Translated using Weblate (French)

Currently translated at 100.0% (499 of 499 strings)

Translated using Weblate (French)

Currently translated at 96.9% (484 of 499 strings)

Co-authored-by: Ribemont Francois <ribemont.francois+weblate@gmail.com>
Co-authored-by: Weblate <noreply@weblate.org>
Translate-URL: http://translate.droposs.org/projects/drop/drop/fr/
Translation: Drop/Drop

.github/workflows/release.yml

@@ -5,8 +5,8 @@ on:
   release:
     types: [published]
   # This can be used to automatically publish nightlies at UTC nighttime
-  schedule:
+  #schedule:
-    - cron: "0 2 * * *" # run at 2 AM UTC
+  #  - cron: "0 2 * * *" # run at 2 AM UTC
 
 jobs:
   web:

app/components/CarouselPagination.vue

@@ -4,9 +4,10 @@
       v-for="(_, i) in amount"
       :key="i"
       :class="[
-        carousel.currentSlide == i ? 'bg-blue-600 w-6' : 'bg-zinc-700 w-3',
+        carousel.currentSlide === i ? 'bg-blue-600 w-6' : 'bg-zinc-700 w-3',
         'transition-all cursor-pointer h-2 rounded-full',
       ]"
+      @click="slideTo(i)"
     />
   </div>
 </template>
@@ -18,8 +19,8 @@ const carousel = inject(injectCarousel)!;
 
 const amount = carousel.maxSlide - carousel.minSlide + 1;
 
-// function slideTo(index: number) {
+function slideTo(index: number) {
-//   const offsetIndex = index + carousel.minSlide;
+  const offsetIndex = index + carousel.minSlide;
-//   carousel.nav.slideTo(offsetIndex);
+  carousel.nav.slideTo(offsetIndex);
-// }
+}
 </script>

app/components/GameEditor/Metadata.vue

@@ -29,6 +29,23 @@
 
         <div class="grid grid-cols-1 lg:grid-cols-3 gap-4 pt-8">
           <MultiItemSelector v-model="currentTags" :items="tags" />
+          <div class="flex flex-col">
+            <label
+              for="releaseDate"
+              class="text-sm/6 font-medium text-zinc-100"
+            >
+              {{ $t("library.admin.game.editReleaseDate") }}
+            </label>
+            <div class="mt-2">
+              <input
+                id="releaseDate"
+                v-model="releaseDate"
+                type="date"
+                name="releaseDate"
+                class="block w-full rounded-md bg-zinc-800 px-3 py-1.5 text-base text-zinc-100 outline outline-1 -outline-offset-1 outline-zinc-700 placeholder:text-zinc-400 focus:outline focus:outline-2 focus:-outline-offset-2 focus:outline-blue-600 sm:text-sm/6"
+              />
+            </div>
+          </div>
         </div>
 
         <!-- image carousel pick -->
@@ -491,11 +508,38 @@ watch(
   { deep: true },
 );
 
+const releaseDate = ref(
+  game.value.mReleased
+    ? new Date(game.value.mReleased).toISOString().substring(0, 10)
+    : "",
+);
+
+watch(releaseDate, async (newDate) => {
+  const body: PatchGameBody = {};
+
+  if (newDate) {
+    const parsed = new Date(newDate);
+    if (!isNaN(parsed.getTime())) {
+      body.mReleased = parsed;
+    }
+  }
+
+  await $dropFetch(`/api/v1/admin/game/:id`, {
+    method: "PATCH",
+    params: {
+      id: game.value.id,
+    },
+    body,
+    failTitle: "Failed to update release date",
+  });
+});
+
 const { t } = useI18n();
 
 // I don't know why I split these fields off.
 const coreMetadataName = ref(game.value.mName);
 const coreMetadataDescription = ref(game.value.mShortDescription);
+
 const coreMetadataIconUrl = ref(useObject(game.value.mIconObjectId));
 const coreMetadataIconFileUpload = ref<FileList | undefined>();
 const coreMetadataLoading = ref(false);
