mirror of
https://github.com/appwrite/console.git
synced 2026-06-06 19:27:48 +00:00
Continue wizard if platform is already added
This commit is contained in:
@@ -108,7 +108,7 @@
|
||||
<img src={logo.src} alt={logo.alt} />
|
||||
</a>
|
||||
<Breadcrumbs {organizations} />
|
||||
{#if selectedProject.pingCount === 0}
|
||||
{#if selectedProject && selectedProject.pingCount === 0}
|
||||
<div class="only-desktop">
|
||||
<Button.Anchor
|
||||
href={`${base}/project-${selectedProject.$id}/get-started`}
|
||||
|
||||
@@ -1,3 +1,30 @@
|
||||
export function isMac(): boolean {
|
||||
return window.navigator.platform.toUpperCase().indexOf('MAC') >= 0;
|
||||
}
|
||||
|
||||
export const getPlatformInfo = (platform: string) => {
|
||||
let name: string, icon: string;
|
||||
if (platform.includes('flutter')) {
|
||||
name = 'Flutter';
|
||||
icon = 'flutter';
|
||||
} else if (platform.includes('react-native')) {
|
||||
name = 'React Native';
|
||||
icon = 'react-native';
|
||||
} else if (platform.includes('apple')) {
|
||||
name = 'Apple';
|
||||
icon = 'apple';
|
||||
} else if (platform.includes('android')) {
|
||||
name = 'Android';
|
||||
icon = 'android';
|
||||
} else if (platform.includes('unity')) {
|
||||
name = 'Unity';
|
||||
icon = 'unity';
|
||||
} else if (platform.includes('web')) {
|
||||
name = 'Web';
|
||||
icon = 'code';
|
||||
} else {
|
||||
name = 'Unknown';
|
||||
icon = 'unknown';
|
||||
}
|
||||
return { name, icon };
|
||||
};
|
||||
|
||||
@@ -13,6 +13,7 @@ export type WizardStore = {
|
||||
nextDisabled: boolean;
|
||||
step: number;
|
||||
interceptorNotificationEnabled: boolean;
|
||||
props: Record<string, unknown>;
|
||||
};
|
||||
|
||||
function createWizardStore() {
|
||||
@@ -25,7 +26,8 @@ function createWizardStore() {
|
||||
media: null,
|
||||
nextDisabled: false,
|
||||
step: 1,
|
||||
finalAction: null
|
||||
finalAction: null,
|
||||
props: {}
|
||||
});
|
||||
|
||||
return {
|
||||
@@ -34,7 +36,8 @@ function createWizardStore() {
|
||||
start: (
|
||||
component: typeof SvelteComponent<unknown>,
|
||||
media: string = null,
|
||||
step: number = 1
|
||||
step: number = 1,
|
||||
props: Record<string, unknown> = {}
|
||||
) =>
|
||||
update((n) => {
|
||||
n.show = true;
|
||||
@@ -46,6 +49,7 @@ function createWizardStore() {
|
||||
n.cover = null;
|
||||
n.nextDisabled = false;
|
||||
n.finalAction = null;
|
||||
n.props = props;
|
||||
trackEvent('wizard_start');
|
||||
return n;
|
||||
}),
|
||||
|
||||
@@ -352,7 +352,7 @@
|
||||
</Shell>
|
||||
|
||||
{#if $wizard.show && $wizard.component}
|
||||
<svelte:component this={$wizard.component} />
|
||||
<svelte:component this={$wizard.component} {...$wizard.props} />
|
||||
{:else if $wizard.cover}
|
||||
<svelte:component this={$wizard.cover} />
|
||||
{/if}
|
||||
|
||||
@@ -35,36 +35,13 @@
|
||||
import { checkPricingRefAndRedirect } from '$lib/helpers/pricingRedirect';
|
||||
import { Icon } from '@appwrite.io/pink-svelte';
|
||||
import { IconPlus } from '@appwrite.io/pink-icons-svelte';
|
||||
import { getPlatformInfo } from '$lib/helpers/platform';
|
||||
|
||||
export let data;
|
||||
|
||||
let addOrganization = false;
|
||||
let showCreate = false;
|
||||
|
||||
const getPlatformInfo = (platform: string) => {
|
||||
let name: string, icon: string;
|
||||
if (platform.includes('flutter')) {
|
||||
name = 'Flutter';
|
||||
icon = 'flutter';
|
||||
} else if (platform.includes('apple')) {
|
||||
name = 'Apple';
|
||||
icon = 'apple';
|
||||
} else if (platform.includes('android')) {
|
||||
name = 'Android';
|
||||
icon = 'android';
|
||||
} else if (platform.includes('unity')) {
|
||||
name = 'Unity';
|
||||
icon = 'unity';
|
||||
} else if (platform.includes('web')) {
|
||||
name = 'Web';
|
||||
icon = 'code';
|
||||
} else {
|
||||
name = 'Unknown';
|
||||
icon = 'unknown';
|
||||
}
|
||||
return { name, icon };
|
||||
};
|
||||
|
||||
function allServiceDisabled(project: Models.Project): boolean {
|
||||
let disabled = true;
|
||||
services.load(project);
|
||||
|
||||
@@ -9,4 +9,7 @@
|
||||
<title>Console - Appwrite</title>
|
||||
</svelte:head>
|
||||
|
||||
<Onboard {projectId} hasPlatforms={$page.data.project.platforms.length > 0} />
|
||||
<Onboard
|
||||
{projectId}
|
||||
platforms={$page.data.project.platforms}
|
||||
pingCount={$page.data.project.pingCount} />
|
||||
|
||||
@@ -1,10 +1,9 @@
|
||||
<script lang="ts">
|
||||
import { Step, Link, Icon, Layout, Card, Typography } from '@appwrite.io/pink-svelte';
|
||||
import { addPlatform } from './platforms/+page.svelte';
|
||||
import { addPlatform, continuePlatform } from './platforms/+page.svelte';
|
||||
import { app } from '$lib/stores/app';
|
||||
import {
|
||||
IconArrowRight,
|
||||
IconDeno,
|
||||
IconNodeJs,
|
||||
IconPhp,
|
||||
IconPython
|
||||
@@ -26,19 +25,39 @@
|
||||
import { wizard } from '$lib/stores/wizard';
|
||||
import { isSmallViewport } from '$lib/stores/viewport';
|
||||
import { AvatarGroup } from '$lib/components';
|
||||
import type { Models } from '@appwrite.io/console';
|
||||
import { onMount } from 'svelte';
|
||||
import { getPlatformInfo } from '$lib/helpers/platform';
|
||||
|
||||
function createKey() {
|
||||
wizard.start(Wizard);
|
||||
}
|
||||
|
||||
export let projectId: string;
|
||||
export let hasPlatforms: boolean;
|
||||
export let platforms: Models.Platform[] = [];
|
||||
export let pingCount = 0;
|
||||
|
||||
function openPlatformWizard(type: number, platform?: Models.Platform) {
|
||||
console.log('type', type);
|
||||
console.log('platform', platform);
|
||||
if (platform) {
|
||||
continuePlatform(type, platform.name, platform.key, platform.type);
|
||||
} else {
|
||||
addPlatform(type);
|
||||
}
|
||||
}
|
||||
|
||||
let platformMap = new Map();
|
||||
platforms.forEach((platform) => {
|
||||
const platformInfo = getPlatformInfo(platform.type);
|
||||
platformMap.set(platformInfo.name, platform);
|
||||
});
|
||||
</script>
|
||||
|
||||
<div style:container-type="inline-size">
|
||||
<div class="console-container">
|
||||
<div class="dashboard-content">
|
||||
{#if !hasPlatforms}
|
||||
{#if platforms.length === 0 || pingCount === 0}
|
||||
<Step.List>
|
||||
<Step.Item state="previous"
|
||||
><div>
|
||||
@@ -66,7 +85,11 @@
|
||||
<Layout.Stack
|
||||
gap="l"
|
||||
direction={$isSmallViewport ? 'column' : 'row'}>
|
||||
<Card.Button on:click={() => addPlatform(0)} padding="s"
|
||||
<Card.Button
|
||||
on:click={() => {
|
||||
openPlatformWizard(0, platformMap.get('Web'));
|
||||
}}
|
||||
padding="s"
|
||||
><Layout.Stack gap="xl"
|
||||
><div class="card-top-image web-image-light"></div>
|
||||
<div class="card-top-image web-image-dark"></div>
|
||||
@@ -82,7 +105,7 @@
|
||||
</Layout.Stack></Card.Button>
|
||||
<Card.Button
|
||||
on:click={() => {
|
||||
addPlatform(1);
|
||||
openPlatformWizard(4, platformMap.get('React Native'));
|
||||
}}
|
||||
padding="s"
|
||||
><Layout.Stack gap="xl"
|
||||
@@ -105,7 +128,11 @@
|
||||
<Layout.Stack
|
||||
gap="l"
|
||||
direction={$isSmallViewport ? 'column' : 'row'}>
|
||||
<Card.Button on:click={() => addPlatform(3)} padding="s">
|
||||
<Card.Button
|
||||
on:click={() => {
|
||||
openPlatformWizard(3, platformMap.get('Apple'));
|
||||
}}
|
||||
padding="s">
|
||||
<Layout.Stack gap="xxl">
|
||||
<img
|
||||
class="platform-image"
|
||||
@@ -123,7 +150,11 @@
|
||||
</div></Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Card.Button>
|
||||
<Card.Button on:click={() => addPlatform(2)} padding="s">
|
||||
<Card.Button
|
||||
on:click={() => {
|
||||
openPlatformWizard(2, platformMap.get('Android'));
|
||||
}}
|
||||
padding="s">
|
||||
<Layout.Stack gap="xxl">
|
||||
<img
|
||||
class="platform-image"
|
||||
@@ -142,7 +173,11 @@
|
||||
</div></Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Card.Button>
|
||||
<Card.Button on:click={() => addPlatform(1)} padding="s">
|
||||
<Card.Button
|
||||
on:click={() => {
|
||||
openPlatformWizard(1, platformMap.get('Flutter'));
|
||||
}}
|
||||
padding="s">
|
||||
<Layout.Stack gap="xxl">
|
||||
<img
|
||||
class="platform-image"
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
import CreateApple from './createApple.svelte';
|
||||
import CreateFlutter from './createFlutter.svelte';
|
||||
import CreateReactNative from './createReactNative.svelte';
|
||||
import { versions } from './wizard/store';
|
||||
import { createPlatform, versions } from './wizard/store';
|
||||
|
||||
export enum Platform {
|
||||
Web,
|
||||
@@ -18,9 +18,25 @@
|
||||
|
||||
export async function addPlatform(type: Platform) {
|
||||
await versions.load();
|
||||
createPlatform.reset();
|
||||
wizard.start(platforms[type]);
|
||||
}
|
||||
|
||||
export async function continuePlatform(
|
||||
platform: Platform,
|
||||
name: string,
|
||||
key: string,
|
||||
type: string
|
||||
) {
|
||||
await versions.load();
|
||||
createPlatform.set({
|
||||
name: name,
|
||||
key: key,
|
||||
type: type
|
||||
});
|
||||
wizard.start(platforms[platform], null, 1, { isPlatformCreated: true });
|
||||
}
|
||||
|
||||
const platforms = {
|
||||
[Platform.Flutter]: CreateFlutter,
|
||||
[Platform.Android]: CreateAndroid,
|
||||
|
||||
@@ -29,7 +29,7 @@
|
||||
import { LabelCard } from '$lib/components';
|
||||
|
||||
let showExitModal = false;
|
||||
let isPlatformCreated = false;
|
||||
export let isPlatformCreated = false;
|
||||
let isCreatingPlatform = false;
|
||||
let connectionSuccessful = false;
|
||||
const projectId = $page.params.project;
|
||||
|
||||
Reference in New Issue
Block a user