From 9218a5cb3266cc43fd85ed346ead0de4bb0ef4b9 Mon Sep 17 00:00:00 2001 From: Darshan Date: Fri, 28 Mar 2025 11:22:49 +0530 Subject: [PATCH] update: move buttons to footer. --- .../overview/platforms/createAndroid.svelte | 186 ++++++------ .../overview/platforms/createApple.svelte | 222 +++++++------- .../overview/platforms/createFlutter.svelte | 221 +++++++------- .../platforms/createReactNative.svelte | 221 +++++++------- .../overview/platforms/createWeb.svelte | 286 +++++++++--------- 5 files changed, 561 insertions(+), 575 deletions(-) diff --git a/src/routes/(console)/project-[project]/overview/platforms/createAndroid.svelte b/src/routes/(console)/project-[project]/overview/platforms/createAndroid.svelte index 78a0e7cfe..9252f2daf 100644 --- a/src/routes/(console)/project-[project]/overview/platforms/createAndroid.svelte +++ b/src/routes/(console)/project-[project]/overview/platforms/createAndroid.svelte @@ -12,7 +12,7 @@ InlineCode, Tooltip } from '@appwrite.io/pink-svelte'; - import { Button, Form, InputText } from '$lib/elements/forms'; + import { Button, InputText } from '$lib/elements/forms'; import { IconAndroid, IconAppwrite, IconInfo } from '@appwrite.io/pink-icons-svelte'; import { Card } from '$lib/components'; import { page } from '$app/stores'; @@ -94,103 +94,88 @@ const val APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject.client.config.endpoint}" -
- - - {#if !isPlatformCreated} -
- - - - - - - - - - Your package name is generally the applicationId in your - app-level build.gradle file. - - - - - - - -
- {:else} - - - - - - - {$createPlatform.name} ({$createPlatform.key}) - - - - - - {/if} - - - {#if isPlatformCreated} -
+ + + {#if !isPlatformCreated} +
+ - - 1. Clone the starter kit from GitHub using the terminal or Android - Studio. - + - -
- -
- - 2. Open the file and update the configuration - settings. - - -
- -
- - 3. Run the app on a connected device or emulator, then click the button to verify the setup. + + + + + Your package name is generally the applicationId in your + app-level build.gradle file. + + + -
- {/if} - - + +
+ {:else} + + + + + + + {$createPlatform.name} ({$createPlatform.key}) + + + + + + {/if} + + + {#if isPlatformCreated} +
+ + + 1. Clone the starter kit from GitHub using the terminal or Android Studio. + + + +
+ +
+ + 2. Open the file and update the configuration + settings. + + +
+ +
+ + 3. Run the app on a connected device or emulator, then click the button to verify the setup. + +
+ {/if} +
+ @@ -244,6 +229,17 @@ const val APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject.client.config.endpoint}" href={location.pathname}> Go to dashboard + {:else} + {/if} diff --git a/src/routes/(console)/project-[project]/overview/platforms/createApple.svelte b/src/routes/(console)/project-[project]/overview/platforms/createApple.svelte index c37edf0f2..5c616dfe9 100644 --- a/src/routes/(console)/project-[project]/overview/platforms/createApple.svelte +++ b/src/routes/(console)/project-[project]/overview/platforms/createApple.svelte @@ -12,7 +12,7 @@ InlineCode, Tooltip } from '@appwrite.io/pink-svelte'; - import { Button, Form, InputText } from '$lib/elements/forms'; + import { Button, InputText } from '$lib/elements/forms'; import { IconApple, IconAppwrite, IconInfo } from '@appwrite.io/pink-icons-svelte'; import { Card } from '$lib/components'; import { page } from '$app/stores'; @@ -105,117 +105,103 @@ APPWRITE_PUBLIC_ENDPOINT: "${sdk.forProject.client.config.endpoint}" -
- - - - {#each Object.entries(platforms) as [key, value]} -
- - -
- {/each} - - - - {#if !isPlatformCreated} -
- - - - - - - - - - You can find your Bundle Identifier in the General tab for - your app's primary target in Xcode. - - - - - - - -
- {:else} - - - - - - - {$createPlatform.name} ({$createPlatform.key}) - - - - - - {/if} - - - {#if isPlatformCreated} -
- - - 1. Clone the starter kit from GitHub using the terminal or XCode. - - - -
- -
- - 2. Open the file and - update the configuration settings. - - -
- -
- - 3. Run the app on a connected device or simulator, then click the button to verify the setup. - -
- {/if} + + + + {#each Object.entries(platforms) as [key, value]} +
+ + +
+ {/each} - + + + {#if !isPlatformCreated} +
+ + + + + + + + + + You can find your Bundle Identifier in the General tab for your + app's primary target in Xcode. + + + + + +
+ {:else} + + + + + + + {$createPlatform.name} ({$createPlatform.key}) + + + + + + {/if} + + + {#if isPlatformCreated} +
+ + + 1. Clone the starter kit from GitHub using the terminal or XCode. + + + +
+ +
+ + 2. Open the file and update + the configuration settings. + + +
+ +
+ + 3. Run the app on a connected device or simulator, then click the button to verify the setup. + +
+ {/if} + + @@ -269,6 +255,20 @@ APPWRITE_PUBLIC_ENDPOINT: "${sdk.forProject.client.config.endpoint}" href={location.pathname}> Go to dashboard + {:else} + {/if}
diff --git a/src/routes/(console)/project-[project]/overview/platforms/createFlutter.svelte b/src/routes/(console)/project-[project]/overview/platforms/createFlutter.svelte index bf2f8fefc..1f07d994c 100644 --- a/src/routes/(console)/project-[project]/overview/platforms/createFlutter.svelte +++ b/src/routes/(console)/project-[project]/overview/platforms/createFlutter.svelte @@ -12,7 +12,7 @@ InlineCode, Tooltip } from '@appwrite.io/pink-svelte'; - import { Button, Form, InputText } from '$lib/elements/forms'; + import { Button, InputText } from '$lib/elements/forms'; import { IconFlutter, IconAppwrite, IconInfo } from '@appwrite.io/pink-icons-svelte'; import { Card } from '$lib/components'; import { page } from '$app/stores'; @@ -162,117 +162,102 @@ static const String APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject.client.config.e -
- - - - {#each Object.entries(platforms) as [key, value]} -
- - -
- {/each} - - - - {#if !isPlatformCreated} -
- - - - - - - - - - {placeholder[platform].tooltip} - - - - - - - -
- {:else} - - - - - - - {$createPlatform.name} ({$createPlatform.key}) - - - - - - {/if} - - - {#if isPlatformCreated} -
- - - 1. Clone the starter kit from GitHub using the terminal, Android Studio - or VSCode. - - - -
- -
- - 2. Open the file and update the configuration settings. - - -
- -
- - 3. Run the app on a connected device or simulator, then click the button to verify the setup. - -
- {/if} + + + + {#each Object.entries(platforms) as [key, value]} +
+ + +
+ {/each} - + + + {#if !isPlatformCreated} +
+ + + + + + + + + + {placeholder[platform].tooltip} + + + + + +
+ {:else} + + + + + + + {$createPlatform.name} ({$createPlatform.key}) + + + + + + {/if} + + + {#if isPlatformCreated} +
+ + + 1. Clone the starter kit from GitHub using the terminal, Android Studio or + VSCode. + + + +
+ +
+ + 2. Open the file + and update the configuration settings. + + +
+ +
+ + 3. Run the app on a connected device or simulator, then click the button to verify the setup. + +
+ {/if} + + @@ -326,6 +311,20 @@ static const String APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject.client.config.e href={location.pathname}> Go to dashboard + {:else} + {/if}
diff --git a/src/routes/(console)/project-[project]/overview/platforms/createReactNative.svelte b/src/routes/(console)/project-[project]/overview/platforms/createReactNative.svelte index a3bc87c49..1c66d51f0 100644 --- a/src/routes/(console)/project-[project]/overview/platforms/createReactNative.svelte +++ b/src/routes/(console)/project-[project]/overview/platforms/createReactNative.svelte @@ -12,7 +12,7 @@ InlineCode, Tooltip } from '@appwrite.io/pink-svelte'; - import { Button, Form, InputText } from '$lib/elements/forms'; + import { Button, InputText } from '$lib/elements/forms'; import { IconReact, IconAppwrite, IconInfo } from '@appwrite.io/pink-icons-svelte'; import { Card } from '$lib/components'; import { page } from '$app/stores'; @@ -131,117 +131,102 @@ const APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject.client.config.endpoint}"; -
- - - - {#each Object.entries(platforms) as [key, value]} -
- - -
- {/each} - - - - {#if !isPlatformCreated} -
- - - - - - - - - - {placeholder[platform].tooltip} - - - - - - - -
- {:else} - - - - - - - {$createPlatform.name} ({$createPlatform.key}) - - - - - - {/if} - - - {#if isPlatformCreated} -
- - - 1. Clone the starter kit from GitHub using the terminal or VSCode. - - - -
- -
- - 2. Open the file and update the configuration settings. - - -
- -
- - 3. Run the app on a connected device or simulator, then click the button to verify the setup. - -
- {/if} + + + + {#each Object.entries(platforms) as [key, value]} +
+ + +
+ {/each} - + + + {#if !isPlatformCreated} +
+ + + + + + + + + + {placeholder[platform].tooltip} + + + + + +
+ {:else} + + + + + + + {$createPlatform.name} ({$createPlatform.key}) + + + + + + {/if} + + + {#if isPlatformCreated} +
+ + + 1. Clone the starter kit from GitHub using the terminal or VSCode. + + + +
+ +
+ + 2. Open the file and + update the configuration settings. + + +
+ +
+ + 3. Run the app on a connected device or simulator, then click the button to verify the setup. + +
+ {/if} + + @@ -292,6 +277,20 @@ const APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject.client.config.endpoint}"; href={location.pathname}> Go to dashboard + {:else} + {/if}
diff --git a/src/routes/(console)/project-[project]/overview/platforms/createWeb.svelte b/src/routes/(console)/project-[project]/overview/platforms/createWeb.svelte index 7f25500a3..fa5dd07e6 100644 --- a/src/routes/(console)/project-[project]/overview/platforms/createWeb.svelte +++ b/src/routes/(console)/project-[project]/overview/platforms/createWeb.svelte @@ -14,7 +14,7 @@ Button, Tooltip } from '@appwrite.io/pink-svelte'; - import { Form, InputText } from '$lib/elements/forms'; + import { InputText } from '$lib/elements/forms'; import { IconVue, IconAppwrite, @@ -144,8 +144,10 @@ ${prefix}APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject.client.config.endpoint}" $: selectedFrameworkIcon = selectedFramework ? selectedFramework.icon : NoFrameworkIcon; async function createWebPlatform() { + hostnameError = false; hostnameError = !new RegExp(hostnameRegex).test(hostname); if (hostnameError) { + console.log(`wrong hostname`); return; } @@ -202,155 +204,141 @@ ${prefix}APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject.client.config.endpoint}" -
- - - {#if !isPlatformCreated || isChangingFramework} -
- -
- {#each frameworks as framework} - - {/each} -
- - {#if isChangingFramework} - (isChangingFramework = false)}> - Save - {/if} - - -
- {#if !isChangingFramework} -
- - - - - The hostname that your website will use to interact with the - Appwrite APIs in production or development environments. No - protocol or port number required. - - -
- Create platform - {/if} - {:else} - - - - {selectedFramework.label} - - { - isChangingFramework = true; - }}>Change - - {/if} - - - {#if isPlatformCreated && !isChangingFramework} -
- - - 1. Clone the starter kit from GitHub using the terminal or VSCode. - - - -
- -
- - {#if selectedFramework.key === 'angular'} - 2. Change - to reflect the values below: - {:else} - 2. Rename into and update the values. - {/if} - - -
- -
- - 3. Install project dependencies - - -
- -
- - 4. Run the app, then click the + + {#if !isPlatformCreated || isChangingFramework} +
+ +
+ {#each frameworks as framework} + + {/each} +
+ + {#if isChangingFramework} + button to verify the setup. - -
- -
+ disabled={!selectedFramework} + on:click={() => (isChangingFramework = false)}> + Save + {/if} -
- - - Demo app runs on http://localhost:{selectedFramework.portNumber} - Open + +
+ {#if !isChangingFramework} +
+ + + + + The hostname that your website will use to interact with the + Appwrite APIs in production or development environments. No protocol + or port number required. + + +
{/if} - - + {:else} + + + + {selectedFramework.label} + + { + isChangingFramework = true; + }}>Change + + {/if} + + + {#if isPlatformCreated && !isChangingFramework} +
+ + + 1. Clone the starter kit from GitHub using the terminal or VSCode. + + + +
+ +
+ + {#if selectedFramework.key === 'angular'} + 2. Change + to reflect the values below: + {:else} + 2. Rename into and update the values. + {/if} + + +
+ +
+ + 3. Install project dependencies + + +
+ +
+ + 4. Run the app, then click the button + to verify the setup. + +
+ +
+ +
+ + + Demo app runs on http://localhost:{selectedFramework.portNumber} + Open + {/if} + + @@ -394,9 +382,13 @@ ${prefix}APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject.client.config.endpoint}" {#if isPlatformCreated} Go to dashboard + {:else} + Create platform {/if}