refactor: ♻️ Rewrite state system to use Pinia for composer and auth

app/pages/[username]/[uuid].vue

@@ -41,9 +41,9 @@ const element = ref<HTMLElement | null>(null);
 const route = useRoute();
 const uuid = route.params.uuid as string;
 
-const note = useNote(client, uuid);
+const note = useNote(uuid);
 const noteId = computed(() => note.value?.id ?? null);
-const context = useNoteContext(client, noteId);
+const context = useNoteContext(noteId);
 const loaded = computed(() => note.value !== null && context.value !== null);
 
 // If ancestors changes, scroll down so that the initial note stays at the same place

app/pages/[username]/index.vue

@@ -39,7 +39,7 @@ definePageMeta({
     ],
 });
 
-const { account, isLoading } = useAccountFromAcct(client, username);
+const { account, isLoading } = useAccountFromAcct(username);
 const accountId = computed(() => account.value?.id ?? undefined);
 
 useSeoMeta({

app/pages/callback.vue

@@ -0,0 +1,43 @@
+<template>
+    <Card v-if="code && domain" class="w-full max-w-md *:w-full">
+        <CardHeader>
+            <CardTitle>Signing in...</CardTitle>
+            <CardDescription>
+                You will be redirected shortly.
+            </CardDescription>
+        </CardHeader>
+    </Card>
+    <Card v-else class="w-full max-w-md *:w-full">
+        <CardHeader>
+            <CardTitle>Error</CardTitle>
+            <CardDescription>
+                Missing code or domain in the callback URL.
+            </CardDescription>
+        </CardHeader>
+    </Card>
+</template>
+
+<script lang="ts" setup>
+import {
+    Card,
+    CardDescription,
+    CardHeader,
+    CardTitle,
+} from "~/components/ui/card";
+
+// This page handles the OAuth callback and signs the user in
+definePageMeta({
+    layout: "auth",
+});
+
+const code = useRequestURL().searchParams.get("code");
+const domain = useRequestURL().searchParams.get("domain");
+const authStore = useAuthStore();
+
+if (code && domain) {
+    const newOrigin = new URL(`https://${domain}`);
+
+    await authStore.finishSignIn(code, newOrigin);
+    await navigateTo("/");
+}
+</script>

app/pages/index.vue

@@ -1,6 +1,6 @@
 <template>
     <TimelineScroller>
-        <Home v-if="identity" />
+        <Home v-if="authStore.isSignedIn" />
         <Public v-else />
     </TimelineScroller>
 </template>
@@ -11,8 +11,9 @@ import Public from "~/components/timelines/public.vue";
 import TimelineScroller from "~/components/timelines/timeline-scroller.vue";
 import * as m from "~~/paraglide/messages.js";
 
+const authStore = useAuthStore();
 useHead({
-    title: identity.value
+    title: authStore.isSignedIn
         ? m.bland_chunky_sparrow_propel()
         : m.lost_trick_dog_grace(),
 });

app/pages/oauth/reset.vue

@@ -1,10 +1,4 @@
 <template>
-    <div
-        class="flex h-svh items-center justify-center px-6 py-12 lg:px-8 bg-center bg-no-repeat bg-cover"
-        :style="{
-            backgroundImage: 'url(/images/banner.webp)',
-        }"
-    >
         <Card v-if="params.success" class="w-full max-w-md *:w-full">
             <CardHeader>
                 <CardTitle>{{ m.late_mean_capybara_fade() }}</CardTitle>
@@ -103,7 +97,6 @@
                 </CardFooter>
             </form>
         </Card>
-    </div>
 </template>
 
 <script setup lang="ts">
@@ -135,8 +128,12 @@ import * as m from "~~/paraglide/messages.js";
 useHead({
     title: m.arable_arable_herring_lead(),
 });
+definePageMeta({
+    layout: "auth",
+});
 
-identity.value = null;
+const authStore = useAuthStore();
+authStore.setActiveIdentity(null);
 
 const formSchema = toTypedSchema(
     z

app/pages/register/index.vue

@@ -160,15 +160,17 @@ const schema = toTypedSchema(
         }),
 );
 
-const instance = useInstanceFromClient(new Client(client.value.url));
+const client = new Client(new URL(useRequestURL().origin));
+const instance = useInstanceFromClient(client);
 const form = useForm({
     validationSchema: schema,
 });
+const authStore = useAuthStore();
 
 const handleSubmit = form.handleSubmit((values) => {
     isLoading.value = true;
-    ref(client)
-        .value?.registerAccount(
+    authStore.client
+        .registerAccount(
             values.username,
             values.email,
             values.password,