diff --git a/src/routes/(console)/project-[region]-[project]/overview/platforms/createAndroid.svelte b/src/routes/(console)/project-[region]-[project]/overview/platforms/createAndroid.svelte index e5aba6c42..f6e3d4209 100644 --- a/src/routes/(console)/project-[region]-[project]/overview/platforms/createAndroid.svelte +++ b/src/routes/(console)/project-[region]-[project]/overview/platforms/createAndroid.svelte @@ -10,7 +10,8 @@ Typography, Fieldset, InlineCode, - Tooltip + Tooltip, + Alert } from '@appwrite.io/pink-svelte'; import { Button, Form, InputText } from '$lib/elements/forms'; import { IconAndroid, IconAppwrite, IconInfo } from '@appwrite.io/pink-icons-svelte'; @@ -39,6 +40,31 @@ const val APPWRITE_PROJECT_NAME = "${$project.name}" const val APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject(page.params.region, page.params.project).client.config.endpoint}"`; + const prompt = ` + 1. If you're starting a new project, you can clone our starter kit from GitHub using the terminal, VSCode or Android Studio. + + \`\`\`bash + ${gitCloneCode} + \`\`\` + + 2. Open the file \`constants/AppwriteConfig.kt\` and update the configuration settings. + + + \`\`\`kotlin + ${configCode} + \`\`\` + + 3. Run the app on a connected device or emulator, then click the \`Send a ping\` button to verify the setup. + `; + + async function copyPrompt() { + await navigator.clipboard.writeText(prompt); + addNotification({ + type: 'success', + message: 'Prompt copied to clipboard' + }); + } + async function createAndroidPlatform() { try { isCreatingPlatform = true; @@ -162,6 +188,18 @@ const val APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject(page.params.region, page. {#if isPlatformCreated}
+ + + Paste it into your LLM to generate a working setup. + + + 1. If you're starting a new project, you can clone our starter kit from GitHub using the terminal, VSCode or Android Studio. diff --git a/src/routes/(console)/project-[region]-[project]/overview/platforms/createApple.svelte b/src/routes/(console)/project-[region]-[project]/overview/platforms/createApple.svelte index d83013497..4b9237df1 100644 --- a/src/routes/(console)/project-[region]-[project]/overview/platforms/createApple.svelte +++ b/src/routes/(console)/project-[region]-[project]/overview/platforms/createApple.svelte @@ -11,7 +11,8 @@ Typography, Fieldset, InlineCode, - Tooltip + Tooltip, + Alert } from '@appwrite.io/pink-svelte'; import { Button, Form, InputText } from '$lib/elements/forms'; import { IconApple, IconAppwrite, IconInfo } from '@appwrite.io/pink-icons-svelte'; @@ -41,6 +42,22 @@ APPWRITE_PROJECT_NAME: "${$project.name}" APPWRITE_PUBLIC_ENDPOINT: "${sdk.forProject(page.params.region, page.params.project).client.config.endpoint}"`; + const prompt = ` + 1. If you're starting a new project, you can clone our starter kit from GitHub using the terminal or XCode. + + \`\`\`bash + ${gitCloneCode} + \`\`\` + + 2. Update the configuration settings in the file \`Sources/Config.plist\` to reflect the values below: + + \`\`\`plaintext + ${configCode} + \`\`\` + + 3. Run the app on a connected device or simulator, then click the \`Send a ping\` button to verify the setup. + `; + export let platform: PlatformType = PlatformType.Appleios; let platforms: { [key: string]: PlatformType } = { @@ -50,6 +67,14 @@ APPWRITE_PUBLIC_ENDPOINT: "${sdk.forProject(page.params.region, page.params.proj tvOS: PlatformType.Appletvos }; + async function copyPrompt() { + await navigator.clipboard.writeText(prompt); + addNotification({ + type: 'success', + message: 'Prompt copied to clipboard' + }); + } + async function createApplePlatform() { try { isCreatingPlatform = true; @@ -192,6 +217,18 @@ APPWRITE_PUBLIC_ENDPOINT: "${sdk.forProject(page.params.region, page.params.proj {#if isPlatformCreated}
+ + + Paste it into your LLM to generate a working setup. + + + 1. If you're starting a new project, you can clone our starter kit from GitHub using the terminal or XCode. diff --git a/src/routes/(console)/project-[region]-[project]/overview/platforms/createFlutter.svelte b/src/routes/(console)/project-[region]-[project]/overview/platforms/createFlutter.svelte index ac39899ae..00f67852d 100644 --- a/src/routes/(console)/project-[region]-[project]/overview/platforms/createFlutter.svelte +++ b/src/routes/(console)/project-[region]-[project]/overview/platforms/createFlutter.svelte @@ -11,7 +11,8 @@ Typography, Fieldset, InlineCode, - Tooltip + Tooltip, + Alert } from '@appwrite.io/pink-svelte'; import { Button, Form, InputText } from '$lib/elements/forms'; import { IconFlutter, IconAppwrite, IconInfo } from '@appwrite.io/pink-icons-svelte'; @@ -42,6 +43,22 @@ static const String appwritePublicEndpoint = '${sdk.forProject(page.params.region, page.params.project).client.config.endpoint}'; }`; + const prompt = ` + 1. If you're starting a new project, you can clone our starter kit from GitHub using the terminal, VSCode or Android Studio. + + \`\`\`bash + ${gitCloneCode} + \`\`\` + + 2. Replace lib/config/environment.dart to reflect the values below: + + \`\`\`dart + ${configCode} + \`\`\` + + 3. Run the app on a connected device or simulator using \`flutter run -d [device_name]\`, then click the \`Send a ping\` button to verify the setup. + `; + export let platform: PlatformType = PlatformType.Flutterandroid; let platforms: { [key: string]: PlatformType } = { @@ -108,6 +125,14 @@ [PlatformType.Flutterwindows]: 'Package name' }; + async function copyPrompt() { + await navigator.clipboard.writeText(prompt); + addNotification({ + type: 'success', + message: 'Prompt copied to clipboard' + }); + } + async function createFlutterPlatform() { try { isCreatingPlatform = true; @@ -273,6 +298,18 @@ {#if isPlatformCreated}
+ + + Paste it into your LLM to generate a working setup. + + + 1. If you're starting a new project, you can clone our starter kit from GitHub using the terminal, VSCode or Android Studio. diff --git a/src/routes/(console)/project-[region]-[project]/overview/platforms/createReactNative.svelte b/src/routes/(console)/project-[region]-[project]/overview/platforms/createReactNative.svelte index 2853694a1..23792884b 100644 --- a/src/routes/(console)/project-[region]-[project]/overview/platforms/createReactNative.svelte +++ b/src/routes/(console)/project-[region]-[project]/overview/platforms/createReactNative.svelte @@ -11,7 +11,8 @@ Typography, Fieldset, InlineCode, - Tooltip + Tooltip, + Alert } from '@appwrite.io/pink-svelte'; import { Button, Form, InputText } from '$lib/elements/forms'; import { IconReact, IconAppwrite, IconInfo } from '@appwrite.io/pink-icons-svelte'; @@ -40,6 +41,22 @@ EXPO_PUBLIC_APPWRITE_PROJECT_NAME="${$project.name}" EXPO_PUBLIC_APPWRITE_ENDPOINT=${sdk.forProject(page.params.region, page.params.project).client.config.endpoint}`; + const prompt = ` + 1. If you're starting a new project, you can clone our starter kit from GitHub using the terminal or VSCode. + + \`\`\`bash + ${gitCloneCode} + \`\`\` + + 2. Add your Appwrite credentials to \`.env.example\` then rename it to \`.env\` if needed. + + \`\`\`dotenv + ${updateConfigCode} + \`\`\` + + 3. Run the app on a connected device or simulator using \`npm install\` followed by \`npm run ios\` or \`npm run android\`, then click the \`Send a ping\` button to verify the setup. + `; + export let platform: PlatformType = PlatformType.Reactnativeandroid; let platforms: { [key: string]: PlatformType } = { @@ -76,6 +93,14 @@ EXPO_PUBLIC_APPWRITE_ENDPOINT=${sdk.forProject(page.params.region, page.params.p [PlatformType.Reactnativeios]: 'Bundle ID' }; + async function copyPrompt() { + await navigator.clipboard.writeText(prompt); + addNotification({ + type: 'success', + message: 'Prompt copied to clipboard' + }); + } + async function createReactNativePlatform() { try { isCreatingPlatform = true; @@ -217,6 +242,19 @@ EXPO_PUBLIC_APPWRITE_ENDPOINT=${sdk.forProject(page.params.region, page.params.p {#if isPlatformCreated}
+ + + Paste it into your LLM to generate a working setup. + + + + 1. If you're starting a new project, you can clone our starter kit from GitHub using the terminal or VSCode. diff --git a/src/routes/(console)/project-[region]-[project]/overview/platforms/createWeb.svelte b/src/routes/(console)/project-[region]-[project]/overview/platforms/createWeb.svelte index 3a16c105f..0288a657b 100644 --- a/src/routes/(console)/project-[region]-[project]/overview/platforms/createWeb.svelte +++ b/src/routes/(console)/project-[region]-[project]/overview/platforms/createWeb.svelte @@ -11,7 +11,8 @@ Fieldset, InlineCode, Card, - Tooltip + Tooltip, + Alert } from '@appwrite.io/pink-svelte'; import { Button, Form, InputText } from '$lib/elements/forms'; import { @@ -151,6 +152,45 @@ ${prefix}APPWRITE_ENDPOINT = "${sdk.forProject(page.params.region, page.params.p $: selectedFramework = frameworks.find((framework) => framework.key === selectedFrameworkKey); $: selectedFrameworkIcon = selectedFramework ? selectedFramework.icon : NoFrameworkIcon; + $: prompt = `1. If you're starting a new project, you can clone our starter kit from + GitHub using the terminal or VSCode. + + \`\`\`bash + git clone https://github.com/appwrite/starter-for-${selectedFramework.key} + cd starter-for-${selectedFramework.key} + \`\`\` + + 2. Copy the file \`.env.example\` to \`.env\` and update the configuration settings. + + \`\`\`dotenv + APPWRITE_PROJECT_ID=${projectId} + APPWRITE_PROJECT_NAME=${$project.name} + APPWRITE_ENDPOINT=${sdk.forProject(page.params.region, page.params.project).client.config.endpoint} + \`\`\` + + 3. Install project dependencies + + \`\`\`bash + npm install + \`\`\` + + 4. Run the app, then click the \`Send a ping\` button + to verify the setup. + + \`\`\`bash + ${selectedFramework.runCommand} + \`\`\` + + Demo app runs on http://localhost:${selectedFramework.portNumber} + `; + + async function copyPrompt() { + await navigator.clipboard.writeText(prompt); + addNotification({ + type: 'success', + message: 'Prompt copied to clipboard' + }); + } async function createWebPlatform() { hostnameError = hostname !== '' ? !new RegExp(extendedHostnameRegex).test(hostname) : null; @@ -287,6 +327,19 @@ ${prefix}APPWRITE_ENDPOINT = "${sdk.forProject(page.params.region, page.params.p {#if isPlatformCreated && !isChangingFramework}
+ + + Paste it into your LLM to generate a working setup. + + + + 1. If you're starting a new project, you can clone our starter kit from GitHub using the terminal or VSCode.