Merge pull request #1733 from appwrite/revert-1721-revert-1675-feat-budget-nullable

Revert "Revert "Console Feat: make budget cap nullable""

src/routes/(console)/create-organization/+page.svelte

@@ -170,7 +170,7 @@
 
             trackEvent(Submit.OrganizationCreate, {
                 plan: tierToPlan(billingPlan)?.name,
-                budget_cap_enabled: !!billingBudget,
+                budget_cap_enabled: billingBudget !== null,
                 members_invited: collaborators?.length
             });
 

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

@@ -1,7 +1,6 @@
 <script lang="ts">
     import { Container } from '$lib/layout';
     import { organization } from '$lib/stores/organization';
-    import BudgetAlert from './budgetAlert.svelte';
     import BudgetCap from './budgetCap.svelte';
     import PlanSummary from './planSummary.svelte';
     import BillingAddress from './billingAddress.svelte';
@@ -128,7 +127,6 @@
     <BillingAddress billingAddress={data?.billingAddress} />
     <TaxId />
     <BudgetCap />
-    <BudgetAlert />
     <AvailableCredit />
 </Container>
 

src/routes/(console)/organization-[organization]/billing/budgetAlert.svelte

@@ -20,6 +20,8 @@
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
 
+    export let alertsEnabled = false;
+
     let search: string;
     let selectedAlert: number;
     let alerts: number[] = [];
@@ -74,7 +76,8 @@
         }
     }
 
-    $: isButtonDisabled = symmetricDifference(alerts, $organization.budgetAlerts).length === 0;
+    $: isButtonDisabled =
+        symmetricDifference(alerts, $organization.budgetAlerts).length === 0 || !alertsEnabled;
 </script>
 
 <Form onSubmit={updateBudget}>
@@ -107,6 +110,7 @@
 
                     <div class="u-flex u-gap-16">
                         <InputSelectSearch
+                            disabled={!alertsEnabled}
                             label="Percentage (%) of budget cap"
                             placeholder="Select a percentage"
                             id="alerts"
@@ -118,7 +122,9 @@
                         <div style="align-self: flex-end">
                             <Button
                                 secondary
-                                disabled={alerts.length > 3 || (!search && !selectedAlert)}
+                                disabled={alerts.length > 3 ||
+                                    (!search && !selectedAlert) ||
+                                    !alertsEnabled}
                                 on:click={addAlert}>
                                 Add alert
                             </Button>

src/routes/(console)/organization-[organization]/billing/budgetCap.svelte

@@ -9,13 +9,14 @@
     import { organization, currentPlan } from '$lib/stores/organization';
     import { sdk } from '$lib/stores/sdk';
     import { onMount } from 'svelte';
+    import BudgetAlert from './budgetAlert.svelte';
 
     let capActive = false;
     let budget: number;
 
     onMount(() => {
         budget = $organization?.billingBudget;
-        capActive = !!$organization?.billingBudget;
+        capActive = $organization?.billingBudget !== null;
     });
 
     async function updateBudget() {
@@ -44,7 +45,7 @@
     }
 
     $: if (!capActive) {
-        budget = 0;
+        budget = null;
     }
 </script>
 
@@ -113,3 +114,5 @@
         </svelte:fragment>
     </CardGrid>
 </Form>
+
+<BudgetAlert alertsEnabled={capActive && budget > 0} />