update to nuxt 4

app/assets/tailwindcss.css

@@ -1,7 +1,7 @@
 @import "tailwindcss";
 @plugin "@tailwindcss/typography";
 @plugin "@tailwindcss/forms";
-@config "../tailwind.config.js";
+@config "../../tailwind.config.js";
 
 @layer base {
   input[type="number"]::-webkit-outer-spin-button,

app/components/Auth/Simple.vue

@@ -86,7 +86,7 @@
 
 <script setup lang="ts">
 import { XCircleIcon } from "@heroicons/vue/20/solid";
-import type { UserModel } from "~/prisma/client/models";
+import type { UserModel } from "~~/prisma/client/models";
 
 const username = ref("");
 const password = ref("");

app/components/GameCarousel.vue

@@ -35,7 +35,7 @@
 </template>
 
 <script setup lang="ts">
-import type { GameModel } from "~/prisma/client/models";
+import type { GameModel } from "~~/prisma/client/models";
 import type { SerializeObject } from "nitropack";
 
 const props = defineProps<{

app/components/GameEditor/Metadata.vue

@@ -444,7 +444,7 @@
 </template>
 
 <script setup lang="ts">
-import type { GameModel, GameTagModel } from "~/prisma/client/models";
+import type { GameModel, GameTagModel } from "~~/prisma/client/models";
 import { micromark } from "micromark";
 import {
   CheckIcon,

app/components/GameEditor/Version.vue

@@ -75,11 +75,11 @@
                     <li
                       v-for="gameVersion in version.gameVersions"
                       :key="gameVersion.versionId"
-                      class="px-3 py-2 bg-zinc-800 rounded-lg shadow"
+                      class="px-3 py-2 border border-zinc-800 rounded-lg shadow"
                     >
                       <div>
                         <div
-                          class="text-sm flex items-center text-zinc-200 font-semibold"
+                          class="text-sm flex items-center gap-x-2 text-zinc-200 font-semibold"
                         >
                           <IconsPlatform
                             :platform="
@@ -91,7 +91,7 @@
                             "
                             class="size-5 text-blue-500"
                           />
-                          <span class="ml-3 block truncate">{{
+                          <span class="block truncate">{{
                             platforms[gameVersion.platformId].name
                           }}</span>
                         </div>

app/components/GamePanel.vue

@@ -77,7 +77,7 @@ const {
       }>
     | undefined
     | null;
-  href?: string;
+  href?: string | undefined;
   showTitleDescription?: boolean;
   animate?: boolean;
   defaultPlaceholder?: boolean;

app/components/GameSearchResultWidget.vue

@@ -16,7 +16,7 @@
 </template>
 
 <script setup lang="ts">
-import type { GameMetadataSearchResult } from "~/server/internal/metadata/types";
+import type { GameMetadataSearchResult } from "~~/server/internal/metadata/types";
 
 const { game } = defineProps<{
   game: Omit<GameMetadataSearchResult, "year"> & { sourceName?: string };

app/components/Icons/Platform.vue

@@ -9,14 +9,14 @@
 </template>
 
 <script setup lang="ts">
-import { HardwarePlatform } from "~/prisma/client/enums";
+import { HardwarePlatform } from "~~/prisma/client/enums";
 import type { Component } from "vue";
 import LinuxLogo from "./LinuxLogo.vue";
 import WindowsLogo from "./WindowsLogo.vue";
 import MacLogo from "./MacLogo.vue";
 import DropLogo from "../DropLogo.vue";
 
-const props = defineProps<{ platform: string; fallback?: string }>();
+const props = defineProps<{ platform: string; fallback?: string | undefined }>();
 
 const platformIcons: { [key in HardwarePlatform]: Component } = {
   [HardwarePlatform.Linux]: LinuxLogo,

app/components/Import/Game.vue

@@ -191,7 +191,7 @@ import {
 import { XCircleIcon } from "@heroicons/vue/16/solid";
 import { ChevronUpDownIcon } from "@heroicons/vue/20/solid";
 import { MagnifyingGlassIcon } from "@heroicons/vue/24/outline";
-import type { GameMetadataSearchResult } from "~/server/internal/metadata/types";
+import type { GameMetadataSearchResult } from "~~/server/internal/metadata/types";
 
 const model = ref<GameMetadataSearchResult | undefined>(undefined);
 

app/components/LanguageSelectorListbox.vue

@@ -92,7 +92,7 @@ import type { Locale } from "vue-i18n";
 
 const { showText = true } = defineProps<{ showText?: boolean }>();
 
-const { locales, locale: currLocale, setLocale } = useI18n();
+const { availableLocales, locale: currLocale, setLocale } = useI18n();
 
 function changeLocale(locale: Locale) {
   setLocale(locale);
@@ -102,7 +102,7 @@ function changeLocale(locale: Locale) {
   useHead({
     htmlAttrs: {
       lang: locale,
-      dir: locales.value.find((l) => l.code === locale)?.dir || "ltr",
+      // dir: availableLocales.find((l) => l === locale)?.dir || "ltr",
     },
   });
 }
@@ -150,6 +150,6 @@ const wiredLocale = computed({
   },
 });
 const currentLocaleInformation = computed(() =>
-  locales.value.find((e) => e.code == wiredLocale.value),
+  availableLocales.find((e) => e == wiredLocale.value),
 );
 </script>

app/components/LogLine.vue

@@ -15,7 +15,7 @@
 </template>
 
 <script setup lang="ts">
-import type { TaskLog } from "~/server/internal/tasks";
+import type { TaskLog } from "~~/server/internal/tasks";
 
 defineProps<{ log: typeof TaskLog.infer; short?: boolean }>();
 

app/components/Modal/AddCompanyGame.vue

@@ -162,7 +162,7 @@
 
 <script setup lang="ts">
 import { ref } from "vue";
-import type { GameModel } from "~/prisma/client/models";
+import type { GameModel } from "~~/prisma/client/models";
 import {
   DialogTitle,
   Listbox,
@@ -171,7 +171,7 @@ import {
   ListboxOption,
   ListboxOptions,
 } from "@headlessui/vue";
-import type { GameMetadataSearchResult } from "~/server/internal/metadata/types";
+import type { GameMetadataSearchResult } from "~~/server/internal/metadata/types";
 import { FetchError } from "ofetch";
 import type { SerializeObject } from "nitropack";
 import { XCircleIcon } from "@heroicons/vue/24/solid";
@@ -208,7 +208,7 @@ const { t } = useI18n();
 
 const open = defineModel<boolean>({ required: true });
 
-const currentGame = ref<(typeof metadataGames.value)[number]>();
+const currentGame = ref<NonNullable<(typeof metadataGames.value)[number]> | null>(null);
 const developed = ref(false);
 const published = ref(false);
 const addGameLoading = ref(false);
@@ -236,7 +236,7 @@ async function addGame() {
       throw e;
     }
   } finally {
-    currentGame.value = undefined;
+    currentGame.value = null;
     developed.value = false;
     published.value = false;
     addGameLoading.value = false;

app/components/Modal/CreateCollection.vue

@@ -46,7 +46,7 @@
 <script setup lang="ts">
 import { ref } from "vue";
 import { DialogTitle } from "@headlessui/vue";
-import type { CollectionEntryModel, GameModel } from "~/prisma/client/models";
+import type { CollectionEntryModel, GameModel } from "~~/prisma/client/models";
 import type { SerializeObject } from "nitropack";
 
 const props = defineProps<{

app/components/Modal/CreateCompany.vue

@@ -110,7 +110,7 @@
 </template>
 
 <script setup lang="ts">
-import type { CompanyModel } from "~/prisma/client/models";
+import type { CompanyModel } from "~~/prisma/client/models";
 
 const open = defineModel<boolean>({ required: true });
 

app/components/Modal/CreateTag.vue

@@ -45,7 +45,7 @@
 <script setup lang="ts">
 import { ref } from "vue";
 import { DialogTitle } from "@headlessui/vue";
-import type { GameTagModel } from "~/prisma/client/models";
+import type { GameTagModel } from "~~/prisma/client/models";
 
 const emit = defineEmits<{
   created: [tag: GameTagModel];

app/components/Modal/DeleteCollection.vue

@@ -35,7 +35,7 @@
 </template>
 
 <script setup lang="ts">
-import type { CollectionModel } from "~/prisma/client/models";
+import type { CollectionModel } from "~~/prisma/client/models";
 import { DialogTitle } from "@headlessui/vue";
 
 const collection = defineModel<CollectionModel | undefined>();

app/components/Modal/DeleteUser.vue

@@ -36,7 +36,7 @@
 
 <script setup lang="ts">
 import { DialogTitle } from "@headlessui/vue";
-import type { UserModel } from "~/prisma/client/models";
+import type { UserModel } from "~~/prisma/client/models";
 
 const user = defineModel<UserModel | undefined>();
 const deleteLoading = ref(false);

app/components/NotificationItem.vue

@@ -44,7 +44,7 @@
 
 <script setup lang="ts">
 import { XMarkIcon } from "@heroicons/vue/24/solid";
-import type { NotificationModel } from "~/prisma/client/models";
+import type { NotificationModel } from "~~/prisma/client/models";
 
 const props = defineProps<{ notification: NotificationModel }>();
 

app/components/RedistEditor/Metadata.vue

@@ -4,7 +4,7 @@
 
 <script setup lang="ts">
 import type { SerializeObject } from "nitropack";
-import type { RedistModel, UserPlatformModel } from "~/prisma/client/models";
+import type { RedistModel, UserPlatformModel } from "~~/prisma/client/models";
 
 type ModelType = SerializeObject<
   RedistModel & { platform?: UserPlatformModel }

app/components/Setup/Library.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script setup lang="ts">
-import AdminSourcesPage from "~/pages/admin/library/sources/index.vue";
+import AdminSourcesPage from "~~/pages/admin/library/sources/index.vue";
 
 const complete = defineModel<boolean>({ required: true });
 // Only runs on component load, so it's fine

app/components/StoreView.vue

@@ -365,7 +365,7 @@ import {
   Squares2X2Icon,
 } from "@heroicons/vue/20/solid";
 import type { SerializeObject } from "nitropack";
-import type { GameModel, GameTagModel } from "~/prisma/client/models";
+import type { GameModel, GameTagModel } from "~~/prisma/client/models";
 import MultiItemSelector from "./MultiItemSelector.vue";
 const { showGamePanelTextDecoration } = await $dropFetch(`/api/v1/settings`);
 

app/components/TaskWidget.vue

@@ -49,7 +49,7 @@
 
 <script setup lang="ts">
 import { CheckCircleIcon, XMarkIcon } from "@heroicons/vue/24/solid";
-import type { TaskMessage } from "~/server/internal/tasks";
+import type { TaskMessage } from "~~/server/internal/tasks";
 
 defineProps<{ task: TaskMessage | undefined; active?: boolean }>();
 </script>

app/components/UserHeader/NotificationWidgetPanel.vue

@@ -46,7 +46,7 @@
 </template>
 
 <script setup lang="ts">
-import type { NotificationModel } from "~/prisma/client/models";
+import type { NotificationModel } from "~~/prisma/client/models";
 
 const props = defineProps<{ notifications: Array<NotificationModel> }>();
 </script>

app/components/UserHeader/UserWidget.vue

@@ -81,8 +81,6 @@
 <script setup lang="ts">
 import { Menu, MenuButton, MenuItem, MenuItems } from "@headlessui/vue";
 import { ChevronDownIcon } from "@heroicons/vue/16/solid";
-import { useObject } from "~/composables/objects";
-import type { NavigationItem } from "~/composables/types";
 
 const user = useUser();
 

app/composables/collection.ts

@@ -2,7 +2,7 @@ import type {
   CollectionModel,
   CollectionEntryModel,
   GameModel,
-} from "~/prisma/client/models";
+} from "~~/prisma/client/models";
 import type { SerializeObject } from "nitropack";
 
 type FullCollection = CollectionModel & {

app/composables/news.ts

@@ -1,4 +1,4 @@
-import type { ArticleModel } from "~/prisma/client/models";
+import type { ArticleModel } from "~~/prisma/client/models";
 import type { SerializeObject } from "nitropack";
 
 export const useNews = () =>

app/composables/notifications.ts

@@ -1,4 +1,4 @@
-import type { NotificationModel } from "~/prisma/client/models";
+import type { NotificationModel } from "~~/prisma/client/models";
 
 const ws = new WebSocketHandler("/api/v1/notifications/ws");
 

app/composables/platform.ts

@@ -1,5 +1,5 @@
-import type { UserPlatform } from "~/prisma/client/client";
-import { HardwarePlatform } from "~/prisma/client/enums";
+import type { UserPlatform } from "~~/prisma/client/client";
+import { HardwarePlatform } from "~~/prisma/client/enums";
 
 export type PlatformRenderable = {
   name: string;

app/composables/task.ts

@@ -1,4 +1,4 @@
-import type { TaskMessage } from "~/server/internal/tasks";
+import type { TaskMessage } from "~~/server/internal/tasks";
 import { WebSocketHandler } from "./ws";
 
 const websocketHandler = new WebSocketHandler("/api/v1/task");

app/composables/user.ts

@@ -1,4 +1,4 @@
-import type { UserModel } from "~/prisma/client/models";
+import type { UserModel } from "~~/prisma/client/models";
 
 // undefined = haven't check
 // null = check, no user

app/composables/users.ts

@@ -1,6 +1,6 @@
 import type { SerializeObject } from "nitropack";
-import type { UserModel } from "~/prisma/client/models";
-import type { AuthMec } from "~/prisma/client/enums";
+import type { UserModel } from "~~/prisma/client/models";
+import type { AuthMec } from "~~/prisma/client/enums";
 
 export const useUsers = () =>
   useState<

app/layouts/admin.vue

@@ -166,8 +166,6 @@ import {
   RectangleStackIcon,
   DocumentIcon,
 } from "@heroicons/vue/24/outline";
-import type { NavigationItem } from "~/composables/types";
-import { useCurrentNavigationIndex } from "~/composables/current-page-engine";
 import { ArrowLeftIcon } from "@heroicons/vue/16/solid";
 import { XMarkIcon } from "@heroicons/vue/24/solid";
 

app/pages/account/notifications.vue

@@ -92,7 +92,7 @@
 
 <script setup lang="ts">
 import { CheckIcon, TrashIcon } from "@heroicons/vue/24/outline";
-import type { NotificationModel } from "~/prisma/client/models";
+import type { NotificationModel } from "~~/prisma/client/models";
 import type { SerializeObject } from "nitropack";
 
 definePageMeta({

app/pages/admin/library/g/[id]/import.vue

@@ -463,7 +463,7 @@ import { CheckIcon, ChevronUpDownIcon } from "@heroicons/vue/20/solid";
 import { PlusIcon, TrashIcon } from "@heroicons/vue/24/outline";
 import { ChevronDownIcon, ChevronUpIcon } from "@heroicons/vue/24/solid";
 import type { SerializeObject } from "nitropack";
-import type { ImportVersion } from "~/server/api/v1/admin/import/version/index.post";
+import type { ImportVersion } from "~~/server/api/v1/admin/import/version/index.post";
 
 definePageMeta({
   layout: "admin",

app/pages/admin/library/import.vue

@@ -219,7 +219,7 @@ import {
 import { CheckIcon, ChevronUpDownIcon } from "@heroicons/vue/20/solid";
 import { PuzzlePieceIcon, ArchiveBoxIcon } from "@heroicons/vue/24/solid";
 import type { FetchError } from "ofetch";
-import type { GameMetadataSearchResult } from "~/server/internal/metadata/types";
+import type { GameMetadataSearchResult } from "~~/server/internal/metadata/types";
 
 definePageMeta({
   layout: "admin",

app/pages/admin/library/sources/index.vue

@@ -316,8 +316,8 @@ import {
 import { BackwardIcon, CheckIcon, XMarkIcon } from "@heroicons/vue/24/outline";
 import { FetchError } from "ofetch";
 import type { Component } from "vue";
-import type { LibraryBackend } from "~/prisma/client/enums";
-import type { WorkingLibrarySource } from "~/server/api/v1/admin/library/sources/index.get";
+import type { LibraryBackend } from "~~/prisma/client/enums";
+import type { WorkingLibrarySource } from "~~/server/api/v1/admin/library/sources/index.get";
 
 definePageMeta({
   layout: "admin",

app/pages/admin/metadata/companies/[id]/index.vue

@@ -238,7 +238,7 @@
 import { MagnifyingGlassIcon } from "@heroicons/vue/24/outline";
 import { ArrowUpTrayIcon, PencilIcon, PlusIcon } from "@heroicons/vue/24/solid";
 import type { SerializeObject } from "nitropack";
-import type { GameModel } from "~/prisma/client/models";
+import type { GameModel } from "~~/prisma/client/models";
 
 definePageMeta({
   layout: "admin",

app/pages/admin/metadata/companies/index.vue

@@ -106,7 +106,7 @@
 
 <script setup lang="ts">
 import { MagnifyingGlassIcon } from "@heroicons/vue/24/outline";
-import type { CompanyModel } from "~/prisma/client/models";
+import type { CompanyModel } from "~~/prisma/client/models";
 
 const { t } = useI18n();
 

app/pages/admin/metadata/tags.vue

@@ -39,7 +39,7 @@
 <script setup lang="ts">
 import { TrashIcon } from "@heroicons/vue/24/outline";
 import type { SerializeObject } from "nitropack";
-import type { GameTagModel } from "~/prisma/client/models";
+import type { GameTagModel } from "~~/prisma/client/models";
 
 definePageMeta({
   layout: "admin",