diff --git a/package.json b/package.json index 0adef8ea1..68e8bdf24 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,7 @@ "@appwrite.io/pink-icons": "0.25.0", "@appwrite.io/pink-icons-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@753c7733", "@appwrite.io/pink-legacy": "^1.0.0", - "@appwrite.io/pink-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@753c7733", + "@appwrite.io/pink-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@938dbd3", "@popperjs/core": "^2.11.8", "@sentry/sveltekit": "^8.38.0", "@stripe/stripe-js": "^3.5.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c61e92f21..7baf58f0f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -21,8 +21,8 @@ importers: specifier: ^1.0.0 version: 1.0.0 '@appwrite.io/pink-svelte': - specifier: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@753c7733 - version: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@753c7733(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19) + specifier: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@938dbd3 + version: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@938dbd3(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19) '@popperjs/core': specifier: ^2.11.8 version: 2.11.8 @@ -224,8 +224,8 @@ packages: peerDependencies: svelte: ^4.0.0 - '@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@753c7733efd753b1a94ab9d28fa3499b580a9f74': - resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@753c7733efd753b1a94ab9d28fa3499b580a9f74} + '@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@938dbd3a95c30f3c85791a6cb7a31dd8adcc0da7': + resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@938dbd3a95c30f3c85791a6cb7a31dd8adcc0da7} version: 1.0.0-next.7 peerDependencies: svelte: ^4.0.0 @@ -239,8 +239,8 @@ packages: '@appwrite.io/pink-legacy@1.0.0': resolution: {integrity: sha512-EZk/wX8oDhIsCXf2A0oQjdNOaHvh5MnWbLQI4pAiGrdy5qQGPoU19AK6iVX6z3QoOq7geoEu0zVwAowBy5hZbQ==} - '@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@753c7733': - resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@753c7733} + '@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@938dbd3': + resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@938dbd3} version: 1.0.0-next.85 peerDependencies: react-dom: ^18.0.0 @@ -4093,7 +4093,7 @@ snapshots: dependencies: svelte: 4.2.19 - '@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@753c7733efd753b1a94ab9d28fa3499b580a9f74(svelte@4.2.19)': + '@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@938dbd3a95c30f3c85791a6cb7a31dd8adcc0da7(svelte@4.2.19)': dependencies: svelte: 4.2.19 @@ -4106,9 +4106,9 @@ snapshots: '@appwrite.io/pink-icons': 1.0.0 the-new-css-reset: 1.11.3 - '@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@753c7733(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)': + '@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@938dbd3(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)': dependencies: - '@appwrite.io/pink-icons-svelte': https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@753c7733efd753b1a94ab9d28fa3499b580a9f74(svelte@4.2.19) + '@appwrite.io/pink-icons-svelte': https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@938dbd3a95c30f3c85791a6cb7a31dd8adcc0da7(svelte@4.2.19) '@floating-ui/dom': 1.6.13 '@melt-ui/pp': 0.3.2(@melt-ui/svelte@0.86.2(svelte@4.2.19))(svelte@4.2.19) '@melt-ui/svelte': 0.86.2(svelte@4.2.19) diff --git a/src/lib/components/breadcrumbs.svelte b/src/lib/components/breadcrumbs.svelte index 76ecf4e2c..7078d81ea 100644 --- a/src/lib/components/breadcrumbs.svelte +++ b/src/lib/components/breadcrumbs.svelte @@ -196,7 +196,8 @@ organisationBottomSheetOpen = true; }} aria-label="Open organizations tab"> - {selectedOrg?.name ?? 'Organization'} + {selectedOrg?.name ?? 'Organization'} @@ -384,12 +385,8 @@ } } - .item:first-of-type { - margin-top: 4px; - } - .item:last-of-type, - .switch-org { - margin-bottom: 4px; + .noProjects { + max-width: 150px; } :global(.item[data-highlighted]) { diff --git a/src/lib/components/navbar.svelte b/src/lib/components/navbar.svelte index 82b743a2f..02a58aa01 100644 --- a/src/lib/components/navbar.svelte +++ b/src/lib/components/navbar.svelte @@ -30,7 +30,7 @@ import { base } from '$app/paths'; import { logout } from '$lib/helpers/logout'; import { app } from '$lib/stores/app'; - import { isSmallViewport } from '$lib/stores/viewport'; + import { isTabletViewport } from '$lib/stores/viewport'; let showSupport = false; @@ -179,7 +179,7 @@ -{#if showAccountMenu && $isSmallViewport} +{#if showAccountMenu && $isTabletViewport} {#if state !== 'icons'}
- {progressCard.title} {progressCard.title} + {progressCard.percentage}% complete
{/if} @@ -270,6 +272,11 @@ +{#if subNavigation} +
+ +
+{/if} diff --git a/src/lib/helpers/onboarding.ts b/src/lib/helpers/onboarding.ts index 9088d7534..f2b61dc3c 100644 --- a/src/lib/helpers/onboarding.ts +++ b/src/lib/helpers/onboarding.ts @@ -1,7 +1,33 @@ +import { get } from 'svelte/store'; +import { user } from '$lib/stores/user'; +import { sdk } from '$lib/stores/sdk'; + +const userPreferences = () => get(user)?.prefs; + export function hasOnboardingDismissed(projectId: string) { - return localStorage.getItem(`onboardingDismissed-${projectId}`) === 'true'; + const currentPrefs = userPreferences(); + const onboardingDismissed = currentPrefs.onboardingDismissed; + return ( + onboardingDismissed && + Array.isArray(onboardingDismissed) && + onboardingDismissed.includes(projectId) + ); } -export function setHasOnboardingDismissed(projectId: string) { - localStorage.setItem(`onboardingDismissed-${projectId}`, 'true'); +export async function setHasOnboardingDismissed(projectId: string) { + const currentPrefs = userPreferences(); + const onboardingDismissed = Array.isArray(currentPrefs?.onboardingDismissed) + ? currentPrefs.onboardingDismissed + : []; + + if (!onboardingDismissed.includes(projectId)) { + onboardingDismissed.push(projectId); + } + + const newPrefs = { + ...currentPrefs, + onboardingDismissed: onboardingDismissed + }; + + await sdk.forConsole.account.updatePrefs(newPrefs); } diff --git a/src/lib/layout/cover.svelte b/src/lib/layout/cover.svelte index 6d836ef7d..d87738e5a 100644 --- a/src/lib/layout/cover.svelte +++ b/src/lib/layout/cover.svelte @@ -2,13 +2,14 @@ import { Layout } from '@appwrite.io/pink-svelte'; export let size: 'small' | 'medium' | 'large' | 'xl' = null; + export let blocksize = '152px'; $: style = size ? `--p-container-max-size: var(--container-max-size, var(--container-size-${size}))` : ''; -
+
@@ -22,7 +23,6 @@ container-type: inline-size; padding-block-start: var(--base-32); padding-block-end: var(--base-16); - block-size: 152px; border-bottom: 1px solid var(--color-border-neutral, #2d2d31); background: var(--color-bgcolor-neutral-primary, #1d1d21); margin-left: -190px; diff --git a/src/lib/layout/navigation.svelte b/src/lib/layout/navigation.svelte index 059b577d6..67b619678 100644 --- a/src/lib/layout/navigation.svelte +++ b/src/lib/layout/navigation.svelte @@ -30,32 +30,3 @@ - -{#if subNavigation} -
- -
-{/if} - - diff --git a/src/lib/layout/shell.svelte b/src/lib/layout/shell.svelte index 280dc7bf0..b8729558b 100644 --- a/src/lib/layout/shell.svelte +++ b/src/lib/layout/shell.svelte @@ -177,7 +177,7 @@ min-height: calc(100vh - 48px); } - :global(main:has(.level-2-nav)) { + :global(main:has(.sub-navigation)) { .main-content { @media (min-width: 1024px) { padding-left: 200px; diff --git a/src/routes/(console)/project-[project]/overview/assets/database.png b/src/routes/(console)/project-[project]/overview/assets/database.png index 499680066..d2428fc29 100644 Binary files a/src/routes/(console)/project-[project]/overview/assets/database.png and b/src/routes/(console)/project-[project]/overview/assets/database.png differ diff --git a/src/routes/(console)/project-[project]/overview/assets/platform-server.png b/src/routes/(console)/project-[project]/overview/assets/platform-server.png index fdbbf9c00..cd8440527 100644 Binary files a/src/routes/(console)/project-[project]/overview/assets/platform-server.png and b/src/routes/(console)/project-[project]/overview/assets/platform-server.png differ diff --git a/src/routes/(console)/project-[project]/overview/assets/platform-web.png b/src/routes/(console)/project-[project]/overview/assets/platform-web.png index addc7fe6e..a0928c81f 100644 Binary files a/src/routes/(console)/project-[project]/overview/assets/platform-web.png and b/src/routes/(console)/project-[project]/overview/assets/platform-web.png differ diff --git a/src/routes/(console)/project-[project]/overview/header.svelte b/src/routes/(console)/project-[project]/overview/header.svelte index 2b7ddefc7..4cb5216a5 100644 --- a/src/routes/(console)/project-[project]/overview/header.svelte +++ b/src/routes/(console)/project-[project]/overview/header.svelte @@ -21,7 +21,7 @@ {:else} - + { - setHasOnboardingDismissed($project.$id); + on:click={async () => { + await setHasOnboardingDismissed($project.$id); if (location.href.endsWith('get-started')) { goto(`${base}/project-${$project.$id}`); } else { diff --git a/src/routes/(console)/project-[project]/overview/onboard.svelte b/src/routes/(console)/project-[project]/overview/onboard.svelte index 566562b6f..c1e13238e 100644 --- a/src/routes/(console)/project-[project]/overview/onboard.svelte +++ b/src/routes/(console)/project-[project]/overview/onboard.svelte @@ -9,10 +9,6 @@ import UsersImgSourceDark from './assets/users-dark.svg'; import DiscordImgSource from './assets/discord.png'; import DiscordImgSourceDark from './assets/discord-dark.png'; - import PlatformWebImgSource from './assets/platform-web.png'; - import PlatformWebImgSourceDark from './assets/platform-web-dark.png'; - import PlatformServerImgSource from './assets/platform-server.png'; - import PlatformServerImgSourceDark from './assets/platform-server-dark.png'; import PlatformIosImgSource from './assets/platform-ios.svg'; import PlatformIosImgSourceDark from './assets/platform-ios-dark.svg'; import PlatformAndroidImgSource from './assets/platform-android.svg'; @@ -60,7 +56,9 @@
- + addPlatform(0)} padding="s" >
@@ -90,7 +88,9 @@ - + addPlatform(3)} padding="s">