@@ -561,7 +605,6 @@ function coreMetadataUpdate_wrapper() {
       );
     })
     .then((newGame) => {
-      console.log(newGame);
       if (!newGame) return;
       Object.assign(game.value, newGame);
       coreMetadataIconUrl.value = useObject(newGame.mIconObjectId);

app/components/Icons/GamepadIcon.vue

@@ -0,0 +1,19 @@
+<template>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="currentColor"
+    stroke-width="2"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+  >
+    <line x1="6" y1="11" x2="10" y2="11" />
+    <line x1="8" y1="9" x2="8" y2="13" />
+    <line x1="15" y1="12" x2="15.01" y2="12" />
+    <line x1="18" y1="10" x2="18.01" y2="10" />
+    <path
+      d="M17.32 5H6.68a4 4 0 00-3.978 3.59c-.006.052-.01.101-.017.152C2.604 9.416 2 14.456 2 16a3 3 0 003 3c1 0 1.5-.5 2-1l1.414-1.414A2 2 0 019.828 16h4.344a2 2 0 011.414.586L17 18c.5.5 1 1 2 1a3 3 0 003-3c0-1.545-.604-6.584-.685-7.258-.007-.05-.011-.1-.017-.151A4 4 0 0017.32 5z"
+    />
+  </svg>
+</template>

app/components/PieChart/PieChart.vue

@@ -0,0 +1,45 @@
+<template>
+  <h2 v-if="title" class="text-lg mb-4 w-full">{{ title }}</h2>
+  <div class="flex flex-col xl:flex-row gap-4">
+    <div class="relative flex grow max-w-[12rem]">
+      <svg class="aspect-square grow relative inline" viewBox="0 0 100 100">
+        <PieChartPieSlice
+          v-for="slice in slices"
+          :key="`${slice.percentage}-${slice.totalPercentage}`"
+          :slice="slice"
+        />
+      </svg>
+      <div class="absolute inset-0 bg-zinc-900 rounded-full m-12" />
+    </div>
+    <ul class="flex flex-col gap-y-1 justify-center text-left">
+      <li
+        v-for="slice in slices"
+        :key="slice.value"
+        class="text-sm inline-flex items-center gap-x-1"
+      >
+        <span
+          class="size-3 inline-block rounded-sm"
+          :class="CHART_COLOURS[slice.color].bg"
+        />
+        {{
+          $t("common.labelValueColon", {
+            label: slice.label,
+            value: slice.value,
+          })
+        }}
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { generateSlices } from "~/components/PieChart/utils";
+import type { SliceData } from "~/components/PieChart/types";
+
+const { data, title = undefined } = defineProps<{
+  data: SliceData[];
+  title?: string | undefined;
+}>();
+
+const slices = generateSlices(data);
+</script>

app/components/PieChart/PieSlice.vue

@@ -0,0 +1,35 @@
+<template>
+  <path
+    v-if="slice.percentage !== 0 && slice.percentage !== 100"
+    :class="[CHART_COLOURS[slice.color].fill]"
+    :d="`
+      M ${slice.start}
+      A ${slice.radius},${slice.radius} 0 ${getFlags(slice.percentage)} ${polarToCartesian(slice.center, slice.radius, percent2Degrees(slice.totalPercentage))}
+      L ${slice.center}
+      z
+    `"
+    stroke-width="2"
+  />
+  <circle
+    v-if="slice.percentage === 100"
+    :r="slice.radius"
+    :cx="slice.center.x"
+    :cy="slice.center.y"
+    :class="[CHART_COLOURS[slice.color].fill]"
+    stroke-width="2"
+  />
+</template>
+
+<script setup lang="ts">
+import type { Slice } from "~/components/PieChart/types";
+import {
+  getFlags,
+  percent2Degrees,
+  polarToCartesian,
+} from "~/components/PieChart/utils";
+import { CHART_COLOURS } from "~/utils/colors";
+
+const { slice } = defineProps<{
+  slice: Slice;
+}>();
+</script>

app/components/PieChart/types.d.ts

@@ -0,0 +1,19 @@
+import type Tuple from "~/utils/tuple";
+import type { ChartColour } from "~/utils/colors";
+
+export type Slice = {
+  start: Tuple;
+  center: Tuple;
+  percentage: number;
+  totalPercentage: number;
+  radius: number;
+  color: ChartColour;
+  label: string;
+  value: number;
+};
+
+export type SliceData = {
+  value: number;
+  color?: ChartColour;
+  label: string;
+};

app/components/PieChart/utils.ts

@@ -0,0 +1,50 @@
+import Tuple from "~/utils/tuple";
+import type { Slice, SliceData } from "~/components/PieChart/types";
+import { sum, lastItem } from "~/utils/array";
+
+export const START = new Tuple(50, 10);
+export const CENTER = new Tuple(50, 50);
+export const RADIUS = 40;
+
+export const polarToCartesian = (
+  center: Tuple,
+  radius: number,
+  angleInDegrees: number,
+) => {
+  const angleInRadians = ((angleInDegrees - 90) * Math.PI) / 180;
+  const x = center.x + radius * Math.cos(angleInRadians);
+  const y = center.y + radius * Math.sin(angleInRadians);
+  return new Tuple(x, y);
+};
+
+export const percent2Degrees = (percentage: number) => (360 * percentage) / 100;
+
+export function generateSlices(data: SliceData[]): Slice[] {
+  return data.reduce((accumulator, currentValue, index, array) => {
+    const percentage =
+      (currentValue.value * 100) / sum(array.map((slice) => slice.value));
+    return [
+      ...accumulator,
+      {
+        start: accumulator.length
+          ? polarToCartesian(
+              CENTER,
+              RADIUS,
+              percent2Degrees(lastItem(accumulator).totalPercentage),
+            )
+          : START,
+        radius: RADIUS,
+        percentage: percentage,
+        totalPercentage:
+          sum(accumulator.map((element) => element.percentage)) + percentage,
+        center: CENTER,
+        color: PIE_COLOURS[index % PIE_COLOURS.length],
+        label: currentValue.label,
+        value: currentValue.value,
+      },
+    ];
+  }, [] as Slice[]);
+}
+
+export const getFlags = (percentage: number) =>
+  percentage > 50 ? new Tuple(1, 1) : new Tuple(0, 1);

app/components/ProgressBar.vue

@@ -0,0 +1,31 @@
+<template>
+  <div
+    :class="[
+      'relative h-5 rounded-xl overflow-hidden',
+      CHART_COLOURS[backgroundColor].bg,
+    ]"
+  >
+    <div
+      :style="{ width: `${percentage}%` }"
+      :class="['transition-all h-full', CHART_COLOURS[color].bg]"
+    />
+    <span
+      class="absolute inset-0 flex items-center justify-center text-blue-200 text-sm font-bold font-display"
+    >
+      {{ $t("tasks.admin.progress", [Math.round(percentage * 10) / 10]) }}
+    </span>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { type ChartColour, CHART_COLOURS } from "~/utils/colors";
+const {
+  percentage,
+  color = "blue",
+  backgroundColor = "zinc",
+} = defineProps<{
+  percentage: number;
+  color?: ChartColour;
+  backgroundColor?: ChartColour;
+}>();
+</script>

app/components/RankingList.vue

@@ -0,0 +1,43 @@
+<template>
+  <table v-if="items.length > 0" class="w-full mt-4 space-y-6">
+    <thead>
+      <tr>
+        <th></th>
+        <th></th>
+        <th></th>
+      </tr>
+    </thead>
+    <tbody class="divide-y divide-white/10">
+      <tr v-for="item in items" :key="`${item.rank}-${item.name}`">
+        <td
+          class="my-2 size-7 rounded-sm bg-zinc-950 ring ring-zinc-800 inline-flex items-center justify-center font-bold font-display text-blue-500"
+        >
+          {{ item.rank }}
+        </td>
+        <td class="w-full font-bold px-2">{{ item.name }}</td>
+        <td
+          class="text-right text-sm font-semibold text-zinc-500 whitespace-nowrap"
+        >
+          {{ item.value }}
+        </td>
+      </tr>
+    </tbody>
+  </table>
+  <p
+    v-else
+    class="w-full p-2 text-center uppercase text-sm font-display font-bold text-zinc-700"
+  >
+    {{ $t("common.noData") }}
+  </p>
+</template>
+
+<script lang="ts" setup>
+export type RankItem = {
+  rank: number;
+  name: string;
+  value: string;
+};
+const { items } = defineProps<{
+  items: RankItem[];
+}>();
+</script>

app/components/SourceTable.vue

@@ -0,0 +1,193 @@
+<template>
+  <div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
+    <div class="inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8">
+      <table class="min-w-full divide-y divide-zinc-700">
+        <thead>
+          <tr>
+            <th
+              scope="col"
+              class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-zinc-100 sm:pl-3"
+            >
+              {{ $t("common.name") }}
+            </th>
+            <th
+              scope="col"
+              class="px-3 py-3.5 text-left text-sm font-semibold text-zinc-100"
+            >
+              {{ $t("type") }}
+            </th>
+            <th
+              scope="col"
+              class="px-3 py-3.5 text-left text-sm font-semibold text-zinc-100"
+            >
+              {{ $t("library.admin.sources.working") }}
+            </th>
+            <th
+              scope="col"
+              class="px-3 py-3.5 text-left text-sm font-semibold text-zinc-100"
+            >
+              {{ $t("options") }}
+            </th>
+            <th
+              scope="col"
+              class="px-3 py-3.5 text-left text-sm font-semibold text-zinc-100"
+            >
+              {{ $t("library.admin.sources.totalSpace") }}
+            </th>
+            <th
+              scope="col"
+              class="px-3 py-3.5 text-left text-sm font-semibold text-zinc-100"
+            >
+              {{ $t("library.admin.sources.freeSpace") }}
+            </th>
+            <th
+              scope="col"
+              class="px-3 py-3.5 text-left text-sm font-semibold text-zinc-100"
+            >
+              {{ $t("library.admin.sources.utilizationPercentage") }}
+            </th>
+            <th
+              v-if="editSource || deleteSource"
+              scope="col"
+              class="relative py-3.5 pl-3 pr-4 sm:pr-3"
+            >
+              <span class="sr-only">{{ $t("actions") }}</span>
+            </th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr
+            v-for="(source, sourceIdx) in sources"
+            :key="source.id"
+            class="even:bg-zinc-800"
+          >
+            <td
+              class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-zinc-100 sm:pl-3"
+            >
+              {{ source.name }}
+            </td>
+            <td
+              class="whitespace-nowrap px-3 py-4 text-sm text-zinc-400 inline-flex gap-x-1 items-center"
+            >
+              <component
+                :is="optionsMetadata[source.backend].icon"
+                class="size-5 text-zinc-400"
+              />
+              {{ optionsMetadata[source.backend].title }}
+            </td>
+            <td class="whitespace-nowrap px-3 py-4 text-sm text-zinc-400">
+              <CheckIcon v-if="source.working" class="size-5 text-green-500" />
+              <XMarkIcon v-else class="size-5 text-red-500" />
+            </td>
+            <td class="whitespace-nowrap px-3 py-4 text-sm text-zinc-400">
+              {{ source.options }}
+            </td>
+            <td class="whitespace-nowrap px-3 py-4 text-sm text-zinc-400">
+              {{ source.fsStats && formatBytes(source.fsStats.totalSpace) }}
+            </td>
+            <td class="whitespace-nowrap px-3 py-4 text-sm text-zinc-400">
+              {{ source.fsStats && formatBytes(source.fsStats.freeSpace) }}
+            </td>
+            <td
+              class="align-middle flex flex-cols-5 whitespace-nowrap px-3 py-4 text-sm text-zinc-400"
+            >
+              <div class="flex-auto content-right">
+                <ProgressBar
+                  v-if="source.fsStats"
+                  :percentage="
+                    getPercentage(
+                      source.fsStats.freeSpace,
+                      source.fsStats.totalSpace,
+                    )
+                  "
+                  :color="
+                    getBarColor(
+                      getPercentage(
+                        source.fsStats.freeSpace,
+                        source.fsStats.totalSpace,
+                      ),
+                    )
+                  "
+                  background-color="slate"
+                />
+              </div>
+            </td>
+            <td
+              v-if="editSource || deleteSource"
+              class="relative whitespace-nowrap py-4 pl-3 pr-3 text-right text-sm font-medium space-x-2"
+            >
+              <button
+                v-if="editSource"
+                class="text-blue-500 hover:text-blue-400"
+                @click="() => editSource(sourceIdx)"
+              >
+                {{ $t("common.edit") }}
+                <span class="sr-only">
+                  {{ $t("chars.srComma", [source.name]) }}
+                </span>
+              </button>
+
+              <button
+                v-if="deleteSource"
+                class="text-red-500 hover:text-red-400"
+                @click="() => deleteSource(sourceIdx)"
+              >
+                {{ $t("delete") }}
+                <span class="sr-only">
+                  {{ $t("chars.srComma", [source.name]) }}
+                </span>
+              </button>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { WorkingLibrarySource } from "~~/server/api/v1/admin/library/sources/index.get";
+import type { LibraryBackend } from "~~/prisma/client/enums";
+import { BackwardIcon, CheckIcon, XMarkIcon } from "@heroicons/vue/24/outline";
+import { DropLogo } from "#components";
+import { formatBytes } from "~~/server/internal/utils/files";
+import { getBarColor } from "~/utils/colors";
+
+const {
+  sources,
+  deleteSource = undefined,
+  editSource = undefined,
+} = defineProps<{
+  sources: WorkingLibrarySource[];
+  summaryMode?: boolean;
+  deleteSource?: (id: number) => void;
+  editSource?: (id: number) => void;
+}>();
+
+const { t } = useI18n();
+
+const optionsMetadata: {
+  [key in LibraryBackend]: {
+    title: string;
+    description: string;
+    docsLink: string;
+    icon: Component;
+  };
+} = {
+  Filesystem: {
+    title: t("library.admin.sources.fsTitle"),
+    description: t("library.admin.sources.fsDesc"),
+    docsLink: "https://docs.droposs.org/docs/library#drop-style",
+    icon: DropLogo,
+  },
+  FlatFilesystem: {
+    title: t("library.admin.sources.fsFlatTitle"),
+    description: t("library.admin.sources.fsFlatDesc"),
+    docsLink: "https://docs.droposs.org/docs/library#flat-style-or-compat",
+    icon: BackwardIcon,
+  },
+};
+
+const getPercentage = (value: number, total: number) =>
+  ((total - value) * 100) / total;
+</script>

app/components/StoreView.vue

@@ -1,3 +1,12 @@
+<i18n>
+{
+  "en": {
+    "↓": "↓",
+    "↑": "↑"
+  }
+}
+</i18n>
+
 <template>
   <div>
     <div>
@@ -176,9 +185,12 @@
                           active ? 'bg-zinc-900 outline-hidden' : '',
                           'w-full text-left block px-4 py-2 text-sm',
                         ]"
-                        @click="() => (currentSort = option.param)"
+                        @click.prevent="handleSortClick(option, $event)"
                       >
                         {{ option.name }}
+                        <span v-if="currentSort === option.param">
+                          {{ sortOrder === "asc" ? $t("↑") : $t("↓") }}
+                        </span>
                       </button>
                     </MenuItem>
                   </div>
@@ -298,7 +310,7 @@
             <div
               v-if="games?.length ?? 0 > 0"
               ref="product-grid"
-              class="relative lg:col-span-4 grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-4 xl:grid-cols-6 2xl:grid-cols-7 gap-4"
+              class="relative lg:col-span-4 grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-4 xl:grid-cols-5 2xl:grid-cols-6 gap-4"
             >
               <!-- Your content -->
               <GamePanel
@@ -397,8 +409,13 @@ const sorts: Array<StoreSortOption> = [
     name: "Recently Added",
     param: "recent",
   },
+  {
+    name: "Name",
+    param: "name",
+  },
 ];
 const currentSort = ref(sorts[0].param);
+const sortOrder = ref<"asc" | "desc">("desc");
 
 const options: Array<StoreFilterOption> = [
   ...(tags.length > 0
@@ -474,7 +491,7 @@ async function updateGames(query: string, resetGames: boolean) {
     results: Array<SerializeObject<GameModel>>;
     count: number;
   }>(
-    `/api/v1/store?take=50&skip=${resetGames ? 0 : games.value?.length || 0}&sort=${currentSort.value}${query ? "&" + query : ""}`,
+    `/api/v1/store?take=50&skip=${resetGames ? 0 : games.value?.length || 0}&sort=${currentSort.value}&order=${sortOrder.value}${query ? "&" + query : ""}`,
   );
   if (resetGames) {
     games.value = newValues.results;
@@ -491,6 +508,19 @@ watch(filterQuery, (newUrl) => {
 watch(currentSort, (_) => {
   updateGames(filterQuery.value, true);
 });
+watch(sortOrder, (_) => {
+  updateGames(filterQuery.value, true);
+});
 
 await updateGames(filterQuery.value, true);
+
+function handleSortClick(option: StoreSortOption, event: MouseEvent) {
+  event.stopPropagation();
+  if (currentSort.value === option.param) {
+    sortOrder.value = sortOrder.value === "asc" ? "desc" : "asc";
+  } else {
+    currentSort.value = option.param;
+    sortOrder.value = option.param === "name" ? "asc" : "desc";
+  }
+}
 </script>

app/components/TileWithLink.vue

@@ -0,0 +1,52 @@
+<template>
+  <div
+    :class="[
+      'border border-zinc-800 rounded-xl h-full px-6 py-4 relative bg-zinc-950/30',
+      { 'min-h-50 pb-15': link, 'lg:pb-4': !link },
+    ]"
+  >
+    <h1
+      v-if="props.title"
+      :class="[
+        'font-semibold text-lg w-full',
+        { 'mb-3': !props.subtitle && link },
+      ]"
+    >
+      {{ props.title }}
+      <div v-if="rightTitle" class="float-right">{{ props.rightTitle }}</div>
+    </h1>
+    <h2
+      v-if="props.subtitle"
+      :class="['text-zinc-400 text-sm w-full', { 'mb-3': link }]"
+    >
+      {{ props.subtitle }}
+      <div v-if="rightTitle" class="float-right">{{ props.rightTitle }}</div>
+    </h2>
+
+    <slot />
+
+    <div v-if="props.link" class="absolute bottom-5 right-5">
+      <NuxtLink
+        :to="props.link.url"
+        class="transition text-sm/6 font-semibold text-zinc-400 hover:text-zinc-100 inline-flex gap-x-2 items-center duration-200 hover:scale-105"
+      >
+        {{ props.link.label }}
+        <ArrowRightIcon class="h-4 w-4" aria-hidden="true" />
+      </NuxtLink>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ArrowRightIcon } from "@heroicons/vue/20/solid";
+
+const props = defineProps<{
+  title?: string;
+  subtitle?: string;
+  rightTitle?: string;
+  link?: {
+    url: string;
+    label: string;
+  };
+}>();
+</script>

app/layouts/admin.vue

@@ -172,9 +172,14 @@ import { XMarkIcon } from "@heroicons/vue/24/solid";
 const i18nHead = useLocaleHead();
 
 const navigation: Array<NavigationItem & { icon: Component }> = [
-  { label: $t("home"), route: "/admin", prefix: "/admin", icon: HomeIcon },
   {
-    label: $t("userHeader.links.library"),
+    label: $t("header.admin.home"),
+    route: "/admin",
+    prefix: "/admin",
+    icon: HomeIcon,
+  },
+  {
+    label: $t("header.admin.library"),
     route: "/admin/library",
     prefix: "/admin/library",
     icon: ServerStackIcon,

app/pages/admin/index.vue

@@ -1,6 +1,147 @@
-<template><div /></template>
+<template>
+  <div class="space-y-4">
+    <div class="sm:flex sm:items-center">
+      <div class="sm:flex-auto">
+        <h1 class="text-2xl font-semibold text-zinc-100">
+          {{ t("home.admin.title") }}
+        </h1>
+        <p class="mt-2 text-base text-zinc-400">
+          {{ t("home.admin.subheader") }}
+        </p>
+      </div>
+    </div>
+    <main
+      class="mx-auto max-w-md lg:max-w-none md:max-w-none w-full py-2 text-zinc-100"
+    >
+      <div class="grid grid-cols-6 gap-4">
+        <div class="col-span-6 lg:col-span-1 md:col-span-3 row-span-1">
+          <TileWithLink>
+            <div class="h-full flex">
+              <div class="flex-1 my-auto">
+                <DropLogo />
+              </div>
+              <div
+                class="flex-6 lg:flex-2 my-auto text-center flex lg:inline mx-4"
+              >
+                <div class="text-2xl flex-1 font-bold">{{ version }}</div>
+                <div class="text-xs flex-1 text-left lg:text-center">
+                  {{ t("home.admin.version") }}
+                </div>
+              </div>
+            </div>
+          </TileWithLink>
+        </div>
+
+        <div class="col-span-6 lg:col-span-1 md:col-span-3">
+          <TileWithLink>
+            <div class="h-full flex">
+              <div class="flex-1 my-auto">
+                <GamepadIcon />
+              </div>
+              <div
+                class="flex-6 lg:flex-2 my-auto text-center flex lg:inline mx-4"
+              >
+                <div class="text-3xl flex-1 font-bold">{{ gameCount }}</div>
+                <div class="text-xs flex-1 text-left lg:text-center">
+                  {{ t("home.admin.games") }}
+                </div>
+              </div>
+            </div>
+          </TileWithLink>
+        </div>
+
+        <div
+          class="col-span-6 lg:col-span-1 md:col-span-3 row-span-1 lg:col-start-1 lg:row-start-2"
+        >
+          <TileWithLink>
+            <div class="h-full flex">
+              <div class="flex-1 my-auto">
+                <ServerStackIcon />
+              </div>
+              <div
+                class="flex-6 lg:flex-2 my-auto text-center flex lg:inline mx-4"
+              >
+                <div class="text-3xl flex-1 font-bold">
+                  {{ sources.length }}
+                </div>
+                <div class="text-xs flex-1 text-left lg:text-center">
+                  {{ t("home.admin.librarySources") }}
+                </div>
+              </div>
+            </div>
+          </TileWithLink>
+        </div>
+
+        <div
+          class="col-span-6 lg:col-span-1 md:col-span-3 row-span-1 lg:col-start-2 lg:row-start-2"
+        >
+          <TileWithLink>
+            <div class="h-full flex">
+              <div class="flex-1 my-auto">
+                <UserGroupIcon />
+              </div>
+              <div
+                class="flex-6 lg:flex-2 my-auto text-center flex lg:inline mx-4"
+              >
+                <div class="text-3xl flex-1 font-bold">
+                  {{ userStats.userCount }}
+                </div>
+                <div class="text-xs flex-1 text-left lg:text-center">
+                  {{ t("home.admin.users") }}
+                </div>
+              </div>
+            </div>
+          </TileWithLink>
+        </div>
+
+        <div class="col-span-6 row-span-1 lg:col-span-2 lg:row-span-2">
+          <TileWithLink
+            :link="{
+              url: '/admin/users',
+              label: t('home.admin.goToUsers'),
+            }"
+            :title="t('home.admin.activeInactiveUsers')"
+          >
+            <PieChart :data="pieChartData" />
+          </TileWithLink>
+        </div>
+        <div class="col-span-6">
+          <TileWithLink
+            title="Library"
+            :link="{ url: '/admin/library', label: 'Go to library' }"
+          >
+            <SourceTable :sources="sources" />
+          </TileWithLink>
+        </div>
+        <div class="col-span-6 lg:col-span-2">
+          <TileWithLink
+            :title="t('home.admin.biggestGamesToDownload')"
+            :subtitle="t('home.admin.latestVersionOnly')"
+          >
+            <RankingList :items="biggestGamesLatest.map(gameToRankItem)" />
+          </TileWithLink>
+        </div>
+        <div class="col-span-6 lg:col-span-2">
+          <TileWithLink
+            :title="t('home.admin.biggestGamesOnServer')"
+            :subtitle="t('home.admin.allVersionsCombined')"
+          >
+            <RankingList :items="biggestGamesCombined.map(gameToRankItem)" />
+          </TileWithLink>
+        </div>
+      </div>
+    </main>
+  </div>
+</template>
 
 <script setup lang="ts">
+import { formatBytes } from "~~/server/internal/utils/files";
+import GamepadIcon from "~/components/Icons/GamepadIcon.vue";
+import DropLogo from "~/components/DropLogo.vue";
+import { ServerStackIcon, UserGroupIcon } from "@heroicons/vue/24/outline";
+import type { RankItem } from "~/components/RankingList.vue";
+import type { GameSize } from "~~/server/internal/gamesize";
+
 definePageMeta({
   layout: "admin",
 });
@@ -8,4 +149,29 @@ definePageMeta({
 useHead({
   title: "Home",
 });
+
+const { t } = useI18n();
+
+const {
+  version,
+  gameCount,
+  sources,
+  userStats,
+  biggestGamesLatest,
+  biggestGamesCombined,
+} = await $dropFetch("/api/v1/admin/home");
+
+const gameToRankItem = (game: GameSize, rank: number): RankItem => ({
+  rank: rank + 1,
+  name: game.gameName,
+  value: formatBytes(game.size),
+});
+
+const pieChartData = [
+  {
+    label: t("home.admin.inactiveUsers"),
+    value: userStats.userCount - userStats.activeSessions,
+  },
+  { label: t("home.admin.activeUsers"), value: userStats.activeSessions },
+];
 </script>

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

@@ -134,34 +134,41 @@
         </div>
       </div>
       <!-- setup mode -->
-      <SwitchGroup as="div" class="max-w-lg flex items-center justify-between">
+      <fieldset class="max-w-lg">
-        <span class="flex flex-grow flex-col">
+        <legend class="text-sm/6 font-semibold text-white">
-          <SwitchLabel
+          Select an import mode
-            as="span"
+        </legend>
-            class="text-sm font-medium leading-6 text-zinc-100"
+        <div class="mt-2 grid grid-cols-1 gap-y-6 sm:grid-cols-2 sm:gap-x-4">
-            passive
+          <label
-            >{{ $t("library.admin.import.version.setupMode") }}</SwitchLabel
+            v-for="mode in setupModes"
+            :key="mode.id"
+            :aria-label="mode.title"
+            :aria-description="mode.description"
+            class="cursor-pointer group relative flex rounded-lg border border-white/10 bg-zinc-800/50 p-4 has-checked:bg-blue-500/10 has-checked:outline-2 has-checked:-outline-offset-2 has-checked:outline-blue-500 has-focus-visible:outline-3 has-focus-visible:-outline-offset-1 has-disabled:bg-gray-800 has-disabled:opacity-25"
           >
-          <SwitchDescription as="span" class="text-sm text-zinc-400">{{
+            <input
-            $t("library.admin.import.version.setupModeDesc")
+              type="radio"
-          }}</SwitchDescription>
+              name="mode"
-        </span>
+              :value="mode.id"
-        <Switch
+              :checked="versionSettings.onlySetup === mode.value"
-          v-model="versionSettings.onlySetup"
+              class="absolute inset-0 appearance-none opacity-0 focus:outline-none"
-          :class="[
+              @click="versionSettings.onlySetup = mode.value"
-            versionSettings.onlySetup ? 'bg-blue-600' : 'bg-zinc-800',
-            'relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-blue-600 focus:ring-offset-2',
-          ]"
-        >
-          <span
-            aria-hidden="true"
-            :class="[
-              versionSettings.onlySetup ? 'translate-x-5' : 'translate-x-0',
-              'pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out',
-            ]"
             />
-        </Switch>
+            <div class="flex-1">
-      </SwitchGroup>
+              <span class="block text-sm font-medium text-white">{{
+                mode.title
+              }}</span>
+              <span class="mt-1 block text-xs text-zinc-400">{{
+                mode.description
+              }}</span>
+            </div>
+            <CheckCircleIcon
+              class="invisible size-5 text-blue-500 group-has-checked:visible"
+              aria-hidden="true"
+            />
+          </label>
+        </div>
+      </fieldset>
       <!-- launch commands -->
       <div class="relative max-w-3xl">
         <label
@@ -462,10 +469,14 @@ import {
 } from "@headlessui/vue";
 import { XCircleIcon } from "@heroicons/vue/16/solid";
 import { CheckIcon, ChevronUpDownIcon } from "@heroicons/vue/20/solid";
-import { PlusIcon, TrashIcon } from "@heroicons/vue/24/outline";
+import {
+  CheckCircleIcon,
+  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 { ImportGameVersion } from "~~/server/api/v1/admin/import/version/index.post";
 
 definePageMeta({
   layout: "admin",
@@ -476,14 +487,15 @@ const { t } = useI18n();
 const route = useRoute();
 const gameId = route.params.id.toString();
 const versions = await $dropFetch(
-  `/api/v1/admin/import/version?id=${encodeURIComponent(gameId)}`,
+  `/api/v1/admin/import/version?id=${encodeURIComponent(gameId)}&mode=game`,
 );
 const userPlatforms = await useAdminPlatforms();
 const allPlatforms = renderPlatforms(userPlatforms);
 const currentlySelectedVersion = ref(-1);
-const versionSettings = ref<Partial<typeof ImportVersion.infer>>({
+
-  id: gameId,
+const versionSettings = ref<Partial<ImportGameVersion>>({
   launches: [],
+  onlySetup: false,
 });
 
 const versionGuesses =
@@ -540,7 +552,7 @@ async function updateCurrentlySelectedVersion(value: number) {
   const options = await $dropFetch(
     `/api/v1/admin/import/version/preload?id=${encodeURIComponent(
       gameId,
-    )}&version=${encodeURIComponent(version)}`,
+    )}&version=${encodeURIComponent(version)}&mode=game`,
   );
   versionGuesses.value = options.map((e) => ({
     ...e,
@@ -556,6 +568,7 @@ async function startImport() {
     body: {
       id: gameId,
       version: versions[currentlySelectedVersion.value],
+      mode: "game",
       ...versionSettings.value,
     },
   });
@@ -572,4 +585,26 @@ function startImport_wrapper() {
       importLoading.value = false;
     });
 }
+
+const setupModes: Array<{
+  id: string;
+  value: boolean;
+  title: string;
+  description: string;
+}> = [
+  {
+    id: "portable",
+    value: false,
+    title: "Portable",
+    description:
+      "This mode is for games that are designed to be launched directly from the install directory. Drop works best with these.",
+  },
+  {
+    id: "setup",
+    value: true,
+    title: "Installer",
+    description:
+      "Also known as 'setup-only', this mode is for installers that modify the system directly, and install to directories like Program Files.",
+  },
+];
 </script>

app/pages/admin/library/index.vue

@@ -158,7 +158,7 @@
             </dl>
             <div class="mt-4 flex flex-col gap-y-1">
               <NuxtLink
-                :href="`/admin/library/g/${entry.id}`"
+                :href="`/admin/library/${entry.urlPrefix}/${entry.id}`"
                 class="w-fit rounded-md bg-zinc-800 px-2.5 py-1.5 text-sm font-semibold text-white shadow-sm hover:bg-zinc-700 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
               >
                 <i18n-t
@@ -221,7 +221,7 @@
             </dl>
             <div class="mt-4 flex flex-col gap-y-1">
               <NuxtLink
-                :href="`/admin/library/r/${entry.id}`"
+                :href="`/admin/library/${entry.urlPrefix}/${entry.id}`"
                 class="w-fit rounded-md bg-zinc-800 px-2.5 py-1.5 text-sm font-semibold text-white shadow-sm hover:bg-zinc-700 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
               >
                 <i18n-t
@@ -261,7 +261,7 @@
                 </p>
                 <p class="mt-3 text-sm md:ml-6 md:mt-0">
                   <NuxtLink
-                    :href="`/admin/library/g/${entry.id}/import`"
+                    :href="`/admin/library/${entry.urlPrefix}/${entry.id}/import`"
                     class="whitespace-nowrap font-medium text-blue-400 hover:text-blue-500"
                   >
                     <i18n-t
@@ -406,6 +406,7 @@ function clientSideTransformation<T, V extends keyof T, K extends string>(
       toImport?: boolean;
       offline?: boolean;
     };
+    urlPrefix: string,
   }
 > {
   return values.map((e) => {
@@ -418,6 +419,7 @@ function clientSideTransformation<T, V extends keyof T, K extends string>(
         notifications: {
           offline: true,
         },
+        urlPrefix: type[0],
       };
     }
 
@@ -433,6 +435,7 @@ function clientSideTransformation<T, V extends keyof T, K extends string>(
       },
       hasNotifications: noVersions || toImport,
       status: "online" as const,
+      urlPrefix: type[0],
     };
   });
 }

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

