feat: add invoice last error

This commit is contained in:
Arman
2024-03-20 14:58:07 +01:00
parent 57dc36c751
commit 56cc9ee9ee
3 changed files with 61 additions and 18 deletions
+1
View File
@@ -48,6 +48,7 @@ export type Invoice = {
rate: number;
desc: string;
}[];
lastError?: string;
};
export type InvoiceList = {
@@ -76,13 +76,19 @@
<Container>
{#if $failedInvoice}
<Alert type="error" class="common-section">
<svelte:fragment slot="title">
The scheduled payment for {$organization.name} failed
</svelte:fragment>
To avoid service disruptions in organization's your projects, please verify your payment
details and update them if necessary.
</Alert>
{#if $failedInvoice?.lastError}
<Alert type="error" class="common-section">
The scheduled payment for {$organization.name} failed due to following error: {$failedInvoice.lastError}
</Alert>
{:else}
<Alert type="error" class="common-section">
<svelte:fragment slot="title">
The scheduled payment for {$organization.name} failed
</svelte:fragment>
To avoid service disruptions in organization's your projects, please verify your payment
details and update them if necessary.
</Alert>
{/if}
{/if}
{#if defaultPaymentMethod?.failed && !backupPaymentMethod}
<Alert type="error" class="common-section">
@@ -22,7 +22,7 @@
} from '$lib/elements/table';
import { toLocaleDate } from '$lib/helpers/date';
import { formatCurrency } from '$lib/helpers/numbers';
import type { InvoiceList } from '$lib/sdk/billing';
import type { Invoice, InvoiceList } from '$lib/sdk/billing';
import { sdk } from '$lib/stores/sdk';
import { VARS } from '$lib/system';
import { Query } from '@appwrite.io/console';
@@ -31,6 +31,7 @@
import { selectedInvoice, showRetryModal } from './store';
let showDropdown = [];
let showFailedError = false;
let offset = 0;
let invoiceList: InvoiceList = {
@@ -51,6 +52,11 @@
]);
}
function retryPayment(invoice: Invoice) {
$selectedInvoice = invoice;
$showRetryModal = true;
}
$: if (offset !== null) {
request();
}
@@ -82,14 +88,45 @@
</TableCellText>
<TableCell title="status">
<Pill
danger={status === 'overdue' ||
status === 'failed' ||
status === 'requires_authentication'}
success={status === 'paid' || status === 'succeeded'}
warning={status === 'pending'}>
{status === 'requires_authentication' ? 'failed' : status}
</Pill>
{#if invoice?.lastError}
<DropList bind:show={showFailedError}>
<Pill
danger={status === 'overdue' ||
status === 'failed' ||
status === 'requires_authentication'}
success={status === 'paid' ||
status === 'succeeded'}
warning={status === 'pending'}
on:click={() => (showFailedError = true)}
button>
{status === 'requires_authentication'
? 'failed'
: status}
</Pill>
<svelte:fragment slot="list">
<li>
The scheduled payment has failed. <Button
link
on:click={() => {
retryPayment(invoice);
showFailedError = false;
}}>Try again</Button
>.
</li>
</svelte:fragment>
</DropList>
{:else}
<Pill
danger={status === 'overdue' ||
status === 'failed' ||
status === 'requires_authentication'}
success={status === 'paid' || status === 'succeeded'}
warning={status === 'pending'}>
{status === 'requires_authentication'
? 'failed'
: status}
</Pill>
{/if}
</TableCell>
<TableCellText title="due">
{formatCurrency(invoice.amount)}
@@ -132,8 +169,7 @@
<DropListItem
icon="refresh"
on:click={() => {
$selectedInvoice = invoice;
$showRetryModal = true;
retryPayment(invoice);
showDropdown[i] = !showDropdown[i];
trackEvent(`click_retry_payment`, {
from: 'button',