Merge branch 'appwrite:main' into fix-977-email-failed-modal-message-…

…improve

src/lib/components/billing/alerts/limitReached.svelte

@@ -9,12 +9,14 @@
     import { organization } from '$lib/stores/organization';
 </script>
 
-{#if $organization?.$id && $organization?.billingPlan === BillingPlan.STARTER && $readOnly && !hideBillingHeaderRoutes.includes($page.url.pathname)}
+{#if $organization?.$id && $organization?.billingPlan === BillingPlan.FREE && $readOnly && !hideBillingHeaderRoutes.includes($page.url.pathname)}
     <HeaderAlert
         type="error"
         title={`${$organization.name} usage has reached the ${tierToPlan($organization.billingPlan).name} plan limit`}>
         <svelte:fragment>
-            Usage for the <b>{$organization.name}</b> organization has reached the limits of the Starter
+            Usage for the <b>{$organization.name}</b> organization has reached the limits of the {tierToPlan(
+                $organization.billingPlan
+            ).name}
             plan. Consider upgrading to increase your resource usage.
         </svelte:fragment>
         <svelte:fragment slot="buttons">

src/lib/components/billing/planComparisonBox.svelte

@@ -13,7 +13,7 @@
         <SecondaryTabsItem
             disabled={selectedTab === 'tier-0'}
             on:click={() => (selectedTab = 'tier-0')}>
-            Starter
+            Free
         </SecondaryTabsItem>
         <SecondaryTabsItem
             disabled={selectedTab === 'tier-1'}
@@ -38,7 +38,7 @@
         {:else if selectedTab === 'tier-1'}
             <h3 class="u-bold body-text-1">{plan.name} plan</h3>
             <ul class="un-order-list u-margin-block-start-8">
-                <li>Everything in the Starter plan, plus:</li>
+                <li>Everything in the Free plan, plus:</li>
                 <li>Unlimited databases, buckets, functions</li>
                 <li>{plan.bandwidth}GB bandwidth</li>
                 <li>{plan.storage}GB storage</li>

src/lib/components/billing/planExcess.svelte

@@ -19,6 +19,7 @@
     import { onMount } from 'svelte';
     import type { OrganizationUsage } from '$lib/sdk/billing';
     import { sdk } from '$lib/stores/sdk';
+    import { BillingPlan } from '$lib/constants';
 
     export let tier: Tier;
 
@@ -51,15 +52,16 @@
                 $organization.billingNextInvoiceDate
             )}
         </svelte:fragment>
-        Following payment of your final invoice, your organization will switch to the Starter plan. {#if excess?.members > 0}All
-            team members except the owner will be removed on that date.{/if} Service disruptions may
-        occur unless resource usage is reduced.
+        Following payment of your final invoice, your organization will switch to the {tierToPlan(
+            BillingPlan.FREE
+        ).name} plan. {#if excess?.members > 0}All team members except the owner will be removed on
+            that date.{/if} Service disruptions may occur unless resource usage is reduced.
         <!-- Any executions, bandwidth, or messaging usage will be reset at that time. -->
         <svelte:fragment slot="buttons">
             <Button
                 text
                 external
-                href="https://appwrite.io/docs/advanced/platform/starter#reaching-resource-limits">
+                href="https://appwrite.io/docs/advanced/platform/free#reaching-resource-limits">
                 Learn more
             </Button>
         </svelte:fragment>

src/lib/components/billing/usageRates.svelte

@@ -49,14 +49,13 @@
         }
     ];
 