@@ -1 +1,478 @@
-<template></template>
+<template>
+  <div class="flex flex-col gap-y-4">
+    <Listbox
+      as="div"
+      :model-value="currentlySelectedVersion"
+      class="max-w-lg"
+      @update:model-value="(value) => updateCurrentlySelectedVersion(value)"
+    >
+      <ListboxLabel class="block text-sm font-medium leading-6 text-zinc-100">{{
+        $t("library.admin.import.version.version")
+      }}</ListboxLabel>
+      <div class="relative mt-2">
+        <ListboxButton
+          class="relative w-full cursor-default rounded-md bg-zinc-950 py-1.5 pl-3 pr-10 text-left text-zinc-100 shadow-sm ring-1 ring-inset ring-zinc-800 focus:outline-none focus:ring-2 focus:ring-blue-600 sm:text-sm sm:leading-6"
+        >
+          <span v-if="currentlySelectedVersion != -1" class="block truncate">{{
+            versions[currentlySelectedVersion]
+          }}</span>
+          <span v-else class="block truncate text-zinc-600">{{
+            $t("library.admin.import.selectDir")
+          }}</span>
+          <span
+            class="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-2"
+          >
+            <ChevronUpDownIcon
+              class="h-5 w-5 text-gray-400"
+              aria-hidden="true"
+            />
+          </span>
+        </ListboxButton>
+
+        <transition
+          leave-active-class="transition ease-in duration-100"
+          leave-from-class="opacity-100"
+          leave-to-class="opacity-0"
+        >
+          <ListboxOptions
+            class="absolute z-10 mt-1 max-h-60 w-full overflow-auto rounded-md bg-zinc-900 py-1 text-base shadow-lg ring-1 ring-zinc-800 focus:outline-none sm:text-sm"
+          >
+            <ListboxOption
+              v-for="(version, versionIdx) in versions"
+              :key="version"
+              v-slot="{ active, selected }"
+              as="template"
+              :value="versionIdx"
+            >
+              <li
+                :class="[
+                  active ? 'bg-blue-600 text-white' : 'text-zinc-100',
+                  'relative cursor-default select-none py-2 pl-3 pr-9',
+                ]"
+              >
+                <span
+                  :class="[
+                    selected ? 'font-semibold' : 'font-normal',
+                    'block truncate',
+                  ]"
+                  >{{ version }}</span
+                >
+
+                <span
+                  v-if="selected"
+                  :class="[
+                    active ? 'text-white' : 'text-blue-600',
+                    'absolute inset-y-0 right-0 flex items-center pr-4',
+                  ]"
+                >
+                  <CheckIcon class="h-5 w-5" aria-hidden="true" />
+                </span>
+              </li>
+            </ListboxOption>
+          </ListboxOptions>
+        </transition>
+      </div>
+    </Listbox>
+
+    <div v-if="versionGuesses" class="flex flex-col gap-4">
+      <!-- version name -->
+      <div class="max-w-lg">
+        <label
+          for="startup"
+          class="block text-sm font-medium leading-6 text-zinc-100"
+          >Version name</label
+        >
+        <p class="text-zinc-400 text-xs">
+          Shown to users when selecting what version to install.
+        </p>
+        <div class="mt-2">
+          <input
+            id="name"
+            v-model="versionSettings.name"
+            name="name"
+            type="text"
+            required
+            placeholder="my version name"
+            class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-950 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-400 shadow-sm ring-1 ring-inset ring-zinc-800 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
+          />
+        </div>
+      </div>
+
+      <!-- install command -->
+      <div class="max-w-lg">
+        <label
+          for="startup"
+          class="block text-sm font-medium leading-6 text-zinc-100"
+          >{{ $t("library.admin.import.version.setupCmd") }}</label
+        >
+        <p class="text-zinc-400 text-xs">
+          {{ $t("library.admin.import.version.setupDesc") }}
+        </p>
+        <div class="mt-2">
+          <div
+            class="flex w-fit rounded-md shadow-sm bg-zinc-950 ring-1 ring-inset ring-zinc-800 focus-within:ring-2 focus-within:ring-inset focus-within:ring-blue-600"
+          >
+            <span
+              class="flex select-none items-center pl-3 text-zinc-500 sm:text-sm"
+            >
+              {{ $t("library.admin.import.version.installDir") }}
+            </span>
+            <PreloadSelector
+              :value="versionSettings.install"
+              :guesses="versionGuesses"
+              @update="(v) => updateInstallCommand(v)"
+            />
+            <input
+              id="startup"
+              v-model="versionSettings.installArgs"
+              type="text"
+              name="startup"
+              class="border-l border-zinc-700 block flex-1 border-0 py-1.5 pl-2 bg-transparent text-zinc-100 placeholder:text-zinc-400 focus:ring-0 sm:text-sm sm:leading-6"
+              placeholder="--setup"
+            />
+          </div>
+        </div>
+      </div>
+      <!-- launch commands -->
+      <div class="relative max-w-3xl">
+        <label
+          for="startup"
+          class="block text-sm font-medium leading-6 text-zinc-100"
+          >{{ $t("library.admin.import.version.launchCmd") }}</label
+        >
+        <p class="text-zinc-400 text-xs">
+          {{ $t("library.admin.import.version.launchDesc") }}
+        </p>
+        <div class="mt-2 ml-4 flex flex-col gap-y-2 items-start">
+          <div
+            v-for="(launch, launchIdx) in versionSettings.launches"
+            :key="launchIdx"
+            class="inline-flex items-center gap-x-2"
+          >
+            <input
+              id="launch-name"
+              v-model="launch.name"
+              type="text"
+              name="launch-name"
+              class="block w-full rounded-md border-0 py-1.5 px-3 bg-zinc-950 disabled:bg-zinc-900/80 text-zinc-100 disabled:text-zinc-400 shadow-sm ring-1 ring-inset ring-zinc-800 disabled:ring-zinc-800 placeholder:text-zinc-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:text-sm sm:leading-6"
+              placeholder="My Launch Command"
+            />
+
+            <div
+              class="flex w-full rounded-md shadow-sm bg-zinc-950 ring-1 ring-inset ring-zinc-800 focus-within:ring-2 focus-within:ring-inset focus-within:ring-blue-600"
+            >
+              <span
+                class="flex select-none items-center pl-3 text-zinc-500 sm:text-sm"
+                >{{ $t("library.admin.import.version.installDir") }}</span
+              >
+              <PreloadSelector
+                :value="launch.launchCommand"
+                :guesses="versionGuesses"
+                @update="(v) => updateLaunchCommand(launchIdx, v)"
+              />
+              <input
+                id="startup"
+                v-model="launch.launchArgs"
+                type="text"
+                name="startup"
+                class="border-l border-zinc-700 block flex-1 border-0 py-1.5 pl-2 bg-transparent text-zinc-100 placeholder:text-zinc-400 focus:ring-0 sm:text-sm sm:leading-6"
+                placeholder="--launch"
+              />
+            </div>
+            <button
+              class="transition bg-zinc-800 rounded-sm aspect-square p-1 text-zinc-600 hover:text-red-600 hover:bg-red-600/20"
+              @click="() => versionSettings.launches!.splice(launchIdx, 1)"
+            >
+              <TrashIcon class="size-5" />
+            </button>
+          </div>
+
+          <p
+            v-if="versionSettings.launches!.length == 0"
+            class="uppercase font-display font-bold text-zinc-500 text-xs"
+          >
+            No launch commands
+          </p>
+
+          <LoadingButton
+            :loading="false"
+            class="inline-flex items-center gap-x-4"
+            @click="
+              () =>
+                versionSettings.launches!.push({
+                  name: '',
+                  description: '',
+                  launchCommand: '',
+                  launchArgs: '',
+                })
+            "
+          >
+            Add new <PlusIcon class="size-5" />
+          </LoadingButton>
+        </div>
+      </div>
+      <!-- uninstall command -->
+      <div class="max-w-lg">
+        <label
+          for="startup"
+          class="block text-sm font-medium leading-6 text-zinc-100"
+          >Uninstall command</label
+        >
+        <p class="text-zinc-400 text-xs">
+          Executable to be run on uninstalling a game. Useful for installer-only
+          games.
+        </p>
+        <div class="mt-2">
+          <div
+            class="flex w-fit rounded-md shadow-sm bg-zinc-950 ring-1 ring-inset ring-zinc-800 focus-within:ring-2 focus-within:ring-inset focus-within:ring-blue-600"
+          >
+            <span
+              class="flex select-none items-center pl-3 text-zinc-500 sm:text-sm"
+            >
+              {{ $t("library.admin.import.version.installDir") }}
+            </span>
+            <PreloadSelector
+              :value="versionSettings.uninstall"
+              :guesses="versionGuesses"
+              @update="(v) => updateUninstallCommand(v)"
+            />
+            <input
+              id="startup"
+              v-model="versionSettings.uninstallArgs"
+              type="text"
+              name="startup"
+              class="border-l border-zinc-700 block flex-1 border-0 py-1.5 pl-2 bg-transparent text-zinc-100 placeholder:text-zinc-400 focus:ring-0 sm:text-sm sm:leading-6"
+              placeholder="--uninstall"
+            />
+          </div>
+        </div>
+      </div>
+
+      <PlatformSelector
+        v-model="versionSettings.platform"
+        class="max-w-lg"
+        :platforms="allPlatforms"
+      >
+        {{ $t("library.admin.import.version.platform") }}
+      </PlatformSelector>
+      <SwitchGroup as="div" class="flex items-center justify-between max-w-lg">
+        <span class="flex flex-grow flex-col">
+          <SwitchLabel
+            as="span"
+            class="text-sm font-medium leading-6 text-zinc-100"
+            passive
+          >
+            {{ $t("library.admin.import.version.updateMode") }}
+          </SwitchLabel>
+          <SwitchDescription as="span" class="text-sm text-zinc-400">
+            {{ $t("library.admin.import.version.updateModeDesc") }}
+          </SwitchDescription>
+        </span>
+        <Switch
+          :model-value="versionSettings.delta || false"
+          :class="[
+            versionSettings.delta ? 'bg-blue-600' : 'bg-zinc-800',
+            'relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-blue-600 focus:ring-offset-2',
+          ]"
+          @update:model-value="(v) => (versionSettings.delta = v)"
+        >
+          <span
+            aria-hidden="true"
+            :class="[
+              versionSettings.delta ? 'translate-x-5' : 'translate-x-0',
+              'pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out',
+            ]"
+          />
+        </Switch>
+      </SwitchGroup>
+      <Disclosure v-slot="{ open }" as="div" class="py-2 max-w-lg">
+        <dt>
+          <DisclosureButton
+            class="border-b border-zinc-600 pb-2 flex w-full items-start justify-between text-left text-zinc-100"
+          >
+            <span class="text-base/7 font-semibold">
+              {{ $t("library.admin.import.version.advancedOptions") }}
+            </span>
+            <span class="ml-6 flex h-7 items-center">
+              <ChevronUpIcon v-if="!open" class="size-6" aria-hidden="true" />
+              <ChevronDownIcon v-else class="size-6" aria-hidden="true" />
+            </span>
+          </DisclosureButton>
+        </dt>
+        <DisclosurePanel
+          as="dd"
+          class="bg-zinc-950/30 p-3 rounded-b-lg mt-2 flex flex-col gap-y-4"
+        >
+          <!-- UMU launcher configuration -->
+
+          <div class="text-zinc-400">
+            {{ $t("library.admin.import.version.noAdv") }}
+          </div>
+        </DisclosurePanel>
+      </Disclosure>
+
+      <LoadingButton
+        class="w-fit"
+        :loading="importLoading"
+        @click="startImport_wrapper"
+      >
+        {{ $t("library.admin.import.import") }}
+      </LoadingButton>
+      <div v-if="importError" class="mt-4 w-fit rounded-md bg-red-600/10 p-4">
+        <div class="flex">
+          <div class="flex-shrink-0">
+            <XCircleIcon class="h-5 w-5 text-red-600" aria-hidden="true" />
+          </div>
+          <div class="ml-3">
+            <h3 class="text-sm font-medium text-red-600">
+              {{ importError }}
+            </h3>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      v-else-if="currentlySelectedVersion != -1"
+      role="status"
+      class="inline-flex text-zinc-100 font-display font-semibold items-center gap-x-4"
+    >
+      {{ $t("library.admin.import.version.loadingVersion") }}
+      <svg
+        aria-hidden="true"
+        class="w-6 h-6 text-transparent animate-spin fill-white"
+        viewBox="0 0 100 101"
+        fill="none"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z"
+          fill="currentColor"
+        />
+        <path
+          d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z"
+          fill="currentFill"
+        />
+      </svg>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {
+  Listbox,
+  ListboxButton,
+  ListboxLabel,
+  ListboxOption,
+  ListboxOptions,
+  Switch,
+  SwitchDescription,
+  SwitchGroup,
+  SwitchLabel,
+  Disclosure,
+  DisclosureButton,
+  DisclosurePanel,
+} from "@headlessui/vue";
+import { XCircleIcon } from "@heroicons/vue/16/solid";
+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 { ImportRedistVersion } from "~~/server/api/v1/admin/import/version/index.post";
+
+definePageMeta({
+  layout: "admin",
+});
+
+const router = useRouter();
+const { t } = useI18n();
+const route = useRoute();
+const redistId = route.params.id.toString();
+const versions = await $dropFetch(
+  `/api/v1/admin/import/version?id=${encodeURIComponent(redistId)}&mode=redist`,
+);
+const userPlatforms = await useAdminPlatforms();
+const allPlatforms = renderPlatforms(userPlatforms);
+const currentlySelectedVersion = ref(-1);
+
+const versionSettings = ref<Partial<ImportRedistVersion>>({
+  launches: [],
+});
+
+const versionGuesses =
+  ref<
+    Array<SerializeObject<{ platform: PlatformRenderable; filename: string }>>
+  >();
+
+function updateLaunchCommand(idx: number, value: string) {
+  versionSettings.value.launches![idx].launchCommand = value;
+  autosetPlatform(value);
+}
+
+function updateInstallCommand(value: string) {
+  versionSettings.value.install = value;
+  autosetPlatform(value);
+}
+
+function updateUninstallCommand(value: string) {
+  versionSettings.value.uninstall = value;
+  autosetPlatform(value);
+}
+
+function autosetPlatform(value: string) {
+  if (!versionGuesses.value) return;
+  if (versionSettings.value.platform) return;
+  const guessIndex = versionGuesses.value.findIndex(
+    (e) => e.filename === value,
+  );
+  if (guessIndex == -1) return;
+  versionSettings.value.platform =
+    versionGuesses.value[guessIndex].platform.param;
+}
+
+const importLoading = ref(false);
+const importError = ref<string | undefined>();
+
+async function updateCurrentlySelectedVersion(value: number) {
+  if (currentlySelectedVersion.value == value) return;
+  currentlySelectedVersion.value = value;
+  const version = versions[currentlySelectedVersion.value];
+  const options = await $dropFetch(
+    `/api/v1/admin/import/version/preload?id=${encodeURIComponent(
+      redistId,
+    )}&version=${encodeURIComponent(version)}&mode=redist`,
+  );
+  versionGuesses.value = options.map((e) => ({
+    ...e,
+    platform: allPlatforms.find((v) => v.param === e.platform)!,
+  }));
+  versionSettings.value.name = version;
+}
+
+async function startImport() {
+  if (!versionSettings.value) return;
+  const taskId = await $dropFetch("/api/v1/admin/import/version", {
+    method: "POST",
+    body: {
+      id: redistId,
+      version: versions[currentlySelectedVersion.value],
+      mode: "redist",
+      ...versionSettings.value,
+    },
+  });
+  router.push(`/admin/task/${taskId.taskId}`);
+}
+
+function startImport_wrapper() {
+  importLoading.value = true;
+  startImport()
+    .catch((error) => {
+      importError.value = error.message ?? t("errors.unknown");
+    })
+    .finally(() => {
+      importLoading.value = false;
+    });
+}
+</script>

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

@@ -18,99 +18,12 @@
         </button>
       </div>
     </div>
-    <div class="mt-8 flow-root">
+    <div class="mt-4 flow-root">
-      <div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
+      <SourceTable
-        <div class="inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8">
+        :sources="sources"
-          <table class="min-w-full divide-y divide-zinc-700">
+        :edit-source="edit"
-            <thead>
+        :delete-source="deleteSource"
-              <tr>
-                <th
-                  scope="col"
-                  class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-zinc-100 sm:pl-3"
-                >
-                  {{ $t("common.name") }}
-                </th>
-                <th
-                  scope="col"
-                  class="px-3 py-3.5 text-left text-sm font-semibold text-zinc-100"
-                >
-                  {{ $t("type") }}
-                </th>
-                <th
-                  scope="col"
-                  class="px-3 py-3.5 text-left text-sm font-semibold text-zinc-100"
-                >
-                  {{ $t("library.admin.sources.working") }}
-                </th>
-                <th
-                  scope="col"
-                  class="px-3 py-3.5 text-left text-sm font-semibold text-zinc-100"
-                >
-                  {{ $t("options") }}
-                </th>
-                <th scope="col" class="relative py-3.5 pl-3 pr-4 sm:pr-3">
-                  <span class="sr-only">{{ $t("common.edit") }}</span>
-                </th>
-              </tr>
-            </thead>
-            <tbody>
-              <tr
-                v-for="(source, sourceIdx) in sources"
-                :key="source.id"
-                class="even:bg-zinc-800"
-              >
-                <td
-                  class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-zinc-100 sm:pl-3"
-                >
-                  {{ source.name }}
-                </td>
-                <td
-                  class="whitespace-nowrap px-3 py-4 text-sm text-zinc-400 inline-flex gap-x-1 items-center"
-                >
-                  <component
-                    :is="optionsMetadata[source.backend].icon"
-                    class="size-5 text-zinc-400"
       />
-                  {{ optionsMetadata[source.backend].title }}
-                </td>
-                <td class="whitespace-nowrap px-3 py-4 text-sm text-zinc-400">
-                  <CheckIcon
-                    v-if="source.working"
-                    class="size-5 text-green-500"
-                  />
-                  <XMarkIcon v-else class="size-5 text-red-500" />
-                </td>
-                <td class="whitespace-nowrap px-3 py-4 text-sm text-zinc-400">
-                  {{ source.options }}
-                </td>
-                <td
-                  class="relative whitespace-nowrap py-4 pl-3 pr-3 text-right text-sm font-medium space-x-2"
-                >
-                  <button
-                    class="text-blue-500 hover:text-blue-400"
-                    @click="() => edit(sourceIdx)"
-                  >
-                    {{ $t("common.edit") }}
-                    <span class="sr-only">
-                      {{ $t("chars.srComma", [source.name]) }}
-                    </span>
-                  </button>
-
-                  <button
-                    class="text-red-500 hover:text-red-400"
-                    @click="() => deleteSource(sourceIdx)"
-                  >
-                    {{ $t("delete") }}
-                    <span class="sr-only">
-                      {{ $t("chars.srComma", [source.name]) }}
-                    </span>
-                  </button>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </div>
     </div>
 
     <ModalTemplate v-model="actionSourceOpen">
@@ -313,7 +226,7 @@ import {
   XCircleIcon,
   ArrowTopRightOnSquareIcon,
 } from "@heroicons/vue/20/solid";
-import { BackwardIcon, CheckIcon, XMarkIcon } from "@heroicons/vue/24/outline";
+import { BackwardIcon } from "@heroicons/vue/24/outline";
 import { FetchError } from "ofetch";
 import type { Component } from "vue";
 import type { LibraryBackend } from "~~/prisma/client/enums";

app/pages/admin/task/[id]/index.vue

@@ -53,18 +53,7 @@
           :log="parseTaskLog(task.log.at(-(idx + 1)))"
         />
       </div>
-      <div class="relative h-5 rounded-xl bg-zinc-950 overflow-hidden">
+      <ProgressBar :percentage="task.progress" />
-        <div
-          :style="{ width: `${task.progress}%` }"
-          class="transition-all bg-blue-600 h-full"
-        />
-        <span
-          class="absolute inset-0 flex items-center justify-center text-blue-200 text-sm font-bold font-display"
-          >{{
-            $t("tasks.admin.progress", [Math.round(task.progress * 10) / 10])
-          }}</span
-        >
-      </div>
     </div>
     <div v-else role="status" class="w-full flex items-center justify-center">
       <svg

app/pages/library/game/[id]/index.vue

@@ -72,7 +72,7 @@
                 {{ $t("store.images") }}
               </h2>
               <div class="relative">
-                <VueCarousel :items-to-show="1">
+                <VueCarousel :items-to-show="1" :wrap-around="true">
                   <VueSlide
                     v-for="image in game.mImageCarouselObjectIds"
                     :key="image"

app/pages/store/[id]/index.vue

@@ -93,6 +93,27 @@
                   >
                 </td>
               </tr>
+              <tr>
+                <td
+                  class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-zinc-100 sm:pl-3"
+                >
+                  {{ $t("store.size") }}
+                </td>
+                <td
+                  v-if="size"
+                  class="whitespace-nowrap inline-flex gap-x-4 px-3 py-4 text-sm text-zinc-400"
+                >
+                  {{ formatBytes(size) }}
+                </td>
+                <td
+                  v-else
+                  class="whitespace-nowrap inline-flex gap-x-4 px-3 py-4 text-sm text-zinc-400 italic"
+                >
+                  <span class="font-semibold text-blue-600">{{
+                    $t("store.commingSoon")
+                  }}</span>
+                </td>
+              </tr>
               <tr>
                 <td
                   class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-zinc-100 sm:pl-3"
@@ -190,7 +211,7 @@
             {{ game.mShortDescription }}
           </p>
           <div class="mt-6 py-4 rounded">
-            <VueCarousel :items-to-show="1">
+            <VueCarousel :items-to-show="1" :wrap-around="true">
               <VueSlide
                 v-for="image in game.mImageCarouselObjectIds"
                 :key="image"
@@ -252,6 +273,7 @@
 import { ArrowTopRightOnSquareIcon } from "@heroicons/vue/24/outline";
 import { StarIcon } from "@heroicons/vue/24/solid";
 import { micromark } from "micromark";
+import { formatBytes } from "~~/server/internal/utils/files";
 
 const route = useRoute();
 const gameId = route.params.id?.toString();
@@ -263,8 +285,7 @@ if (!gameId)
   });
 
 const user = useUser();
-
+const { game, rating, platforms, size } = await $dropFetch(`/api/v1/games/${gameId}`);
-const { game, rating, platforms } = await $dropFetch(`/api/v1/games/${gameId}`);
 
 // Preview description (first 30 lines)
 const showPreview = ref(true);

app/utils/array.ts

@@ -0,0 +1,6 @@
+export const sum = (array: number[]) =>
+  array.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
+
+export function lastItem<T>(array: T[]) {
+  return array[array.length - 1];
+}

app/utils/colors.ts

