feat: add yarn typecheck and fix all types

components/CreateCollectionModal.vue

@@ -1,5 +1,5 @@
 <template>
-  <ModalTemplate v-model="open">
+  <ModalTemplate v-model="!!open">
     <template #default>
       <div>
         <DialogTitle as="h3" class="text-lg font-medium leading-6 text-white">

components/Docs/Sidebar.vue

@@ -1,50 +0,0 @@
-<template>
-    <div
-        v-if="user"
-        class="flex grow flex-col gap-y-5 overflow-y-auto bg-zinc-900 px-6 pb-4 ring-1 ring-white/10"
-    >
-        <div class="flex h-16 shrink-0 items-center">
-            <Wordmark />
-        </div>
-
-        <nav class="flex flex-1 flex-col">
-            <ul role="list" class="flex flex-1 flex-col gap-y-7">
-                <li>
-                    <ul role="list" class="-mx-2 space-y-1">
-                        <DocsSidebarNavItem
-                            v-for="item in unwrappedNavigation ?? navigation"
-                            :key="item.name"
-                            :nav="item"
-                        />
-                    </ul>
-                </li>
-                <li class="mt-auto flex items-center">
-                    <div class="inline-flex items-center w-full text-zinc-300">
-                        <img
-                            :src="useObject(user.profilePicture)"
-                            class="w-5 h-5 rounded-sm"
-                        />
-                        <span class="ml-3 text-sm font-bold">{{
-                            user.displayName
-                        }}</span>
-                    </div>
-                    <NuxtLink
-                        href="/"
-                        class="ml-auto rounded bg-blue-600 px-2 py-1 text-sm font-semibold text-white shadow-sm hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
-                    >
-                        &larr;&nbsp;Home
-                    </NuxtLink>
-                </li>
-            </ul>
-        </nav>
-    </div>
-</template>
-
-<script setup lang="ts">
-import { fetchContentNavigation, useObject, useUser } from "#imports";
-
-const user = useUser();
-
-const navigation = await fetchContentNavigation();
-const unwrappedNavigation = navigation[0]?.children;
-</script>

components/Docs/SidebarNavItem.vue

@@ -1,30 +0,0 @@
-<template>
-    <NuxtLink
-        :href="props.nav._path"
-        :class="[
-            current
-                ? 'text-zinc-100'
-                : 'text-zinc-400 hover:text-zinc-100 hover:bg-zinc-900',
-            ' group flex gap-x-3 rounded-md px-2 text-sm font-semibold leading-6',
-        ]"
-    >
-        {{ props.nav.title }}
-    </NuxtLink>
-    <ul class="pl-3 flex flex-col" v-if="children">
-        <li v-for="child in children" class="inline-flex items-center">
-            <ChevronDownIcon class="w-4 h-4 text-zinc-600 rotate-45" />
-            <DocsSidebarNavItem :nav="child" :key="child._path" />
-        </li>
-    </ul>
-</template>
-
-<script setup lang="ts">
-import { ChevronDownIcon } from "@heroicons/vue/24/solid";
-
-type NavItem = { title: string; _path: string; children?: NavItem[] };
-const props = defineProps<{ nav: NavItem }>();
-const children = props.nav.children?.filter((e) => e._path != props.nav._path);
-
-const route = useRoute();
-const current = computed(() => route.path.trim() == props.nav._path.trim());
-</script>

components/PlatformSelector.vue

@@ -1,5 +1,5 @@
 <template>
-  <Listbox as="div" v-model="model">
+  <Listbox as="div" v-model="typedModel">
     <ListboxLabel class="block text-sm font-medium leading-6 text-zinc-100"
       ><slot
     /></ListboxLabel>
@@ -74,7 +74,6 @@
 </template>
 
 <script setup lang="ts">
-import { IconsLinuxLogo, IconsMacLogo, IconsWindowsLogo } from "#components";
 import {
   Listbox,
   ListboxButton,
@@ -83,9 +82,18 @@ import {
   ListboxOptions,
 } from "@headlessui/vue";
 import { CheckIcon, ChevronUpDownIcon } from "@heroicons/vue/20/solid";
-import type { Component } from "vue";
 
-const model = defineModel<PlatformClient>();
+const model = defineModel<PlatformClient | undefined>();
+
+const typedModel = computed<PlatformClient | null>({
+  get() {
+    return model.value || null;
+  },
+  set(v) {
+    if (v === null) return (model.value = undefined);
+    model.value = v;
+  },
+});
 
 const values = Object.fromEntries(Object.entries(PlatformClient));
 </script>

components/UploadFileDialog.vue

@@ -1,5 +1,5 @@
 <template>
-  <TransitionRoot as="template" :show="open">
+  <TransitionRoot as="template" :show="!!open">
     <Dialog class="relative z-50" @close="open = false">
       <TransitionChild
         as="template"