feat: onboarding

src/stores.ts

@@ -357,6 +357,10 @@ export const usePrfStore = defineStore('prf', () => {
     };
 });
 
+export enum ClientData {
+    Onboarded,
+}
+
 export const useClientStore = defineStore('client', () => {
     type ScaleType = 's' | 'm' | 'l' | 'xl';
     const scaleFactor: Ref<ScaleType> = ref('s');
@@ -366,16 +370,21 @@ export const useClientStore = defineStore('client', () => {
     const enableAutoupdates = ref(true);
     const verbose = ref(false);
     const theme: Ref<'light' | 'dark' | 'system'> = ref('system');
+    const onboarded: Ref<Game[]> = ref([]);
 
-    const scaleValue = (value: ScaleType) =>
+    const _scaleValue = (value: ScaleType) =>
         value === 's' ? 1 : value === 'm' ? 1.25 : value === 'l' ? 1.5 : 2;
 
+    const scaleValue = computed(() => {
+        return _scaleValue(scaleFactor.value);
+    });
+
     const setScaleFactor = async (value: ScaleType) => {
         scaleFactor.value = value;
 
         const window = getCurrentWindow();
-        const w = Math.floor(scaleValue(value) * 900);
-        const h = Math.floor(scaleValue(value) * 480);
+        const w = Math.floor(_scaleValue(value) * 900);
+        const h = Math.floor(_scaleValue(value) * 600);
 
         let size = await window.innerSize();
 
@@ -420,6 +429,10 @@ export const useClientStore = defineStore('client', () => {
             if (input.theme) {
                 theme.value = input.theme;
             }
+
+            if (input.onboarded) {
+                onboarded.value = input.onboarded;
+            }
             await setTheme(theme.value);
         } catch (e) {
             console.error(`Error reading client options: ${e}`);
@@ -452,6 +465,7 @@ export const useClientStore = defineStore('client', () => {
                     h: Math.floor(size.height),
                 },
                 theme: theme.value,
+                onboarded: onboarded.value,
             })
         );
     };
@@ -499,6 +513,11 @@ export const useClientStore = defineStore('client', () => {
         await save();
     };
 
+    const setOnboarded = async (game: Game) => {
+        onboarded.value = [...onboarded.value, game];
+        await save();
+    };
+
     getCurrentWindow().onResized(async ({ payload }) => {
         // For whatever reason this is 0 when minimized
         if (payload.width > 0) {
@@ -512,8 +531,11 @@ export const useClientStore = defineStore('client', () => {
         enableAutoupdates,
         verbose,
         theme,
+        onboarded,
         timeout,
         scaleModel,
+        _scaleValue,
+        scaleValue,
         load,
         save,
         queueSave,
@@ -521,5 +543,6 @@ export const useClientStore = defineStore('client', () => {
         setAutoupdates,
         setVerbose,
         setTheme,
+        setOnboarded,
     };
 });