diff --git a/src/routes/console/project-[project]/overview/platforms/createAndroid.svelte b/src/routes/console/project-[project]/overview/platforms/createAndroid.svelte
index 2ed2b4860a..c9336d50d7 100644
--- a/src/routes/console/project-[project]/overview/platforms/createAndroid.svelte
+++ b/src/routes/console/project-[project]/overview/platforms/createAndroid.svelte
@@ -10,8 +10,10 @@
     import Step2 from './wizard/android/step2.svelte';
     import Step3 from './wizard/android/step3.svelte';
     import Step4 from './wizard/step4.svelte';
+    import { sdkForConsole } from '$lib/stores/sdk';
+    import { trackEvent } from '$lib/actions/analytics';
 
-    async function onFinish() {
+    async function onExit() {
         if ($onboarding) {
             invalidate(Dependencies.PROJECT);
         }
@@ -20,6 +22,23 @@
         wizard.hide();
     }
 
+    async function onFinish() {
+        await sdkForConsole.projects.createPlatform(
+            $createPlatform.projectId,
+            'android',
+            $createPlatform.name,
+            $createPlatform.key,
+            undefined,
+            undefined
+        );
+
+        trackEvent('submit_platform_create', {
+            type: 'android'
+        });
+
+        await onExit();
+    }
+
     beforeNavigate(() => {
         wizard.hide();
     });
@@ -50,5 +69,5 @@
     title="Add an Android Project"
     steps={stepsComponents}
     on:finish={onFinish}
-    on:exit={onFinish}
+    on:exit={onExit}
     finalAction="Take me to my Dashboard" />
diff --git a/src/routes/console/project-[project]/overview/platforms/createApple.svelte b/src/routes/console/project-[project]/overview/platforms/createApple.svelte
index 52d6b5208c..8713c5a988 100644
--- a/src/routes/console/project-[project]/overview/platforms/createApple.svelte
+++ b/src/routes/console/project-[project]/overview/platforms/createApple.svelte
@@ -1,3 +1,16 @@
+<script lang="ts" context="module">
+    export enum Platform {
+        iOS = 'apple-ios',
+        macOS = 'apple-macos',
+        watchOS = 'apple-watchos',
+        tvOS = 'apple-tvos'
+    }
+
+    export const isPlatform = (platform: string): platform is Platform => {
+        return Object.values(Platform).includes(platform as Platform);
+    };
+</script>
+
 <script lang="ts">
     import { Wizard } from '$lib/layout';
     import { beforeNavigate, invalidate } from '$app/navigation';
@@ -10,8 +23,10 @@
     import Step4 from './wizard/step4.svelte';
     import { Dependencies } from '$lib/constants';
     import { onboarding } from '../../store';
+    import { sdkForConsole } from '$lib/stores/sdk';
+    import { trackEvent } from '$lib/actions/analytics';
 
-    async function onFinish() {
+    async function onExit() {
         if ($onboarding) {
             invalidate(Dependencies.PROJECT);
         }
@@ -20,6 +35,23 @@
         wizard.hide();
     }
 
+    async function onFinish() {
+        await sdkForConsole.projects.createPlatform(
+            $createPlatform.projectId,
+            $createPlatform.type,
+            $createPlatform.name,
+            $createPlatform.key,
+            undefined,
+            undefined
+        );
+
+        trackEvent('submit_platform_create', {
+            type: $createPlatform.type
+        });
+
+        await onExit();
+    }
+
     beforeNavigate(() => {
         wizard.hide();
     });
@@ -50,5 +82,5 @@
     title="Add an Apple Project"
     steps={stepsComponents}
     on:finish={onFinish}
-    on:exit={onFinish}
+    on:exit={onExit}
     finalAction="Take me to my Dashboard" />
diff --git a/src/routes/console/project-[project]/overview/platforms/createFlutter.svelte b/src/routes/console/project-[project]/overview/platforms/createFlutter.svelte
index 8e9d5a152c..7a4efb4862 100644
--- a/src/routes/console/project-[project]/overview/platforms/createFlutter.svelte
+++ b/src/routes/console/project-[project]/overview/platforms/createFlutter.svelte
@@ -1,3 +1,18 @@
+<script lang="ts" context="module">
+    export enum Platform {
+        Android = 'flutter-android',
+        Ios = 'flutter-ios',
+        Linux = 'flutter-linux',
+        Macos = 'flutter-macos',
+        Windows = 'flutter-windows',
+        Web = 'flutter-web'
+    }
+
+    export function isPlatform(value: string): value is Platform {
+        return Object.values(Platform).includes(value as Platform);
+    }
+</script>
+
 <script lang="ts">
     import { Wizard } from '$lib/layout';
     import { beforeNavigate, invalidate } from '$app/navigation';
@@ -10,8 +25,10 @@
     import Step4 from './wizard/step4.svelte';
     import { Dependencies } from '$lib/constants';
     import { onboarding } from '../../store';
+    import { sdkForConsole } from '$lib/stores/sdk';
+    import { trackEvent } from '$lib/actions/analytics';
 
-    async function onFinish() {
+    async function onExit() {
         if ($onboarding) {
             invalidate(Dependencies.PROJECT);
         }
@@ -20,6 +37,23 @@
         wizard.hide();
     }
 
+    async function onFinish() {
+        await sdkForConsole.projects.createPlatform(
+            $createPlatform.projectId,
+            $createPlatform.type,
+            $createPlatform.name,
+            $createPlatform.type !== Platform.Web ? $createPlatform.key : undefined,
+            undefined,
+            $createPlatform.type === Platform.Web ? $createPlatform.hostname : undefined
+        );
+
+        trackEvent('submit_platform_create', {
+            type: $createPlatform.type
+        });
+
+        await onExit();
+    }
+
     beforeNavigate(() => {
         wizard.hide();
     });
@@ -50,5 +84,5 @@
     title="Add a Flutter Project"
     steps={stepsComponents}
     on:finish={onFinish}
-    on:exit={onFinish}
+    on:exit={onExit}
     finalAction="Take me to my Dashboard" />
diff --git a/src/routes/console/project-[project]/overview/platforms/createWeb.svelte b/src/routes/console/project-[project]/overview/platforms/createWeb.svelte
index 57eb2b89ce..a603f5be97 100644
--- a/src/routes/console/project-[project]/overview/platforms/createWeb.svelte
+++ b/src/routes/console/project-[project]/overview/platforms/createWeb.svelte
@@ -10,8 +10,10 @@
     import Step4 from './wizard/step4.svelte';
     import { Dependencies } from '$lib/constants';
     import { onboarding } from '../../store';
+    import { sdkForConsole } from '$lib/stores/sdk';
+    import { trackEvent } from '$lib/actions/analytics';
 
-    async function onFinish() {
+    async function onExit() {
         if ($onboarding) {
             invalidate(Dependencies.PROJECT);
         }
@@ -20,6 +22,23 @@
         wizard.hide();
     }
 
+    async function onFinish() {
+        await sdkForConsole.projects.createPlatform(
+            $createPlatform.projectId,
+            'web',
+            $createPlatform.name,
+            undefined,
+            undefined,
+            $createPlatform.hostname
+        );
+
+        trackEvent('submit_platform_create', {
+            type: 'web'
+        });
+
+        await onExit();
+    }
+
     beforeNavigate(() => {
         wizard.hide();
     });
@@ -50,5 +69,5 @@
     title="Add a Web Project"
     steps={stepsComponents}
     on:finish={onFinish}
-    on:exit={onFinish}
+    on:exit={onExit}
     finalAction="Take me to my Dashboard" />
diff --git a/src/routes/console/project-[project]/overview/platforms/wizard/android/step1.svelte b/src/routes/console/project-[project]/overview/platforms/wizard/android/step1.svelte
index 8b903523e0..abe3fbfed7 100644
--- a/src/routes/console/project-[project]/overview/platforms/wizard/android/step1.svelte
+++ b/src/routes/console/project-[project]/overview/platforms/wizard/android/step1.svelte
@@ -2,50 +2,18 @@
     import { page } from '$app/stores';
     import { FormList, InputText } from '$lib/elements/forms';
     import { WizardStep } from '$lib/layout';
-    import { sdkForConsole } from '$lib/stores/sdk';
-    import { createPlatform } from '../store';
-    import { wizard } from '$lib/stores/wizard';
     import { app } from '$lib/stores/app';
-    import Light from './light.svg';
+    import { wizard } from '$lib/stores/wizard';
+    import { createPlatform } from '../store';
     import Dark from './dark.svg';
-    import { trackEvent } from '$lib/actions/analytics';
+    import Light from './light.svg';
 
     $wizard.media = $app.themeInUse === 'dark' ? Dark : Light;
 
-    const projectId = $page.params.project;
-
-    async function beforeSubmit() {
-        if ($createPlatform.$id) {
-            await sdkForConsole.projects.updatePlatform(
-                projectId,
-                $createPlatform.$id,
-                $createPlatform.name,
-                $createPlatform.key,
-                $createPlatform.store,
-                $createPlatform.hostname
-            );
-
-            return;
-        }
-
-        const platform = await sdkForConsole.projects.createPlatform(
-            projectId,
-            'android',
-            $createPlatform.name,
-            $createPlatform.key,
-            undefined,
-            undefined
-        );
-
-        trackEvent('submit_platform_create', {
-            type: 'android'
-        });
-
-        $createPlatform.$id = platform.$id;
-    }
+    $createPlatform.projectId = $page.params.project;
 </script>
 
-<WizardStep {beforeSubmit}>
+<WizardStep>
     <svelte:fragment slot="title">Register your Android app</svelte:fragment>
     <FormList>
         <InputText
diff --git a/src/routes/console/project-[project]/overview/platforms/wizard/apple/step1.svelte b/src/routes/console/project-[project]/overview/platforms/wizard/apple/step1.svelte
index b472fc121e..a71315c294 100644
--- a/src/routes/console/project-[project]/overview/platforms/wizard/apple/step1.svelte
+++ b/src/routes/console/project-[project]/overview/platforms/wizard/apple/step1.svelte
@@ -3,59 +3,19 @@
     import { Pill } from '$lib/elements';
     import { FormItem, FormList, InputText } from '$lib/elements/forms';
     import { WizardStep } from '$lib/layout';
-    import { sdkForConsole } from '$lib/stores/sdk';
-    import { createPlatform } from '../store';
-    import { wizard } from '$lib/stores/wizard';
     import { app } from '$lib/stores/app';
-    import Light from './light.svg';
+    import { wizard } from '$lib/stores/wizard';
+    import { isPlatform, Platform } from '../../createApple.svelte';
+    import { createPlatform } from '../store';
     import Dark from './dark.svg';
-    import { trackEvent } from '$lib/actions/analytics';
+    import Light from './light.svg';
 
     $wizard.media = $app.themeInUse === 'dark' ? Dark : Light;
-
-    enum Platform {
-        iOS = 'apple-ios',
-        macOS = 'apple-macos',
-        watchOS = 'apple-watchos',
-        tvOS = 'apple-tvos'
-    }
-
-    let platform: Platform = Platform.iOS;
-
-    const projectId = $page.params.project;
-
-    async function beforeSubmit() {
-        if ($createPlatform.$id) {
-            await sdkForConsole.projects.updatePlatform(
-                projectId,
-                $createPlatform.$id,
-                $createPlatform.name,
-                $createPlatform.key,
-                $createPlatform.store,
-                $createPlatform.hostname
-            );
-
-            return;
-        }
-
-        const response = await sdkForConsole.projects.createPlatform(
-            projectId,
-            platform,
-            $createPlatform.name,
-            $createPlatform.key,
-            undefined,
-            undefined
-        );
-
-        trackEvent('submit_platform_create', {
-            type: platform
-        });
-
-        $createPlatform.$id = response.$id;
-    }
+    $createPlatform.type = isPlatform($createPlatform.type) ? $createPlatform.type : Platform.iOS;
+    $createPlatform.projectId = $page.params.project;
 </script>
 
-<WizardStep {beforeSubmit}>
+<WizardStep>
     <svelte:fragment slot="title">Register your Apple app</svelte:fragment>
 
     <FormList isCommonSection>
@@ -64,26 +24,26 @@
             <div class="u-flex u-gap-16 u-margin-block-start-8">
                 <Pill
                     button
-                    on:click={() => (platform = Platform.iOS)}
-                    selected={platform === Platform.iOS}>
+                    on:click={() => ($createPlatform.type = Platform.iOS)}
+                    selected={$createPlatform.type === Platform.iOS}>
                     iOS
                 </Pill>
                 <Pill
                     button
-                    on:click={() => (platform = Platform.macOS)}
-                    selected={platform === Platform.macOS}>
+                    on:click={() => ($createPlatform.type = Platform.macOS)}
+                    selected={$createPlatform.type === Platform.macOS}>
                     macOS
                 </Pill>
                 <Pill
                     button
-                    on:click={() => (platform = Platform.watchOS)}
-                    selected={platform === Platform.watchOS}>
+                    on:click={() => ($createPlatform.type = Platform.watchOS)}
+                    selected={$createPlatform.type === Platform.watchOS}>
                     watchOS
                 </Pill>
                 <Pill
                     button
-                    on:click={() => (platform = Platform.tvOS)}
-                    selected={platform === Platform.tvOS}>
+                    on:click={() => ($createPlatform.type = Platform.tvOS)}
+                    selected={$createPlatform.type === Platform.tvOS}>
                     tvOS
                 </Pill>
             </div>
diff --git a/src/routes/console/project-[project]/overview/platforms/wizard/flutter/step1.svelte b/src/routes/console/project-[project]/overview/platforms/wizard/flutter/step1.svelte
index 675071ef73..c289241f76 100644
--- a/src/routes/console/project-[project]/overview/platforms/wizard/flutter/step1.svelte
+++ b/src/routes/console/project-[project]/overview/platforms/wizard/flutter/step1.svelte
@@ -4,34 +4,19 @@
     import { Pill } from '$lib/elements';
     import { FormList, InputText } from '$lib/elements/forms';
     import { WizardStep } from '$lib/layout';
-    import { sdkForConsole } from '$lib/stores/sdk';
-    import { createPlatform } from '../store';
-    import { wizard } from '$lib/stores/wizard';
     import { app } from '$lib/stores/app';
-    import Light from './light.svg';
+    import { wizard } from '$lib/stores/wizard';
+    import { isPlatform, Platform } from '../../createFlutter.svelte';
+    import { createPlatform } from '../store';
     import Dark from './dark.svg';
-    import { trackEvent } from '$lib/actions/analytics';
+    import Light from './light.svg';
 
     $wizard.media = $app.themeInUse === 'dark' ? Dark : Light;
-
-    enum Platform {
-        Android = 'flutter-android',
-        Ios = 'flutter-ios',
-        Linux = 'flutter-linux',
-        Macos = 'flutter-macos',
-        Windows = 'flutter-windows',
-        Web = 'flutter-web'
-    }
-
-    function isPlatform(value: string): value is Platform {
-        return Object.values(Platform).includes(value as Platform);
-    }
-
-    let platform: Platform = isPlatform($createPlatform.type)
+    $createPlatform.type = isPlatform($createPlatform.type)
         ? $createPlatform.type
         : Platform.Android;
+    $createPlatform.projectId = $page.params.project;
 
-    const projectId = $page.params.project;
     const suggestions = ['*.vercel.app', '*.netlify.app', '*.gitpod.io'];
     const placeholder: Record<
         Platform,
@@ -85,76 +70,46 @@
         [Platform.Web]: 'Hostname',
         [Platform.Windows]: 'Package Name'
     };
-
-    async function beforeSubmit() {
-        if ($createPlatform.$id) {
-            await sdkForConsole.projects.updatePlatform(
-                projectId,
-                $createPlatform.$id,
-                $createPlatform.name,
-                $createPlatform.key,
-                $createPlatform.store,
-                $createPlatform.hostname
-            );
-        } else {
-            const response = await sdkForConsole.projects.createPlatform(
-                projectId,
-                platform,
-                $createPlatform.name,
-                platform !== Platform.Web ? $createPlatform.key : undefined,
-                undefined,
-                platform === Platform.Web ? $createPlatform.hostname : undefined
-            );
-
-            trackEvent('submit_platform_create', {
-                type: platform
-            });
-
-            $createPlatform.$id = response.$id;
-        }
-
-        $createPlatform.type = platform;
-    }
 </script>
 
-<WizardStep {beforeSubmit}>
+<WizardStep>
     <svelte:fragment slot="title">Register your Flutter app</svelte:fragment>
     <svelte:fragment slot="subtitle">
         <div class="u-flex u-gap-16 u-margin-block-start-8">
             <Pill
                 button
-                on:click={() => (platform = Platform.Android)}
-                selected={platform === Platform.Android}>
+                on:click={() => ($createPlatform.type = Platform.Android)}
+                selected={$createPlatform.type === Platform.Android}>
                 Android
             </Pill>
             <Pill
                 button
-                on:click={() => (platform = Platform.Ios)}
-                selected={platform === Platform.Ios}>
+                on:click={() => ($createPlatform.type = Platform.Ios)}
+                selected={$createPlatform.type === Platform.Ios}>
                 iOS
             </Pill>
             <Pill
                 button
-                on:click={() => (platform = Platform.Linux)}
-                selected={platform === Platform.Linux}>
+                on:click={() => ($createPlatform.type = Platform.Linux)}
+                selected={$createPlatform.type === Platform.Linux}>
                 Linux
             </Pill>
             <Pill
                 button
-                on:click={() => (platform = Platform.Macos)}
-                selected={platform === Platform.Macos}>
+                on:click={() => ($createPlatform.type = Platform.Macos)}
+                selected={$createPlatform.type === Platform.Macos}>
                 Mac OS
             </Pill>
             <Pill
                 button
-                on:click={() => (platform = Platform.Windows)}
-                selected={platform === Platform.Windows}>
+                on:click={() => ($createPlatform.type = Platform.Windows)}
+                selected={$createPlatform.type === Platform.Windows}>
                 Windows
             </Pill>
             <Pill
                 button
-                on:click={() => (platform = Platform.Web)}
-                selected={platform === Platform.Web}>
+                on:click={() => ($createPlatform.type = Platform.Web)}
+                selected={$createPlatform.type === Platform.Web}>
                 Web
             </Pill>
         </div>
@@ -168,16 +123,16 @@
         <InputText
             id="name"
             label="Name"
-            placeholder={placeholder[platform].name}
+            placeholder={placeholder[$createPlatform.type].name}
             required
             bind:value={$createPlatform.name} />
-        {#if platform === Platform.Web}
+        {#if $createPlatform.type === Platform.Web}
             <div>
                 <InputText
                     id="hostname"
-                    label={hostname[platform]}
-                    placeholder={placeholder[platform].hostname}
-                    tooltip={placeholder[platform].tooltip}
+                    label={hostname[$createPlatform.type]}
+                    placeholder={placeholder[$createPlatform.type].hostname}
+                    tooltip={placeholder[$createPlatform.type].tooltip}
                     required
                     bind:value={$createPlatform.hostname} />
 
@@ -195,9 +150,9 @@
         {:else}
             <InputText
                 id="key"
-                label={hostname[platform]}
-                placeholder={placeholder[platform].hostname}
-                tooltip={placeholder[platform].tooltip}
+                label={hostname[$createPlatform.type]}
+                placeholder={placeholder[$createPlatform.type].hostname}
+                tooltip={placeholder[$createPlatform.type].tooltip}
                 required
                 bind:value={$createPlatform.key} />
         {/if}
diff --git a/src/routes/console/project-[project]/overview/platforms/wizard/store.ts b/src/routes/console/project-[project]/overview/platforms/wizard/store.ts
index 66d15738f3..b826be83d8 100644
--- a/src/routes/console/project-[project]/overview/platforms/wizard/store.ts
+++ b/src/routes/console/project-[project]/overview/platforms/wizard/store.ts
@@ -3,14 +3,19 @@ import { sdkForConsole } from '$lib/stores/sdk';
 import { cachedStore } from '$lib/helpers/cache';
 import type { Models } from '@aw-labs/appwrite-console';
 
+type Store = Partial<Models.Platform> & {
+    projectId?: string;
+};
+
 function createPlatformStore() {
-    const { subscribe, update, set } = writable<Partial<Models.Platform>>({
+    const { subscribe, update, set } = writable<Store>({
         $id: null,
         name: null,
         hostname: null,
         key: null,
         store: null,
-        type: null
+        type: null,
+        projectId: null
     });
 
     return {
@@ -24,7 +29,8 @@ function createPlatformStore() {
                 hostname: null,
                 key: null,
                 store: null,
-                type: null
+                type: null,
+                projectId: null
             });
         }
     };
diff --git a/src/routes/console/project-[project]/overview/platforms/wizard/web/step1.svelte b/src/routes/console/project-[project]/overview/platforms/wizard/web/step1.svelte
index 12d9fcccde..926eb66abc 100644
--- a/src/routes/console/project-[project]/overview/platforms/wizard/web/step1.svelte
+++ b/src/routes/console/project-[project]/overview/platforms/wizard/web/step1.svelte
@@ -4,50 +4,19 @@
     import { Pill } from '$lib/elements';
     import { FormList, InputText } from '$lib/elements/forms';
     import { WizardStep } from '$lib/layout';
-    import { sdkForConsole } from '$lib/stores/sdk';
+    import { app } from '$lib/stores/app';
     import { wizard } from '$lib/stores/wizard';
     import { createPlatform } from '../store';
-    import { app } from '$lib/stores/app';
-    import Light from './light.svg';
     import Dark from './dark.svg';
-    import { trackEvent } from '$lib/actions/analytics';
+    import Light from './light.svg';
 
-    const projectId = $page.params.project;
+    $createPlatform.projectId = $page.params.project;
     const suggestions = ['*.vercel.app', '*.netlify.app', '*.gitpod.io'];
 
     $wizard.media = $app.themeInUse === 'dark' ? Dark : Light;
-    async function beforeSubmit() {
-        if ($createPlatform.$id) {
-            await sdkForConsole.projects.updatePlatform(
-                projectId,
-                $createPlatform.$id,
-                $createPlatform.name,
-                $createPlatform.key,
-                $createPlatform.store,
-                $createPlatform.hostname
-            );
-
-            return;
-        }
-
-        const platform = await sdkForConsole.projects.createPlatform(
-            projectId,
-            'web',
-            $createPlatform.name,
-            undefined,
-            undefined,
-            $createPlatform.hostname
-        );
-
-        trackEvent('submit_platform_create', {
-            type: 'web'
-        });
-
-        $createPlatform.$id = platform.$id;
-    }
 </script>
 
-<WizardStep {beforeSubmit}>
+<WizardStep>
     <svelte:fragment slot="title">Register your Web app</svelte:fragment>
     <FormList>
         <InputText