@@ -0,0 +1,76 @@
+export const CHART_COLOURS = {
+  // Bar colours
+  red: {
+    fill: "fill-red-700",
+    bg: "bg-red-700",
+  },
+  orange: {
+    fill: "fill-orange-800",
+    bg: "bg-orange-800",
+  },
+  blue: {
+    fill: "fill-blue-900",
+    bg: "bg-blue-900",
+  },
+
+  // Pie colours
+  lightblue: {
+    fill: "fill-blue-400",
+    bg: "bg-blue-400",
+  },
+  dropblue: {
+    fill: "fill-blue-600",
+    bg: "bg-blue-600",
+  },
+  green: {
+    fill: "fill-green-500",
+    bg: "bg-green-500",
+  },
+  yellow: {
+    fill: "fill-yellow-800",
+    bg: "bg-yellow-800",
+  },
+  purple: {
+    fill: "fill-purple-500",
+    bg: "bg-purple-500",
+  },
+  zinc: {
+    fill: "fill-zinc-950",
+    bg: "bg-zinc-950",
+  },
+  pink: {
+    fill: "fill-pink-800",
+    bg: "bg-pink-800",
+  },
+
+  lime: {
+    fill: "fill-lime-600",
+    bg: "bg-lime-600",
+  },
+  emerald: {
+    fill: "fill-emerald-500",
+    bg: "bg-emerald-500",
+  },
+  slate: {
+    fill: "fill-slate-800",
+    bg: "bg-slate-800",
+  },
+};
+export const PIE_COLOURS: ChartColour[] = [
+  "lightblue",
+  "dropblue",
+  "purple",
+  "emerald",
+];
+
+export type ChartColour = keyof typeof CHART_COLOURS;
+
+export function getBarColor(percentage: number): ChartColour {
+  if (percentage <= 70) {
+    return "blue";
+  }
+  if (percentage > 70 && percentage <= 90) {
+    return "orange";
+  }
+  return "red";
+}

app/utils/tuple.ts

@@ -0,0 +1,13 @@
+export default class Tuple {
+  x: number;
+  y: number;
+
+  constructor(x: number, y: number) {
+    this.x = x;
+    this.y = y;
+  }
+
+  toString() {
+    return `${this.x},${this.y}`;
+  }
+}

components/GameEditor/Version.vue

@@ -0,0 +1,206 @@
+<!-- eslint-disable vue/no-v-html -->
+<template>
+  <div v-if="game && unimportedVersions">
+    <div class="grow flex flex-row gap-y-8">
+      <div class="grow w-full h-full px-6 py-4 flex flex-col"></div>
+      <div
+        class="lg:overflow-y-auto lg:border-l lg:border-zinc-800 lg:block lg:inset-y-0 lg:z-50 lg:w-[30vw] flex flex-col gap-y-8 px-6 py-4"
+      >
+        <!-- version manager -->
+        <div>
+          <!-- version priority -->
+          <div>
+            <div class="border-b border-zinc-800 pb-3">
+              <div
+                class="flex flex-wrap items-center justify-between sm:flex-nowrap"
+              >
+                <h3
+                  class="text-base font-semibold font-display leading-6 text-zinc-100"
+                >
+                  {{ $t("library.admin.versionPriority") }}
+
+                  <!-- import games button -->
+
+                  <NuxtLink
+                    :href="canImport ? `/admin/library/${game.id}/import` : ''"
+                    type="button"
+                    :class="[
+                      canImport
+                        ? 'bg-blue-600 hover:bg-blue-700'
+                        : 'bg-blue-800/50',
+                      'inline-flex w-fit items-center gap-x-2 rounded-md  px-3 py-1 text-sm font-semibold font-display text-white shadow-sm  focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600',
+                    ]"
+                  >
+                    {{
+                      canImport
+                        ? $t("library.admin.import.version.import")
+                        : $t("library.admin.import.version.noVersions")
+                    }}
+                  </NuxtLink>
+                </h3>
+              </div>
+            </div>
+
+            <div class="mt-4 text-center w-full text-sm text-zinc-600">
+              {{ $t("lowest") }}
+            </div>
+            <draggable
+              :list="game.versions"
+              handle=".handle"
+              class="mt-2 space-y-4"
+              @update="() => updateVersionOrder()"
+            >
+              <template
+                #item="{ element: item }: { element: GameVersionModelWithSize }"
+              >
+                <div
+                  class="w-full inline-flex items-center px-4 py-2 bg-zinc-800 rounded justify-between w-full flex"
+                >
+                  <div class="text-zinc-100 font-semibold flex-none">
+                    {{ item.versionName }}
+                  </div>
+                  <div
+                    class="text-right text-zinc-400 text-xs font-normal flex-auto pr-4"
+                  >
+                    {{ item.size && formatBytes(item.size) }}
+                  </div>
+                  <div class="text-zinc-400">
+                    {{ item.delta ? $t("library.admin.version.delta") : "" }}
+                  </div>
+                  <div class="inline-flex items-center gap-x-2">
+                    <component
+                      :is="PLATFORM_ICONS[item.platform]"
+                      class="size-6 text-blue-600"
+                    />
+                    <Bars3Icon
+                      class="cursor-move w-6 h-6 text-zinc-400 handle"
+                    />
+                    <button @click="() => deleteVersion(item.versionName)">
+                      <TrashIcon class="w-5 h-5 text-red-600" />
+                    </button>
+                  </div>
+                </div>
+              </template>
+            </draggable>
+            <div
+              v-if="game.versions.length == 0"
+              class="text-center font-bold text-zinc-400 my-3"
+            >
+              {{ $t("library.admin.version.noVersionsAdded") }}
+            </div>
+            <div class="mt-2 text-center w-full text-sm text-zinc-600">
+              {{ $t("highest") }}
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div v-else class="grow w-full flex items-center justify-center">
+    <div class="flex flex-col items-center">
+      <ExclamationCircleIcon
+        class="h-12 w-12 text-red-600"
+        aria-hidden="true"
+      />
+      <div class="mt-3 text-center sm:mt-5">
+        <h1 class="text-3xl font-semibold font-display leading-6 text-zinc-100">
+          {{ $t("library.admin.offlineTitle") }}
+        </h1>
+        <div class="mt-4">
+          <p class="text-sm text-zinc-400 max-w-md">
+            {{ $t("library.admin.offline") }}
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { GameModel, GameVersionModel } from "~/prisma/client/models";
+import { Bars3Icon, TrashIcon } from "@heroicons/vue/24/solid";
+import type { SerializeObject } from "nitropack";
+import type { H3Error } from "h3";
+import { ExclamationCircleIcon } from "@heroicons/vue/24/outline";
+import { formatBytes } from "~/server/internal/utils/files";
+
+// TODO implement UI for this page
+
+const props = defineProps<{ unimportedVersions: string[] }>();
+
+const { t } = useI18n();
+
+const hasDeleted = ref(false);
+
+const canImport = computed(
+  () => hasDeleted.value || props.unimportedVersions.length > 0,
+);
+
+type GameVersionModelWithSize = GameVersionModel & { size: number };
+
+type GameAndVersions = GameModel & {
+  versions: GameVersionModelWithSize[];
+};
+const game = defineModel<SerializeObject<GameAndVersions>>() as Ref<
+  SerializeObject<GameAndVersions>
+>;
+if (!game.value)
+  throw createError({
+    statusCode: 500,
+    statusMessage: "Game not provided to editor component",
+  });
+
+async function updateVersionOrder() {
+  try {
+    const newVersions = await $dropFetch("/api/v1/admin/game/version", {
+      method: "PATCH",
+      body: {
+        id: game.value.id,
+        versions: game.value.versions.map((e) => e.versionName),
+      },
+    });
+    game.value.versions = newVersions;
+  } catch (e) {
+    createModal(
+      ModalType.Notification,
+      {
+        title: t("errors.version.order.title"),
+        description: t("errors.version.order.desc", {
+          error: (e as H3Error)?.statusMessage ?? t("errors.unknown"),
+        }),
+        buttonText: t("common.close"),
+      },
+      (e, c) => c(),
+    );
+  }
+}
+
+async function deleteVersion(versionName: string) {
+  try {
+    await $dropFetch("/api/v1/admin/game/version", {
+      method: "DELETE",
+      body: {
+        id: game.value.id,
+        versionName: versionName,
+      },
+    });
+    game.value.versions.splice(
+      game.value.versions.findIndex((e) => e.versionName === versionName),
+      1,
+    );
+    hasDeleted.value = true;
+  } catch (e) {
+    createModal(
+      ModalType.Notification,
+      {
+        title: t("errors.version.delete.title"),
+        description: t("errors.version.delete.desc", {
+          error: (e as H3Error)?.statusMessage ?? t("errors.unknown"),
+        }),
+        buttonText: t("common.close"),
+      },
+      (e, c) => c(),
+    );
+  }
+}
+</script>

eslint.config.mjs

@@ -19,7 +19,7 @@ export default withNuxt([
         },
       ],
       "@intlify/vue-i18n/no-missing-keys": "error",
-      "vue/multi-word-component-names": "ignore",
+      "vue/multi-word-component-names": "off",
     },
     settings: {
       "vue-i18n": {

i18n/locales/en_us.json

@@ -117,7 +117,9 @@
     "servers": "Servers",
     "srLoading": "Loading…",
     "tags": "Tags",
-    "today": "Today"
+    "today": "Today",
+    "labelValueColon": "{label}: {value}",
+    "noData": "No data"
   },
   "delete": "Delete",
   "drop": {
@@ -268,6 +270,8 @@
         "store": "Store",
         "tokens": "API tokens"
       },
+      "home": "Home",
+      "library": "Library",
       "tasks": "Tasks",
       "users": "Users"
     },
@@ -276,7 +280,24 @@
   },
   "helpUsTranslate": "Help us translate Drop {arrow}",
   "highest": "highest",
-  "home": "Home",
+  "home": {
+    "admin": {
+      "title": "Home",
+      "subheader": "Instance summary",
+      "games": "Games",
+      "librarySources": "Library sources",
+      "version": "Version",
+      "activeInactiveUsers": "Active/inactive users",
+      "activeUsers": "Active users",
+      "inactiveUsers": "Inactive users",
+      "goToUsers": "Go to users",
+      "users": "Users",
+      "biggestGamesToDownload": "Biggest games to download",
+      "latestVersionOnly": "Latest version only",
+      "biggestGamesOnServer": "Biggest games on server",
+      "allVersionsCombined": "All versions combined"
+    }
+  },
   "library": {
     "addGames": "All Games",
     "addToLib": "Add to Library",
@@ -292,6 +313,7 @@
         "deleteImage": "Delete image",
         "editGameDescription": "Game Description",
         "editGameName": "Game Name",
+        "editReleaseDate": "Release Date",
         "imageCarousel": "Image Carousel",
         "imageCarouselDescription": "Customise what images and what order are shown on the store page.",
         "imageCarouselEmpty": "No images added to the carousel yet.",
@@ -423,7 +445,11 @@
         "namePlaceholder": "My New Source",
         "sources": "Library Sources",
         "typeDesc": "The type of your source. Changes the required options.",
-        "working": "Working?"
+        "working": "Working?",
+        "freeSpace": "Free space",
+        "totalSpace": "Total space",
+        "utilizationPercentage": "Utilization percentage",
+        "percentage": "{number}%"
       },
       "subheader": "As you add folders to your library sources, Drop will detect it and prompt you to import it. Each game needs to be imported before you can import a version.",
       "title": "Libraries",
@@ -553,6 +579,7 @@
     "openFeatured": "Star games in Admin Library {arrow}",
     "platform": "Platform | Platform | Platforms",
     "publishers": "Publishers | Publisher | Publishers",
+    "size": "Size",
     "rating": "Rating",
     "readLess": "Click to read less",
     "readMore": "Click to read more",

i18n/locales/fr.json

@@ -3,16 +3,16 @@
     "devices": {
       "capabilities": "Capacités",
       "lastConnected": "Dernière Connexion",
-      "noDevices": "Aucun appareil n'est connecté à vôtre compte.",
+      "noDevices": "Aucun appareil connecté à vôtre compte.",
       "platform": "Plateforme",
       "revoke": "Révoquer",
       "subheader": "Gérer les appareils authorisés à accéder à votre compte Drop.",
       "title": "Appareils"
     },
     "notifications": {
-      "all": "Tout voir {arrow}",
+      "all": "Voir tout {arrow}",
       "desc": "Voir et gérer vos notifications.",
-      "markAllAsRead": "Tout marqué comme lu",
+      "markAllAsRead": "Marquer tout comme lu",
       "markAsRead": "Marquer comme lu",
       "none": "Pas de notification",
       "notifications": "Notifications",
@@ -62,6 +62,7 @@
       "description": "Utiliser un code pour vous connecter à votre client Drop si vous ne pouvez pas ouvrir un navigateur web sur votre appareil.",
       "title": "Connecter votre client Drop"
     },
+    "confirmPassword": "Confirmez @:auth.password",
     "displayName": "Nom d'Affichage",
     "email": "Email",
     "password": "Mot de passe",
