mirror of
https://github.com/appwrite/console.git
synced 2026-06-06 19:27:48 +00:00
Merge branch 'main' into 'fix-pro-1929'.
This commit is contained in:
Darshan
+1
-1
@@ -98,7 +98,7 @@
|
||||
<div class="u-flex u-gap-16">
|
||||
<div class="u-cross-child-center u-line-height-1-5">
|
||||
<h6 class="u-bold">{$platform.name}</h6>
|
||||
<p>{$platform.hostname}</p>
|
||||
<p>{$platform.hostname || $platform.key}</p>
|
||||
</div>
|
||||
</div>
|
||||
</Box>
|
||||
|
||||
+57
-56
@@ -91,11 +91,11 @@ const val APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject(page.params.region, page.
|
||||
});
|
||||
</script>
|
||||
|
||||
<Wizard title="Add Android platform" bind:showExitModal confirmExit>
|
||||
<Form onSubmit={createAndroidPlatform}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<!-- Step One -->
|
||||
{#if !isPlatformCreated}
|
||||
<Wizard title="Add Android platform" bind:showExitModal confirmExit={!isPlatformCreated}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<!-- Step One -->
|
||||
{#if !isPlatformCreated}
|
||||
<Form onSubmit={createAndroidPlatform}>
|
||||
<Fieldset legend="Details">
|
||||
<Layout.Stack gap="l" alignItems="flex-end">
|
||||
<Layout.Stack gap="s">
|
||||
@@ -136,59 +136,60 @@ const val APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject(page.params.region, page.
|
||||
</Button>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{:else}
|
||||
<Layout.Stack gap="xxl">
|
||||
<Card padding="s" radius="s">
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
gap="xs">
|
||||
<Layout.Stack direction="row" alignItems="center" gap="s">
|
||||
<Icon size="m" icon={IconAndroid} />
|
||||
<Typography.Text variant="m-400" color="--fgcolor-neutral-primary">
|
||||
{$createPlatform.name} ({$createPlatform.key})
|
||||
</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Form>
|
||||
{:else}
|
||||
<Layout.Stack gap="xxl">
|
||||
<Card padding="s" radius="s">
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
gap="xs">
|
||||
<Layout.Stack direction="row" alignItems="center" gap="s">
|
||||
<Icon size="m" icon={IconAndroid} />
|
||||
<Typography.Text variant="m-400" color="--fgcolor-neutral-primary">
|
||||
{$createPlatform.name} ({$createPlatform.key})
|
||||
</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Card>
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
|
||||
<!-- Step Two -->
|
||||
{#if isPlatformCreated}
|
||||
<Fieldset legend="Clone starter">
|
||||
<Layout.Stack gap="l">
|
||||
<Typography.Text variant="m-500">
|
||||
1. If you're starting a new project, you can clone our starter kit from
|
||||
GitHub using the terminal, VSCode or Android Studio.
|
||||
</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={gitCloneCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Open the file <InlineCode
|
||||
size="s"
|
||||
code="data/repository/AppwriteRepository.kt" /> and update the configuration
|
||||
settings.</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="kotlin" lineNumbers code={updateConfigCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>3. Run the app on a connected device or emulator, then click the <InlineCode
|
||||
size="s"
|
||||
code="Send a ping" /> button to verify the setup.</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Form>
|
||||
</Card>
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
|
||||
<!-- Step Two -->
|
||||
{#if isPlatformCreated}
|
||||
<Fieldset legend="Clone starter">
|
||||
<Layout.Stack gap="l">
|
||||
<Typography.Text variant="m-500">
|
||||
1. If you're starting a new project, you can clone our starter kit from
|
||||
GitHub using the terminal, VSCode or Android Studio.
|
||||
</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={gitCloneCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Open the file <InlineCode
|
||||
size="s"
|
||||
code="data/repository/AppwriteRepository.kt" /> and update the configuration
|
||||
settings.</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="kotlin" lineNumbers code={updateConfigCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>3. Run the app on a connected device or emulator, then click the <InlineCode
|
||||
size="s"
|
||||
code="Send a ping" /> button to verify the setup.</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
|
||||
<svelte:fragment slot="aside">
|
||||
<Card padding="l" class="responsive-padding">
|
||||
<Layout.Stack gap="xxl">
|
||||
|
||||
+109
-105
@@ -102,117 +102,121 @@ APPWRITE_PUBLIC_ENDPOINT: "${sdk.forProject(page.params.region, page.params.proj
|
||||
});
|
||||
</script>
|
||||
|
||||
<Wizard title="Add Apple platform" bind:showExitModal confirmExit>
|
||||
<Form onSubmit={createApplePlatform}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<!-- Step One -->
|
||||
<Layout.Grid gap="l" rowGap="l" columns={4} columnsXS={2}>
|
||||
{#each Object.entries(platforms) as [key, value]}
|
||||
<Pink2Card.Selector
|
||||
{value}
|
||||
id={key}
|
||||
title={key}
|
||||
imageRadius="s"
|
||||
name="framework"
|
||||
bind:group={platform}
|
||||
disabled={isCreatingPlatform || isPlatformCreated} />
|
||||
{/each}
|
||||
</Layout.Grid>
|
||||
<Wizard title="Add Apple platform" bind:showExitModal confirmExit={!isPlatformCreated}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<Form onSubmit={createApplePlatform}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<!-- Step One -->
|
||||
<Layout.Grid gap="l" rowGap="l" columns={4} columnsXS={2}>
|
||||
{#each Object.entries(platforms) as [key, value]}
|
||||
<Pink2Card.Selector
|
||||
{value}
|
||||
id={key}
|
||||
title={key}
|
||||
imageRadius="s"
|
||||
name="framework"
|
||||
bind:group={platform}
|
||||
disabled={isCreatingPlatform || isPlatformCreated} />
|
||||
{/each}
|
||||
</Layout.Grid>
|
||||
|
||||
<!-- Step Two -->
|
||||
{#if !isPlatformCreated}
|
||||
<Fieldset legend="Details">
|
||||
<Layout.Stack gap="l" alignItems="flex-end">
|
||||
<Layout.Stack gap="s">
|
||||
<InputText
|
||||
id="name"
|
||||
label="Name"
|
||||
placeholder="My Apple App"
|
||||
required
|
||||
bind:value={$createPlatform.name} />
|
||||
<!-- Step Two -->
|
||||
{#if !isPlatformCreated}
|
||||
<Fieldset legend="Details">
|
||||
<Layout.Stack gap="l" alignItems="flex-end">
|
||||
<Layout.Stack gap="s">
|
||||
<InputText
|
||||
id="name"
|
||||
label="Name"
|
||||
placeholder="My Apple App"
|
||||
required
|
||||
bind:value={$createPlatform.name} />
|
||||
|
||||
<!-- Tooltips on InputText don't work as of now -->
|
||||
<InputText
|
||||
id="hostname"
|
||||
label="Bundle ID"
|
||||
placeholder="com.company.appname"
|
||||
required
|
||||
bind:value={$createPlatform.key}>
|
||||
<Tooltip slot="info" maxWidth="15rem">
|
||||
<Icon icon={IconInfo} size="s" />
|
||||
<Typography.Caption variant="400" slot="tooltip">
|
||||
You can find your Bundle Identifier in the General tab for
|
||||
your app's primary target in Xcode.
|
||||
</Typography.Caption>
|
||||
</Tooltip>
|
||||
</InputText>
|
||||
</Layout.Stack>
|
||||
|
||||
<Button
|
||||
fullWidthMobile
|
||||
size="s"
|
||||
submit
|
||||
forceShowLoader
|
||||
submissionLoader={isCreatingPlatform}
|
||||
disabled={!platform ||
|
||||
!$createPlatform.name ||
|
||||
!$createPlatform.key ||
|
||||
isCreatingPlatform}>
|
||||
Create platform
|
||||
</Button>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{:else}
|
||||
<Layout.Stack gap="xxl">
|
||||
<Card padding="s" radius="s">
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
gap="xs">
|
||||
<Layout.Stack direction="row" alignItems="center" gap="s">
|
||||
<Icon size="m" icon={IconApple} />
|
||||
<Typography.Text variant="m-400" color="--fgcolor-neutral-primary">
|
||||
{$createPlatform.name} ({$createPlatform.key})
|
||||
</Typography.Text>
|
||||
<!-- Tooltips on InputText don't work as of now -->
|
||||
<InputText
|
||||
id="hostname"
|
||||
label="Bundle ID"
|
||||
placeholder="com.company.appname"
|
||||
required
|
||||
bind:value={$createPlatform.key}>
|
||||
<Tooltip slot="info" maxWidth="15rem">
|
||||
<Icon icon={IconInfo} size="s" />
|
||||
<Typography.Caption variant="400" slot="tooltip">
|
||||
You can find your Bundle Identifier in the General tab
|
||||
for your app's primary target in Xcode.
|
||||
</Typography.Caption>
|
||||
</Tooltip>
|
||||
</InputText>
|
||||
</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Card>
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
|
||||
<!-- Step Three -->
|
||||
{#if isPlatformCreated}
|
||||
<Fieldset legend="Clone starter">
|
||||
<Layout.Stack gap="l">
|
||||
<Typography.Text variant="m-500">
|
||||
1. If you're starting a new project, you can clone our starter kit from
|
||||
GitHub using the terminal or XCode.
|
||||
</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={gitCloneCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Open the file <InlineCode size="s" code="Sources/Config.plist" /> and
|
||||
update the configuration settings.</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="plaintext" lineNumbers code={updateConfigCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>3. Run the app on a connected device or simulator, then click the <InlineCode
|
||||
<Button
|
||||
fullWidthMobile
|
||||
size="s"
|
||||
code="Send a ping" /> button to verify the setup.</Typography.Text>
|
||||
submit
|
||||
forceShowLoader
|
||||
submissionLoader={isCreatingPlatform}
|
||||
disabled={!platform ||
|
||||
!$createPlatform.name ||
|
||||
!$createPlatform.key ||
|
||||
isCreatingPlatform}>
|
||||
Create platform
|
||||
</Button>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{:else}
|
||||
<Layout.Stack gap="xxl">
|
||||
<Card padding="s" radius="s">
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
gap="xs">
|
||||
<Layout.Stack direction="row" alignItems="center" gap="s">
|
||||
<Icon size="m" icon={IconApple} />
|
||||
<Typography.Text
|
||||
variant="m-400"
|
||||
color="--fgcolor-neutral-primary">
|
||||
{$createPlatform.name} ({$createPlatform.key})
|
||||
</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Card>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Form>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Form>
|
||||
|
||||
<!-- Step Three -->
|
||||
{#if isPlatformCreated}
|
||||
<Fieldset legend="Clone starter">
|
||||
<Layout.Stack gap="l">
|
||||
<Typography.Text variant="m-500">
|
||||
1. If you're starting a new project, you can clone our starter kit from
|
||||
GitHub using the terminal or XCode.
|
||||
</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={gitCloneCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Open the file <InlineCode size="s" code="Sources/Config.plist" /> and update
|
||||
the configuration settings.</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="plaintext" lineNumbers code={updateConfigCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>3. Run the app on a connected device or simulator, then click the <InlineCode
|
||||
size="s"
|
||||
code="Send a ping" /> button to verify the setup.</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
<svelte:fragment slot="aside">
|
||||
<Card padding="l" class="responsive-padding">
|
||||
<Layout.Stack gap="xxl">
|
||||
|
||||
+124
-120
@@ -161,133 +161,137 @@ static const String APPWRITE_PUBLIC_ENDPOINT = "${sdk.forProject(page.params.reg
|
||||
});
|
||||
</script>
|
||||
|
||||
<Wizard title="Add Flutter platform" bind:showExitModal confirmExit>
|
||||
<Form onSubmit={createFlutterPlatform}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<!-- Step One -->
|
||||
<Layout.Grid gap="l" rowGap="l" columns={3} columnsXS={2} columnsXXS={1}>
|
||||
{#each Object.entries(platforms) as [key, value]}
|
||||
<Pink2Card.Selector
|
||||
{value}
|
||||
id={key}
|
||||
title={key}
|
||||
imageRadius="s"
|
||||
name="framework"
|
||||
bind:group={platform}
|
||||
disabled={isCreatingPlatform || isPlatformCreated} />
|
||||
{/each}
|
||||
</Layout.Grid>
|
||||
<Wizard title="Add Flutter platform" bind:showExitModal confirmExit={!isPlatformCreated}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<Form onSubmit={createFlutterPlatform}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<!-- Step One -->
|
||||
<Layout.Grid gap="l" rowGap="l" columns={3} columnsXS={2} columnsXXS={1}>
|
||||
{#each Object.entries(platforms) as [key, value]}
|
||||
<Pink2Card.Selector
|
||||
{value}
|
||||
id={key}
|
||||
title={key}
|
||||
imageRadius="s"
|
||||
name="framework"
|
||||
bind:group={platform}
|
||||
disabled={isCreatingPlatform || isPlatformCreated} />
|
||||
{/each}
|
||||
</Layout.Grid>
|
||||
|
||||
<!-- Step Two -->
|
||||
{#if !isPlatformCreated}
|
||||
<Fieldset legend="Details">
|
||||
<Layout.Stack gap="l" alignItems="flex-end">
|
||||
<Layout.Stack gap="s">
|
||||
<InputText
|
||||
id="name"
|
||||
label="Name"
|
||||
placeholder={placeholder[platform].name}
|
||||
required
|
||||
bind:value={$createPlatform.name} />
|
||||
|
||||
<!-- Tooltips on InputText don't work as of now -->
|
||||
{#if platform === PlatformType.Flutterweb}
|
||||
<!-- Step Two -->
|
||||
{#if !isPlatformCreated}
|
||||
<Fieldset legend="Details">
|
||||
<Layout.Stack gap="l" alignItems="flex-end">
|
||||
<Layout.Stack gap="s">
|
||||
<InputText
|
||||
id="hostname"
|
||||
label={hostname[platform]}
|
||||
placeholder={placeholder[platform].hostname}
|
||||
id="name"
|
||||
label="Name"
|
||||
placeholder={placeholder[platform].name}
|
||||
required
|
||||
bind:value={$createPlatform.hostname}>
|
||||
<Tooltip slot="info" maxWidth="15rem">
|
||||
<Icon icon={IconInfo} size="s" />
|
||||
<Typography.Caption variant="400" slot="tooltip">
|
||||
{placeholder[platform].tooltip}
|
||||
</Typography.Caption>
|
||||
</Tooltip>
|
||||
</InputText>
|
||||
{:else}
|
||||
<InputText
|
||||
id="key"
|
||||
label={hostname[platform]}
|
||||
placeholder={placeholder[platform].hostname}
|
||||
required
|
||||
bind:value={$createPlatform.key}>
|
||||
<Tooltip slot="info" maxWidth="15rem">
|
||||
<Icon icon={IconInfo} size="s" />
|
||||
<Typography.Caption variant="400" slot="tooltip">
|
||||
{placeholder[platform].tooltip}
|
||||
</Typography.Caption>
|
||||
</Tooltip>
|
||||
</InputText>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
bind:value={$createPlatform.name} />
|
||||
|
||||
<Button
|
||||
fullWidthMobile
|
||||
size="s"
|
||||
submit
|
||||
forceShowLoader
|
||||
submissionLoader={isCreatingPlatform}
|
||||
disabled={!platform ||
|
||||
!$createPlatform.name ||
|
||||
(!$createPlatform.key && !$createPlatform.hostname) ||
|
||||
isCreatingPlatform}>
|
||||
Create platform
|
||||
</Button>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{:else}
|
||||
<Layout.Stack gap="xxl">
|
||||
<Card padding="s" radius="s">
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
gap="xs">
|
||||
<Layout.Stack direction="row" alignItems="center" gap="s">
|
||||
<Icon size="m" icon={IconFlutter} />
|
||||
<Typography.Text variant="m-400" color="--fgcolor-neutral-primary">
|
||||
{$createPlatform.name} ({$createPlatform.key})
|
||||
</Typography.Text>
|
||||
<!-- Tooltips on InputText don't work as of now -->
|
||||
{#if platform === PlatformType.Flutterweb}
|
||||
<InputText
|
||||
id="hostname"
|
||||
label={hostname[platform]}
|
||||
placeholder={placeholder[platform].hostname}
|
||||
required
|
||||
bind:value={$createPlatform.hostname}>
|
||||
<Tooltip slot="info" maxWidth="15rem">
|
||||
<Icon icon={IconInfo} size="s" />
|
||||
<Typography.Caption variant="400" slot="tooltip">
|
||||
{placeholder[platform].tooltip}
|
||||
</Typography.Caption>
|
||||
</Tooltip>
|
||||
</InputText>
|
||||
{:else}
|
||||
<InputText
|
||||
id="key"
|
||||
label={hostname[platform]}
|
||||
placeholder={placeholder[platform].hostname}
|
||||
required
|
||||
bind:value={$createPlatform.key}>
|
||||
<Tooltip slot="info" maxWidth="15rem">
|
||||
<Icon icon={IconInfo} size="s" />
|
||||
<Typography.Caption variant="400" slot="tooltip">
|
||||
{placeholder[platform].tooltip}
|
||||
</Typography.Caption>
|
||||
</Tooltip>
|
||||
</InputText>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
|
||||
<Button
|
||||
fullWidthMobile
|
||||
size="s"
|
||||
submit
|
||||
forceShowLoader
|
||||
submissionLoader={isCreatingPlatform}
|
||||
disabled={!platform ||
|
||||
!$createPlatform.name ||
|
||||
(!$createPlatform.key && !$createPlatform.hostname) ||
|
||||
isCreatingPlatform}>
|
||||
Create platform
|
||||
</Button>
|
||||
</Layout.Stack>
|
||||
</Card>
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
|
||||
<!-- Step Three -->
|
||||
{#if isPlatformCreated}
|
||||
<Fieldset legend="Clone starter">
|
||||
<Layout.Stack gap="l">
|
||||
<Typography.Text variant="m-500">
|
||||
1. If you're starting a new project, you can clone our starter kit from
|
||||
GitHub using the terminal, VSCode or Android Studio.
|
||||
</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={gitCloneCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Open the file <InlineCode
|
||||
size="s"
|
||||
code="lib/constants/appwrite.dart" /> and update the configuration settings.</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="dart" lineNumbers code={updateConfigCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>3. Run the app on a connected device or simulator, then click the <InlineCode
|
||||
size="s"
|
||||
code="Send a ping" /> button to verify the setup.</Typography.Text>
|
||||
</Fieldset>
|
||||
{:else}
|
||||
<Layout.Stack gap="xxl">
|
||||
<Card padding="s" radius="s">
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
gap="xs">
|
||||
<Layout.Stack direction="row" alignItems="center" gap="s">
|
||||
<Icon size="m" icon={IconFlutter} />
|
||||
<Typography.Text
|
||||
variant="m-400"
|
||||
color="--fgcolor-neutral-primary">
|
||||
{$createPlatform.name} ({$createPlatform.hostname ||
|
||||
$createPlatform.key})
|
||||
</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Card>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Form>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Form>
|
||||
|
||||
<!-- Step Three -->
|
||||
{#if isPlatformCreated}
|
||||
<Fieldset legend="Clone starter">
|
||||
<Layout.Stack gap="l">
|
||||
<Typography.Text variant="m-500">
|
||||
1. If you're starting a new project, you can clone our starter kit from
|
||||
GitHub using the terminal, VSCode or Android Studio.
|
||||
</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={gitCloneCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Open the file <InlineCode size="s" code="lib/constants/appwrite.dart" />
|
||||
and update the configuration settings.</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="dart" lineNumbers code={updateConfigCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>3. Run the app on a connected device or simulator, then click the <InlineCode
|
||||
size="s"
|
||||
code="Send a ping" /> button to verify the setup.</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
<svelte:fragment slot="aside">
|
||||
<Card padding="l" class="responsive-padding">
|
||||
<Layout.Stack gap="xxl">
|
||||
|
||||
+111
-107
@@ -126,119 +126,123 @@ const EXPO_PUBLIC_APPWRITE_ENDPOINT = "${sdk.forProject(page.params.region, page
|
||||
});
|
||||
</script>
|
||||
|
||||
<Wizard title="Add React Native platform" bind:showExitModal confirmExit>
|
||||
<Form onSubmit={createReactNativePlatform}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<!-- Step One -->
|
||||
<Layout.Stack gap="l" direction="row">
|
||||
{#each Object.entries(platforms) as [key, value]}
|
||||
<Pink2Card.Selector
|
||||
{value}
|
||||
id={key}
|
||||
title={key}
|
||||
imageRadius="s"
|
||||
name="framework"
|
||||
bind:group={platform}
|
||||
disabled={isCreatingPlatform || isPlatformCreated} />
|
||||
{/each}
|
||||
</Layout.Stack>
|
||||
|
||||
<!-- Step Two -->
|
||||
{#if !isPlatformCreated}
|
||||
<Fieldset legend="Details">
|
||||
<Layout.Stack gap="l" alignItems="flex-end">
|
||||
<Layout.Stack gap="s">
|
||||
<InputText
|
||||
id="name"
|
||||
label="Name"
|
||||
placeholder={placeholder[platform].name}
|
||||
required
|
||||
bind:value={$createPlatform.name} />
|
||||
|
||||
<!-- Tooltips on InputText don't work as of now -->
|
||||
<InputText
|
||||
id="hostname"
|
||||
label={hostname[platform]}
|
||||
placeholder={placeholder[platform].hostname}
|
||||
required
|
||||
bind:value={$createPlatform.key}>
|
||||
<Tooltip slot="info" maxWidth="15rem">
|
||||
<Icon icon={IconInfo} size="s" />
|
||||
<Typography.Caption variant="400" slot="tooltip">
|
||||
{placeholder[platform].tooltip}
|
||||
</Typography.Caption>
|
||||
</Tooltip>
|
||||
</InputText>
|
||||
</Layout.Stack>
|
||||
|
||||
<Button
|
||||
fullWidthMobile
|
||||
size="s"
|
||||
submit
|
||||
forceShowLoader
|
||||
submissionLoader={isCreatingPlatform}
|
||||
disabled={!platform ||
|
||||
!$createPlatform.name ||
|
||||
!$createPlatform.key ||
|
||||
isCreatingPlatform}>
|
||||
Create platform
|
||||
</Button>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{:else}
|
||||
<Layout.Stack gap="xxl">
|
||||
<Card padding="s" radius="s">
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
gap="xs">
|
||||
<Layout.Stack direction="row" alignItems="center" gap="s">
|
||||
<Icon size="m" icon={IconReact} />
|
||||
<Typography.Text variant="m-400" color="--fgcolor-neutral-primary">
|
||||
{$createPlatform.name} ({$createPlatform.key})
|
||||
</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Card>
|
||||
<Wizard title="Add React Native platform" bind:showExitModal confirmExit={!isPlatformCreated}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<Form onSubmit={createReactNativePlatform}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<!-- Step One -->
|
||||
<Layout.Stack gap="l" direction="row">
|
||||
{#each Object.entries(platforms) as [key, value]}
|
||||
<Pink2Card.Selector
|
||||
{value}
|
||||
id={key}
|
||||
title={key}
|
||||
imageRadius="s"
|
||||
name="framework"
|
||||
bind:group={platform}
|
||||
disabled={isCreatingPlatform || isPlatformCreated} />
|
||||
{/each}
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
|
||||
<!-- Step Three -->
|
||||
{#if isPlatformCreated}
|
||||
<Fieldset legend="Clone starter">
|
||||
<Layout.Stack gap="l">
|
||||
<Typography.Text variant="m-500">
|
||||
1. If you're starting a new project, you can clone our starter kit from
|
||||
GitHub using the terminal or VSCode.
|
||||
</Typography.Text>
|
||||
<!-- Step Two -->
|
||||
{#if !isPlatformCreated}
|
||||
<Fieldset legend="Details">
|
||||
<Layout.Stack gap="l" alignItems="flex-end">
|
||||
<Layout.Stack gap="s">
|
||||
<InputText
|
||||
id="name"
|
||||
label="Name"
|
||||
placeholder={placeholder[platform].name}
|
||||
required
|
||||
bind:value={$createPlatform.name} />
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={gitCloneCode} />
|
||||
</div>
|
||||
<!-- Tooltips on InputText don't work as of now -->
|
||||
<InputText
|
||||
id="hostname"
|
||||
label={hostname[platform]}
|
||||
placeholder={placeholder[platform].hostname}
|
||||
required
|
||||
bind:value={$createPlatform.key}>
|
||||
<Tooltip slot="info" maxWidth="15rem">
|
||||
<Icon icon={IconInfo} size="s" />
|
||||
<Typography.Caption variant="400" slot="tooltip">
|
||||
{placeholder[platform].tooltip}
|
||||
</Typography.Caption>
|
||||
</Tooltip>
|
||||
</InputText>
|
||||
</Layout.Stack>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Add your Appwrite credentials to <InlineCode
|
||||
<Button
|
||||
fullWidthMobile
|
||||
size="s"
|
||||
code=".env.example" /> then rename it to <InlineCode
|
||||
size="s"
|
||||
code=".env" /> if needed.</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="javascript" lineNumbers code={updateConfigCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>3. Run the app on a connected device or simulator, then click the <InlineCode
|
||||
size="s"
|
||||
code="Send a ping" /> button to verify the setup.</Typography.Text>
|
||||
submit
|
||||
forceShowLoader
|
||||
submissionLoader={isCreatingPlatform}
|
||||
disabled={!platform ||
|
||||
!$createPlatform.name ||
|
||||
!$createPlatform.key ||
|
||||
isCreatingPlatform}>
|
||||
Create platform
|
||||
</Button>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{:else}
|
||||
<Layout.Stack gap="xxl">
|
||||
<Card padding="s" radius="s">
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
gap="xs">
|
||||
<Layout.Stack direction="row" alignItems="center" gap="s">
|
||||
<Icon size="m" icon={IconReact} />
|
||||
<Typography.Text
|
||||
variant="m-400"
|
||||
color="--fgcolor-neutral-primary">
|
||||
{$createPlatform.name} ({$createPlatform.key})
|
||||
</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Card>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Form>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Form>
|
||||
|
||||
<!-- Step Three -->
|
||||
{#if isPlatformCreated}
|
||||
<Fieldset legend="Clone starter">
|
||||
<Layout.Stack gap="l">
|
||||
<Typography.Text variant="m-500">
|
||||
1. If you're starting a new project, you can clone our starter kit from
|
||||
GitHub using the terminal or VSCode.
|
||||
</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={gitCloneCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Add your Appwrite credentials to <InlineCode
|
||||
size="s"
|
||||
code=".env.example" /> then rename it to <InlineCode
|
||||
size="s"
|
||||
code=".env" /> if needed.</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="javascript" lineNumbers code={updateConfigCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>3. Run the app on a connected device or simulator, then click the <InlineCode
|
||||
size="s"
|
||||
code="Send a ping" /> button to verify the setup.</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
<svelte:fragment slot="aside">
|
||||
<Card padding="l" class="responsive-padding">
|
||||
<Layout.Stack gap="xxl">
|
||||
|
||||
+136
-144
@@ -199,158 +199,150 @@ ${prefix}APPWRITE_ENDPOINT = "${sdk.forProject(page.params.region, page.params.p
|
||||
});
|
||||
</script>
|
||||
|
||||
<Wizard title="Add web platform" bind:showExitModal>
|
||||
<Form onSubmit={createWebPlatform}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<!-- Step One -->
|
||||
{#if !isPlatformCreated || isChangingFramework}
|
||||
<Fieldset legend="Type">
|
||||
<Layout.Stack>
|
||||
<div class="frameworks">
|
||||
{#each frameworks as framework}
|
||||
<Card.Selector
|
||||
bind:group={selectedFrameworkKey}
|
||||
name="framework"
|
||||
id={framework.key}
|
||||
value={framework.key}
|
||||
title={framework.label}
|
||||
icon={framework.icon}
|
||||
imageRadius="s" />
|
||||
{/each}
|
||||
</div>
|
||||
<Wizard title="Add web platform" bind:showExitModal confirmExit={!isPlatformCreated}>
|
||||
<Layout.Stack gap="xxl">
|
||||
<!-- Step One -->
|
||||
{#if !isPlatformCreated || isChangingFramework}
|
||||
<Form onSubmit={createWebPlatform}>
|
||||
<Layout.Stack>
|
||||
<Fieldset legend="Type">
|
||||
<Layout.Stack>
|
||||
<div class="frameworks">
|
||||
{#each frameworks as framework}
|
||||
<Card.Selector
|
||||
bind:group={selectedFrameworkKey}
|
||||
name="framework"
|
||||
id={framework.key}
|
||||
value={framework.key}
|
||||
title={framework.label}
|
||||
icon={framework.icon}
|
||||
imageRadius="s" />
|
||||
{/each}
|
||||
</div>
|
||||
<Layout.Stack direction="row" justifyContent="flex-end">
|
||||
{#if isChangingFramework}
|
||||
<Button
|
||||
disabled={!selectedFramework}
|
||||
on:click={() => (isChangingFramework = false)}>
|
||||
Save</Button>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{#if !isChangingFramework}
|
||||
<Fieldset legend="Details">
|
||||
<InputText
|
||||
id="hostname"
|
||||
label="Hostname"
|
||||
placeholder="localhost"
|
||||
error={hostnameError && 'Please enter a valid hostname'}
|
||||
bind:value={hostname}>
|
||||
<Tooltip slot="info">
|
||||
<Icon icon={IconInfo} size="s" />
|
||||
<span slot="tooltip">
|
||||
The hostname that your website will use to interact with the
|
||||
Appwrite APIs in production or development environments. No
|
||||
protocol or port number required.
|
||||
</span>
|
||||
</Tooltip>
|
||||
</InputText></Fieldset>
|
||||
<Layout.Stack direction="row" justifyContent="flex-end">
|
||||
{#if isChangingFramework}
|
||||
<Button
|
||||
disabled={!selectedFramework}
|
||||
on:click={() => (isChangingFramework = false)}>
|
||||
Save</Button>
|
||||
{/if}
|
||||
<Button submit disabled={!selectedFramework}>Create platform</Button>
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Form>
|
||||
{:else}
|
||||
<Card.Base padding="s"
|
||||
><Layout.Stack direction="row" justifyContent="space-between" alignItems="center">
|
||||
<Layout.Stack gap="xxs" direction="row">
|
||||
<Icon icon={selectedFramework.smallIcon} />
|
||||
<Typography.Text variant="m-500">{selectedFramework.label}</Typography.Text>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
{#if !isChangingFramework}
|
||||
<Fieldset legend="Details">
|
||||
<InputText
|
||||
id="hostname"
|
||||
label="Hostname"
|
||||
placeholder="localhost"
|
||||
error={hostnameError && 'Please enter a valid hostname'}
|
||||
bind:value={hostname}>
|
||||
<Tooltip slot="info">
|
||||
<Icon icon={IconInfo} size="s" />
|
||||
<span slot="tooltip">
|
||||
The hostname that your website will use to interact with the
|
||||
Appwrite APIs in production or development environments. No
|
||||
protocol or port number required.
|
||||
</span>
|
||||
</Tooltip>
|
||||
</InputText></Fieldset>
|
||||
<Layout.Stack direction="row" justifyContent="flex-end"
|
||||
><Button submit disabled={!selectedFramework}>Create platform</Button
|
||||
></Layout.Stack>
|
||||
{/if}
|
||||
{:else}
|
||||
<Card.Base padding="s"
|
||||
><Layout.Stack
|
||||
direction="row"
|
||||
justifyContent="space-between"
|
||||
alignItems="center">
|
||||
<Layout.Stack gap="xxs" direction="row">
|
||||
<Icon icon={selectedFramework.smallIcon} />
|
||||
<Typography.Text variant="m-500"
|
||||
>{selectedFramework.label}</Typography.Text>
|
||||
</Layout.Stack>
|
||||
<Button
|
||||
size="s"
|
||||
secondary
|
||||
on:click={() => {
|
||||
isChangingFramework = true;
|
||||
}}>Change</Button>
|
||||
</Layout.Stack></Card.Base>
|
||||
{/if}
|
||||
<Button
|
||||
size="s"
|
||||
secondary
|
||||
on:click={() => {
|
||||
isChangingFramework = true;
|
||||
}}>Change</Button>
|
||||
</Layout.Stack></Card.Base>
|
||||
{/if}
|
||||
|
||||
<!-- Step Three -->
|
||||
{#if isPlatformCreated && !isChangingFramework}
|
||||
<Fieldset legend="Clone starter">
|
||||
<Layout.Stack gap="l">
|
||||
<Typography.Text variant="m-500">
|
||||
1. If you're starting a new project, you can clone our starter kit from
|
||||
GitHub using the terminal or VSCode.
|
||||
</Typography.Text>
|
||||
<!-- Step Three -->
|
||||
{#if isPlatformCreated && !isChangingFramework}
|
||||
<Fieldset legend="Clone starter">
|
||||
<Layout.Stack gap="l">
|
||||
<Typography.Text variant="m-500">
|
||||
1. If you're starting a new project, you can clone our starter kit from
|
||||
GitHub using the terminal or VSCode.
|
||||
</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code
|
||||
lang="bash"
|
||||
lineNumbers
|
||||
code={`\ngit clone https://github.com/appwrite/starter-for-${selectedFramework.key}\ncd starter-for-${selectedFramework.key}`} />
|
||||
</div>
|
||||
|
||||
{#if selectedFramework.key === 'angular'}
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Change <InlineCode
|
||||
size="s"
|
||||
code="src/environments/environment.ts" />
|
||||
to reflect the values below:</Typography.Text>
|
||||
{:else}
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Add your Appwrite credentials to <InlineCode
|
||||
size="s"
|
||||
code=".env.example" /> then rename it to <InlineCode
|
||||
size="s"
|
||||
code=".env" /> if needed.</Typography.Text>
|
||||
{/if}
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code
|
||||
lang="bash"
|
||||
lineNumbers
|
||||
code={selectedFramework.updateConfigCode} />
|
||||
</div>
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code
|
||||
lang="bash"
|
||||
lineNumbers
|
||||
code={`\ngit clone https://github.com/appwrite/starter-for-${selectedFramework.key}\ncd starter-for-${selectedFramework.key}`} />
|
||||
</div>
|
||||
|
||||
{#if selectedFramework.key === 'angular'}
|
||||
<Typography.Text variant="m-500"
|
||||
>3. Install project dependencies</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={'npm install'} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>4. Run the app, then click the <InlineCode
|
||||
>2. Change <InlineCode
|
||||
size="s"
|
||||
code="Send a ping" /> button to verify the setup.</Typography.Text>
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={selectedFramework.runCommand} />
|
||||
</div>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
<Card.Base padding="s"
|
||||
><Layout.Stack direction="row" justifyContent="space-between"
|
||||
><Layout.Stack direction="row" alignItems="center">
|
||||
<Icon
|
||||
icon={IconInfo}
|
||||
color="--fgcolor-neutral-tertiary" /><Typography.Text
|
||||
variant="m-500"
|
||||
color="--fgcolor-neutral-primary">
|
||||
Demo app runs on http://localhost:{selectedFramework.portNumber}</Typography.Text
|
||||
></Layout.Stack>
|
||||
<Button
|
||||
external
|
||||
secondary
|
||||
href={`http://localhost:${selectedFramework.portNumber}`}
|
||||
><Layout.Stack direction="row" gap="xs"
|
||||
>Open <Icon
|
||||
icon={IconExternalLink}
|
||||
color="--fgcolor-neutral-tertiary" /></Layout.Stack
|
||||
></Button
|
||||
></Layout.Stack
|
||||
></Card.Base>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Form>
|
||||
code="src/environments/environment.ts" />
|
||||
to reflect the values below:</Typography.Text>
|
||||
{:else}
|
||||
<Typography.Text variant="m-500"
|
||||
>2. Add your Appwrite credentials to <InlineCode
|
||||
size="s"
|
||||
code=".env.example" /> then rename it to <InlineCode
|
||||
size="s"
|
||||
code=".env" /> if needed.</Typography.Text>
|
||||
{/if}
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={selectedFramework.updateConfigCode} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>3. Install project dependencies</Typography.Text>
|
||||
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={'npm install'} />
|
||||
</div>
|
||||
|
||||
<Typography.Text variant="m-500"
|
||||
>4. Run the app, then click the <InlineCode size="s" code="Send a ping" /> button
|
||||
to verify the setup.</Typography.Text>
|
||||
<!-- Temporary fix: Remove this div once Code splitting issue with stack spacing is resolved -->
|
||||
<div class="pink2-code-margin-fix">
|
||||
<Code lang="bash" lineNumbers code={selectedFramework.runCommand} />
|
||||
</div>
|
||||
</Layout.Stack>
|
||||
</Fieldset>
|
||||
<Card.Base padding="s"
|
||||
><Layout.Stack direction="row" justifyContent="space-between"
|
||||
><Layout.Stack direction="row" alignItems="center">
|
||||
<Icon icon={IconInfo} color="--fgcolor-neutral-tertiary" /><Typography.Text
|
||||
variant="m-500"
|
||||
color="--fgcolor-neutral-primary">
|
||||
Demo app runs on http://localhost:{selectedFramework.portNumber}</Typography.Text
|
||||
></Layout.Stack>
|
||||
<Button
|
||||
external
|
||||
secondary
|
||||
href={`http://localhost:${selectedFramework.portNumber}`}
|
||||
><Layout.Stack direction="row" gap="xs"
|
||||
>Open <Icon
|
||||
icon={IconExternalLink}
|
||||
color="--fgcolor-neutral-tertiary" /></Layout.Stack
|
||||
></Button
|
||||
></Layout.Stack
|
||||
></Card.Base>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
<svelte:fragment slot="aside">
|
||||
<Card.Base>
|
||||
<Layout.Stack gap="xxl">
|
||||
|
||||
Reference in New Issue
Block a user