diff --git a/src/routes/console/organization-[organization]/billing/+page.svelte b/src/routes/console/organization-[organization]/billing/+page.svelte
index a6055bedb..379814dd1 100644
--- a/src/routes/console/organization-[organization]/billing/+page.svelte
+++ b/src/routes/console/organization-[organization]/billing/+page.svelte
@@ -20,6 +20,8 @@
import { wizard } from '$lib/stores/wizard';
import ChangeOrganizationTierCloud from '$routes/console/changeOrganizationTierCloud.svelte';
import { BillingPlan } from '$lib/constants';
+ import RetryPaymentModal from './retryPaymentModal.svelte';
+ import { selectedInvoice, showRetryModal } from './store';
$: defaultPaymentMethod = $paymentMethods?.paymentMethods?.find(
(method: PaymentMethodData) => method.$id === $organization?.paymentMethodId
@@ -30,29 +32,40 @@
);
onMount(async () => {
- if (
- $page.url.searchParams.has('type') &&
- $page.url.searchParams.get('type') === 'upgrade'
- ) {
- wizard.start(ChangeOrganizationTierCloud);
- }
+ if ($page.url.searchParams.has('type')) {
+ if ($page.url.searchParams.get('type') === 'upgrade') {
+ wizard.start(ChangeOrganizationTierCloud);
+ }
- if (
- $page.url.searchParams.has('invoice') &&
- $page.url.searchParams.has('type') &&
- $page.url.searchParams.get('type') === 'confirmation'
- ) {
- const invoiceId = $page.url.searchParams.get('invoice');
- const invoice = await sdk.forConsole.billing.getInvoice(
- $page.params.organization,
- invoiceId
- );
+ if (
+ $page.url.searchParams.has('invoice') &&
+ $page.url.searchParams.get('type') === 'confirmation'
+ ) {
+ const invoiceId = $page.url.searchParams.get('invoice');
+ const invoice = await sdk.forConsole.billing.getInvoice(
+ $page.params.organization,
+ invoiceId
+ );
- await confirmPayment(
- $organization.$id,
- invoice.clientSecret,
- $organization.paymentMethodId
- );
+ await confirmPayment(
+ $organization.$id,
+ invoice.clientSecret,
+ $organization.paymentMethodId
+ );
+ }
+
+ if (
+ $page.url.searchParams.has('invoice') &&
+ $page.url.searchParams.get('type') === 'retry'
+ ) {
+ const invoiceId = $page.url.searchParams.get('invoice');
+ const invoice = await sdk.forConsole.billing.getInvoice(
+ $page.params.organization,
+ invoiceId
+ );
+ selectedInvoice.set(invoice);
+ showRetryModal.set(true);
+ }
}
if ($page.url.searchParams.has('clientSecret')) {
const clientSecret = $page.url.searchParams.get('clientSecret');
@@ -101,3 +114,7 @@
{/if}
+
+{#if $selectedInvoice}
+
+{/if}
diff --git a/src/routes/console/organization-[organization]/billing/paymentHistory.svelte b/src/routes/console/organization-[organization]/billing/paymentHistory.svelte
index 8ca0b69d9..ea71e2061 100644
--- a/src/routes/console/organization-[organization]/billing/paymentHistory.svelte
+++ b/src/routes/console/organization-[organization]/billing/paymentHistory.svelte
@@ -21,17 +21,15 @@
TableScroll
} from '$lib/elements/table';
import { toLocaleDate } from '$lib/helpers/date';
- import type { Invoice, InvoiceList } from '$lib/sdk/billing';
+ import type { InvoiceList } from '$lib/sdk/billing';
import { sdk } from '$lib/stores/sdk';
import { VARS } from '$lib/system';
import { Query } from '@appwrite.io/console';
import { onMount } from 'svelte';
- import RetryPaymentModal from './retryPaymentModal.svelte';
import { trackEvent } from '$lib/actions/analytics';
+ import { selectedInvoice, showRetryModal } from './store';
let showDropdown = [];
- let showRetryModal = false;
- let selectedInvoice: Invoice | null = null;
let offset = 0;
let invoiceList: InvoiceList = {
@@ -131,8 +129,8 @@
{
- selectedInvoice = invoice;
- showRetryModal = true;
+ $selectedInvoice = invoice;
+ $showRetryModal = true;
showDropdown[i] = !showDropdown[i];
trackEvent(`click_retry_payment`, {
from: 'button',
@@ -164,7 +162,3 @@
{/if}
-
-{#if selectedInvoice}
-
-{/if}
diff --git a/src/routes/console/organization-[organization]/billing/store.ts b/src/routes/console/organization-[organization]/billing/store.ts
index e75622d62..314b4b31c 100644
--- a/src/routes/console/organization-[organization]/billing/store.ts
+++ b/src/routes/console/organization-[organization]/billing/store.ts
@@ -1,6 +1,6 @@
import { page } from '$app/stores';
import type { WizardStepsType } from '$lib/layout/wizard.svelte';
-import type { AggregationList } from '$lib/sdk/billing';
+import type { AggregationList, Invoice } from '$lib/sdk/billing';
import { derived, writable } from 'svelte/store';
export const aggregationList = derived(
@@ -13,3 +13,6 @@ export const addCreditWizardStore = writable<{ coupon: string; paymentMethodId:
coupon: null,
paymentMethodId: null
});
+
+export let selectedInvoice = writable(null);
+export let showRetryModal = writable(false);