-    $: isFree = org.billingPlan === BillingPlan.STARTER;
+    $: isFree = org.billingPlan === BillingPlan.FREE;
 </script>
 
 <Modal bind:show size="big" headerDivider={false} title="Usage rates">
     {#if isFree}
-        Usage on the Starter plan is limited for the following resources. Next billing period: {toLocaleDate(
-            nextDate
-        )}.
+        Usage on the {$plansInfo?.get(BillingPlan.FREE).name} plan is limited for the following resources.
+        Next billing period: {toLocaleDate(nextDate)}.
     {:else if org.billingPlan === BillingPlan.PRO}
         <p>
             Usage on the Pro plan will be charged at the end of each billing period at the following

src/lib/components/support.svelte

@@ -30,7 +30,7 @@
                 </p>
             {/if}
         </div>
-        {#if $organization?.billingPlan === BillingPlan.STARTER}
+        {#if $organization?.billingPlan === BillingPlan.FREE}
             <Button
                 fullWidth
                 href={$upgradeURL}
@@ -63,6 +63,7 @@
         <div class="u-margin-block-start-8 u-width-full-line">
             {#key $app.themeInUse}
                 <iframe
+                    style="color-scheme: none"
                     title="Appwrite Status"
                     src={`https://status.appwrite.online/badge?theme=${
                         $app.themeInUse === 'dark' ? 'dark' : 'light'

src/lib/constants.ts

@@ -367,7 +367,7 @@ export const eventServices: Array<EventService> = [
 ];
 
 export enum BillingPlan {
-    STARTER = 'tier-0',
+    FREE = 'tier-0',
     PRO = 'tier-1',
     SCALE = 'tier-2'
 }
@@ -387,7 +387,7 @@ export const feedbackDowngradeOptions = [
     },
     {
         value: 'starter',
-        label: 'The Starter plan is enough for my projects'
+        label: 'The Free plan is enough for my projects'
     },
     {
         value: 'budget',

src/lib/layout/activity.svelte

@@ -52,7 +52,7 @@
                         Logs are retained in rolling {hoursToDays(limit)} intervals with the
                         {tierToPlan($organization.billingPlan).name}
                         plan.
-                        {#if $organization?.billingPlan === BillingPlan.STARTER}
+                        {#if $organization?.billingPlan === BillingPlan.FREE}
                             <Button link on:click={upgradeMethod}>Upgrade</Button> to increase your log
                             retention for a longer period.
                         {/if}

src/lib/layout/containerButton.svelte

@@ -7,7 +7,7 @@
 
     export let title: string;
     export let tooltipContent =
-        $organization.billingPlan === BillingPlan.STARTER
+        $organization.billingPlan === BillingPlan.FREE
             ? `Upgrade to add more ${title.toLocaleLowerCase()}`
             : `You've reached the ${title.toLocaleLowerCase()} limit for the ${
                   tierToPlan($organization.billingPlan).name

src/lib/layout/containerHeader.svelte

@@ -63,7 +63,7 @@
 
     $: tier = tierToPlan($organization?.billingPlan)?.name;
     $: hasProjectLimitation =
-        checkForProjectLimitation(serviceId) && $organization?.billingPlan === BillingPlan.STARTER;
+        checkForProjectLimitation(serviceId) && $organization?.billingPlan === BillingPlan.FREE;
     $: hasUsageFees = hasProjectLimitation
         ? checkForUsageFees($organization?.billingPlan, serviceId)
         : false;
@@ -88,7 +88,7 @@
             })
             .join(', ')}
         <slot name="alert" {limit} {tier} {title} {upgradeMethod} {hasUsageFees} {services}>
-            {#if $organization?.billingPlan !== BillingPlan.STARTER && hasUsageFees}
+            {#if $organization?.billingPlan !== BillingPlan.FREE && hasUsageFees}
                 <Alert type="info" isStandalone>
                     <span class="text">
                         You've reached the {services} limit for the {tier} plan.
@@ -135,7 +135,7 @@
                             <p class="text">
                                 You are limited to {limit}
                                 {title.toLocaleLowerCase()} per project on the {tier} plan.
-                                {#if $organization?.billingPlan === BillingPlan.STARTER}<Button
+                                {#if $organization?.billingPlan === BillingPlan.FREE}<Button
                                         link
                                         href={$upgradeURL}
                                         on:click={() =>
@@ -158,7 +158,7 @@
                             <p class="text">
                                 You are limited to {limit}
                                 {title.toLocaleLowerCase()} per organization on the {tier} plan.
-                                {#if $organization?.billingPlan === BillingPlan.STARTER}
+                                {#if $organization?.billingPlan === BillingPlan.FREE}
                                     <Button link href={$upgradeURL}>Upgrade</Button>
                                     for additional {title.toLocaleLowerCase()}.
                                 {/if}

src/lib/layout/header.svelte

@@ -103,7 +103,7 @@
 
 <div class="main-header-end">
     <nav class="u-flex is-only-desktop u-cross-center">
-        {#if isCloud && $organization?.billingPlan === BillingPlan.STARTER && !$page.url.pathname.startsWith('/console/account')}
+        {#if isCloud && $organization?.billingPlan === BillingPlan.FREE && !$page.url.pathname.startsWith('/console/account')}
             <Button
                 disabled={$organization?.markedForDeletion}
                 href={$upgradeURL}

src/lib/layout/logs.svelte

@@ -310,7 +310,7 @@
                                         <Alert>
                                             Logs are retained in rolling {hoursToDays(limit)} intervals
                                             with the {tier} plan.
-                                            {#if $organization.billingPlan === BillingPlan.STARTER}
+                                            {#if $organization.billingPlan === BillingPlan.FREE}
                                                 <Button link href={$upgradeURL}>Upgrade</Button> to increase
                                                 your log retention for a longer period.
                                             {/if}

src/lib/stores/billing.ts

@@ -40,7 +40,7 @@ export const readOnly = writable<boolean>(false);
 
 export function tierToPlan(tier: Tier) {
     switch (tier) {
-        case BillingPlan.STARTER:
+        case BillingPlan.FREE:
             return tierFree;
         case BillingPlan.PRO:
             return tierPro;
@@ -115,7 +115,7 @@ export type TierData = {
 };
 
 export const tierFree: TierData = {
-    name: 'Starter',
+    name: 'Free',
     description: 'For personal hobby projects of small scale and students.'
 };
 
@@ -171,7 +171,7 @@ export function isServiceLimited(serviceId: PlanServices, plan: Tier, total: num
 }
 
 export function calculateTrialDay(org: Organization) {
-    if (org?.billingPlan === BillingPlan.STARTER) return false;
+    if (org?.billingPlan === BillingPlan.FREE) return false;
     const endDate = new Date(org?.billingStartDate);
     const today = new Date();
 
@@ -185,7 +185,7 @@ export function calculateTrialDay(org: Organization) {
 }
 
 export async function checkForUsageLimit(org: Organization) {
-    if (org?.billingPlan !== BillingPlan.STARTER) {
+    if (org?.billingPlan !== BillingPlan.FREE) {
         readOnly.set(false);
         return;
     }
@@ -221,9 +221,9 @@ export async function checkForUsageLimit(org: Organization) {
         if (now - lastNotification < 1000 * 60 * 60 * 24) return;
 
         localStorage.setItem('limitReachedNotification', now.toString());
-        let message = `<b>${org.name}</b> has reached <b>75%</b> of the Starter plan's ${resources.find((r) => r.value >= 75).name} limit. Upgrade to ensure there are no service disruptions.`;
+        let message = `<b>${org.name}</b> has reached <b>75%</b> of the ${tierToPlan(BillingPlan.FREE).name} plan's ${resources.find((r) => r.value >= 75).name} limit. Upgrade to ensure there are no service disruptions.`;
         if (resources.filter((r) => r.value >= 75)?.length > 1) {
-            message = `Usage for <b>${org.name}</b> has reached 75% of the Starter plan limit. Upgrade to ensure there are no service disruptions.`;
+            message = `Usage for <b>${org.name}</b> has reached 75% of the ${tierToPlan(BillingPlan.FREE).name} plan limit. Upgrade to ensure there are no service disruptions.`;
         }
         addNotification({
             type: 'warning',
@@ -255,7 +255,7 @@ export async function checkForUsageLimit(org: Organization) {
 }
 
 export async function checkPaymentAuthorizationRequired(org: Organization) {
-    if (org.billingPlan === BillingPlan.STARTER) return;
+    if (org.billingPlan === BillingPlan.FREE) return;
 
     const invoices = await sdk.forConsole.billing.listInvoices(org.$id, [
         Query.equal('status', 'requires_authentication')
@@ -351,7 +351,7 @@ export async function checkForMandate(org: Organization) {
 
 export async function checkForMissingPaymentMethod() {
     const orgs = await sdk.forConsole.billing.listOrganization([
-        Query.notEqual('billingPlan', BillingPlan.STARTER),
+        Query.notEqual('billingPlan', BillingPlan.FREE),
         Query.isNull('paymentMethodId'),
         Query.isNull('backupPaymentMethodId')
     ]);

src/routes/console/+layout.svelte

@@ -149,6 +149,7 @@
                         await goto(`/console/project-${$project.$id}/auth/security#${heading}`);
                         scrollBy({ top: -100 });
                     },
+                    disabled: !$project?.$id,
                     group: 'security',
                     icon: 'pencil'
                 }) as const
@@ -161,7 +162,8 @@
             callback: () => {
                 goto(`/console/project-${$project.$id}/settings`);
             },
-            disabled: isOnSettingsLayout && $page.url.pathname.endsWith('settings'),
+            disabled:
+                !$project?.$id || (isOnSettingsLayout && $page.url.pathname.endsWith('settings')),
             group: isOnSettingsLayout ? 'navigation' : 'settings',
             rank: isOnSettingsLayout ? 40 : -1
         },
@@ -172,7 +174,8 @@
             callback: () => {
                 goto(`/console/project-${$project.$id}/settings/domains`);
             },
-            disabled: isOnSettingsLayout && $page.url.pathname.includes('domains'),
+            disabled:
+                !$project?.$id || (isOnSettingsLayout && $page.url.pathname.includes('domains')),
             group: isOnSettingsLayout ? 'navigation' : 'settings',
             rank: isOnSettingsLayout ? 30 : -1
         },
@@ -182,7 +185,8 @@
             callback: () => {
                 goto(`/console/project-${$project.$id}/settings/webhooks`);
             },
-            disabled: isOnSettingsLayout && $page.url.pathname.includes('webhooks'),
+            disabled:
+                !$project?.$id || (isOnSettingsLayout && $page.url.pathname.includes('webhooks')),
             group: isOnSettingsLayout ? 'navigation' : 'settings',
 
             rank: isOnSettingsLayout ? 20 : -1
@@ -193,7 +197,8 @@
             callback: () => {
                 goto(`/console/project-${$project.$id}/settings/migrations`);
             },
-            disabled: isOnSettingsLayout && $page.url.pathname.includes('migrations'),
+            disabled:
+                !$project?.$id || (isOnSettingsLayout && $page.url.pathname.includes('migrations')),
             group: isOnSettingsLayout ? 'navigation' : 'settings',
 
             rank: isOnSettingsLayout ? 10 : -1
@@ -202,9 +207,10 @@
             label: 'Go to SMTP settings',
             keys: isOnSettingsLayout ? ['g', 's'] : undefined,
             callback: () => {
+                console.log('withing callback of go to smtp');
                 goto(`/console/project-${$project.$id}/settings/smtp`);
             },
-            disabled: isOnSettingsLayout && $page.url.pathname.includes('smtp'),
+            disabled: !$project?.$id || (isOnSettingsLayout && $page.url.pathname.includes('smtp')),
             group: isOnSettingsLayout ? 'navigation' : 'settings',
             rank: -1
         },
@@ -260,7 +266,7 @@
         if (isCloud) {
             await checkForUsageLimit(org);
             checkForMarkedForDeletion(org);
-            if (org?.billingPlan !== BillingPlan.STARTER) {
+            if (org?.billingPlan !== BillingPlan.FREE) {
                 await paymentExpired(org);
                 await checkPaymentAuthorizationRequired(org);
                 await checkForMandate(org);

src/routes/console/account/organizations/+page.svelte

@@ -71,7 +71,7 @@
                     </svelte:fragment>
                     <svelte:fragment slot="status">
                         {#if isCloudOrg(organization)}
-                            {#if organization?.billingPlan === BillingPlan.STARTER}
+                            {#if organization?.billingPlan === BillingPlan.FREE}
                                 <div
                                     class="u-flex u-cross-center"
                                     use:tooltip={{
@@ -81,7 +81,7 @@
                                     <Pill>FREE</Pill>
                                 </div>
                             {/if}
-                            {#if organization?.billingTrialStartDate && $daysLeftInTrial > 0 && organization.billingPlan !== BillingPlan.STARTER && $plansInfo.get(organization.billingPlan)?.trialDays}
+                            {#if organization?.billingTrialStartDate && $daysLeftInTrial > 0 && organization.billingPlan !== BillingPlan.FREE && $plansInfo.get(organization.billingPlan)?.trialDays}
                                 <div
                                     class="u-flex u-cross-center"
                                     use:tooltip={{