diff --git a/src/lib/profiles/index.svelte.ts b/src/lib/profiles/index.svelte.ts
index 197edb2490..ff62f43b23 100644
--- a/src/lib/profiles/index.svelte.ts
+++ b/src/lib/profiles/index.svelte.ts
@@ -4,8 +4,6 @@ import { OAuthProvider, Platform } from '@appwrite.io/console';
 import { env } from '$env/dynamic/public';
 import { BillingPlan } from '@appwrite.io/console';
 import type { Component } from 'svelte';
-import UnauthenticatedConsole from './(unauthenticated)/console.svelte';
-import UnauthenticatedStudio from './(unauthenticated)/studio.svelte';
 import StudioCss from './css/studio.css?url';
 import ConsoleCss from './css/console.css?url';
 import { isCloud } from '$lib/system';
@@ -61,7 +59,7 @@ export type Profile = {
     minimalOrgHeader: boolean;
     getProjectRoute: (params: { region: string; project: string }) => ResolvedPathname;
     component: {
-        unauthenticated: Component;
+        getUnauthenticated: () => Promise<Component>;
     };
     links: {
         docs: string;
@@ -98,9 +96,6 @@ export const base: Profile = {
         },
         alt: 'Logo Appwrite'
     },
-    component: {
-        unauthenticated: UnauthenticatedConsole
-    },
     logins: [Logins.EMAIL, isCloud && Logins.GITHUB].filter(Boolean),
     oauthProviders: {
         github: {
@@ -136,6 +131,9 @@ export const base: Profile = {
             project
         });
     },
+    component: {
+        getUnauthenticated: async () => (await import('./(unauthenticated)/console.svelte')).default
+    },
     links: {
         website: 'https://appwrite.io',
         docs: 'https://appwrite.io/docs',
@@ -205,9 +203,6 @@ export const studio: Profile = {
         }
     },
     css: StudioCss,
-    component: {
-        unauthenticated: UnauthenticatedStudio
-    },
     showOnboarding: false,
     useCommandCenter: false,
     showGithubIssueSupport: false,
@@ -235,6 +230,9 @@ export const studio: Profile = {
             project
         });
     },
