From d943b9e37d8ff7ee40cefd5b290bd72b4df9d948 Mon Sep 17 00:00:00 2001
From: Darshan <itznotabug@gmail.com>
Date: Tue, 2 Sep 2025 09:43:07 +0530
Subject: [PATCH 1/2] fix: buttons and modal form.

---
 .../organization-[organization]/change-plan/+page.svelte   | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/routes/(console)/organization-[organization]/change-plan/+page.svelte b/src/routes/(console)/organization-[organization]/change-plan/+page.svelte
index eaf4434aa..cdbd1c020 100644
--- a/src/routes/(console)/organization-[organization]/change-plan/+page.svelte
+++ b/src/routes/(console)/organization-[organization]/change-plan/+page.svelte
@@ -319,7 +319,7 @@
 </svelte:head>
 
 <Wizard title="Change plan" href={previousPage} bind:showExitModal confirmExit>
-    <Form bind:this={formComponent} onSubmit={handleSubmit} bind:isSubmitting>
+    <Form bind:this={formComponent} onSubmit={handleSubmit} bind:isSubmitting isModal>
         <Layout.Stack gap="xxl">
             <Fieldset legend="Select plan">
                 <Layout.Stack gap="l">
@@ -347,10 +347,15 @@
                             title="You can only have one free organization per account">
                             To downgrade this organization, first migrate or delete your existing
                             free organization.
+                            <Layout.Stack
+                                gap="xs"
+                                direction="row"
+                                justifyContent="flex-start">
                             <Button
                                 compact
                                 href="https://appwrite.io/docs/advanced/migrations/cloud"
                                 >Migration guide</Button>
+                            </Layout.Stack>
                         </Alert.Inline>
                     {/if}
 

From 25e3ef31a278b154b15d67f4d2d7d04ae2da2a00 Mon Sep 17 00:00:00 2001
From: Darshan <itznotabug@gmail.com>
Date: Tue, 2 Sep 2025 09:48:18 +0530
Subject: [PATCH 2/2] fix: form causing issue in wizard.

---
 .../components/organizationUsageLimits.svelte | 92 ++++++++++---------
 .../change-plan/+page.svelte                  | 16 ++--
 2 files changed, 56 insertions(+), 52 deletions(-)

diff --git a/src/lib/components/organizationUsageLimits.svelte b/src/lib/components/organizationUsageLimits.svelte
index 5fb85a6ae..37ce91b6c 100644
--- a/src/lib/components/organizationUsageLimits.svelte
+++ b/src/lib/components/organizationUsageLimits.svelte
@@ -261,52 +261,58 @@
     </div>
 </Layout.Stack>
 
