Rearchitecture for v0.4.0 (#197)

* feat: database redist support

* feat: rearchitecture of database schemas, migration reset, and #180

* feat: import redists

* fix: giantbomb logging bug

* feat: partial user platform support + statusMessage -> message

* feat: add user platform filters to store view

* fix: sanitize svg uploads

... copilot suggested this

I feel dirty.

* feat: beginnings of platform & redist management

* feat: add server side redist patching

* fix: update drop-base commit

* feat: import of custom platforms & file extensions

* fix: redelete platform

* fix: remove platform

* feat: uninstall commands, new R UI

* checkpoint: before migrating to nuxt v4

* update to nuxt 4

* fix: fixes for Nuxt v4 update

* fix: remaining type issues

* feat: initial feedback to import other kinds of versions

* working commit

* fix: lint

* feat: redist import

app/components/NotificationItem.vue

@@ -0,0 +1,65 @@
+<template>
+  <div class="pointer-events-auto w-full bg-zinc-950/40 rounded">
+    <div class="p-4">
+      <div class="flex items-start">
+        <div class="w-0 flex-1 pt-0.5">
+          <p class="text-sm font-medium text-zinc-100">
+            {{ notification.title }}
+          </p>
+          <p class="mt-1 text-sm text-zinc-400 line-clamp-3">
+            {{ notification.description }}
+          </p>
+          <div
+            v-if="notification.actions.length > 0"
+            class="mt-3 flex space-x-7"
+          >
+            <NuxtLink
+              v-for="[name, link] in notification.actions.map((e) =>
+                e.split('|'),
+              )"
+              :key="name"
+              type="button"
+              :href="link"
+              class="rounded-md text-sm font-medium text-blue-600 hover:text-blue-500 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
+            >
+              {{ name }}
+            </NuxtLink>
+            <!-- todo -->
+          </div>
+        </div>
+        <div class="ml-4 flex shrink-0">
+          <button
+            type="button"
+            class="inline-flex rounded-md text-zinc-400 hover:text-zinc-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2"
+            @click="() => deleteMe()"
+          >
+            <span class="sr-only">{{ $t("common.close") }}</span>
+            <XMarkIcon class="size-5" aria-hidden="true" />
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { XMarkIcon } from "@heroicons/vue/24/solid";
+import type { NotificationModel } from "~~/prisma/client/models";
+
+const props = defineProps<{ notification: NotificationModel }>();
+
+async function deleteMe() {
+  await $dropFetch(`/api/v1/notifications/:id`, {
+    method: "DELETE",
+    params: {
+      id: props.notification.id,
+    },
+  });
+  const notifications = useNotifications();
+  const indexOfMe = notifications.value.findIndex(
+    (e) => e.id === props.notification.id,
+  );
+  // Delete me
+  notifications.value.splice(indexOfMe, 1);
+}
+</script>