+    component: {
+        getUnauthenticated: async () => (await import('./(unauthenticated)/studio.svelte')).default
+    },
     links: {
         website: 'https://imagine.dev',
         docs: 'https://imagine.dev',
diff --git a/src/lib/stores/sdk.ts b/src/lib/stores/sdk.ts
index e985f67eb9..bc07aa98a4 100644
--- a/src/lib/stores/sdk.ts
+++ b/src/lib/stores/sdk.ts
@@ -114,7 +114,6 @@ if (!building) {
     scopedConsoleClient.setProject('console');
     clientConsole.setEndpoint(endpoint).setProject('console');
 
-    // set platform type!
     clientConsole.setPlatform(resolvedProfile.platform);
     scopedConsoleClient.setPlatform(resolvedProfile.platform);
 
diff --git a/src/routes/(authenticated)/mfa/+page.svelte b/src/routes/(authenticated)/mfa/+page.svelte
index c078fea780..55bbb0191d 100644
--- a/src/routes/(authenticated)/mfa/+page.svelte
+++ b/src/routes/(authenticated)/mfa/+page.svelte
@@ -12,7 +12,6 @@
     import { resolvedProfile } from '$lib/profiles/index.svelte';
 
     export let data;
-    const Unauthenticated = resolvedProfile.component.unauthenticated;
     const factors = data.factors as Models.MfaFactors & { recoveryCode: boolean };
 
     let disabled = false;
@@ -53,24 +52,26 @@
     <title>Verify - {resolvedProfile.platform}</title>
 </svelte:head>
 
-<Unauthenticated align="center">
-    <svelte:fragment slot="top">
-        <div class="top u-flex u-position-absolute u-main-center">
-            <div class="flex u-width-full-line">
-                <Button compact on:click={back}>
-                    <Icon icon={IconChevronLeft} slot="start" size="s" />
-                    Back
-                </Button>
+{#await resolvedProfile.component.getUnauthenticated() then Unauthenticated}
+    <Unauthenticated align="center">
+        <svelte:fragment slot="top">
+            <div class="top u-flex u-position-absolute u-main-center">
+                <div class="flex u-width-full-line">
+                    <Button compact on:click={back}>
+                        <Icon icon={IconChevronLeft} slot="start" size="s" />
+                        Back
+                    </Button>
+                </div>
             </div>
-        </div>
-    </svelte:fragment>
-    <svelte:fragment slot="title">Verify your identity</svelte:fragment>
-    <Form onSubmit={submit}>
-        <Layout.Stack gap="l" justifyContent="center" alignContent="center" alignItems="center">
-            <MfaChallengeFormList {factors} bind:challenge bind:code bind:disabled />
-        </Layout.Stack>
-    </Form>
-</Unauthenticated>
+        </svelte:fragment>
+        <svelte:fragment slot="title">Verify your identity</svelte:fragment>
+        <Form onSubmit={submit}>
+            <Layout.Stack gap="l" justifyContent="center" alignContent="center" alignItems="center">
+                <MfaChallengeFormList {factors} bind:challenge bind:code bind:disabled />
+            </Layout.Stack>
+        </Form>
+    </Unauthenticated>
+{/await}
 
 <style lang="scss">
     @use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
diff --git a/src/routes/(public)/(guest)/login/+page.svelte b/src/routes/(public)/(guest)/login/+page.svelte
index a160b94471..9766f0e4db 100644
--- a/src/routes/(public)/(guest)/login/+page.svelte
+++ b/src/routes/(public)/(guest)/login/+page.svelte
@@ -21,7 +21,6 @@
     let { data }: PageProps = $props();
 
     const profile = $derived(resolvedProfile);
-    const Unauthenticated = $derived(profile.component.unauthenticated);
 
     async function login() {
         try {
@@ -102,61 +101,63 @@
     <title>Sign in - {profile.platform}</title>
 </svelte:head>
 
-<Unauthenticated coupon={data?.couponData} campaign={data?.campaign}>
-    <svelte:fragment slot="title">Sign in</svelte:fragment>
-    <svelte:fragment>
-        <Form onSubmit={login}>
-            <Layout.Stack>
-                {#if emailEnabled}
-                    <InputEmail
-                        id="email"
-                        label="Email"
-                        placeholder="Email"
-                        autofocus={true}
-                        required={true}
-                        bind:value={mail} />
-                    <InputPassword
-                        id="password"
-                        label="Password"
-                        placeholder="Password"
-                        required={true}
-                        bind:value={pass} />
-                    <Button fullWidth submit {disabled}>Sign in</Button>
-                    <span class="with-separators eyebrow-heading-3">or</span>
-                {/if}
-                {#if profile.logins.includes(Logins.GITHUB)}
-                    <Button
-                        secondary
-                        fullWidth
-                        on:click={() => onOauthLogin(profile.oauthProviders.github)}
-                        {disabled}>
-                        <span class="icon-github" aria-hidden="true"></span>
-                        <span class="text">Sign in with GitHub</span>
-                    </Button>
-                {/if}
-                {#if profile.logins.includes(Logins.GOOGLE)}
-                    <Button
-                        secondary
-                        fullWidth
-                        on:click={() => onOauthLogin(profile.oauthProviders.google)}
-                        {disabled}>
-                        <span class="icon-google" aria-hidden="true"></span>
-                        <span class="text">Sign in with Google</span>
-                    </Button>
-                {/if}
-            </Layout.Stack>
-        </Form>
-    </svelte:fragment>
-    <svelte:fragment slot="links">
-        {#if emailEnabled}
-            <li class="inline-links-item">
-                <a href={`${base}/recover`}><span class="text">Forgot password?</span></a>
-            </li>
-            <li class="inline-links-item">
-                <a href={`${base}/register${page?.url?.search ?? ''}`}>
-                    <span class="text">Sign up</span>
-                </a>
-            </li>
-        {/if}
-    </svelte:fragment>
-</Unauthenticated>
+{#await resolvedProfile.component.getUnauthenticated() then Unauthenticated}
+    <Unauthenticated coupon={data?.couponData} campaign={data?.campaign}>
+        <svelte:fragment slot="title">Sign in</svelte:fragment>
+        <svelte:fragment>
+            <Form onSubmit={login}>
+                <Layout.Stack>
+                    {#if emailEnabled}
+                        <InputEmail
+                            id="email"
+                            label="Email"
+                            placeholder="Email"
+                            autofocus={true}
+                            required={true}
+                            bind:value={mail} />
+                        <InputPassword
+                            id="password"
+                            label="Password"
+                            placeholder="Password"
+                            required={true}
+                            bind:value={pass} />
+                        <Button fullWidth submit {disabled}>Sign in</Button>
+                        <span class="with-separators eyebrow-heading-3">or</span>
+                    {/if}
+                    {#if profile.logins.includes(Logins.GITHUB)}
+                        <Button
+                            secondary
+                            fullWidth
+                            on:click={() => onOauthLogin(profile.oauthProviders.github)}
+                            {disabled}>
+                            <span class="icon-github" aria-hidden="true"></span>
+                            <span class="text">Sign in with GitHub</span>
+                        </Button>
+                    {/if}
+                    {#if profile.logins.includes(Logins.GOOGLE)}
+                        <Button
+                            secondary
+                            fullWidth
+                            on:click={() => onOauthLogin(profile.oauthProviders.google)}
+                            {disabled}>
+                            <span class="icon-google" aria-hidden="true"></span>
+                            <span class="text">Sign in with Google</span>
+                        </Button>
+                    {/if}
+                </Layout.Stack>
+            </Form>
+        </svelte:fragment>
+        <svelte:fragment slot="links">
+            {#if emailEnabled}
+                <li class="inline-links-item">
+                    <a href={`${base}/recover`}><span class="text">Forgot password?</span></a>
+                </li>
+                <li class="inline-links-item">
+                    <a href={`${base}/register${page?.url?.search ?? ''}`}>
+                        <span class="text">Sign up</span>
+                    </a>
+                </li>
+            {/if}
+        </svelte:fragment>
+    </Unauthenticated>
+{/await}
diff --git a/src/routes/(public)/(guest)/register/+page.svelte b/src/routes/(public)/(guest)/register/+page.svelte
index bd4e96f3fb..f88d138223 100644
--- a/src/routes/(public)/(guest)/register/+page.svelte
+++ b/src/routes/(public)/(guest)/register/+page.svelte
@@ -113,73 +113,79 @@
             scopes: ['read:user', 'user:email']
         });
     }
-
-    const Unauthenticated = resolvedProfile.component.unauthenticated;
 </script>
 
 <svelte:head>
     <title>Sign up - {resolvedProfile.platform}</title>
 </svelte:head>
 
-<Unauthenticated coupon={data?.couponData} campaign={data?.campaign || testimonialCampaign}>
-    <svelte:fragment slot="title">Sign up</svelte:fragment>
-    <svelte:fragment>
-        <Form onSubmit={register}>
-            <Layout.Stack>
-                <InputText
-                    id="name"
-                    label="Name"
-                    placeholder="Your name"
-                    autofocus
-                    required
-                    autocomplete
-                    bind:value={name} />
-                <InputEmail
-                    id="email"
-                    label="Email"
-                    placeholder="Your email"
-                    required
-                    bind:value={mail} />
-                <InputPassword
-                    id="password"
-                    label="Password"
-                    placeholder="Your password"
-                    helper="Password must be at least 8 characters long"
-                    required
-                    bind:value={pass} />
-                <InputChoice required bind:value={terms} id="terms" label="terms" showLabel={false}>
-                    By registering, you agree that you have read, understand, and acknowledge our <Link.Anchor
-                        href={resolvedProfile.links.privacy}
-                        target="_blank"
-                        rel="noopener noreferrer">
-                        Privacy Policy</Link.Anchor>
-                    and accept our
-                    <Link.Anchor
-                        href={resolvedProfile.links.privacy}
-                        target="_blank"
-                        rel="noopener noreferrer">General Terms of Use</Link.Anchor
-                    >.</InputChoice>
+{#await resolvedProfile.component.getUnauthenticated() then Unauthenticated}
+    <Unauthenticated coupon={data?.couponData} campaign={data?.campaign || testimonialCampaign}>
+        <svelte:fragment slot="title">Sign up</svelte:fragment>
+        <svelte:fragment>
+            <Form onSubmit={register}>
+                <Layout.Stack>
+                    <InputText
+                        id="name"
+                        label="Name"
+                        placeholder="Your name"
+                        autofocus
+                        required
+                        autocomplete
+                        bind:value={name} />
+                    <InputEmail
+                        id="email"
+                        label="Email"
+                        placeholder="Your email"
+                        required
+                        bind:value={mail} />
+                    <InputPassword
+                        id="password"
+                        label="Password"
+                        placeholder="Your password"
+                        helper="Password must be at least 8 characters long"
+                        required
+                        bind:value={pass} />
+                    <InputChoice
+                        required
+                        bind:value={terms}
+                        id="terms"
+                        label="terms"
+                        showLabel={false}>
+                        By registering, you agree that you have read, understand, and acknowledge
+                        our <Link.Anchor
+                            href={resolvedProfile.links.privacy}
+                            target="_blank"
+                            rel="noopener noreferrer">
+                            Privacy Policy</Link.Anchor>
+                        and accept our
+                        <Link.Anchor
+                            href={resolvedProfile.links.privacy}
+                            target="_blank"
+                            rel="noopener noreferrer">General Terms of Use</Link.Anchor
+                        >.</InputChoice>
 
-                <Button fullWidth submit disabled={disabled || !terms}>Sign up</Button>
+                    <Button fullWidth submit disabled={disabled || !terms}>Sign up</Button>
 
-                {#if isCloud}
-                    <span class="with-separators eyebrow-heading-3">or</span>
-                    <Button
-                        secondary
-                        fullWidth
-                        on:click={onGithubLogin}
-                        disabled={disabled || !terms}>
-                        <span class="icon-github" aria-hidden="true"></span>
-                        <span class="text">Sign up with GitHub</span>
-                    </Button>
-                {/if}
-            </Layout.Stack>
-        </Form>
-    </svelte:fragment>
-    <svelte:fragment slot="links">
-        <Typography.Text variant="m-400">
-            Already got an account? <Link.Anchor href={`${base}/login${page?.url?.search ?? ''}`}
-                >Sign in</Link.Anchor>
-        </Typography.Text>
-    </svelte:fragment>
-</Unauthenticated>
+                    {#if isCloud}
+                        <span class="with-separators eyebrow-heading-3">or</span>
+                        <Button
+                            secondary
+                            fullWidth
+                            on:click={onGithubLogin}
+                            disabled={disabled || !terms}>
+                            <span class="icon-github" aria-hidden="true"></span>
+                            <span class="text">Sign up with GitHub</span>
+                        </Button>
+                    {/if}
+                </Layout.Stack>
+            </Form>
+        </svelte:fragment>
+        <svelte:fragment slot="links">
+            <Typography.Text variant="m-400">
+                Already got an account? <Link.Anchor
+                    href={`${base}/login${page?.url?.search ?? ''}`}>Sign in</Link.Anchor>
+            </Typography.Text>
+        </svelte:fragment>
+    </Unauthenticated>
+{/await}
diff --git a/src/routes/(public)/(guest)/register/invite/[slug]/+page.svelte b/src/routes/(public)/(guest)/register/invite/[slug]/+page.svelte
index cab1ebfb36..cb34629213 100644
--- a/src/routes/(public)/(guest)/register/invite/[slug]/+page.svelte
+++ b/src/routes/(public)/(guest)/register/invite/[slug]/+page.svelte
@@ -95,65 +95,67 @@
             });
         }
     }
-    const Unauthenticated = resolvedProfile.component.unauthenticated;
 </script>
 
 <svelte:head>
     <title>Sign up - {resolvedProfile.platform}</title>
 </svelte:head>
 
-<Unauthenticated {imgLight} {imgDark}>
-    <svelte:fragment slot="title">{title}</svelte:fragment>
-    <svelte:fragment>
-        <Form onSubmit={invite}>
-            <Layout.Stack>
-                <InputText
-                    id="name"
-                    label="Name"
-                    placeholder="Your name"
-                    autofocus={true}
-                    bind:value={name} />
-                <InputEmail
-                    id="email"
-                    label="Email"
-                    placeholder="Your email"
-                    required={true}
-                    bind:value={mail} />
-                <InputPassword
-                    id="password"
-                    label="Password"
-                    placeholder="Your password"
-                    required={true}
-                    bind:value={pass} />
-                <InputText
-                    id="Code"
-                    label="Code"
-                    placeholder="Your code"
-                    required={true}
-                    bind:value={code} />
-                <InputChoice required value={terms} id="terms" label="terms" showLabel={false}>
-                    By registering, you agree that you have read, understand, and acknowledge our <a
-                        class="link"
-                        href={resolvedProfile.links.privacy}
-                        target="_blank"
-                        rel="noopener noreferrer">
-                        Privacy Policy</a>
-                    and accept our
-                    <a
-                        class="link"
-                        href={resolvedProfile.links.terms}
-                        target="_blank"
-                        rel="noopener noreferrer">General Terms of Use</a
-                    >.</InputChoice>
-                <Button fullWidth submit>Sign up</Button>
-            </Layout.Stack>
-        </Form>
-    </svelte:fragment>
-    <svelte:fragment slot="links">
-        <li class="inline-links-item">
-            <span class="text">
-                Already got an account? <a class="link" href={`${base}/login`}>Sign in</a>
-            </span>
-        </li>
-    </svelte:fragment>
-</Unauthenticated>
+{#await resolvedProfile.component.getUnauthenticated() then Unauthenticated}
+    <Unauthenticated {imgLight} {imgDark}>
+        <svelte:fragment slot="title">{title}</svelte:fragment>
+        <svelte:fragment>
+            <Form onSubmit={invite}>
+                <Layout.Stack>
+                    <InputText
+                        id="name"
+                        label="Name"
+                        placeholder="Your name"
+                        autofocus={true}
+                        bind:value={name} />
+                    <InputEmail
+                        id="email"
+                        label="Email"
+                        placeholder="Your email"
+                        required={true}
+                        bind:value={mail} />
+                    <InputPassword
+                        id="password"
+                        label="Password"
+                        placeholder="Your password"
+                        required={true}
+                        bind:value={pass} />
+                    <InputText
+                        id="Code"
+                        label="Code"
+                        placeholder="Your code"
+                        required={true}
+                        bind:value={code} />
+                    <InputChoice required value={terms} id="terms" label="terms" showLabel={false}>
+                        By registering, you agree that you have read, understand, and acknowledge
+                        our <a
+                            class="link"
+                            href={resolvedProfile.links.privacy}
+                            target="_blank"
+                            rel="noopener noreferrer">
+                            Privacy Policy</a>
+                        and accept our
+                        <a
+                            class="link"
+                            href={resolvedProfile.links.terms}
+                            target="_blank"
+                            rel="noopener noreferrer">General Terms of Use</a
+                        >.</InputChoice>
+                    <Button fullWidth submit>Sign up</Button>
+                </Layout.Stack>
+            </Form>
+        </svelte:fragment>
+        <svelte:fragment slot="links">
+            <li class="inline-links-item">
+                <span class="text">
+                    Already got an account? <a class="link" href={`${base}/login`}>Sign in</a>
+                </span>
+            </li>
+        </svelte:fragment>
+    </Unauthenticated>
+{/await}
diff --git a/src/routes/(public)/invite/+page.svelte b/src/routes/(public)/invite/+page.svelte
index afb9ae15e0..d31e9d2cb5 100644
--- a/src/routes/(public)/invite/+page.svelte
+++ b/src/routes/(public)/invite/+page.svelte
@@ -42,63 +42,65 @@
             trackError(error, Submit.MembershipUpdateStatus);
         }
     };
-    const Unauthenticated = resolvedProfile.component.unauthenticated;
 </script>
 
 <svelte:head>
     <title>Accept invite - {resolvedProfile.platform}</title>
 </svelte:head>
 
-<Unauthenticated>
-    <svelte:fragment slot="title">
-        {#if !userId || !secret || !membershipId || !teamId}
-            Invalid invite
-        {:else}
-            Invite
-        {/if}
-    </svelte:fragment>
-    <svelte:fragment>
-        {#if !userId || !secret || !membershipId || !teamId}
-            <Layout.Stack>
-                <Alert.Inline status="warning" title="The invite link is not valid">
-                    Please ask the project owner to send you a new invite.
-                </Alert.Inline>
-                <div>
-                    <Button href={`${base}/register`}>Sign up to {resolvedProfile.platform}</Button>
-                </div>
-            </Layout.Stack>
-        {:else}
-            <Layout.Stack>
-                <Typography.Text>
-                    You have been invited to join an organization on {resolvedProfile.platform}
-                </Typography.Text>
-                <Form onSubmit={acceptInvite}>
-                    <Layout.Stack>
-                        <InputChoice
-                            required
-                            bind:value={terms}
-                            id="terms"
-                            label="terms"
-                            showLabel={false}>
-                            By accepting the invitation, you agree to the <Link.Anchor
-                                href={resolvedProfile.links.terms}
-                                target="_blank"
-                                rel="noopener noreferrer">Terms and Conditions</Link.Anchor>
-                            and
-                            <Link.Anchor
-                                href={resolvedProfile.links.privacy}
-                                target="_blank"
-                                rel="noopener noreferrer">
-                                Privacy Policy</Link.Anchor
-                            >.</InputChoice>
+{#await resolvedProfile.component.getUnauthenticated() then Unauthenticated}
+    <Unauthenticated>
+        <svelte:fragment slot="title">
+            {#if !userId || !secret || !membershipId || !teamId}
+                Invalid invite
+            {:else}
+                Invite
+            {/if}
+        </svelte:fragment>
+        <svelte:fragment>
+            {#if !userId || !secret || !membershipId || !teamId}
+                <Layout.Stack>
+                    <Alert.Inline status="warning" title="The invite link is not valid">
+                        Please ask the project owner to send you a new invite.
+                    </Alert.Inline>
+                    <div>
+                        <Button href={`${base}/register`}
+                            >Sign up to {resolvedProfile.platform}</Button>
+                    </div>
+                </Layout.Stack>
+            {:else}
+                <Layout.Stack>
+                    <Typography.Text>
+                        You have been invited to join an organization on {resolvedProfile.platform}
+                    </Typography.Text>
+                    <Form onSubmit={acceptInvite}>
+                        <Layout.Stack>
+                            <InputChoice
+                                required
+                                bind:value={terms}
+                                id="terms"
+                                label="terms"
+                                showLabel={false}>
+                                By accepting the invitation, you agree to the <Link.Anchor
+                                    href={resolvedProfile.links.terms}
+                                    target="_blank"
+                                    rel="noopener noreferrer">Terms and Conditions</Link.Anchor>
+                                and
+                                <Link.Anchor
+                                    href={resolvedProfile.links.privacy}
+                                    target="_blank"
+                                    rel="noopener noreferrer">
+                                    Privacy Policy</Link.Anchor
+                                >.</InputChoice>
 
-                        <Layout.Stack direction="row">
-                            <Button secondary href={`${base}/login`}>Cancel</Button>
-                            <Button submit disabled={!terms}>Accept</Button>
+                            <Layout.Stack direction="row">
+                                <Button secondary href={`${base}/login`}>Cancel</Button>
+                                <Button submit disabled={!terms}>Accept</Button>
+                            </Layout.Stack>
                         </Layout.Stack>
-                    </Layout.Stack>
-                </Form>
-            </Layout.Stack>
-        {/if}
-    </svelte:fragment>
-</Unauthenticated>
+                    </Form>
+                </Layout.Stack>
+            {/if}
+        </svelte:fragment>
+    </Unauthenticated>
+{/await}
diff --git a/src/routes/(public)/recover/+page.svelte b/src/routes/(public)/recover/+page.svelte
index 1d368a438c..a7df8ec9c2 100644
--- a/src/routes/(public)/recover/+page.svelte
+++ b/src/routes/(public)/recover/+page.svelte
@@ -64,59 +64,60 @@
             });
         }
     }
-    const Unauthenticated = resolvedProfile.component.unauthenticated;
 </script>
 
 <svelte:head>
     <title>Recover - {resolvedProfile.platform}</title>
 </svelte:head>
 
-<Unauthenticated>
-    <svelte:fragment slot="title">Password recovery</svelte:fragment>
-    <svelte:fragment>
-        {#if userId && secret}
-            <Form onSubmit={setPassword}>
-                <Layout.Stack>
-                    <InputPassword
-                        label="New password"
-                        placeholder="Enter password"
-                        id="password"
-                        autofocus={true}
-                        required={true}
-                        bind:value={password} />
-                    <InputPassword
-                        label="Confirm password"
-                        placeholder="Confirm password"
-                        id="confirm-password"
-                        required={true}
-                        bind:value={confirmPassword} />
+{#await resolvedProfile.component.getUnauthenticated() then Unauthenticated}
+    <Unauthenticated>
+        <svelte:fragment slot="title">Password recovery</svelte:fragment>
+        <svelte:fragment>
+            {#if userId && secret}
+                <Form onSubmit={setPassword}>
+                    <Layout.Stack>
+                        <InputPassword
+                            label="New password"
+                            placeholder="Enter password"
+                            id="password"
+                            autofocus={true}
+                            required={true}
+                            bind:value={password} />
+                        <InputPassword
+                            label="Confirm password"
+                            placeholder="Confirm password"
+                            id="confirm-password"
+                            required={true}
+                            bind:value={confirmPassword} />
 
-                    <Button fullWidth submit>Update</Button>
-                </Layout.Stack>
-            </Form>
-        {:else}
-            <Form onSubmit={recover}>
-                <Layout.Stack>
-                    <InputEmail
-                        id="email"
-                        label="Email"
-                        placeholder="Email"
-                        autofocus={true}
-                        required={true}
-                        bind:value={email} />
+                        <Button fullWidth submit>Update</Button>
+                    </Layout.Stack>
+                </Form>
+            {:else}
+                <Form onSubmit={recover}>
+                    <Layout.Stack>
+                        <InputEmail
+                            id="email"
+                            label="Email"
+                            placeholder="Email"
+                            autofocus={true}
+                            required={true}
+                            bind:value={email} />
 
-                    <Button fullWidth submit>Recover</Button>
-                </Layout.Stack>
-            </Form>
-        {/if}
-    </svelte:fragment>
-    <svelte:fragment slot="links">
-        <Layout.Stack direction="row" justifyContent="center" alignItems="center">
-            <Link.Anchor href={`${base}/login`} variant="quiet">Sign in</Link.Anchor>
-            <div style:height="20px">
-                <Divider vertical />
-            </div>
-            <Link.Anchor href={`${base}/register`} variant="quiet">Sign up</Link.Anchor>
-        </Layout.Stack>
-    </svelte:fragment>
-</Unauthenticated>
+                        <Button fullWidth submit>Recover</Button>
+                    </Layout.Stack>
+                </Form>
+            {/if}
+        </svelte:fragment>
+        <svelte:fragment slot="links">
+            <Layout.Stack direction="row" justifyContent="center" alignItems="center">
+                <Link.Anchor href={`${base}/login`} variant="quiet">Sign in</Link.Anchor>
+                <div style:height="20px">
+                    <Divider vertical />
+                </div>
+                <Link.Anchor href={`${base}/register`} variant="quiet">Sign up</Link.Anchor>
+            </Layout.Stack>
+        </svelte:fragment>
+    </Unauthenticated>
+{/await}
diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index c05ab389fe..d93e874721 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -3,16 +3,16 @@
     import { Button } from '$lib/elements/forms';
     import { resolvedProfile } from '$lib/profiles/index.svelte';
     import { Badge, Typography, Layout } from '@appwrite.io/pink-svelte';
-
-    const Unauthenticated = resolvedProfile.component.unauthenticated;
 </script>
 
-<Unauthenticated>
-    <Layout.Stack gap="l" alignItems="center">
-        <Badge variant="secondary" content="404 Page not found" />
-        <Typography.Title size="l" align="center">
-            The page you're looking for doesn't exist.
-        </Typography.Title>
-        <Button href={base}>Back to console</Button>
-    </Layout.Stack>
-</Unauthenticated>
+{#await resolvedProfile.component.getUnauthenticated() then Unauthenticated}
+    <Unauthenticated>
+        <Layout.Stack gap="l" alignItems="center">
+            <Badge variant="secondary" content="404 Page not found" />
+            <Typography.Title size="l" align="center">
+                The page you're looking for doesn't exist.
+            </Typography.Title>
+            <Button href={base}>Back to console</Button>
+        </Layout.Stack>
+    </Unauthenticated>
+{/await}