-<Modal bind:show={showSelectProject} title="Manage projects" onSubmit={updateSelected}>
-    <svelte:fragment slot="description">
-        Choose which {freePlanLimits.projects} projects to keep. Projects over the limit will be blocked
-        after your billing cycle ends on {toLocaleDate($organization.billingNextInvoiceDate)}.
-    </svelte:fragment>
+{#if showSelectProject}
+    <Modal bind:show={showSelectProject} title="Manage projects" onSubmit={updateSelected}>
+        <svelte:fragment slot="description">
+            Choose which {freePlanLimits.projects} projects to keep. Projects over the limit will be
+            blocked after your billing cycle ends on {toLocaleDate(
+                $organization.billingNextInvoiceDate
+            )}.
+        </svelte:fragment>
 
-    {#if error}
-        <Alert.Inline status="error" title="Error">{error}</Alert.Inline>
-    {/if}
+        {#if error}
+            <Alert.Inline status="error" title="Error">{error}</Alert.Inline>
+        {/if}
 
-    <div>
-        <Table.Root
-            let:root
-            allowSelection
-            bind:selectedRows={selectedProjects}
-            columns={[{ id: 'name' }, { id: 'created' }]}>
-            <svelte:fragment slot="header" let:root>
-                <Table.Header.Cell column="name" {root}>Project Name</Table.Header.Cell>
-                <Table.Header.Cell column="created" {root}>Created</Table.Header.Cell>
-            </svelte:fragment>
-            {#each projects as project}
-                <Table.Row.Base {root} id={project.$id}>
-                    <Table.Cell column="name" {root}
-                        ><Typography.Text truncate>{project.name}</Typography.Text></Table.Cell>
-                    <Table.Cell column="created" {root}>
-                        {toLocaleDateTime(project.$createdAt)}
-                    </Table.Cell>
-                </Table.Row.Base>
-            {/each}
-        </Table.Root>
-    </div>
-    {#if selectedProjects.length === allowedProjectsToKeep}
-        {@const difference = projects.length - selectedProjects.length}
-        {@const messagePrefix = difference > 1 ? `${difference} projects` : `${difference} project`}
-        <Alert.Inline
-            status="warning"
-            title={`${messagePrefix} will be archived on ${toLocaleDate($organization.billingNextInvoiceDate)}`}>
-            {formatProjectsToArchive()} will be archived
-        </Alert.Inline>
-    {/if}
+        <div>
+            <Table.Root
+                let:root
+                allowSelection
+                bind:selectedRows={selectedProjects}
+                columns={[{ id: 'name' }, { id: 'created' }]}>
+                <svelte:fragment slot="header" let:root>
+                    <Table.Header.Cell column="name" {root}>Project Name</Table.Header.Cell>
+                    <Table.Header.Cell column="created" {root}>Created</Table.Header.Cell>
+                </svelte:fragment>
+                {#each projects as project}
+                    <Table.Row.Base {root} id={project.$id}>
+                        <Table.Cell column="name" {root}
+                            ><Typography.Text truncate>{project.name}</Typography.Text></Table.Cell>
+                        <Table.Cell column="created" {root}>
+                            {toLocaleDateTime(project.$createdAt)}
+                        </Table.Cell>
+                    </Table.Row.Base>
+                {/each}
+            </Table.Root>
+        </div>
+        {#if selectedProjects.length === allowedProjectsToKeep}
+            {@const difference = projects.length - selectedProjects.length}
+            {@const messagePrefix =
+                difference > 1 ? `${difference} projects` : `${difference} project`}
+            <Alert.Inline
+                status="warning"
+                title={`${messagePrefix} will be archived on ${toLocaleDate($organization.billingNextInvoiceDate)}`}>
+                {formatProjectsToArchive()} will be archived
+            </Alert.Inline>
+        {/if}
 
-    <svelte:fragment slot="footer">
-        <Button secondary on:click={() => (showSelectProject = false)}>Cancel</Button>
-        <Button submit disabled={selectedProjects.length !== allowedProjectsToKeep}>Save</Button>
-    </svelte:fragment>
-</Modal>
+        <svelte:fragment slot="footer">
+            <Button secondary on:click={() => (showSelectProject = false)}>Cancel</Button>
+            <Button submit disabled={selectedProjects.length !== allowedProjectsToKeep}
+                >Save</Button>
+        </svelte:fragment>
+    </Modal>
+{/if}
 
 <style>
     /* Responsive table container */
diff --git a/src/routes/(console)/organization-[organization]/change-plan/+page.svelte b/src/routes/(console)/organization-[organization]/change-plan/+page.svelte
index cdbd1c020..72fab5667 100644
--- a/src/routes/(console)/organization-[organization]/change-plan/+page.svelte
+++ b/src/routes/(console)/organization-[organization]/change-plan/+page.svelte
@@ -319,7 +319,7 @@
 </svelte:head>
 
 <Wizard title="Change plan" href={previousPage} bind:showExitModal confirmExit>
-    <Form bind:this={formComponent} onSubmit={handleSubmit} bind:isSubmitting isModal>
+    <Form bind:this={formComponent} onSubmit={handleSubmit} bind:isSubmitting>
         <Layout.Stack gap="xxl">
             <Fieldset legend="Select plan">
                 <Layout.Stack gap="l">
@@ -347,14 +347,12 @@
                             title="You can only have one free organization per account">
                             To downgrade this organization, first migrate or delete your existing
                             free organization.
-                            <Layout.Stack
-                                gap="xs"
-                                direction="row"
-                                justifyContent="flex-start">
-                            <Button
-                                compact
-                                href="https://appwrite.io/docs/advanced/migrations/cloud"
-                                >Migration guide</Button>
+                            <Layout.Stack gap="xs" direction="row" justifyContent="flex-start">
+                                <Button
+                                    compact
+                                    external
+                                    href="https://appwrite.io/docs/advanced/migrations/cloud"
+                                    >Migration guide</Button>
                             </Layout.Stack>
                         </Alert.Inline>
                     {/if}