fix: payment methods not updated after adding it.

Author: ItzNotABug

src/lib/components/billing/paymentModal.svelte

@@ -21,7 +21,7 @@
         try {
             const card = await submitStripeCard(name, page?.params?.organization ?? null);
             modal.closeModal();
-            invalidate(Dependencies.PAYMENT_METHODS);
+            await invalidate(Dependencies.PAYMENT_METHODS);
             dispatch('submit', card);
             addNotification({
                 type: 'success',

src/lib/components/billing/selectPaymentMethod.svelte

@@ -20,8 +20,19 @@
 
     async function cardSaved(event: CustomEvent<PaymentMethodData>) {
         value = event.detail.$id;
-        invalidate(Dependencies.UPGRADE_PLAN);
-        invalidate(Dependencies.CREATE_ORGANIZATION);
+
+        if (value) {
+            methods = {
+                ...methods,
+                total: methods.total + 1,
+                paymentMethods: [...methods.paymentMethods, event.detail]
+            };
+        }
+
+        await Promise.all([
+            invalidate(Dependencies.UPGRADE_PLAN),
+            invalidate(Dependencies.CREATE_ORGANIZATION)
+        ]);
     }
 
     onMount(() => {

src/routes/(console)/organization-[organization]/change-plan/+page.svelte

@@ -338,12 +338,12 @@
                             </Layout.Stack>
                         </Layout.Stack>
                     </Fieldset>
-                {:then paymentMethods}
+                {:then _}
                     <Fieldset legend="Payment">
                         <SelectPaymentMethod
-                            methods={paymentMethods}
+                            bind:taxId
                             bind:value={paymentMethodId}
-                            bind:taxId>
+                            bind:methods={paymentMethods}>
                             <svelte:fragment slot="actions">
                                 {#if !selectedCoupon?.code}
                                     {#if paymentMethodId}