@@ -147,6 +148,7 @@
     "auth": {
       "disabled": "Compte invalide or désactivé. Merci de contacter l'administrateur du serveur.",
       "invalidInvite": "Invitation invalide ou expirée",
+      "invalidPassState": "Le mot de passe enregistré est invalide. Merci de contacter l'administrateur du serveur.",
       "invalidUserOrPass": "Nom d'utilisateur ou password invalide.",
       "inviteIdRequired": "id est requis pour récupérer l'invitation",
       "method": {
@@ -155,6 +157,10 @@
       "usernameTaken": "Nom d'utilisateur déjà pris."
     },
     "backHome": "{arrow} Retour a l'accueil",
+    "externalUrl": {
+      "subtitle": "Ce message n'est visible qu'aux administrateurs.",
+      "title": "Accès via une EXTERNAL_URL différente. Veuillez consulter la documentation."
+    },
     "game": {
       "banner": {
         "description": "Drop a échoué a mettre à jour l'image de la bannière : {0}",
@@ -215,6 +221,7 @@
     "revokeClient": "Échec de la révocation du client",
     "revokeClientFull": "Échec de la revocation du client {0}",
     "signIn": "Se connecter {arrow}",
+    "support": "Assistance Discord",
     "unknown": "Une erreur inconnue est survenue",
     "upload": {
       "description": "Drop n'a pas pu uploader le fichier : {0}",
@@ -254,7 +261,11 @@
     "admin": {
       "admin": "Administration",
       "metadata": "Méta",
-      "settings": "Paramètres",
+      "settings": {
+        "store": "Store",
+        "title": "Paramètres",
+        "tokens": "API tokens"
+      },
       "tasks": "Tâches",
       "users": "Utilisateurs"
     },
@@ -327,6 +338,8 @@
         },
         "withoutMetadata": "Importer sans les données méta"
       },
+      "libraryHint": "Pas de bibliothèque configurée.",
+      "libraryHintDocsLink": "Qu'est-ce que cela veut dire ? {arrow}",
       "metadata": {
         "companies": {
           "action": "Gérer {arrow}",
@@ -340,15 +353,25 @@
           "description": "Les sociétés organisent les jeux par qui les a développer ou éditer.",
           "editor": {
             "action": "Ajouter un jeu {plus}",
+            "descriptionPlaceholder": "{'<'}description{'>'}",
             "developed": "Développé",
             "libraryDescription": "Ajouter, supprimer ou personnaliser ce que cette société a développé et/ou publié.",
             "libraryTitle": "Bibliothèque de jeux",
             "noDescription": "(pas de description)",
             "published": "Publié",
             "uploadBanner": "Uploader bannière",
-            "uploadIcon": "Uplader icône"
+            "uploadIcon": "Uplader icône",
+            "websitePlaceholder": "{'<'}site web{'>'}"
           },
           "modals": {
+            "createDescription": "Créez une société pour mieux organizer vos jeux.",
+            "createFieldDescription": "Description de la Société",
+            "createFieldDescriptionPlaceholder": "Un petit studio indépendant qui...",
+            "createFieldName": "Nom de la société",
+            "createFieldNamePlaceholder": "Ma nouvelle société...",
+            "createFieldWebsite": "Site web de la société",
+            "createFieldWebsitePlaceholder": "https://exemple com/",
+            "createTitle": "Créer une société",
             "nameDescription": "Éditer le nom de la société. Ce nom est utilisé pour trouver les jeux nouvellement importés.",
             "nameTitle": "Éditer le nom de la société",
             "shortDeckDescription": "Éditer la description de la company. Cela n'affecte pas la description longue (markdown).",
@@ -384,12 +407,15 @@
         "create": "Créer une source",
         "createDesc": "Drop va utiliser cette source pour accéder à votre bibliothèque de jeux, et les rendre disponible.",
         "desc": "Configurer vos sources de bibliothèques où Drop va regarder pour les nouveaux jeux et versions à importer.",
+        "documentationLink": "Documentation {arrow}",
         "edit": "Éditer la source",
         "fsDesc": "Importe les jeux à partir d'un chemin d'accès sur le disque. Cela requière une structure des dossiers basées sur la version, et qui supporte les jeux archivés.",
         "fsFlatDesc": "Importe les jeux à partir d'un chemin d’accès sur le disque, mais sans le sous-dossier version séparé. Utile pour migrer une bibliothèque vers Drop.",
+        "fsFlatTitle": "Compatibilité",
         "fsPath": "Chemin d’accès",
         "fsPathDesc": "Un chemin d’accès absolu à votre bibliothèque de jeux.",
         "fsPathPlaceholder": "/mnt/jeux",
+        "fsTitle": "Drop-style",
         "link": "Sources {arrow}",
         "nameDesc": "Le nom de votre source, pour référence.",
         "namePlaceholder": "Mes Nouvelle Source",
@@ -447,6 +473,7 @@
     "checkLater": "Vérifier plus tard pour les mises à jour.",
     "delete": "Supprimer l'Article",
     "filter": {
+      "all": "Tous les temps",
       "month": "Ce mois",
       "week": "Cette semaine",
       "year": "Cette année"
@@ -509,15 +536,19 @@
   "store": {
     "about": "À propos",
     "commingSoon": "prochainement",
+    "developers": "Développeurs | Développeur | Développeurs",
     "exploreMore": "Explorer plus {arrow}",
     "featured": "Mis en avant",
     "images": "Images de Jeux",
+    "lookAt": "Découvrez le maintenant",
     "noDevelopers": "Pas de développeur",
-    "noGame": "pas de jeu",
+    "noFeatured": "PAS DE JEU MIS EN AVANT",
+    "noGame": "PAS DE JEU",
     "noImages": "Pas d'image",
     "noPublishers": "Pas d'éditeur.",
     "noTags": "Pas de tag",
     "openAdminDashboard": "Ouvrir dans le Tableau de Bord d'Administration",
+    "openFeatured": "Mettez des étoiles aux jeux dans l'administration de la bibliothèque {arrow}",
     "platform": "Plateforme | Plateforme | Plateformes",
     "publishers": "Éditeurs | Éditeur | Éditeurs",
     "rating": "Note",
@@ -544,7 +575,9 @@
       "back": "{arrow} Retour aux Tâches",
       "completedTasksTitle": "Tâches complétées",
       "dailyScheduledTitle": "Tâches quotidiennes planifiées",
+      "execute": "{arrow} Exécuter",
       "noTasksRunning": "Pas de tâche en cours",
+      "progress": "{0]%",
       "runningTasksTitle": "Tâches en cours d'exécution",
       "scheduled": {
         "checkUpdateDescription": "Vérifier si Drop a une mise à jour.",
@@ -588,6 +621,7 @@
         "description": "Drop supporte une variété de \"mécanismes d'authentification\". Lorsque vous les activez ou les désactivez, ils sont affichés sur la page de connection pour que les utilisateurs puissent les sélectionner. Cliquer sur le menu à points pour configurer le mécanisme d'authentification.",
         "disabled": "Désactivé",
         "enabled": "Activé",
+        "enabledKey": "Activée ?",
         "oidc": "OpenID Connect",
         "simple": "Simple (nom d'utilisateur/mot de passe)",
         "srOpenOptions": "Ouvrir les options",
@@ -605,7 +639,7 @@
         "createInvitation": "Créer invitation",
         "description": "L'authentification simple utilise un système d'invitations pour créer les utilisateurs. Tu peux créer une invitation et optionnellement spécifier le nom d'utilisateur ou email de cet utilisateur, et un lien magique sera généré un lien magique qui peut être utilisé pour créer le compte.",
         "expires": "Expire : {expiry}",
-        "invitationTitle": "invitations",
+        "invitationTitle": "Invitations",
         "invite3Days": "3 jours",
         "invite6Months": "6 mois",
         "inviteAdminSwitchDescription": "Créer cet utilisateur en tant qu'adminstrateur",

nuxt.config.ts

@@ -263,6 +263,7 @@ export default defineNuxtConfig({
           "https://www.giantbomb.com",
           "https://images.pcgamingwiki.com",
           "https://images.igdb.com",
+          "https://*.steamstatic.com",
         ],
       },
       strictTransportSecurity: false,

package.json

@@ -21,7 +21,7 @@
   },
   "dependencies": {
     "@discordapp/twemoji": "^16.0.1",
-    "@drop-oss/droplet": "3.0.1",
+    "@drop-oss/droplet": "3.2.0",
     "@headlessui/vue": "^1.7.23",
     "@heroicons/vue": "^2.1.5",
     "@nuxt/fonts": "^0.11.0",
@@ -32,7 +32,7 @@
     "@vueuse/nuxt": "13.6.0",
     "argon2": "^0.43.0",
     "arktype": "^2.1.10",
-    "axios": "^1.7.7",
+    "axios": "^1.12.0",
     "bcryptjs": "^3.0.2",
     "cheerio": "^1.0.0",
     "cookie-es": "^2.0.0",

pnpm-lock.yaml

@@ -12,8 +12,8 @@ importers:
         specifier: ^16.0.1
         version: 16.0.1
       '@drop-oss/droplet':
-        specifier: 3.0.1
+        specifier: 3.2.0
-        version: 3.0.1
+        version: 3.2.0
       '@headlessui/vue':
         specifier: ^1.7.23
         version: 1.7.23(vue@3.5.21(typescript@5.9.2))
@@ -45,7 +45,7 @@ importers:
         specifier: ^2.1.10
         version: 2.1.22
       axios:
-        specifier: ^1.7.7
+        specifier: ^1.12.0
         version: 1.12.2
       bcryptjs:
         specifier: ^3.0.2
@@ -387,74 +387,83 @@ packages:
   '@discordapp/twemoji@16.0.1':
     resolution: {integrity: sha512-figLiBWzjS5cyrAjLaGjM8AAaowO3qvK8rg5bA2dElB4qsaPMvBVlFDMO2d3x+nC1igt7kgWH4dvNmvvUHUF8w==}
 
-  '@drop-oss/droplet-darwin-arm64@3.0.1':
+  '@drop-oss/droplet-darwin-arm64@3.2.0':
-    resolution: {integrity: sha512-LXe8vsXUBL96boI78H6oXpSaPVwF4cCwJ5l/QVtsOWMebNo6gk9wICDZ+5IoR/Ol32t1a1lk+DjbD1zeGenPxg==}
+    resolution: {integrity: sha512-dH/vRFxuLjOzYBBvDG140wKcx4LmFxBJ5iTjZrWzV641wiRjx8B38niWXuqZ2ZADkCL4muOvgRGFJ4W1N/j6jQ==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [darwin]
 
-  '@drop-oss/droplet-darwin-universal@3.0.1':
+  '@drop-oss/droplet-darwin-universal@3.2.0':
-    resolution: {integrity: sha512-Mf2gjC24u6s8djV/3slZvwdr4+h0qBu2OYXBUSDfR4H/VJwV5TstnWVKF+U8d1hjmHE9eLO8elbGNnpQmSoTOQ==}
+    resolution: {integrity: sha512-k7Xhzs2mXrQcm3SLhLNDBkUaCWqtbQ6dyme1ubsG9PZEcvv25T//8CNVFEsHVZTKqj5nF41iSh4Wz1Qn6VxkVw==}
     engines: {node: '>= 10'}
     os: [darwin]
 
-  '@drop-oss/droplet-darwin-x64@3.0.1':
+  '@drop-oss/droplet-darwin-x64@3.2.0':
-    resolution: {integrity: sha512-4IIDl/E+hzZ2Vt9m4FMPlZEXwj1EwE6qXyUidACK6TTFqpjLpsEHKuhv1FOxGyJ8qkvagtyPCc+cs1TxoZD6FA==}
+    resolution: {integrity: sha512-GvRwQrtcC1Dq6YyXxBGSFj+WasnIa1dk9t2lCaR9OQdh3qp2did21o2poo1Sgdjg+mI2lUdgZ6w0yXJlL1vl+A==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [darwin]
 
-  '@drop-oss/droplet-linux-arm64-gnu@3.0.1':
+  '@drop-oss/droplet-linux-arm64-gnu@3.2.0':
-    resolution: {integrity: sha512-klGvlLf1xSMT3iYsIAaBbmbir1ZJWtcVyOMUlsfc1lkJ8mgyB+PrW4BsnYj7Pp4G34n7WsOChjC8TdJDBBuBWg==}
+    resolution: {integrity: sha512-ZqH0xTEeSeJF77vy8rZDxHEV8JMaN0khdg6ptpnbBfc56J5jt6wS3NlHK8M0ZVlDqqZnXMS1vUO0b6rfmQodKw==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [linux]
 
-  '@drop-oss/droplet-linux-arm64-musl@3.0.1':
+  '@drop-oss/droplet-linux-arm64-musl@3.2.0':
-    resolution: {integrity: sha512-oOjvGETlrJGC1RlNhUoVS9N89Rn/0DqBauVz3BBFjJTKSd5jU3/gLzwgmfkKDGVEU5lyGPAn2WQroiESEG9wdA==}
+    resolution: {integrity: sha512-TTw44PggYfp3RJkvNhXH89duuuvONEA8c8oRBCzCczRf3hDnbzCQLaB1UlnIlESsJZXXiFSDIBV2/0kkpB+Ukg==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [linux]
 
-  '@drop-oss/droplet-linux-riscv64-gnu@3.0.1':
+  '@drop-oss/droplet-linux-riscv64-gnu@3.2.0':
-    resolution: {integrity: sha512-Zf3gUsWq9Hqb275MOi7PJDhmJz7Qa/Y1XMen880bxPaOeDFqFOoKUxUr2/qv1MYp6tT3zO27NprGsHirYWqsyA==}
+    resolution: {integrity: sha512-Ee/PfkoG8pm/9C3LFXJleIi5N8V5cK+44p+iDaneAo6gj5k67zYzuga3mJVswTgd3fncG1cw+xPqBl4PUWc1pg==}
     engines: {node: '>= 10'}
     cpu: [riscv64]
     os: [linux]
 
-  '@drop-oss/droplet-linux-x64-gnu@3.0.1':
+  '@drop-oss/droplet-linux-x64-gnu@3.2.0':
-    resolution: {integrity: sha512-sskblycJdtNJVnRHjPHhwHkQUfQNaDIWDzXOzEaBPOcDKqYA7od7VMDAseqBkrKDn7l8bBUtRXFAipdsO8hffw==}
+    resolution: {integrity: sha512-L2M/MEoe5Y74MTtzpEWHIvdyRSPLgM1WLzpb/xRNCWe8d6FcUFDgdMlbd6rDj5t4Q6JEzyMIHUciVRaYIv+ShA==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [linux]
 
-  '@drop-oss/droplet-linux-x64-musl@3.0.1':
+  '@drop-oss/droplet-linux-x64-musl@3.2.0':
-    resolution: {integrity: sha512-lh+1M6UAf5+ET1/ZEFRsB3shFHjkT/9Ql9akr/vyUue91TWPmP71meqVkCugWDhP6lxBt56jg2VVrJfmPAsK6w==}
+    resolution: {integrity: sha512-F/uQUAHWbhiiAtoyKHQHPgjG7jJd8pQX6sCgdf5ufCdwFLvHEdu9pO0qN+xpzaACceIKX4Vip0vUwQwEzYhAKA==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [linux]
 
-  '@drop-oss/droplet-win32-arm64-msvc@3.0.1':
+  '@drop-oss/droplet-win32-arm64-msvc@3.2.0':
-    resolution: {integrity: sha512-caQDPoDNJyyJXUEijw+hGTy0wmCrW5efTqBwnvMcQ282EOilg1d5WeJ31pfEcuLYF4MK1t9uaLcG6jZ9YLtzEQ==}
+    resolution: {integrity: sha512-x7i1KKL8vQGcXbKIyH56LCEdQxLKNEk/KFjuD/YGrbBJ/+Q+fh46hLK+Sx4I/HzPHecd5g3xc2kVgO7+DgjhYA==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [win32]
 
-  '@drop-oss/droplet-win32-x64-msvc@3.0.1':
+  '@drop-oss/droplet-win32-x64-msvc@3.2.0':
-    resolution: {integrity: sha512-bp8KwewF/T3JkVeJWkg86U3b0cGQD9i8k92x6HYPtnF5nLPAb2UIUEJgmYYFNPFe36RECBV7PIIG0ujdT1ELQw==}
+    resolution: {integrity: sha512-lC8a456IQ0ArzX40IlStolV4GIdl26xF9PikcuQ9r+n4VDqWSHb8A0Wwj87leU3QdoMu+Y2nlA1QHKgpVSEuoQ==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [win32]
 
-  '@drop-oss/droplet@3.0.1':
+  '@drop-oss/droplet@3.2.0':
-    resolution: {integrity: sha512-YhtgpwNqEHO8R03yf9Xb5LXuaLWkQvY+2lxOD1PwzpGI5V9PKlDE+x1IJBmdBF5bDPDGk9MxQidGtnYQuAEBEA==}
+    resolution: {integrity: sha512-+3zw3MPriMrj8HlKAq2VTlXEPOXN0homusjmQcBRzVx7GjtGvb5Y9YIHs16qfn8zdTEDi5twrtsUBQYkVjU2bQ==}
     engines: {node: '>= 10'}
 
-  '@emnapi/core@1.5.0':
+  '@emnapi/core@1.4.5':
-    resolution: {integrity: sha512-sbP8GzB1WDzacS8fgNPpHlp6C9VZe+SJP3F90W9rLemaQj2PzIuTEl1qDOYQf58YIpyjViI24y9aPWCjEzY2cg==}
+    resolution: {integrity: sha512-XsLw1dEOpkSX/WucdqUhPWP7hDxSvZiY+fsUC14h+FtQ2Ifni4znbBt8punRX+Uj2JG/uDb8nEHVKvrVlvdZ5Q==}
 
-  '@emnapi/runtime@1.5.0':
+  '@emnapi/core@1.6.0':
-    resolution: {integrity: sha512-97/BJ3iXHww3djw6hYIfErCZFee7qCtrneuLa20UXFCOTCfBM2cvQHjWJ2EG0s0MtdNwInarqCTz35i4wWXHsQ==}
+    resolution: {integrity: sha512-zq/ay+9fNIJJtJiZxdTnXS20PllcYMX3OE23ESc4HK/bdYu3cOWYVhsOhVnXALfU/uqJIxn5NBPd9z4v+SfoSg==}
+
+  '@emnapi/runtime@1.4.5':
+    resolution: {integrity: sha512-++LApOtY0pEEz1zrd9vy1/zXVaVJJ/EbAF3u0fXIzPJEDtnITsBGbbK0EkM72amhl/R5b+5xx0Y/QhcVOpuulg==}
+
+  '@emnapi/runtime@1.6.0':
+    resolution: {integrity: sha512-obtUmAHTMjll499P+D9A3axeJFlhdjOWdKUNs/U6QIGT7V5RjcUW1xToAzjvmgTSQhDbYn/NwfTRoJcQ2rNBxA==}
+
+  '@emnapi/wasi-threads@1.0.4':
+    resolution: {integrity: sha512-PJR+bOmMOPH8AtcTGAyYNiuJ3/Fcoj2XN/gBEWzDIKh254XO+mM9XoXHk5GNEhodxeMznbg7BlRojVbKN+gC6g==}
 
   '@emnapi/wasi-threads@1.1.0':
     resolution: {integrity: sha512-WI0DdZ8xFSbgMjR1sFsKABJ/C5OnRrjT06JXbZKexJGrDuPTzZdDYfFlsgcCXCyf+suG5QU2e/y1Wo2V/OapLQ==}
@@ -851,8 +860,8 @@ packages:
   '@napi-rs/wasm-runtime@0.2.12':
     resolution: {integrity: sha512-ZVWUcfwY4E/yPitQJl481FjFo3K22D6qF0DuFH6Y/nbnE11GY5uguDxZMGXPQ8WQ0128MXQD7TnfHyK4oWoIJQ==}
 
-  '@napi-rs/wasm-runtime@1.0.5':
+  '@napi-rs/wasm-runtime@1.0.7':
-    resolution: {integrity: sha512-TBr9Cf9onSAS2LQ2+QHx6XcC6h9+RIzJgbqG3++9TUZSH204AwEy5jg3BTQ0VATsyoGj4ee49tN/y6rvaOOtcg==}
+    resolution: {integrity: sha512-SeDnOO0Tk7Okiq6DbXmmBODgOAb9dp9gjlphokTUxmt8U3liIP1ZsozBahH69j/RJv+Rfs6IwUKHTgQYJ/HBAw==}
 
   '@nodelib/fs.scandir@2.1.5':
     resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
@@ -1804,6 +1813,9 @@ packages:
   '@twemoji/parser@16.0.0':
     resolution: {integrity: sha512-jmuIjkp3OIaEemwMy3sArBwZSuZkRqmueGwRe2Zk4cFzbUJISFBJSZLDUUBNIgq3c+nY49ideYN2OiII6JUqwA==}
 
+  '@tybys/wasm-util@0.10.0':
+    resolution: {integrity: sha512-VyyPYFlOMNylG45GoAe0xDoLwWuowvf92F9kySqzYh8vmYm7D2u4iUJKa1tOUpS70Ku13ASrOkS4ScXFsTaCNQ==}
+
   '@tybys/wasm-util@0.10.1':
     resolution: {integrity: sha512-9tTaPJLSiejZKx+Bmog4uSubteqTvFrVrURwkmHixBo0G4seD0zUxp98E1DzUBJxLQ3NPwXrGKDiVjwx/DpPsg==}
 
@@ -5802,56 +5814,72 @@ snapshots:
       jsonfile: 5.0.0
       universalify: 0.1.2
 
-  '@drop-oss/droplet-darwin-arm64@3.0.1':
+  '@drop-oss/droplet-darwin-arm64@3.2.0':
     optional: true
 
-  '@drop-oss/droplet-darwin-universal@3.0.1':
+  '@drop-oss/droplet-darwin-universal@3.2.0':
     optional: true
 
-  '@drop-oss/droplet-darwin-x64@3.0.1':
+  '@drop-oss/droplet-darwin-x64@3.2.0':
     optional: true
 
-  '@drop-oss/droplet-linux-arm64-gnu@3.0.1':
+  '@drop-oss/droplet-linux-arm64-gnu@3.2.0':
     optional: true
 
-  '@drop-oss/droplet-linux-arm64-musl@3.0.1':
+  '@drop-oss/droplet-linux-arm64-musl@3.2.0':
     optional: true
 
-  '@drop-oss/droplet-linux-riscv64-gnu@3.0.1':
+  '@drop-oss/droplet-linux-riscv64-gnu@3.2.0':
     optional: true
 
-  '@drop-oss/droplet-linux-x64-gnu@3.0.1':
+  '@drop-oss/droplet-linux-x64-gnu@3.2.0':
     optional: true
 
-  '@drop-oss/droplet-linux-x64-musl@3.0.1':
+  '@drop-oss/droplet-linux-x64-musl@3.2.0':
     optional: true
 
-  '@drop-oss/droplet-win32-arm64-msvc@3.0.1':
+  '@drop-oss/droplet-win32-arm64-msvc@3.2.0':
     optional: true
 
-  '@drop-oss/droplet-win32-x64-msvc@3.0.1':
+  '@drop-oss/droplet-win32-x64-msvc@3.2.0':
     optional: true
 
-  '@drop-oss/droplet@3.0.1':
+  '@drop-oss/droplet@3.2.0':
     optionalDependencies:
-      '@drop-oss/droplet-darwin-arm64': 3.0.1
+      '@drop-oss/droplet-darwin-arm64': 3.2.0
-      '@drop-oss/droplet-darwin-universal': 3.0.1
+      '@drop-oss/droplet-darwin-universal': 3.2.0
-      '@drop-oss/droplet-darwin-x64': 3.0.1
+      '@drop-oss/droplet-darwin-x64': 3.2.0
-      '@drop-oss/droplet-linux-arm64-gnu': 3.0.1
+      '@drop-oss/droplet-linux-arm64-gnu': 3.2.0
-      '@drop-oss/droplet-linux-arm64-musl': 3.0.1
+      '@drop-oss/droplet-linux-arm64-musl': 3.2.0
-      '@drop-oss/droplet-linux-riscv64-gnu': 3.0.1
+      '@drop-oss/droplet-linux-riscv64-gnu': 3.2.0
-      '@drop-oss/droplet-linux-x64-gnu': 3.0.1
+      '@drop-oss/droplet-linux-x64-gnu': 3.2.0
-      '@drop-oss/droplet-linux-x64-musl': 3.0.1
+      '@drop-oss/droplet-linux-x64-musl': 3.2.0
-      '@drop-oss/droplet-win32-arm64-msvc': 3.0.1
+      '@drop-oss/droplet-win32-arm64-msvc': 3.2.0
-      '@drop-oss/droplet-win32-x64-msvc': 3.0.1
+      '@drop-oss/droplet-win32-x64-msvc': 3.2.0
 
-  '@emnapi/core@1.5.0':
+  '@emnapi/core@1.4.5':
+    dependencies:
+      '@emnapi/wasi-threads': 1.0.4
+      tslib: 2.8.1
+    optional: true
+
+  '@emnapi/core@1.6.0':
     dependencies:
       '@emnapi/wasi-threads': 1.1.0
       tslib: 2.8.1
     optional: true
 
-  '@emnapi/runtime@1.5.0':
+  '@emnapi/runtime@1.4.5':
+    dependencies:
+      tslib: 2.8.1
+    optional: true
+
+  '@emnapi/runtime@1.6.0':
+    dependencies:
+      tslib: 2.8.1
+    optional: true
+
+  '@emnapi/wasi-threads@1.0.4':
     dependencies:
       tslib: 2.8.1
     optional: true
@@ -6228,15 +6256,15 @@ snapshots:
 
   '@napi-rs/wasm-runtime@0.2.12':
     dependencies:
-      '@emnapi/core': 1.5.0
+      '@emnapi/core': 1.4.5
-      '@emnapi/runtime': 1.5.0
+      '@emnapi/runtime': 1.4.5
-      '@tybys/wasm-util': 0.10.1
+      '@tybys/wasm-util': 0.10.0
     optional: true
 
-  '@napi-rs/wasm-runtime@1.0.5':
+  '@napi-rs/wasm-runtime@1.0.7':
     dependencies:
-      '@emnapi/core': 1.5.0
+      '@emnapi/core': 1.6.0
-      '@emnapi/runtime': 1.5.0
+      '@emnapi/runtime': 1.6.0
       '@tybys/wasm-util': 0.10.1
     optional: true
 
@@ -6722,7 +6750,7 @@ snapshots:
 
   '@oxc-minify/binding-wasm32-wasi@0.87.0':
     dependencies:
-      '@napi-rs/wasm-runtime': 1.0.5
+      '@napi-rs/wasm-runtime': 1.0.7
     optional: true
 
   '@oxc-minify/binding-win32-arm64-msvc@0.87.0':
@@ -6807,7 +6835,7 @@ snapshots:
 
   '@oxc-parser/binding-wasm32-wasi@0.87.0':
     dependencies:
-      '@napi-rs/wasm-runtime': 1.0.5
+      '@napi-rs/wasm-runtime': 1.0.7
     optional: true
 
   '@oxc-parser/binding-win32-arm64-msvc@0.70.0':
@@ -6870,7 +6898,7 @@ snapshots:
 
   '@oxc-transform/binding-wasm32-wasi@0.87.0':
     dependencies:
-      '@napi-rs/wasm-runtime': 1.0.5
+      '@napi-rs/wasm-runtime': 1.0.7
     optional: true
 
   '@oxc-transform/binding-win32-arm64-msvc@0.87.0':
@@ -7258,6 +7286,11 @@ snapshots:
 
   '@twemoji/parser@16.0.0': {}
 
+  '@tybys/wasm-util@0.10.0':
+    dependencies:
+      tslib: 2.8.1
+    optional: true
+
   '@tybys/wasm-util@0.10.1':
     dependencies:
       tslib: 2.8.1

pnpm-workspace.yaml

@@ -1,4 +1,8 @@
 onlyBuiltDependencies:
+  - '@prisma/client'
+  - '@prisma/engines'
+  - '@tailwindcss/oxide'
   - esbuild
+  - prisma
 
 shamefullyHoist: true

prisma/migrations/20250918184144_add_steam_metadata/migration.sql

@@ -0,0 +1,8 @@
+-- AlterEnum
+ALTER TYPE "MetadataSource" ADD VALUE 'Steam';
+
+-- DropIndex
+DROP INDEX "GameTag_name_idx";
+
+-- CreateIndex
+CREATE INDEX "GameTag_name_idx" ON "GameTag" USING GIST ("name" gist_trgm_ops(siglen=32));

prisma/migrations/20250925223539_add_pre_and_post_install_for_redist_version/migration.sql

@@ -0,0 +1,41 @@
+/*
+  Warnings:
+
+  - A unique constraint covering the columns `[installRId]` on the table `LaunchOption` will be added. If there are existing duplicate values, this will fail.
+  - A unique constraint covering the columns `[uninstallRId]` on the table `LaunchOption` will be added. If there are existing duplicate values, this will fail.
+  - A unique constraint covering the columns `[installId]` on the table `RedistVersion` will be added. If there are existing duplicate values, this will fail.
+  - A unique constraint covering the columns `[uninstallId]` on the table `RedistVersion` will be added. If there are existing duplicate values, this will fail.
+
+*/
+-- DropIndex
+DROP INDEX "public"."GameTag_name_idx";
+
+-- AlterTable
+ALTER TABLE "public"."LaunchOption" ADD COLUMN     "installRId" TEXT,
+ADD COLUMN     "uninstallRId" TEXT;
+
+-- AlterTable
+ALTER TABLE "public"."RedistVersion" ADD COLUMN     "installId" TEXT,
+ADD COLUMN     "onlySetup" BOOLEAN NOT NULL DEFAULT false,
+ADD COLUMN     "uninstallId" TEXT;
+
+-- CreateIndex
+CREATE INDEX "GameTag_name_idx" ON "public"."GameTag" USING GIST ("name" gist_trgm_ops(siglen=32));
+
+-- CreateIndex
+CREATE UNIQUE INDEX "LaunchOption_installRId_key" ON "public"."LaunchOption"("installRId");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "LaunchOption_uninstallRId_key" ON "public"."LaunchOption"("uninstallRId");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "RedistVersion_installId_key" ON "public"."RedistVersion"("installId");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "RedistVersion_uninstallId_key" ON "public"."RedistVersion"("uninstallId");
+
+-- AddForeignKey
+ALTER TABLE "public"."RedistVersion" ADD CONSTRAINT "RedistVersion_installId_fkey" FOREIGN KEY ("installId") REFERENCES "public"."LaunchOption"("launchId") ON DELETE SET NULL ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "public"."RedistVersion" ADD CONSTRAINT "RedistVersion_uninstallId_fkey" FOREIGN KEY ("uninstallId") REFERENCES "public"."LaunchOption"("launchId") ON DELETE SET NULL ON UPDATE CASCADE;

prisma/migrations/20250925225034_add_delta_versioning_to_redist/migration.sql

@@ -0,0 +1,15 @@
+/*
+  Warnings:
+
+  - Added the required column `versionIndex` to the `RedistVersion` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- DropIndex
+DROP INDEX "public"."GameTag_name_idx";
+
+-- AlterTable
+ALTER TABLE "public"."RedistVersion" ADD COLUMN     "delta" BOOLEAN NOT NULL DEFAULT false,
+ADD COLUMN     "versionIndex" INTEGER NOT NULL;
+
+-- CreateIndex
+CREATE INDEX "GameTag_name_idx" ON "public"."GameTag" USING GIST ("name" gist_trgm_ops(siglen=32));

prisma/migrations/20251107223657_move_version_index/migration.sql

@@ -0,0 +1,18 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `versionIndex` on the `GameVersion` table. All the data in the column will be lost.
+  - Added the required column `versionIndex` to the `Version` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- DropIndex
+DROP INDEX "public"."GameTag_name_idx";
+
+-- AlterTable
+ALTER TABLE "public"."GameVersion" DROP COLUMN "versionIndex";
+
+-- AlterTable
+ALTER TABLE "public"."Version" ADD COLUMN     "versionIndex" INTEGER NOT NULL;
+
+-- CreateIndex
+CREATE INDEX "GameTag_name_idx" ON "public"."GameTag" USING GIST ("name" gist_trgm_ops(siglen=32));

prisma/migrations/20251109232837_move_hidden_to_version/migration.sql

@@ -0,0 +1,17 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `hidden` on the `GameVersion` table. All the data in the column will be lost.
+
+*/
+-- DropIndex
+DROP INDEX "public"."GameTag_name_idx";
+
+-- AlterTable
+ALTER TABLE "public"."GameVersion" DROP COLUMN "hidden";
+
+-- AlterTable
+ALTER TABLE "public"."Version" ADD COLUMN     "hidden" BOOLEAN NOT NULL DEFAULT false;
+
+-- CreateIndex
+CREATE INDEX "GameTag_name_idx" ON "public"."GameTag" USING GIST ("name" gist_trgm_ops(siglen=32));

prisma/models/content.prisma

@@ -49,6 +49,11 @@ model LaunchOption {
     uninstallGId      String?      @unique
     uninstallGVersion GameVersion? @relation(name: "uninstall")
 
+    installRId        String?        @unique
+    installRVersion   RedistVersion? @relation(name: "install_redist")
+    uninstallRId      String?        @unique
+    uninstallRVersion RedistVersion? @relation(name: "uninstall_redist")
+
     name        String
     description String
 
@@ -63,7 +68,9 @@ model Version {
     versionPath String
 
     versionName  String
+    versionIndex Int
     created      DateTime @default(now())
+    hidden       Boolean  @default(false)
 
     gameId       String?
     game         Game?         @relation(fields: [gameId], references: [id], map: "game_link", onDelete: Cascade, onUpdate: Cascade)
@@ -101,9 +108,7 @@ model GameVersion {
 
     umuIdOverride String?
 
-    versionIndex Int
     delta Boolean @default(false)
-    hidden       Boolean @default(false)
 
     platformId String
     platform   PlatformLink @relation(fields: [platformId], references: [id])
@@ -125,8 +130,17 @@ model RedistVersion {
     versionId String  @id
     version   Version @relation(fields: [versionId], references: [versionId], onDelete: Cascade, onUpdate: Cascade)
 
+    installId   String?       @unique
+    install     LaunchOption? @relation(name: "install_redist", fields: [installId], references: [launchId])
+    uninstallId String?       @unique
+    uninstall   LaunchOption? @relation(name: "uninstall_redist", fields: [uninstallId], references: [launchId])
+    onlySetup   Boolean       @default(false)
+
     launches LaunchOption[]
 
+    versionIndex Int
+    delta        Boolean @default(false)
+
     gameDependees GameVersion[]
     dlcDependees  DLCVersion[]
 

prisma/models/metadata.prisma

@@ -5,6 +5,7 @@ enum MetadataSource {
   IGDB
   Metacritic
   OpenCritic
+  Steam
 }
 
 model Game {

server/api/v1/admin/game/[id]/index.delete.ts

@@ -1,5 +1,5 @@
 import aclManager from "~~/server/internal/acls";
-import prisma from "~~/server/internal/db/database";
+import libraryManager from "~~/server/internal/library";
 
 export default defineEventHandler(async (h3) => {
   const allowed = await aclManager.allowSystemACL(h3, ["game:delete"]);
@@ -7,11 +7,7 @@ export default defineEventHandler(async (h3) => {
 
   const gameId = getRouterParam(h3, "id")!;
 
-  await prisma.game.delete({
+  await libraryManager.deleteGame(gameId);
-    where: {
-      id: gameId,
-    },
-  });
 
   return {};
 });

server/api/v1/admin/game/[id]/index.get.ts

@@ -23,7 +23,7 @@ export default defineEventHandler(async (h3) => {
               install: true,
               uninstall: true,
               launches: true,
-            }
+            },
           },
         },
       },
@@ -34,10 +34,24 @@ export default defineEventHandler(async (h3) => {
   if (!game || !game.libraryId)
     throw createError({ statusCode: 404, message: "Game ID not found" });
 
+  const getGameVersionSize = async (
+    version: Omit<(typeof game)["versions"][number], "dropletManifest">,
+  ) => {
+    const size = await libraryManager.getGameVersionSize(
+      gameId,
+      version.versionId,
+    );
+    return { ...version, size };
+  };
+  const gameWithVersionSize = {
+    ...game,
+    versions: await Promise.all(game.versions.map(getGameVersionSize)),
+  };
+
   const unimportedVersions = await libraryManager.fetchUnimportedGameVersions(
     game.libraryId,
     game.libraryPath,
   );
 
-  return { game, unimportedVersions };
+  return { game: gameWithVersionSize, unimportedVersions };
 });

server/api/v1/admin/game/version/index.delete.ts

@@ -1,7 +1,7 @@
 import { type } from "arktype";
 import { readDropValidatedBody, throwingArktype } from "~~/server/arktype";
 import aclManager from "~~/server/internal/acls";
-import prisma from "~~/server/internal/db/database";
+import libraryManager from "~~/server/internal/library";
 
 const DeleteVersion = type({
   id: "string",
@@ -16,11 +16,7 @@ export default defineEventHandler<{ body: typeof DeleteVersion }>(
 
     const body = await readDropValidatedBody(h3, DeleteVersion);
 
-    await prisma.version.delete({
+    await libraryManager.deleteGameVersion(body.id);
-      where: {
-        versionId: body.id,
-      },
-    });
 
     return {};
   },

server/api/v1/admin/game/version/index.patch.ts

@@ -21,7 +21,7 @@ export default defineEventHandler<{ body: typeof UpdateVersionOrder }>(
 
     await prisma.$transaction(
       versions.map((versionId, versionIndex) =>
-        prisma.gameVersion.update({
+        prisma.version.update({
           where: {
             versionId,
           },

server/api/v1/admin/home/index.get.ts

@@ -0,0 +1,27 @@
+import aclManager from "~~/server/internal/acls";
+import prisma from "~~/server/internal/db/database";
+import { systemConfig } from "~~/server/internal/config/sys-conf";
+import libraryManager from "~~/server/internal/library";
+import userStatsManager from "~~/server/internal/userstats";
+
+export default defineEventHandler(async (h3) => {
+  const allowed = await aclManager.allowSystemACL(h3, ["game:read"]);
+  if (!allowed) throw createError({ statusCode: 403 });
+
+  const sources = await libraryManager.fetchLibraries();
+  const userStats = await userStatsManager.getUserStats();
+
+  const biggestGamesCombined =
+    await libraryManager.getBiggestGamesCombinedVersions(5);
+  const biggestGamesLatest =
+    await libraryManager.getBiggestGamesLatestVersions(5);
+
+  return {
+    gameCount: await prisma.game.count(),
+    version: systemConfig.getDropVersion(),
+    userStats,
+    sources,
+    biggestGamesLatest,
+    biggestGamesCombined,
+  };
+});

server/api/v1/admin/import/version/index.get.ts

@@ -1,29 +1,33 @@
+import { ArkErrors, type } from "arktype";
 import aclManager from "~~/server/internal/acls";
 import prisma from "~~/server/internal/db/database";
-import libraryManager from "~~/server/internal/library";
+import libraryManager, { VersionImportModes } from "~~/server/internal/library";
+
+export const PreloadQuery = type({
+  id: "string",
+  mode: type.enumerated(...VersionImportModes),
+});
 
 export default defineEventHandler(async (h3) => {
   const allowed = await aclManager.allowSystemACL(h3, ["import:version:read"]);
   if (!allowed) throw createError({ statusCode: 403 });
 
-  const query = await getQuery(h3);
+  const rawQuery = await getQuery(h3);
-  const gameId = query.id?.toString();
+  const query = PreloadQuery(rawQuery);
-  if (!gameId)
+  if (query instanceof ArkErrors)
-    throw createError({
+    throw createError({ statusCode: 400, message: query.summary });
-      statusCode: 400,
-      message: "Missing id in request params",
-    });
 
-  const game = await prisma.game.findUnique({
+  const value: { libraryId: string; libraryPath: string } | undefined =
-    where: { id: gameId },
+    await // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (prisma[query.mode] as any).findUnique({
+      where: { id: query.id },
       select: { libraryId: true, libraryPath: true },
     });
-  if (!game || !game.libraryId)
+  if (!value) throw createError({ statusCode: 404, message: "Not found" });
-    throw createError({ statusCode: 404, message: "Game not found" });
 
   const unimportedVersions = await libraryManager.fetchUnimportedGameVersions(
-    game.libraryId,
+    value.libraryId,
-    game.libraryPath,
+    value.libraryPath,
   );
   if (!unimportedVersions)
     throw createError({ statusCode: 400, message: "Invalid game ID" });

server/api/v1/admin/import/version/index.post.ts

@@ -1,9 +1,7 @@
 import { type } from "arktype";
 import { readDropValidatedBody, throwingArktype } from "~~/server/arktype";
 import aclManager from "~~/server/internal/acls";
-import prisma from "~~/server/internal/db/database";
 import libraryManager from "~~/server/internal/library";
-import { convertIDToLink } from "~~/server/internal/platform/link";
 
 export const LaunchCommands = type({
   name: "string > 0",
@@ -12,14 +10,18 @@ export const LaunchCommands = type({
   launchArgs: "string = ''",
 }).array();
 
-export const ImportVersion = type({
+const ImportVersionBase = type({
   id: "string",
   version: "string",
   name: "string?",
 
   platform: "string",
-  onlySetup: "boolean = false",
   delta: "boolean = false",
+});
+
+const ImportGameVersion = type({
+  mode: "'game'",
+  onlySetup: "boolean = false",
   umuId: "string = ''",
 
   install: "string?",
@@ -27,7 +29,26 @@ export const ImportVersion = type({
   launches: LaunchCommands,
   uninstall: "string?",
   uninstallArgs: "string?",
-}).configure(throwingArktype);
+});
+
+const ImportRedistVersion = type({
+  mode: "'redist'",
+  install: "string?",
+  installArgs: "string?",
+  launches: LaunchCommands,
+  uninstall: "string?",
+  uninstallArgs: "string?",
+});
+
+export const ImportVersion = ImportVersionBase.and(
+  ImportGameVersion.or(ImportRedistVersion),
+).configure(throwingArktype);
+
+export type ImportGameVersion = typeof ImportVersionBase.infer &
+  typeof ImportGameVersion.infer;
+
+export type ImportRedistVersion = typeof ImportVersionBase.infer &
+  typeof ImportRedistVersion.infer;
 
 export default defineEventHandler(async (h3) => {
   const allowed = await aclManager.allowSystemACL(h3, ["import:version:new"]);
@@ -35,48 +56,10 @@ export default defineEventHandler(async (h3) => {
 
   const body = await readDropValidatedBody(h3, ImportVersion);
 
-  const platform = await convertIDToLink(body.platform);
-  if (!platform)
-    throw createError({ statusCode: 400, message: "Invalid platform." });
-
-  if (body.delta) {
-    const validOverlayVersions = await prisma.gameVersion.count({
-      where: {
-        version: {
-          gameId: body.id,
-        },
-        delta: false,
-        platform,
-      },
-    });
-    if (validOverlayVersions == 0)
-      throw createError({
-        statusCode: 400,
-        message:
-          "Update mode requires a pre-existing version for this platform.",
-      });
-  }
-
-  if (body.onlySetup) {
-    if (!body.install)
-      throw createError({
-        statusCode: 400,
-        message: 'Install required in "setup mode".',
-      });
-  } else {
-    if (!body.delta && body.launches.length == 0)
-      throw createError({
-        statusCode: 400,
-        message:
-          "At least one launch command is required for non-delta versions",
-      });
-  }
-
   // startup & delta require more complex checking logic
   const taskId = await libraryManager.importVersion(
     body.id,
     body.version,
-    "game",
     body,
   );
   if (!taskId)

server/api/v1/admin/import/version/preload.get.ts

@@ -1,22 +1,26 @@
+import { ArkErrors, type } from "arktype";
 import aclManager from "~~/server/internal/acls";
-import libraryManager from "~~/server/internal/library";
+import libraryManager, { VersionImportModes } from "~~/server/internal/library";
+
+export const PreloadQuery = type({
+  id: "string",
+  version: "string",
+  mode: type.enumerated(...VersionImportModes),
+});
 
 export default defineEventHandler(async (h3) => {
   const allowed = await aclManager.allowSystemACL(h3, ["import:version:read"]);
   if (!allowed) throw createError({ statusCode: 403 });
 
-  const query = await getQuery(h3);
+  const rawQuery = await getQuery(h3);
-  const gameId = query.id?.toString();
+  const query = PreloadQuery(rawQuery);
-  const versionName = query.version?.toString();
+  if (query instanceof ArkErrors)
-  if (!gameId || !versionName)
+    throw createError({ statusCode: 400, message: query.summary });
-    throw createError({
-      statusCode: 400,
-      message: "Missing id or version in request params",
-    });
 
   const preload = await libraryManager.fetchUnimportedVersionInformation(
-    gameId,
+    query.id,
-    versionName,
+    query.mode,
+    query.version,
   );
   if (!preload)
     throw createError({

server/api/v1/admin/library/sources/index.get.ts

@@ -2,7 +2,10 @@ import type { LibraryModel } from "~~/prisma/client/models";
 import aclManager from "~~/server/internal/acls";
 import libraryManager from "~~/server/internal/library";
 
-export type WorkingLibrarySource = LibraryModel & { working: boolean };
+export type WorkingLibrarySource = LibraryModel & {
+  working: boolean;
+  fsStats?: { freeSpace: number; totalSpace: number } | undefined;
+};
 
 export default defineEventHandler(async (h3) => {
   const allowed = await aclManager.allowSystemACL(h3, [

server/api/v1/admin/library/sources/index.patch.ts

@@ -3,8 +3,8 @@ import { readDropValidatedBody, throwingArktype } from "~~/server/arktype";
 import aclManager from "~~/server/internal/acls";
 import prisma from "~~/server/internal/db/database";
 import libraryManager from "~~/server/internal/library";
+import type { WorkingLibrarySource } from "~~/server/api/v1/admin/library/sources/index.get";
 import { libraryConstructors } from "~~/server/plugins/05.library-init";
-import type { WorkingLibrarySource } from "./index.get";
 
 const UpdateLibrarySource = type({
   id: "string",
@@ -49,8 +49,8 @@ export default defineEventHandler<{ body: typeof UpdateLibrarySource.infer }>(
         },
       });
 
-      await libraryManager.removeLibrary(source.id);
+      libraryManager.removeLibrary(source.id);
-      await libraryManager.addLibrary(newLibrary);
+      libraryManager.addLibrary(newLibrary);
 
       const workingSource: WorkingLibrarySource = {
         ...updatedSource,

server/api/v1/admin/library/sources/index.post.ts

@@ -6,7 +6,7 @@ import aclManager from "~~/server/internal/acls";
 import prisma from "~~/server/internal/db/database";
 import libraryManager from "~~/server/internal/library";
 import { libraryConstructors } from "~~/server/plugins/05.library-init";
-import type { WorkingLibrarySource } from "./index.get";
+import type { WorkingLibrarySource } from "~~/server/api/v1/admin/library/sources/index.get";
 
 const CreateLibrarySource = type({
   name: "string",
@@ -52,11 +52,12 @@ export default defineEventHandler<{ body: typeof CreateLibrarySource.infer }>(
         },
       });
 
-      await libraryManager.addLibrary(library);
+      libraryManager.addLibrary(library);
 
       const workingSource: WorkingLibrarySource = {
         ...source,
         working: true,
+        fsStats: library.fsStats(),
       };
 
       return workingSource;

server/api/v1/admin/task/index.post.ts

@@ -2,7 +2,7 @@ import { type } from "arktype";
 import { readDropValidatedBody, throwingArktype } from "~~/server/arktype";
 import aclManager from "~~/server/internal/acls";
 import taskHandler from "~~/server/internal/tasks";
-import { TASK_GROUPS, type TaskGroup } from "~~/server/internal/tasks/group";
+import { TASK_GROUPS } from "~~/server/internal/tasks/group";
 
 const StartTask = type({
   taskGroup: type.enumerated(...TASK_GROUPS),

server/api/v1/admin/users/[id]/index.delete.ts

@@ -1,6 +1,7 @@
 import { defineEventHandler, createError } from "h3";
 import aclManager from "~~/server/internal/acls";
 import prisma from "~~/server/internal/db/database";
+import userStatsManager from "~~/server/internal/userstats";
 
 export default defineEventHandler(async (h3) => {
   const allowed = await aclManager.allowSystemACL(h3, ["user:delete"]);
@@ -27,5 +28,6 @@ export default defineEventHandler(async (h3) => {
     throw createError({ statusCode: 404, message: "User not found." });
 
   await prisma.user.delete({ where: { id: userId } });
+  await userStatsManager.deleteUser();
   return { success: true };
 });

server/api/v1/auth/signup/simple.post.ts

@@ -6,6 +6,7 @@ import objectHandler from "~~/server/internal/objects";
 import { type } from "arktype";
 import { randomUUID } from "node:crypto";
 import { throwingArktype } from "~~/server/arktype";
+import userStatsManager from "~~/server/internal/userstats";
 
 export const SharedRegisterValidator = type({
   username: "string >= 5",
@@ -86,5 +87,6 @@ export default defineEventHandler<{
     prisma.invitation.delete({ where: { id: user.invitation } }),
   ]);
 
+  await userStatsManager.addUser();
   return linkMec.user;
 });

server/api/v1/client/auth/initiate.post.ts

@@ -1,5 +1,5 @@
 import { type } from "arktype";
-import { ClientCapabilities } from "~~/prisma/client/enums";
+import type { ClientCapabilities } from "~~/prisma/client/enums";
 import { readDropValidatedBody, throwingArktype } from "~~/server/arktype";
 import type {
   CapabilityConfiguration,
@@ -7,7 +7,7 @@ import type {
 import capabilityManager, {
   validCapabilities,
 } from "~~/server/internal/clients/capabilities";
-import clientHandler, { AuthMode, AuthModes } from "~~/server/internal/clients/handler";
+import clientHandler, { AuthModes } from "~~/server/internal/clients/handler";
 import { parsePlatform } from "~~/server/internal/utils/parseplatform";
 
 const ClientAuthInitiate = type({

server/api/v1/client/capability/index.post.ts

@@ -1,9 +1,7 @@
 import { type } from "arktype";
 import { ClientCapabilities } from "~~/prisma/client/enums";
 import { readDropValidatedBody, throwingArktype } from "~~/server/arktype";
-import capabilityManager, {
+import capabilityManager from "~~/server/internal/clients/capabilities";
-  validCapabilities,
-} from "~~/server/internal/clients/capabilities";
 import { defineClientEventHandler } from "~~/server/internal/clients/event-handler";
 import notificationSystem from "~~/server/internal/notifications";
 

server/api/v1/client/game/version.get.ts

@@ -1,5 +1,6 @@
 import { defineClientEventHandler } from "~~/server/internal/clients/event-handler";
 import prisma from "~~/server/internal/db/database";
+import libraryManager from "~~/server/internal/library";
 
 export default defineClientEventHandler(async (h3) => {
   const query = getQuery(h3);
@@ -23,5 +24,8 @@ export default defineClientEventHandler(async (h3) => {
       message: "Game version not found",
     });
 
-  return gameVersion;
+  return {
+    ...gameVersion,
+    size: libraryManager.getGameVersionSize(id, version),
+  };
 });

server/api/v1/client/game/versions.get.ts

@@ -10,16 +10,17 @@ export default defineClientEventHandler(async (h3) => {
       message: "No ID in request query",
     });
 
-  const versions = await prisma.gameVersion.findMany({
+  const versions = await prisma.version.findMany({
     where: {
-      version: {
       gameId: id,
-      },
       hidden: false,
     },
     orderBy: {
       versionIndex: "desc", // Latest one first
     },
+    include: {
+      gameVersions: true,
+    },
   });
 
   return versions;

server/api/v1/games/[id]/index.get.ts

@@ -1,6 +1,7 @@
 import aclManager from "~~/server/internal/acls";
 import prisma from "~~/server/internal/db/database";
 import { convertIDsToPlatforms } from "~~/server/internal/platform/link";
+import libraryManager from "~~/server/internal/library";
 
 export default defineEventHandler(async (h3) => {
   const userId = await aclManager.getUserIdACL(h3, ["store:read"]);
@@ -72,5 +73,7 @@ export default defineEventHandler(async (h3) => {
 
   const noVersionsGame = { ...game, versions: undefined };
 
-  return { game: noVersionsGame, rating, platforms };
+  const size = await libraryManager.getGameVersionSize(game.id);
+
+  return { game: noVersionsGame, rating, platforms, size };
 });

server/api/v1/store/index.get.ts

@@ -17,7 +17,8 @@ const StoreRead = type({
   company: "string?",
   companyActions: "string = 'published,developed'",
 
-  sort: "'default' | 'newest' | 'recent' = 'default'",
+  sort: "'default' | 'newest' | 'recent' | 'name' = 'default'",
+  order: "'asc' | 'desc' = 'desc'",
 });
 
 export default defineEventHandler(async (h3) => {
@@ -101,10 +102,13 @@ export default defineEventHandler(async (h3) => {
   switch (options.sort) {
     case "default":
     case "newest":
-      sort.mReleased = "desc";
+      sort.mReleased = options.order;
       break;
     case "recent":
-      sort.created = "desc";
+      sort.created = options.order;
+      break;
+    case "name":
+      sort.mName = options.order;
       break;
   }
 

server/internal/clients/handler.ts

@@ -7,6 +7,7 @@ import type {
 } from "./capabilities";
 import capabilityManager from "./capabilities";
 import type { PeerImpl } from "../tasks";
+import userStatsManager from "~~/server/internal/userstats";
 
 export const AuthModes = ["callback", "code"] as const;
 export type AuthMode = (typeof AuthModes)[number];
@@ -133,7 +134,7 @@ export class ClientHandler {
         statusCode: 400,
         message: "Client has not connected yet. Please try again later.",
       });
-    await client.peer.send(
+    client.peer.send(
       JSON.stringify({ type: "token", value: `${clientId}/${token}` }),
     );
   }
@@ -163,6 +164,7 @@ export class ClientHandler {
         lastConnected: new Date(),
       },
     });
+    await userStatsManager.cacheUserSessions();
 
     for (const [capability, configuration] of Object.entries(
       metadata.data.capabilities,
@@ -188,6 +190,7 @@ export class ClientHandler {
         id,
       },
     });
+    await userStatsManager.cacheUserStats();
   }
 }
 

server/internal/downloads/manifest.ts

@@ -1,4 +1,5 @@
 import prisma from "../db/database";
+import { sum } from "~/utils/array";
 
 export type DropChunk = {
   permissions: number;
@@ -70,6 +71,7 @@ class ManifestGenerator {
           select: {
             gameId: true,
             dropletManifest: true,
+            versionIndex: true,
           },
         },
       },
@@ -82,16 +84,16 @@ class ManifestGenerator {
       // Start at the same index minus one, and keep grabbing them
       // until we run out or we hit something that isn't a delta
       // eslint-disable-next-line no-constant-condition
-      for (let i = baseVersion.versionIndex - 1; true; i--) {
+      for (let i = baseVersion.version.versionIndex - 1; true; i--) {
         const currentVersion = await prisma.gameVersion.findFirst({
           where: {
             version: {
               gameId: baseVersion.version.gameId!,
+              versionIndex: i,
             },
             platform: {
               id: baseVersion.platform.id,
             },
-            versionIndex: i,
           },
           include: {
             version: {
@@ -123,6 +125,14 @@ class ManifestGenerator {
 
     return manifest;
   }
+
+  calculateManifestSize(manifest: DropManifest) {
+    return sum(
+      Object.values(manifest)
+        .map((chunk) => chunk.lengths)
+        .flat(),
+    );
+  }
 }
 
 export const manifestGenerator = new ManifestGenerator();

server/internal/gamesize/index.ts

@@ -0,0 +1,233 @@
+import { sum } from "~/utils/array";
+import cacheHandler from "../cache";
+import prisma from "../db/database";
+import manifestGenerator from "../downloads/manifest";
+import type { Game, Version } from "~~/prisma/client/client";
+
+export type GameSize = {
+  gameName: string;
+  size: number;
+  gameId: string;
+};
+
+export type VersionSize = GameSize & {
+  latest: boolean;
+};
+
+type VersionsSizes = {
+  [versionId: string]: VersionSize;
+};
+
+type GameVersionsSize = {
+  [gameId: string]: VersionsSizes;
+};
+
+class GameSizeManager {
+  private gameVersionsSizesCache =
+    cacheHandler.createCache<GameVersionsSize>("gameVersionsSizes");
+  // All versions sizes combined
+  private gameSizesCache = cacheHandler.createCache<GameSize>("gameSizes");
+
+  private async clearGameVersionsSizesCache() {
+    (await this.gameVersionsSizesCache.getKeys()).map((key) =>
+      this.gameVersionsSizesCache.remove(key),
+    );
+  }
+
+  private async clearGameSizesCache() {
+    (await this.gameSizesCache.getKeys()).map((key) =>
+      this.gameSizesCache.remove(key),
+    );
+  }
+
+  // All versions of a game combined
+  async getCombinedGameSize(gameId: string) {
+    const versions = await prisma.version.findMany({
+      where: { gameId },
+    });
+    const sizes = await Promise.all(
+      versions.map((version) =>
+        manifestGenerator.calculateManifestSize(
+          JSON.parse(version.dropletManifest as string),
+        ),
+      ),
+    );
+    return sum(sizes);
+  }
+
+  async getGameVersionSize(
+    gameId: string,
+    versionId?: string,
+  ): Promise<number | null> {
+    if (!versionId) {
+      const version = await prisma.version.findFirst({
+        where: { gameId },
+        orderBy: {
+          versionIndex: "desc",
+        },
+      });
+      if (!version) {
+        return null;
+      }
+      versionId = version.versionId;
+    }
+
+    const manifest = await manifestGenerator.generateManifest(versionId);
+    if (!manifest) {
+      return null;
+    }
+
+    return manifestGenerator.calculateManifestSize(manifest);
+  }
+
+  private async isLatestVersion(
+    gameVersions: Version[],
+    version: Version,
+  ): Promise<boolean> {
+    return gameVersions.length > 0
+      ? gameVersions[0].versionId === version.versionId
+      : false;
+  }
+
+  async getBiggestGamesLatestVersion(top: number): Promise<VersionSize[]> {
+    const gameIds = await this.gameVersionsSizesCache.getKeys();
+    const latestGames = await Promise.all(
+      gameIds.map(async (gameId) => {
+        const versionsSizes = await this.gameVersionsSizesCache.get(gameId);
+        if (!versionsSizes) {
+          return null;
+        }
+        const latestVersionName = Object.keys(versionsSizes).find(
+          (versionId) => versionsSizes[versionId].latest,
+        );
+        if (!latestVersionName) {
+          return null;
+        }
+        return versionsSizes[latestVersionName] || null;
+      }),
+    );
+    return latestGames
+      .filter((game) => game !== null)
+      .sort((gameA, gameB) => gameB.size - gameA.size)
+      .slice(0, top);
+  }
+
+  async isGameVersionsSizesCacheEmpty() {
+    return (await this.gameVersionsSizesCache.getKeys()).length === 0;
+  }
+
+  async isGameSizesCacheEmpty() {
+    return (await this.gameSizesCache.getKeys()).length === 0;
+  }
+
+  async cacheAllCombinedGames() {
+    await this.clearGameSizesCache();
+    const games = await prisma.game.findMany({ include: { versions: true } });
+
+    await Promise.all(games.map((game) => this.cacheCombinedGame(game)));
+  }
+
+  async cacheCombinedGame(game: Game) {
+    const size = await this.getCombinedGameSize(game.id);
+    if (!size) {
+      this.gameSizesCache.remove(game.id);
+      return;
+    }
+    const gameSize = {
+      size,
+      gameName: game.mName,
+      gameId: game.id,
+    };
+    await this.gameSizesCache.set(game.id, gameSize);
+  }
+
+  async cacheAllGameVersions() {
+    await this.clearGameVersionsSizesCache();
+    const games = await prisma.game.findMany({
+      include: {
+        versions: {
+          orderBy: {
+            versionIndex: "desc",
+          },
+          take: 1,
+        },
+      },
+    });
+
+    await Promise.all(games.map((game) => this.cacheGameVersion(game)));
+  }
+
+  async cacheGameVersion(
+    game: Game & { versions: Version[] },
+    versionId?: string,
+  ) {
+    const cacheVersion = async (version: Version) => {
+      const size = await this.getGameVersionSize(game.id, version.versionId);
+      if (!version.versionId || !size) {
+        return;
+      }
+
+      const versionsSizes = {
+        [version.versionId]: {
+          size,
+          gameName: game.mName,
+          gameId: game.id,
+          latest: await this.isLatestVersion(game.versions, version),
+        },
+      };
+      const allVersionsSizes =
+        (await this.gameVersionsSizesCache.get(game.id)) || {};
+      await this.gameVersionsSizesCache.set(game.id, {
+        ...allVersionsSizes,
+        ...versionsSizes,
+      });
+    };
+
+    if (versionId) {
+      const version = await prisma.version.findFirst({
+        where: { gameId: game.id, versionId },
+      });
+      if (!version) {
+        return;
+      }
+      cacheVersion(version);
+      return;
+    }
+    if ("versions" in game) {
+      await Promise.all(game.versions.map(cacheVersion));
+    }
+  }
+
+  async getBiggestGamesAllVersions(top: number): Promise<GameSize[]> {
+    const gameIds = await this.gameSizesCache.getKeys();
+    const allGames = await Promise.all(
+      gameIds.map(async (gameId) => await this.gameSizesCache.get(gameId)),
+    );
+    return allGames
+      .filter((game) => game !== null)
+      .sort((gameA, gameB) => gameB.size - gameA.size)
+      .slice(0, top);
+  }
+
+  async deleteGameVersion(gameId: string, versionId: string) {
+    const game = await prisma.game.findFirst({ where: { id: gameId } });
+    if (game) {
+      await this.cacheCombinedGame(game);
+    }
+    const versionsSizes = await this.gameVersionsSizesCache.get(gameId);
+    if (!versionsSizes) {
+      return;
+    }
+    // Remove the version from the VersionsSizes object
+    const { [versionId]: _, ...updatedVersionsSizes } = versionsSizes;
+    await this.gameVersionsSizesCache.set(gameId, updatedVersionsSizes);
+  }
+
+  async deleteGame(gameId: string) {
+    this.gameSizesCache.remove(gameId);
+    this.gameVersionsSizesCache.remove(gameId);
+  }
+}
+
+export const gameSizeManager = new GameSizeManager();
+export default gameSizeManager;

server/internal/library/index.ts

@@ -17,8 +17,13 @@ import type { ImportVersion } from "~~/server/api/v1/admin/import/version/index.
 import type {
   GameVersionCreateInput,
   LaunchOptionCreateManyInput,
-  VersionCreateArgs,
+  VersionCreateInput,
+  VersionWhereInput,
 } from "~~/prisma/client/models";
+import type { PlatformLink } from "~~/prisma/client/client";
+import { convertIDToLink } from "../platform/link";
+import type { WorkingLibrarySource } from "~~/server/api/v1/admin/library/sources/index.get";
+import gameSizeManager from "../gamesize";
 
 export const VersionImportModes = ["game", "redist"] as const;
 export type VersionImportMode = (typeof VersionImportModes)[number];
@@ -51,13 +56,19 @@ class LibraryManager {
     this.libraries.delete(id);
   }
 
-  async fetchLibraries() {
+  async fetchLibraries(): Promise<WorkingLibrarySource[]> {
     const libraries = await prisma.library.findMany({});
-    const libraryWithMetadata = libraries.map((e) => ({
+
-      ...e,
+    const libraryWithMetadata = libraries.map(async (library) => {
-      working: this.libraries.has(e.id),
+      const theLibrary = this.libraries.get(library.id);
-    }));
+      const working = this.libraries.has(library.id);
-    return libraryWithMetadata;
+      return {
+        ...library,
+        working,
+        fsStats: working ? theLibrary?.fsStats() : undefined,
+      };
+    });
+    return await Promise.all(libraryWithMetadata);
   }
 
   async fetchGamesByLibrary() {
@@ -216,7 +227,17 @@ class LibraryManager {
     return await this.fetchLibraryObjectWithStatus(redists);
   }
 
-  private async fetchLibraryPath(id: string, mode: VersionImportMode) {
+  private async fetchLibraryPath(
+    id: string,
+    mode: VersionImportMode,
+    platform?: PlatformLink,
+  ): Promise<
+    | [
+        { mName: string; libraryId: string; libraryPath: string } | null,
+        VersionWhereInput,
+      ]
+    | undefined
+  > {
     switch (mode) {
       case "game":
         return [
@@ -224,8 +245,8 @@ class LibraryManager {
             where: { id },
             select: { mName: true, libraryId: true, libraryPath: true },
           }),
-          { gameId: id },
+          { gameId: id, gameVersions: { some: { platform } } },
-        ] as const;
+        ];
       case "redist":
         return [
           await prisma.redist.findUnique({
@@ -233,7 +254,7 @@ class LibraryManager {
             select: { mName: true, libraryId: true, libraryPath: true },
           }),
           { redistId: id },
-        ] as const;
+        ];
     }
     return undefined;
   }
@@ -241,11 +262,11 @@ class LibraryManager {
   private createVersionOptions(
     id: string,
     currentIndex: number,
-    mode: VersionImportMode,
     metadata: typeof ImportVersion.infer,
-  ): Partial<VersionCreateArgs["data"]> {
+  ): Omit<
-    switch (mode) {
+    VersionCreateInput,
-      case "game":
+    "versionPath" | "versionName" | "dropletManifest"
+  > {
     const installCreator = {
       install: {
         create: {
@@ -268,11 +289,17 @@ class LibraryManager {
       },
     } satisfies Partial<GameVersionCreateInput>;
 
+    switch (metadata.mode) {
+      case "game": {
         return {
-          gameId: id,
+          versionIndex: currentIndex,
+          game: {
+            connect: {
+              id,
+            },
+          },
           gameVersions: {
             create: {
-              versionIndex: currentIndex,
               delta: metadata.delta,
               umuIdOverride: metadata.umuId,
 
@@ -303,25 +330,64 @@ class LibraryManager {
             },
           },
         };
+      }
       case "redist":
-        return {};
+        return {
+          versionIndex: currentIndex,
+          redist: {
+            connect: {
+              id,
+            },
+          },
+          redistVersions: {
+            create: {
+              versionIndex: currentIndex,
+              delta: metadata.delta,
+
+              launches: {
+                createMany: {
+                  data: metadata.launches.map(
+                    (v) =>
+                      ({
+                        name: v.name,
+                        description: v.description,
+                        command: v.launchCommand,
+                        args: v.launchArgs,
+                      }) satisfies LaunchOptionCreateManyInput,
+                  ),
+                },
+              },
+
+              ...(metadata.install ? installCreator : undefined),
+              ...(metadata.uninstall ? uninstallCreator : undefined),
+
+              platform: {
+                connect: {
+                  id: metadata.platform,
+                },
+              },
+            },
+          },
+        };
     }
   }
 
   /**
    * Fetches recommendations and extra data about the version. Doesn't actually check if it's been imported.
-   * @param gameId
+   * @param id
-   * @param versionName
+   * @param version
    * @returns
    */
-  async fetchUnimportedVersionInformation(gameId: string, versionName: string) {
+  async fetchUnimportedVersionInformation(
-    const game = await prisma.game.findUnique({
+    id: string,
-      where: { id: gameId },
+    mode: VersionImportMode,
-      select: { libraryPath: true, libraryId: true, mName: true },
+    version: string,
-    });
+  ) {
-    if (!game || !game.libraryId) return undefined;
+    const value = await this.fetchLibraryPath(id, mode);
+    if (!value?.[0] || !value[0].libraryId) return undefined;
+    const [libraryDetails] = value;
 
-    const library = this.libraries.get(game.libraryId);
+    const library = this.libraries.get(libraryDetails.libraryId);
     if (!library) return undefined;
 
     const userPlatforms = await prisma.userPlatform.findMany({});
@@ -354,7 +420,10 @@ class LibraryManager {
       match: number;
     }> = [];
 
-    const files = await library.versionReaddir(game.libraryPath, versionName);
+    const files = await library.versionReaddir(
+      libraryDetails.libraryPath,
+      version,
+    );
     for (const filename of files) {
       const basename = path.basename(filename);
       const dotLocation = filename.lastIndexOf(".");
@@ -363,7 +432,7 @@ class LibraryManager {
       for (const [platform, checkExts] of Object.entries(fileExts)) {
         for (const checkExt of checkExts) {
           if (checkExt != ext) continue;
-          const fuzzyValue = fuzzy(basename, game.mName);
+          const fuzzyValue = fuzzy(basename, libraryDetails.mName);
           options.push({
             filename,
             platform,
@@ -404,17 +473,56 @@ class LibraryManager {
   async importVersion(
     id: string,
     version: string,
-    mode: VersionImportMode,
     metadata: typeof ImportVersion.infer,
   ) {
     const taskId = createVersionImportTaskId(id, version);
 
-    const value = await this.fetchLibraryPath(id, mode);
+    if (metadata.mode === "game") {
-    if (!value || !value[0]) return undefined;
+      if (metadata.onlySetup) {
+        if (!metadata.install)
+          throw createError({
+            statusCode: 400,
+            message: "An install command is required in only-setup mode.",
+          });
+      } else {
+        if (!metadata.delta && metadata.launches.length == 0)
+          throw createError({
+            statusCode: 400,
+            message:
+              "At least one launch command is required in non-delta, non-setup mode.",
+          });
+      }
+    }
+
+    const platform = await convertIDToLink(metadata.platform);
+    if (!platform)
+      throw createError({ statusCode: 400, message: "Invalid platform." });
+
+    const value = await this.fetchLibraryPath(id, metadata.mode, platform);
+    if (!value || !value[0])
+      throw createError({
+        statusCode: 400,
+        message: `${metadata.mode} not found.`,
+      });
     const [libraryDetails, idFilter] = value;
 
     const library = this.libraries.get(libraryDetails.libraryId);
-    if (!library) return undefined;
+    if (!library)
+      throw createError({
+        statusCode: 500,
+        message: "Library not found but exists in database?",
+      });
+
+    const currentIndex = await prisma.version.count({
+      where: { ...idFilter },
+    });
+
+    if (metadata.delta && currentIndex == 0)
+      throw createError({
+        statusCode: 400,
+        message:
+          "At least one pre-existing version of the same platform is required for delta mode.",
+      });
 
     taskHandler.create({
       id: taskId,
@@ -439,18 +547,14 @@ class LibraryManager {
 
         logger.info("Created manifest successfully!");
 
-        const currentIndex = await prisma.version.count({
-          where: { ...idFilter },
-        });
-
         // Then, create the database object
-        await prisma.version.create({
+        const createdVersion = await prisma.version.create({
           data: {
             versionPath: version,
             versionName: metadata.name ?? version,
             dropletManifest: manifest,
 
-            ...libraryManager.createVersionOptions(id, currentIndex, mode, metadata)
+            ...libraryManager.createVersionOptions(id, currentIndex, metadata),
           },
         });
 
@@ -460,10 +564,18 @@ class LibraryManager {
           nonce: `version-create-${id}-${version}`,
           title: `'${libraryDetails.mName}' ('${version}') finished importing.`,
           description: `Drop finished importing version ${version} for ${libraryDetails.mName}.`,
-          actions: [`View|/admin/library/${modeToLink[mode]}/${id}`],
+          actions: [`View|/admin/library/${modeToLink[metadata.mode]}/${id}`],
           acls: ["system:import:version:read"],
         });
 
+        if (metadata.mode === "game") {
+          await libraryManager.cacheCombinedGameSize(id);
+          await libraryManager.cacheGameVersionSize(
+            id,
+            createdVersion.versionId,
+          );
+        }
+
         progress(100);
       },
     });
@@ -493,6 +605,73 @@ class LibraryManager {
     if (!library) return undefined;
     return await library.readFile(game, version, filename, options);
   }
+
+  async deleteGameVersion(versionId: string) {
+    const version = await prisma.version.delete({
+      where: {
+        versionId,
+      },
+      include: {
+        game: true,
+      },
+    });
+
+    if (version.game) {
+      await gameSizeManager.deleteGameVersion(
+        version.game.id,
+        version.versionId,
+      );
+    }
+  }
+
+  async deleteGame(gameId: string) {
+    await prisma.game.delete({
+      where: {
+        id: gameId,
+      },
+    });
+    gameSizeManager.deleteGame(gameId);
+  }
+
+  async getGameVersionSize(
+    gameId: string,
+    versionId?: string,
+  ): Promise<number | null> {
+    return gameSizeManager.getGameVersionSize(gameId, versionId);
+  }
+
+  async getBiggestGamesCombinedVersions(top: number) {
+    if (await gameSizeManager.isGameSizesCacheEmpty()) {
+      await gameSizeManager.cacheAllCombinedGames();
+    }
+    return gameSizeManager.getBiggestGamesAllVersions(top);
+  }
+
+  async getBiggestGamesLatestVersions(top: number) {
+    if (await gameSizeManager.isGameVersionsSizesCacheEmpty()) {
+      await gameSizeManager.cacheAllGameVersions();
+    }
+    return gameSizeManager.getBiggestGamesLatestVersion(top);
+  }
+
+  async cacheCombinedGameSize(gameId: string) {
+    const game = await prisma.game.findFirst({ where: { id: gameId } });
+    if (!game) {
+      return;
+    }
+    await gameSizeManager.cacheCombinedGame(game);
+  }
+
+  async cacheGameVersionSize(gameId: string, versionId: string) {
+    const game = await prisma.game.findFirst({
+      where: { id: gameId },
+      include: { versions: true },
+    });
+    if (!game) {
+      return;
+    }
+    await gameSizeManager.cacheGameVersion(game, versionId);
+  }
 }
 
 export const libraryManager = new LibraryManager();

server/internal/library/provider.ts

@@ -57,6 +57,8 @@ export abstract class LibraryProvider<CFG> {
     filename: string,
     options?: { start?: number; end?: number },
   ): Promise<ReadableStream | undefined>;
+
+  abstract fsStats(): { freeSpace: number; totalSpace: number } | undefined;
 }
 
 export class GameNotFoundError extends Error {}

server/internal/library/providers/filesystem.ts

@@ -8,6 +8,7 @@ import { LibraryBackend } from "~~/prisma/client/enums";
 import fs from "fs";
 import path from "path";
 import droplet, { DropletHandler } from "@drop-oss/droplet";
+import { fsStats } from "~~/server/internal/utils/files";
 
 export const FilesystemProviderConfig = type({
   baseDir: "string",
@@ -122,4 +123,8 @@ export class FilesystemProvider
 
     return stream;
   }
+
+  fsStats() {
+    return fsStats(this.config.baseDir);
+  }
 }

server/internal/library/providers/flat.ts

@@ -6,6 +6,7 @@ import fs from "fs";
 import path from "path";
 import droplet from "@drop-oss/droplet";
 import { DROPLET_HANDLER } from "./filesystem";
+import { fsStats } from "~~/server/internal/utils/files";
 
 export const FlatFilesystemProviderConfig = type({
   baseDir: "string",
@@ -113,4 +114,8 @@ export class FlatFilesystemProvider
 
     return stream.getStream();
   }
+
+  fsStats() {
+    return fsStats(this.config.baseDir);
+  }
 }

server/internal/metadata/igdb.ts

@@ -72,7 +72,7 @@ interface IGDBCompanyWebsite extends IGDBItem {
 }
 
 interface IGDBCover extends IGDBItem {
-  url: string;
+  image_id: string;
 }
 
 interface IGDBSearchStub extends IGDBItem {
@@ -179,7 +179,7 @@ export class IGDBProvider implements MetadataProvider {
 
     if (response.status !== 200)
       throw new Error(
-        `Error in IDGB \nStatus Code: ${response.status}\n${response.data}`,
+        `Error in IGDB \nStatus Code: ${response.status}\n${response.data}`,
       );
 
     this.accessToken = response.data.access_token;
@@ -187,7 +187,7 @@ export class IGDBProvider implements MetadataProvider {
       seconds: response.data.expires_in,
     });
 
-    logger.info("IDGB done authorizing with twitch");
+    logger.info("IGDB done authorizing with twitch");
   }
 
   private async refreshCredentials() {
@@ -246,39 +246,47 @@ export class IGDBProvider implements MetadataProvider {
     return <T[]>response.data;
   }
 
-  private async _getMediaInternal(mediaID: IGDBID, type: string) {
+  private async _getMediaInternal(
+    mediaID: IGDBID,
+    type: string,
+    size: string = "t_thumb",
+  ) {
     if (mediaID === undefined)
       throw new Error(
         `IGDB mediaID when getting item of type ${type} was undefined`,
       );
 
-    const body = `where id = ${mediaID}; fields url;`;
+    const body = `where id = ${mediaID}; fields image_id;`;
     const response = await this.request<IGDBCover>(type, body);
 
-    let result = "";
+    if (!response.length || !response[0].image_id) {
-
+      throw new Error(`No image_id found for ${type} with id ${mediaID}`);
-    response.forEach((cover) => {
-      if (cover.url.startsWith("https:")) {
-        result = cover.url;
-      } else {
-        // twitch *sometimes* provides it in the format "//images.igdb.com"
-        result = `https:${cover.url}`;
     }
-    });
+
+    const imageId = response[0].image_id;
+    const result = `https://images.igdb.com/igdb/image/upload/${size}/${imageId}.jpg`;
 
     return result;
   }
 
   private async getCoverURL(id: IGDBID) {
-    return await this._getMediaInternal(id, "covers");
+    return await this._getMediaInternal(id, "covers", "t_cover_big");
   }
 
   private async getArtworkURL(id: IGDBID) {
-    return await this._getMediaInternal(id, "artworks");
+    return await this._getMediaInternal(id, "artworks", "t_1080p");
+  }
+
+  private async getScreenshotURL(id: IGDBID) {
+    return await this._getMediaInternal(id, "screenshots", "t_1080p");
+  }
+
+  private async getIconURL(id: IGDBID) {
+    return await this._getMediaInternal(id, "covers", "t_thumb");
   }
 
   private async getCompanyLogoURl(id: IGDBID) {
-    return await this._getMediaInternal(id, "company_logos");
+    return await this._getMediaInternal(id, "company_logos", "t_original");
   }
 
   private trimMessage(msg: string, len: number) {
@@ -327,7 +335,7 @@ export class IGDBProvider implements MetadataProvider {
       let icon = "";
       const cover = response[i].cover;
       if (cover !== undefined) {
-        icon = await this.getCoverURL(cover);
+        icon = await this.getIconURL(cover);
       } else {
         icon = "";
       }
@@ -355,23 +363,26 @@ export class IGDBProvider implements MetadataProvider {
     const currentGame = (await this.request<IGDBGameFull>("games", body)).at(0);
     if (!currentGame) throw new Error("No game found on IGDB with that id");
 
-    context?.logger.info("Using IDGB provider.");
+    context?.logger.info("Using IGDB provider.");
 
-    let iconRaw;
+    let iconRaw, coverRaw;
     const cover = currentGame.cover;
 
     if (cover !== undefined) {
       context?.logger.info("Found cover URL, using...");
-      iconRaw = await this.getCoverURL(cover);
+      iconRaw = await this.getIconURL(cover);
+      coverRaw = await this.getCoverURL(cover);
     } else {
       context?.logger.info("Missing cover URL, using fallback...");
       iconRaw = jdenticon.toPng(id, 512);
+      coverRaw = iconRaw;
     }
 
     const icon = createObject(iconRaw);
+    const coverID = createObject(coverRaw);
     let banner;
 
-    const images = [icon];
+    const images = [coverID];
     for (const art of currentGame.artworks ?? []) {
       const objectId = createObject(await this.getArtworkURL(art));
       if (!banner) {
@@ -384,6 +395,11 @@ export class IGDBProvider implements MetadataProvider {
       banner = createObject(jdenticon.toPng(id, 512));
     }
 
+    for (const screenshot of currentGame.screenshots ?? []) {
+      const objectId = createObject(await this.getScreenshotURL(screenshot));
+      images.push(objectId);
+    }
+
     context?.progress(20);
 
     const publishers: CompanyModel[] = [];
@@ -452,13 +468,25 @@ export class IGDBProvider implements MetadataProvider {
 
     const genres = await this.getGenres(currentGame.genres);
 
-    const deck = this.trimMessage(currentGame.summary, 280);
+    let description = "";
+    let shortDescription = "";
+
+    if (currentGame.summary.length > (currentGame.storyline?.length ?? 0)) {
+      description = currentGame.summary;
+      shortDescription = this.trimMessage(
+        currentGame.storyline ?? currentGame.summary,
+        280,
+      );
+    } else {
+      description = currentGame.storyline ?? currentGame.summary;
+      shortDescription = this.trimMessage(currentGame.summary, 280);
+    }
 
     const metadata = {
       id: currentGame.id.toString(),
       name: currentGame.name,
-      shortDescription: deck,
+      shortDescription,
-      description: currentGame.summary,
+      description,
       released,
 
       genres,
@@ -471,7 +499,7 @@ export class IGDBProvider implements MetadataProvider {
 
       icon,
       bannerId: banner,
-      coverId: icon,
+      coverId: coverID,
       images,
     };
 

server/internal/tasks/registry/debug.ts

@@ -1,4 +1,4 @@
-import { defineDropTask } from "..";
+// import { defineDropTask } from "..";
 
 /*
 export default defineDropTask({

server/internal/userstats/index.ts

@@ -0,0 +1,68 @@
+/*
+Handles managing collections
+*/
+
+import cacheHandler from "../cache";
+import prisma from "../db/database";
+import { DateTime } from "luxon";
+
+class UserStatsManager {
+  // Caches the user's core library
+  private userStatsCache = cacheHandler.createCache<number>("userStats");
+
+  async cacheUserSessions() {
+    const activeSessions =
+      (
+        await prisma.client.groupBy({
+          by: ["userId"],
+          where: {
+            id: { not: "system" },
+            lastConnected: {
+              gt: DateTime.now().minus({ months: 1 }).toISO(),
+            },
+          },
+        })
+      ).length || 0;
+    await this.userStatsCache.set("activeSessions", activeSessions);
+  }
+
+  private async cacheUserCount() {
+    const userCount =
+      (await prisma.user.count({
+        where: { id: { not: "system" } },
+      })) || 0;
+    await this.userStatsCache.set("userCount", userCount);
+  }
+
+  async cacheUserStats() {
+    await this.cacheUserSessions();
+    await this.cacheUserCount();
+  }
+
+  async getUserStats() {
+    let activeSessions = await this.userStatsCache.get("activeSessions");
+    let userCount = await this.userStatsCache.get("userCount");
+
+    if (activeSessions === null || userCount === null) {
+      await this.cacheUserStats();
+      activeSessions = (await this.userStatsCache.get("activeSessions")) || 0;
+      userCount = (await this.userStatsCache.get("userCount")) || 0;
+    }
+
+    return { activeSessions, userCount };
+  }
+
+  async addUser() {
+    const userCount = (await this.userStatsCache.get("userCount")) || 0;
+    await this.userStatsCache.set("userCount", userCount + 1);
+  }
+
+  async deleteUser() {
+    const userCount = (await this.userStatsCache.get("userCount")) || 1;
+    await this.userStatsCache.set("userCount", userCount - 1);
+    await this.cacheUserSessions();
+  }
+}
+
+export const manager = new UserStatsManager();
+export default manager;

server/internal/utils/files.ts

@@ -0,0 +1,47 @@
+import fs from "fs";
+import nodePath from "path";
+
+export function fsStats(folderPath: string) {
+  const stats = fs.statfsSync(folderPath);
+  const freeSpace = stats.bavail * stats.bsize;
+  const totalSpace = stats.blocks * stats.bsize;
+  return { freeSpace, totalSpace };
+}
+
+export function getFolderSize(folderPath: string): number {
+  const files = fs.readdirSync(folderPath, { withFileTypes: true });
+
+  const paths = files.map((file) => {
+    const path = nodePath.join(folderPath, file.name);
+    if (file.isDirectory()) {
+      return getFolderSize(path);
+    }
+    if (file.isFile()) {
+      return fs.statSync(path).size;
+    }
+    return 0;
+  });
+
+  return paths
+    .flat(Infinity)
+    .reduce(
+      (accumulator: number, currentValue: number) => accumulator + currentValue,
+      0,
+    );
+}
+
+export function formatBytes(bytes: number): string {
+  if (bytes < 1024) {
+    return `${bytes} B`;
+  }
+  if (bytes >= 1024 && bytes < Math.pow(1024, 2)) {
+    return `${(bytes / 1024).toFixed(2)} KiB`;
+  }
+  if (bytes >= Math.pow(1024, 2) && bytes < Math.pow(1024, 3)) {
+    return `${(bytes / (1024 * 1024)).toFixed(2)} MiB`;
+  }
+  if (bytes >= Math.pow(1024, 3) && bytes < Math.pow(1024, 4)) {
+    return `${(bytes / (1024 * 1024 * 1024)).toFixed(2)} GiB`;
+  }
+  return `${(bytes / Math.pow(1024, 4)).toFixed(2)} TiB`;
+}

server/plugins/03.metadata-init.ts

@@ -5,11 +5,13 @@ import { GiantBombProvider } from "../internal/metadata/giantbomb";
 import { IGDBProvider } from "../internal/metadata/igdb";
 import { ManualMetadataProvider } from "../internal/metadata/manual";
 import { PCGamingWikiProvider } from "../internal/metadata/pcgamingwiki";
-import { logger } from "~~/server/internal/logging";
+import { logger } from "../internal/logging";
+import { SteamProvider } from "../internal/metadata/steam";
 
 export default defineNitroPlugin(async (_nitro) => {
   const metadataProviders = [
     GiantBombProvider,
+    SteamProvider,
     PCGamingWikiProvider,
     IGDBProvider,
   ];