feat: ✨ Rework OIDC flow, add emoji autosuggestions

composables/CacheRefresh.ts

@@ -0,0 +1,32 @@
+import type { Mastodon } from "megalodon";
+import type { InstanceWithExtra } from "./Instance";
+
+export const useCacheRefresh = (client: MaybeRef<Mastodon | null>) => {
+    const tokenData = useTokenData();
+    const me = useMe();
+    const instance = useInstance();
+    const customEmojis = useCustomEmojis();
+
+    // Refresh custom emojis and instance data and me on every reload
+    watchEffect(async () => {
+        if (tokenData.value) {
+            await toValue(client)
+                ?.verifyAccountCredentials()
+                .then((res) => {
+                    me.value = res.data;
+                });
+        }
+
+        toValue(client)
+            ?.getInstanceCustomEmojis()
+            .then((res) => {
+                customEmojis.value = res.data;
+            });
+
+        toValue(client)
+            ?.getInstance()
+            .then((res) => {
+                instance.value = res.data as InstanceWithExtra;
+            });
+    });
+};

composables/CustomEmojis.ts

@@ -1,7 +1,6 @@
-import type { Mastodon } from "megalodon";
 import type { Emoji } from "~/types/mastodon/emoji";
 
-export const useCustomEmojis = (client: MaybeRef<Mastodon | null>) => {
+export const useCustomEmojis = () => {
     // Cache in localStorage
     return useLocalStorage<Emoji[]>("lysand:custom_emojis", []);
 };

composables/EventBus.ts

@@ -1,6 +1,14 @@
 import mitt from "mitt";
 import type { Status } from "~/types/mastodon/status";
 
+export type NotificationEvent = {
+    type: "error" | "info";
+    title: string;
+    message?: string;
+    persistent?: boolean;
+    onDismiss?: () => void;
+};
+
 type ApplicationEvents = {
     "note:reply": Status;
     "note:delete": Status;
@@ -15,6 +23,7 @@ type ApplicationEvents = {
     "composer:quote": Status;
     "composer:send": Status;
     "composer:close": undefined;
+    "notification:new": NotificationEvent;
 };
 
 const emitter = mitt<ApplicationEvents>();

composables/Instance.ts

@@ -1,23 +1,26 @@
+import { StorageSerializers } from "@vueuse/core";
 import type { Mastodon } from "megalodon";
 import type { Instance } from "~/types/mastodon/instance";
 
-type InstanceWithExtra = Instance & {
-    banner?: string;
-    lysand_version?: string;
+export type InstanceWithExtra = Instance & {
+    banner: string | null;
+    lysand_version: string;
+    sso: {
+        forced: boolean;
+        providers: {
+            id: string;
+            name: string;
+            icon?: string;
+        }[];
+    };
 };
 
-export const useInstance = (client: MaybeRef<Mastodon | null>) => {
-    if (!ref(client).value) {
-        return ref(null as InstanceWithExtra | null);
+export const useInstance = () => {
+    if (process.server) {
+        return ref(null);
     }
 
-    const output = ref(null as InstanceWithExtra | null);
-
-    ref(client)
-        .value?.getInstance()
-        .then((res) => {
-            output.value = res.data;
-        });
-
-    return output;
+    return useLocalStorage<InstanceWithExtra | null>("lysand:instance", null, {
+        serializer: StorageSerializers.object,
+    });
 };

composables/OAuthProviders.ts

@@ -1,13 +0,0 @@
-export const useOAuthProviders = async () => {
-    if (process.server) return ref([]);
-    const providers = await fetch(
-        new URL("/oauth/providers", useBaseUrl().value),
-    ).then((d) => d.json());
-    return ref(
-        providers as {
-            name: string;
-            icon: string;
-            id: string;
-        }[],
-    );
-};

composables/SSOConfig.ts

@@ -0,0 +1,7 @@
+import type { InstanceWithExtra } from "./Instance";
+
+export const useSSOConfig = (): Ref<InstanceWithExtra["sso"] | null> => {
+    const instance = useInstance();
+
+    return computed(() => instance.value?.sso || null);
+};