chore: Added libayatana-appindicator3.so.1 to appimage files

Signed-off-by: quexeky <git@quexeky.dev>

.github/workflows/clippy.yml

@@ -0,0 +1,23 @@
+on: push
+name: Clippy check
+jobs:
+  clippy_check:
+    runs-on: ubuntu-24.04
+    permissions:
+      checks: write
+    steps:
+      - uses: actions/checkout@v1
+      - name: install dependencies (ubuntu only)
+        run: |
+          sudo apt-get update
+          sudo apt-get install -y libglib2.0-dev libgtk-3-dev libwebkit2gtk-4.1-dev
+
+      - uses: actions-rs/toolchain@v1
+        with:
+            toolchain: nightly
+            components: clippy
+            override: true
+      - uses: actions-rs/clippy-check@v1
+        with:
+          token: ${{ secrets.GITHUB_TOKEN }}
+          args: --manifest-path ./src-tauri/Cargo.toml

.github/workflows/release.yml

@@ -22,9 +22,9 @@ jobs:
             args: '--target aarch64-apple-darwin'
           - platform: 'macos-latest' # for Intel based macs.
             args: '--target x86_64-apple-darwin'
-          - platform: 'ubuntu-24.04' # for Tauri v1 you could replace this with ubuntu-20.04.
+          - platform: 'ubuntu-22.04' # for Tauri v1 you could replace this with ubuntu-20.04.
             args: ''
-          - platform: 'ubuntu-24.04-arm'
+          - platform: 'ubuntu-22.04-arm'
             args: '--target aarch64-unknown-linux-gnu'
           - platform: 'windows-latest'
             args: ''
@@ -48,12 +48,42 @@ jobs:
           targets: ${{ matrix.platform == 'macos-latest' && 'aarch64-apple-darwin,x86_64-apple-darwin' || '' }}
 
       - name: install dependencies (ubuntu only)
-        if: matrix.platform == 'ubuntu-22.04' # This must match the platform value defined above.
+        if: matrix.platform == 'ubuntu-22.04' || matrix.platform == 'ubuntu-22.04-arm' # This must match the platform value defined above.
         run: |
           sudo apt-get update
-          sudo apt-get install -y libwebkit2gtk-4.0-dev libwebkit2gtk-4.1-dev libappindicator3-dev librsvg2-dev patchelf libgtk2.0-dev libsoup3.0-dev
+          sudo apt-get install -y libwebkit2gtk-4.1-dev libappindicator3-dev librsvg2-dev patchelf
         # webkitgtk 4.0 is for Tauri v1 - webkitgtk 4.1 is for Tauri v2.
-        # You can remove the one that doesn't apply to your app to speed up the workflow a bit.
+
+
+      - name: Import Apple Developer Certificate
+        if: matrix.platform == 'macos-latest'
+        env:
+          APPLE_CERTIFICATE: ${{ secrets.APPLE_CERTIFICATE }}
+          APPLE_CERTIFICATE_PASSWORD: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
+          KEYCHAIN_PASSWORD: ${{ secrets.KEYCHAIN_PASSWORD }}
+        run: |
+          echo $APPLE_CERTIFICATE | base64 --decode > certificate.p12
+          security create-keychain -p "$KEYCHAIN_PASSWORD" build.keychain
+          security default-keychain -s build.keychain
+          security unlock-keychain -p "$KEYCHAIN_PASSWORD" build.keychain
+          security set-keychain-settings -t 3600 -u build.keychain
+          
+          curl https://droposs.org/drop.crt --output drop.pem
+          sudo security authorizationdb write com.apple.trust-settings.admin allow
+          sudo security add-trusted-cert -d -r trustRoot -k build.keychain -p codeSign -u -1 drop.pem
+          sudo security authorizationdb remove com.apple.trust-settings.admin
+
+          security import certificate.p12 -k build.keychain -P "$APPLE_CERTIFICATE_PASSWORD" -T /usr/bin/codesign
+          security set-key-partition-list -S apple-tool:,apple:,codesign: -s -k "$KEYCHAIN_PASSWORD" build.keychain
+          security find-identity -v -p codesigning build.keychain
+
+      - name: Verify Certificate
+        if: matrix.platform == 'macos-latest'
+        run: |
+          CERT_INFO=$(security find-identity -v -p codesigning build.keychain | grep "Drop OSS")
+          CERT_ID=$(echo "$CERT_INFO" | awk -F'"' '{print $2}')
+          echo "CERT_ID=$CERT_ID" >> $GITHUB_ENV
+          echo "Certificate imported. Using identity: $CERT_ID"
 
       - name: install frontend dependencies
         run: yarn install # change this to npm, pnpm or bun depending on which one you use.
@@ -61,6 +91,10 @@ jobs:
       - uses: tauri-apps/tauri-action@v0
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          APPLE_CERTIFICATE: ${{ secrets.APPLE_CERTIFICATE }}
+          APPLE_CERTIFICATE_PASSWORD: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
+          APPLE_SIGNING_IDENTITY: ${{ env.CERT_ID }}
+          NO_STRIP: true
         with:
           tagName: v__VERSION__ # the action automatically replaces \_\_VERSION\_\_ with the app version.
           releaseName: 'Auto-release v__VERSION__'

.gitignore

@@ -27,3 +27,6 @@ dist-ssr
 
 src-tauri/flamegraph.svg
 src-tauri/perf*
+
+/*.AppImage
+/squashfs-root

.gitmodules

@@ -1,9 +1,6 @@
-[submodule "drop-base"]
-	path = drop-base
-	url = https://github.com/drop-oss/drop-base
 [submodule "src-tauri/tailscale/libtailscale"]
 	path = src-tauri/tailscale/libtailscale
 	url = https://github.com/tailscale/libtailscale.git
-[submodule "src-tauri/umu/umu-launcher"]
-	path = src-tauri/umu/umu-launcher
-	url = https://github.com/Open-Wine-Components/umu-launcher.git
+[submodule "libs/drop-base"]
+	path = libs/drop-base
+	url = https://github.com/drop-oss/drop-base.git

README.md

@@ -4,7 +4,7 @@ Drop app is the companion app for [Drop](https://github.com/Drop-OSS/drop). It u
 
 ## Running
 Before setting up the drop app, be sure that you have a server set up. 
-The instructions for this can be found on the [Drop Wiki](https://wiki.droposs.org/guides/quickstart.html)
+The instructions for this can be found on the [Drop Docs](https://docs.droposs.org/docs/guides/quickstart)
 
 ## Current features
 Currently supported are the following features:

build.mjs

@@ -0,0 +1,48 @@
+import fs from "fs";
+import process from "process";
+import childProcess from "child_process";
+import createLogger from "pino";
+
+const OUTPUT = "./.output";
+const logger = createLogger({ transport: { target: "pino-pretty" } });
+
+async function spawn(exec, opts) {
+  const output = childProcess.spawn(exec, { ...opts, shell: true });
+  output.stdout.on("data", (data) => {
+    process.stdout.write(data);
+  });
+  output.stderr.on("data", (data) => {
+    process.stderr.write(data);
+  });
+
+  return await new Promise((resolve, reject) => {
+    output.on("error", (err) => reject(err));
+    output.on("exit", () => resolve());
+  });
+}
+
+const views = fs.readdirSync(".").filter((view) => {
+  const expectedPath = `./${view}/package.json`;
+  return fs.existsSync(expectedPath);
+});
+
+fs.mkdirSync(OUTPUT, { recursive: true });
+
+for (const view of views) {
+  const loggerChild = logger.child({});
+  process.chdir(`./${view}`);
+
+  loggerChild.info(`Install deps for "${view}"`);
+  await spawn("yarn");
+
+  loggerChild.info(`Building "${view}"`);
+  await spawn("yarn build", {
+    env: { ...process.env, NUXT_APP_BASE_URL: `/${view}/` },
+  });
+
+  process.chdir("..");
+
+  fs.cpSync(`./${view}/.output/public`, `${OUTPUT}/${view}`, {
+    recursive: true,
+  });
+}

composables/app-state.ts

@@ -1,3 +0,0 @@
-import type { AppState } from "~/types";
-
-export const useAppState = () => useState<AppState>("state");

composables/game.ts

@@ -1,86 +0,0 @@
-import { invoke } from "@tauri-apps/api/core";
-import { listen } from "@tauri-apps/api/event";
-import { type Game, type GameStatus as DownloadStatus, type GameStatusEnum as DownloadStatusEnum, type GameVersion, type DownloadableMetadata, DownloadableType } from "~/types";
-
-const gameRegistry: { [key: string]: { game: Game; version?: GameVersion } } =
-  {};
-
-const downloadStatusRegistry: Map<DownloadableMetadata, Ref<DownloadStatus>> = new Map();
-
-type OptionDownloadStatus = { [key in DownloadStatusEnum]: { version_name?: string } };
-export type SerializedDownloadStatus = [
-  { type: DownloadStatusEnum },
-  OptionDownloadStatus | null
-];
-
-export const parseStatus = (status: SerializedDownloadStatus): DownloadStatus => {
-  console.log(status);
-  if (status[0]) {
-    return {
-      type: status[0].type,
-    };
-  } else if (status[1]) {
-    const [[gameStatus, options]] = Object.entries(status[1]);
-    return {
-      type: gameStatus as DownloadStatusEnum,
-      ...options,
-    };
-  } else {
-    throw new Error("No game status");
-  }
-};
-
-export const useStatus = (meta: DownloadableMetadata) => {
-  return downloadStatusRegistry.get(meta)
-}
-
-export const useGame = async (gameId: string) => {
-  const data: {
-    game: Game;
-    status: SerializedDownloadStatus;
-    version?: GameVersion;
-  } = await invoke("fetch_game", {
-    gameId,
-  });
-  const meta = {
-    id: gameId,
-    version: data.version?.versionName,
-    downloadType: DownloadableType.Game
-  } satisfies DownloadableMetadata;
-  if (!gameRegistry[gameId]) {
-
-    gameRegistry[gameId] = { game: data.game, version: data.version };
-  }
-  if (!downloadStatusRegistry.has(meta)) {
-    downloadStatusRegistry.set(meta, ref(parseStatus(data.status)));
-
-    listen(`update_game/${gameId}`, (event) => {
-      const payload: {
-        status: SerializedDownloadStatus;
-        version?: GameVersion;
-      } = event.payload as any;
-
-      downloadStatusRegistry.get(meta)!.value = parseStatus(payload.status);
-
-      /**
-       * I am not super happy about this.
-       * 
-       * This will mean that we will still have a version assigned if we have a game installed then uninstall it.
-       * It is necessary because a flag to check if we should overwrite seems excessive, and this function gets called
-       * on transient state updates. 
-       */
-      if (payload.version) {
-        gameRegistry[gameId].version = payload.version;
-      }
-    });
-  }
-
-
-  const game = gameRegistry[gameId];
-  const status = downloadStatusRegistry.get(meta)!;
-  return { ...game, status };
-};
-
-export type FrontendGameConfiguration = {
-  launchString: string;
-};

main/app.vue

@@ -1,4 +1,5 @@
 <template>
+  <LoadingIndicator />
   <NuxtLayout class="select-none w-screen h-screen">
     <NuxtPage />
     <ModalStack />
@@ -9,8 +10,6 @@
 import "~/composables/downloads.js";
 
 import { invoke } from "@tauri-apps/api/core";
-import { AppStatus } from "~/types";
-import { listen } from "@tauri-apps/api/event";
 import { useAppState } from "./composables/app-state.js";
 import {
   initialNavigation,
@@ -20,18 +19,26 @@ import {
 const router = useRouter();
 
 const state = useAppState();
-try {
-  state.value = JSON.parse(await invoke("fetch_state"));
-} catch (e) {
-  console.error("failed to parse state", e);
-}
 
-router.beforeEach(async () => {
+async function fetchState() {
   try {
     state.value = JSON.parse(await invoke("fetch_state"));
+    if (!state.value)
+      throw createError({
+        statusCode: 500,
+        statusMessage: `App state is: ${state.value}`,
+        fatal: true,
+      });
   } catch (e) {
     console.error("failed to parse state", e);
+    throw e;
   }
+}
+await fetchState();
+
+// This is inefficient but apparently we do it lol
+router.beforeEach(async () => {
+  await fetchState();
 });
 
 setupHooks();

main/components/GameStatusButton.vue

@@ -46,7 +46,7 @@
           class="absolute right-0 z-[500] mt-2 w-32 origin-top-right rounded-md bg-zinc-900 shadow-lg ring-1 ring-zinc-100/5 focus:outline-none"
         >
           <div class="py-1">
-            <MenuItem v-slot="{ active }">
+            <MenuItem v-if="showOptions" v-slot="{ active }">
               <button
                 @click="() => emit('options')"
                 :class="[
@@ -87,6 +87,8 @@ import {
   ChevronDownIcon,
   PlayIcon,
   QueueListIcon,
+  ServerIcon,
+  StopIcon,
   WrenchIcon,
 } from "@heroicons/vue/20/solid";
 
@@ -103,12 +105,18 @@ const emit = defineEmits<{
   (e: "uninstall"): void;
   (e: "kill"): void;
   (e: "options"): void;
+  (e: "resume"): void;
 }>();
 
 const showDropdown = computed(
   () =>
     props.status.type === GameStatusEnum.Installed ||
-    props.status.type === GameStatusEnum.SetupRequired
+    props.status.type === GameStatusEnum.SetupRequired ||
+    props.status.type === GameStatusEnum.PartiallyInstalled
+);
+
+const showOptions = computed(
+  () => props.status.type === GameStatusEnum.Installed
 );
 
 const styles: { [key in GameStatusEnum]: string } = {
@@ -118,6 +126,8 @@ const styles: { [key in GameStatusEnum]: string } = {
     "bg-zinc-800 text-white hover:bg-zinc-700 focus-visible:outline-zinc-700 hover:bg-zinc-700",
   [GameStatusEnum.Downloading]:
     "bg-zinc-800 text-white hover:bg-zinc-700 focus-visible:outline-zinc-700 hover:bg-zinc-700",
+  [GameStatusEnum.Validating]:
+    "bg-zinc-800 text-white hover:bg-zinc-700 focus-visible:outline-zinc-700 hover:bg-zinc-700",
   [GameStatusEnum.SetupRequired]:
     "bg-yellow-600 text-white hover:bg-yellow-500 focus-visible:outline-yellow-600 hover:bg-yellow-500",
   [GameStatusEnum.Installed]:
@@ -128,38 +138,46 @@ const styles: { [key in GameStatusEnum]: string } = {
     "bg-zinc-800 text-white hover:bg-zinc-700 focus-visible:outline-zinc-700 hover:bg-zinc-700",
   [GameStatusEnum.Running]:
     "bg-zinc-800 text-white hover:bg-zinc-700 focus-visible:outline-zinc-700 hover:bg-zinc-700",
+  [GameStatusEnum.PartiallyInstalled]:
+    "bg-blue-600 text-white hover:bg-blue-500 focus-visible:outline-blue-600 hover:bg-blue-500",
 };
 
 const buttonNames: { [key in GameStatusEnum]: string } = {
   [GameStatusEnum.Remote]: "Install",
   [GameStatusEnum.Queued]: "Queued",
   [GameStatusEnum.Downloading]: "Downloading",
+  [GameStatusEnum.Validating]: "Validating",
   [GameStatusEnum.SetupRequired]: "Setup",
   [GameStatusEnum.Installed]: "Play",
   [GameStatusEnum.Updating]: "Updating",
   [GameStatusEnum.Uninstalling]: "Uninstalling",
   [GameStatusEnum.Running]: "Stop",
+  [GameStatusEnum.PartiallyInstalled]: "Resume",
 };
 
 const buttonIcons: { [key in GameStatusEnum]: Component } = {
   [GameStatusEnum.Remote]: ArrowDownTrayIcon,
   [GameStatusEnum.Queued]: QueueListIcon,
   [GameStatusEnum.Downloading]: ArrowDownTrayIcon,
+  [GameStatusEnum.Validating]: ServerIcon,
   [GameStatusEnum.SetupRequired]: WrenchIcon,
   [GameStatusEnum.Installed]: PlayIcon,
   [GameStatusEnum.Updating]: ArrowDownTrayIcon,
   [GameStatusEnum.Uninstalling]: TrashIcon,
-  [GameStatusEnum.Running]: PlayIcon,
+  [GameStatusEnum.Running]: StopIcon,
+  [GameStatusEnum.PartiallyInstalled]: ArrowDownTrayIcon,
 };
 
 const buttonActions: { [key in GameStatusEnum]: () => void } = {
   [GameStatusEnum.Remote]: () => emit("install"),
   [GameStatusEnum.Queued]: () => emit("queue"),
   [GameStatusEnum.Downloading]: () => emit("queue"),
+  [GameStatusEnum.Validating]: () => emit("queue"),
   [GameStatusEnum.SetupRequired]: () => emit("launch"),
   [GameStatusEnum.Installed]: () => emit("launch"),
   [GameStatusEnum.Updating]: () => emit("queue"),
   [GameStatusEnum.Uninstalling]: () => {},
   [GameStatusEnum.Running]: () => emit("kill"),
+  [GameStatusEnum.PartiallyInstalled]: () => emit("resume"),
 };
 </script>

main/components/Header.vue

@@ -37,7 +37,7 @@
               <component class="h-5" :is="item.icon" />
             </HeaderWidget>
           </li>
-          <OfflineHeaderWidget v-if="state.status === AppStatus.Offline" />
+          <OfflineHeaderWidget v-if="state?.status === AppStatus.Offline" />
           <HeaderUserWidget />
         </ol>
       </div>

main/components/HeaderUserWidget.vue

@@ -1,5 +1,5 @@
 <template>
-  <Menu v-if="state.user" as="div" class="relative inline-block">
+  <Menu v-if="state?.user" as="div" class="relative inline-block">
     <MenuButton>
       <HeaderWidget>
         <div class="inline-flex items-center text-zinc-300 hover:text-white">
@@ -23,7 +23,7 @@
       <MenuItems
         class="absolute bg-zinc-900 right-0 top-10 z-50 w-56 origin-top-right focus:outline-none shadow-md"
       >
-        <PanelWidget class="flex-col gap-y-2">
+        <div class="flex-col gap-y-2">
           <NuxtLink
             to="/id/me"
             class="transition inline-flex items-center w-full py-3 px-4 hover:bg-zinc-800"
@@ -65,7 +65,7 @@
               </button>
             </MenuItem>
           </div>
-        </PanelWidget>
+        </div>
       </MenuItems>
     </transition>
   </Menu>
@@ -87,7 +87,7 @@ router.afterEach(() => {
 
 const state = useAppState();
 const profilePictureUrl: string = await useObject(
-  state.value.user?.profilePictureObjectId ?? ""
+  state.value?.user?.profilePictureObjectId ?? ""
 );
 const adminUrl: string = await invoke("gen_drop_url", {
   path: "/admin",

main/components/InitiateAuthModule.vue

@@ -13,11 +13,7 @@
       <div class="max-w-lg">
         <slot />
         <div class="mt-10">
-          <button
-            @click="() => authWrapper_wrapper()"
-            :disabled="loading"
-            class="text-sm text-left font-semibold leading-7 text-blue-600"
-          >
+          <div>
             <div v-if="loading" role="status">
               <svg
                 aria-hidden="true"
@@ -37,10 +33,19 @@
               </svg>
               <span class="sr-only">Loading...</span>
             </div>
-            <span v-else>
-              Sign in with your browser <span aria-hidden="true">&rarr;</span>
+            <span class="inline-flex gap-x-8 items-center" v-else>
+              <button
+                @click="() => authWrapper_wrapper()"
+                :disabled="loading"
+                class="px-3 py-1 inline-flex items-center gap-x-2 bg-zinc-700 rounded text-sm text-left font-semibold leading-7 text-white"
+              >
+                Sign in with your browser <ArrowTopRightOnSquareIcon class="size-4" />
+              </button>
+              <NuxtLink href="/auth/code" class="text-zinc-100 text-sm hover:text-zinc-300">
+                Use a code &rarr;
+              </NuxtLink>
             </span>
-          </button>
+          </div>
 
           <div class="mt-5" v-if="offerManual">
             <h1 class="text-zinc-100 font-semibold">Having trouble?</h1>
@@ -121,6 +126,7 @@
 
 <script setup lang="ts">
 import { XCircleIcon } from "@heroicons/vue/16/solid";
+import { ArrowTopRightOnSquareIcon } from "@heroicons/vue/20/solid";
 import { invoke } from "@tauri-apps/api/core";
 
 const loading = ref(false);

main/components/LibrarySearch.vue

@@ -1,19 +1,30 @@
 <template>
   <div>
-    <div
-      class="relative mb-3 transition-transform duration-300 hover:scale-105 active:scale-95"
-    >
+    <div class="mb-3 inline-flex gap-x-2">
       <div
-        class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3"
+        class="relative transition-transform duration-300 hover:scale-105 active:scale-95"
       >
-        <MagnifyingGlassIcon class="h-5 w-5 text-zinc-400" aria-hidden="true" />
+        <div
+          class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3"
+        >
+          <MagnifyingGlassIcon
+            class="h-5 w-5 text-zinc-400"
+            aria-hidden="true"
+          />
+        </div>
+        <input
+          type="text"
+          v-model="searchQuery"
+          class="block w-full rounded-lg border-0 bg-zinc-800/50 py-2 pl-10 pr-3 text-zinc-100 placeholder:text-zinc-500 focus:bg-zinc-800 focus:ring-2 focus:ring-inset focus:ring-blue-500 sm:text-sm sm:leading-6"
+          placeholder="Search library..."
+        />
       </div>
-      <input
-        type="text"
-        v-model="searchQuery"
-        class="block w-full rounded-lg border-0 bg-zinc-800/50 py-2 pl-10 pr-3 text-zinc-100 placeholder:text-zinc-500 focus:bg-zinc-800 focus:ring-2 focus:ring-inset focus:ring-blue-500 sm:text-sm sm:leading-6"
-        placeholder="Search library..."
-      />
+      <button
+        @click="() => calculateGames(true)"
+        class="p-1 flex items-center justify-center transition-transform duration-300 size-10 hover:scale-110 active:scale-90 rounded-lg bg-zinc-800/50 text-zinc-100"
+      >
+        <ArrowPathIcon class="size-4" />
+      </button>
     </div>
 
     <TransitionGroup name="list" tag="ul" class="flex flex-col gap-y-1.5">
@@ -60,7 +71,7 @@
 </template>
 
 <script setup lang="ts">
-import { MagnifyingGlassIcon } from "@heroicons/vue/20/solid";
+import { ArrowPathIcon, MagnifyingGlassIcon } from "@heroicons/vue/20/solid";
 import { invoke } from "@tauri-apps/api/core";
 import { GameStatusEnum, type Game, type GameStatus } from "~/types";
 import { TransitionGroup } from "vue";
@@ -70,22 +81,26 @@ import { listen } from "@tauri-apps/api/event";
 const gameStatusTextStyle: { [key in GameStatusEnum]: string } = {
   [GameStatusEnum.Installed]: "text-green-500",
   [GameStatusEnum.Downloading]: "text-blue-500",
+  [GameStatusEnum.Validating]: "text-blue-300",
   [GameStatusEnum.Running]: "text-green-500",
   [GameStatusEnum.Remote]: "text-zinc-500",
   [GameStatusEnum.Queued]: "text-blue-500",
   [GameStatusEnum.Updating]: "text-blue-500",
   [GameStatusEnum.Uninstalling]: "text-zinc-100",
   [GameStatusEnum.SetupRequired]: "text-yellow-500",
+  [GameStatusEnum.PartiallyInstalled]: "text-gray-400",
 };
 const gameStatusText: { [key in GameStatusEnum]: string } = {
   [GameStatusEnum.Remote]: "Not installed",
   [GameStatusEnum.Queued]: "Queued",
   [GameStatusEnum.Downloading]: "Downloading...",
+  [GameStatusEnum.Validating]: "Validating...",
   [GameStatusEnum.Installed]: "Installed",
   [GameStatusEnum.Updating]: "Updating...",
   [GameStatusEnum.Uninstalling]: "Uninstalling...",
   [GameStatusEnum.SetupRequired]: "Setup required",
   [GameStatusEnum.Running]: "Running",
+  [GameStatusEnum.PartiallyInstalled]: "Partially installed",
 };
 
 const router = useRouter();
@@ -99,16 +114,20 @@ const icons: { [key: string]: string } = {};
 
 const rawGames: Ref<Game[], Game[]> = ref([]);
 
-async function calculateGames() {
-  rawGames.value = await invoke("fetch_library");
-  for (const game of rawGames.value) {
+async function calculateGames(clearAll = false) {
+  if (clearAll) rawGames.value = [];
+  // If we update immediately, the navigation gets re-rendered before we
+  // add all the necessary state, and it freaks tf out
+  const newGames = await invoke<typeof rawGames.value>("fetch_library");
+  for (const game of newGames) {
     if (games[game.id]) continue;
     games[game.id] = await useGame(game.id);
   }
-  for (const game of rawGames.value) {
+  for (const game of newGames) {
     if (icons[game.id]) continue;
     icons[game.id] = await useObject(game.mIconObjectId);
   }
+  rawGames.value = newGames;
 }
 
 await calculateGames();

main/components/LoadingIndicator.vue

@@ -0,0 +1,7 @@
+<template></template>
+
+<script setup lang="ts">
+const loading = useLoadingIndicator();
+
+watch(loading.isLoading, console.log);
+</script>

main/components/MiniHeader.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="h-10 cursor-pointer flex flex-row items-center justify-between bg-zinc-950"
+    class="h-16 cursor-pointer flex flex-row items-center justify-between bg-zinc-950"
   >
     <div class="px-5 py-3 grow" @mousedown="() => window.startDragging()">
       <Wordmark class="mt-1" />

main/composables/app-state.ts

@@ -0,0 +1,3 @@
+import type { AppState } from "~/types";
+
+export const useAppState = () => useState<AppState | undefined>("state");

main/composables/game.ts

@@ -0,0 +1,73 @@
+import { invoke } from "@tauri-apps/api/core";
+import { listen } from "@tauri-apps/api/event";
+import type { Game, GameStatus, GameStatusEnum, GameVersion } from "~/types";
+
+const gameRegistry: { [key: string]: { game: Game; version?: GameVersion } } =
+  {};
+
+const gameStatusRegistry: { [key: string]: Ref<GameStatus> } = {};
+
+type OptionGameStatus = { [key in GameStatusEnum]: { version_name?: string } };
+export type SerializedGameStatus = [
+  { type: GameStatusEnum },
+  OptionGameStatus | null
+];
+
+export const parseStatus = (status: SerializedGameStatus): GameStatus => {
+  if (status[0]) {
+    return {
+      type: status[0].type,
+    };
+  } else if (status[1]) {
+    const [[gameStatus, options]] = Object.entries(status[1]);
+    return {
+      type: gameStatus as GameStatusEnum,
+      ...options,
+    };
+  } else {
+    throw new Error("No game status");
+  }
+};
+
+export const useGame = async (gameId: string) => {
+  if (!gameRegistry[gameId]) {
+    const data: {
+      game: Game;
+      status: SerializedGameStatus;
+      version?: GameVersion;
+    } = await invoke("fetch_game", {
+      gameId,
+    });
+    gameRegistry[gameId] = { game: data.game, version: data.version };
+    if (!gameStatusRegistry[gameId]) {
+      gameStatusRegistry[gameId] = ref(parseStatus(data.status));
+
+      listen(`update_game/${gameId}`, (event) => {
+        const payload: {
+          status: SerializedGameStatus;
+          version?: GameVersion;
+        } = event.payload as any;
+        gameStatusRegistry[gameId].value = parseStatus(payload.status);
+        
+        /**
+         * I am not super happy about this.
+         * 
+         * This will mean that we will still have a version assigned if we have a game installed then uninstall it.
+         * It is necessary because a flag to check if we should overwrite seems excessive, and this function gets called
+         * on transient state updates. 
+         */
+        if (payload.version) {
+          gameRegistry[gameId].version = payload.version;
+        }
+      });
+    }
+  }
+
+  const game = gameRegistry[gameId];
+  const status = gameStatusRegistry[gameId];
+  return { ...game, status };
+};
+
+export type FrontendGameConfiguration = {
+  launchString: string;
+};

main/composables/state-navigation.ts

@@ -1,9 +1,11 @@
+import { invoke } from "@tauri-apps/api/core";
 import { listen } from "@tauri-apps/api/event";
 import { data } from "autoprefixer";
 import { AppStatus, type AppState } from "~/types";
 
 export function setupHooks() {
   const router = useRouter();
+  const state = useAppState();
 
   listen("auth/processing", (event) => {
     router.push("/auth/processing");
@@ -15,8 +17,9 @@ export function setupHooks() {
     );
   });
 
-  listen("auth/finished", (event) => {
-    router.push("/store");
+  listen("auth/finished", async (event) => {
+    router.push("/library");
+    state.value = JSON.parse(await invoke("fetch_state"));
   });
 
   listen("download_error", (event) => {
@@ -27,12 +30,31 @@ export function setupHooks() {
         description: `Drop encountered an error while downloading your game: "${(
           event.payload as unknown as string
         ).toString()}"`,
-        buttonText: "Close"
+        buttonText: "Close",
       },
       (e, c) => c()
     );
   });
 
+  // This is for errors that (we think) aren't our fault
+  listen("launch_external_error", (event) => {
+    createModal(
+      ModalType.Confirmation,
+      {
+        title: "Did something go wrong?",
+        description:
+          "Drop detected that something might've gone wrong with launching your game. Do you want to open the log directory?",
+        buttonText: "Open",
+      },
+      async (e, c) => {
+        if (e == "confirm") {
+          await invoke("open_process_logs", { gameId: event.payload });
+        }
+        c();
+      }
+    );
+  });
+
   /*
 
   document.addEventListener("contextmenu", (event) => {
@@ -43,7 +65,13 @@ export function setupHooks() {
   */
 }
 
-export function initialNavigation(state: Ref<AppState>) {
+export function initialNavigation(state: ReturnType<typeof useAppState>) {
+  if (!state.value)
+    throw createError({
+      statusCode: 500,
+      statusMessage: "App state not valid",
+      fatal: true,
+    });
   const router = useRouter();
 
   switch (state.value.status) {
@@ -60,6 +88,6 @@ export function initialNavigation(state: Ref<AppState>) {
       router.push("/error/serverunavailable");
       break;
     default:
-      router.push("/store");
+      router.push("/library");
   }
 }

main/error.vue

@@ -7,6 +7,7 @@
         class="mx-auto w-full max-w-7xl px-6 pt-6 sm:pt-10 lg:col-span-2 lg:col-start-1 lg:row-start-1 lg:px-8"
       >
         <Logo class="h-10 w-auto sm:h-12" />
+        
       </header>
       <main
         class="mx-auto w-full max-w-7xl px-6 py-24 sm:py-32 lg:col-span-2 lg:col-start-1 lg:row-start-2 lg:px-8"

main/nuxt.config.ts

@@ -13,5 +13,9 @@ export default defineNuxtConfig({
 
   ssr: false,
 
-  extends: [["./drop-base"]],
+  extends: [["../libs/drop-base"]],
+
+  app: {
+    baseURL: "/main",
+  }
 });

main/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "view",
+  "private": true,
+  "version": "0.3.1",
+  "type": "module",
+  "scripts": {
+    "build": "nuxt generate",
+    "dev": "nuxt dev",
+    "postinstall": "nuxt prepare",
+    "tauri": "tauri"
+  },
+  "dependencies": {
+    "@headlessui/vue": "^1.7.23",
+    "@heroicons/vue": "^2.1.5",
+    "@nuxtjs/tailwindcss": "^6.12.2",
+    "@tauri-apps/api": "^2.7.0",
+    "koa": "^2.16.1",
+    "markdown-it": "^14.1.0",
+    "micromark": "^4.0.1",
+    "nuxt": "^3.16.0",
+    "scss": "^0.2.4",
+    "vue-router": "latest",
+    "vuedraggable": "^4.1.0"
+  },
+  "devDependencies": {
+    "@tailwindcss/forms": "^0.5.9",
+    "@tailwindcss/typography": "^0.5.15",
+    "@types/markdown-it": "^14.1.2",
+    "autoprefixer": "^10.4.20",
+    "postcss": "^8.4.47",
+    "sass-embedded": "^1.79.4",
+    "tailwindcss": "^3.4.13",
+    "typescript": "^5.8.3",
+    "vue-tsc": "^2.2.10"
+  },
+  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
+}

main/pages/auth/code.vue

@@ -0,0 +1,37 @@
+<template>
+  <div class="min-h-full w-full flex items-center justify-center">
+    <div class="flex flex-col items-center">
+      <div class="text-center">
+        <h1 class="text-3xl font-semibold font-display leading-6 text-zinc-100">
+          Device authorization
+        </h1>
+        <div class="mt-4">
+          <p class="text-sm text-zinc-400 max-w-md mx-auto">
+            Open Drop on another one of your devices, and use your account
+            dropdown to "Authorize client", and enter the code below.
+          </p>
+          <div
+            class="mt-8 flex items-center justify-center gap-x-5 text-8xl font-bold text-zinc-100"
+          >
+            <span v-for="letter in code.split('')">{{ letter }}</span>
+          </div>
+        </div>
+        <div class="mt-10 flex items-center justify-center gap-x-6">
+          <NuxtLink href="/auth" class="text-sm font-semibold text-blue-600"
+            ><span aria-hidden="true">&larr;</span> Use a different method
+          </NuxtLink>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { invoke } from "@tauri-apps/api/core";
+
+const code = await invoke<string>("auth_initiate_code");
+
+definePageMeta({
+  layout: "mini",
+});
+</script>

main/pages/library/[id]/index.vue

@@ -32,6 +32,7 @@
             @uninstall="() => uninstall()"
             @kill="() => kill()"
             @options="() => (configureModalOpen = true)"
+            @resume="() => resumeDownload()"
             :status="status"
           />
           <a
@@ -75,7 +76,7 @@
                       <TransitionGroup name="slide" tag="div" class="h-full">
                         <img
                           v-for="(url, index) in mediaUrls"
-                          :key="url"
+                          :key="index"
                           :src="url"
                           class="absolute inset-0 w-full h-full object-cover"
                           v-show="index === currentImageIndex"
@@ -156,8 +157,8 @@
     <template #default>
       <div class="sm:flex sm:items-start">
         <div class="mt-3 text-center sm:mt-0 sm:text-left">
-          <h3 class="text-base font-semibold text-zinc-100"
-            >Install {{ game.mName }}?
+          <h3 class="text-base font-semibold text-zinc-100">
+            Install {{ game.mName }}?
           </h3>
           <div class="mt-2">
             <p class="text-sm text-zinc-400">
@@ -349,9 +350,7 @@
     <template #buttons>
       <LoadingButton
         @click="() => install()"
-        :disabled="
-          !(versionOptions && versionOptions.length > 0)
-        "
+        :disabled="!(versionOptions && versionOptions.length > 0)"
         :loading="installLoading"
         type="submit"
         class="ml-2 w-full sm:w-fit"
@@ -369,7 +368,18 @@
     </template>
   </ModalTemplate>
 
-  <GameOptionsModal v-if="status.type === GameStatusEnum.Installed" v-model="configureModalOpen" :game-id="game.id" />
+  <!-- 
+  Dear future DecDuck,
+  This v-if is necessary for Vue rendering reasons
+  (it tries to access the game version for not installed games)
+  You have already tried to remove it
+  Don't.  
+  -->
+  <GameOptionsModal
+    v-if="status.type === GameStatusEnum.Installed"
+    v-model="configureModalOpen"
+    :game-id="game.id"
+  />
 
   <Transition
     enter="transition ease-out duration-300"
@@ -419,7 +429,7 @@
           <img
             v-for="(url, index) in mediaUrls"
             v-show="currentImageIndex === index"
-            :key="url"
+            :key="index"
             :src="url"
             class="max-h-[90vh] max-w-[90vw] object-contain"
             :alt="`${game.mName} screenshot ${index + 1}`"
@@ -440,10 +450,6 @@
 
 <script setup lang="ts">
 import {
-  Dialog,
-  DialogTitle,
-  TransitionChild,
-  TransitionRoot,
   Listbox,
   ListboxButton,
   ListboxLabel,
@@ -471,7 +477,6 @@ const router = useRouter();
 const id = route.params.id.toString();
 
 const { game: rawGame, status } = await useGame(id);
-console.log("status: ", status);
 const game = ref(rawGame);
 
 const remoteUrl: string = await invoke("gen_drop_url", {
@@ -482,7 +487,10 @@ const bannerUrl = await useObject(game.value.mBannerObjectId);
 
 // Get all available images
 const mediaUrls = await Promise.all(
-  game.value.mImageCarouselObjectIds.map((id) => useObject(id))
+  game.value.mImageCarouselObjectIds.map(async (v) => {
+    const src = await useObject(v);
+    return src;
+  })
 );
 
 const htmlDescription = micromark(game.value.mDescription);
@@ -533,6 +541,14 @@ async function install() {
   installLoading.value = false;
 }
 
+async function resumeDownload() {
+  try {
+    await invoke("resume_download", { gameId: game.value.id });
+  } catch (e) {
+    console.error(e);
+  }
+}
+
 async function launch() {
   try {
     await invoke("launch_game", { id: game.value.id });

main/pages/queue.vue

@@ -1,32 +1,46 @@
 <template>
   <div class="bg-zinc-950 p-4 min-h-full space-y-4">
-    <div class="h-16 overflow-hidden relative rounded-xl flex flex-row border border-zinc-900">
+    <div
+      class="h-16 overflow-hidden relative rounded-xl flex flex-row border border-zinc-900"
+    >
       <div
-        class="bg-zinc-900 z-10 w-32 flex flex-col gap-x-2 text-blue-400 font-display items-left justify-center pl-2">
+        class="bg-zinc-900 z-10 w-32 flex flex-col gap-x-2 text-blue-400 font-display items-left justify-center pl-2"
+      >
         <span class="font-semibold">{{ formatKilobytes(stats.speed) }}/s</span>
-        <span v-if="stats.time > 0" class="text-sm">{{ formatTime(stats.time) }} left</span>
+        <span v-if="stats.time > 0" class="text-sm"
+          >{{ formatTime(stats.time) }} left</span
+        >
       </div>
       <div class="absolute inset-0 h-full flex flex-row items-end justify-end">
-        <div v-for="bar in speedHistory" :style="{ height: `${(bar / speedMax) * 100}%` }"
-          class="w-[8px] bg-blue-600/40" />
+        <div
+          v-for="bar in speedHistory"
+          :style="{ height: `${(bar / speedMax) * 100}%` }"
+          class="w-[8px] bg-blue-600/40"
+        />
       </div>
     </div>
     <draggable v-model="queue.queue" @end="onEnd">
       <template #item="{ element }: { element: (typeof queue.value.queue)[0] }">
-        <li v-if="downloads.has(element.meta)" :key="element.meta.id"
-          class="mb-4 bg-zinc-900 rounded-lg flex flex-row justify-between gap-x-6 py-5 px-4">
+        <li
+          v-if="games[element.meta.id]"
+          :key="element.meta.id"
+          class="mb-4 bg-zinc-900 rounded-lg flex flex-row justify-between gap-x-6 py-5 px-4"
+        >
           <div class="w-full flex items-center max-w-md gap-x-4 relative">
-            <img class="size-24 flex-none bg-zinc-800 object-cover rounded" :src="downloads.get(element.meta)!.queueMeta.cover"
-              alt="" />
+            <img
+              class="size-24 flex-none bg-zinc-800 object-cover rounded"
+              :src="games[element.meta.id].cover"
+              alt=""
+            />
             <div class="min-w-0 flex-auto">
               <p class="text-xl font-semibold text-zinc-100">
                 <NuxtLink :href="`/library/${element.meta.id}`" class="">
                   <span class="absolute inset-x-0 -top-px bottom-0" />
-                  {{ downloads.get(element.meta)!.queueMeta.mName }}
+                  {{ games[element.meta.id].game.mName }}
                 </NuxtLink>
               </p>
               <p class="mt-1 flex text-xs/5 text-gray-500">
-                {{ downloads.get(element.meta)!.queueMeta.mShortDescription }}
+                {{ games[element.meta.id].game.mShortDescription }}
               </p>
             </div>
           </div>
@@ -35,28 +49,40 @@
               <p class="text-md text-zinc-500 uppercase font-display font-bold">
                 {{ element.status }}
               </p>
-              <div v-if="element.progress" class="mt-1 w-96 bg-zinc-800 rounded-lg overflow-hidden">
-                <div class="h-2 bg-blue-600" :style="{ width: `${element.progress * 100}%` }" />
+              <div
+                v-if="element.progress"
+                class="mt-1 w-96 bg-zinc-800 rounded-lg overflow-hidden"
+              >
+                <div
+                  class="h-2 bg-blue-600"
+                  :style="{ width: `${element.progress * 100}%` }"
+                />
               </div>
-              <span class="mt-2 inline-flex items-center gap-x-1 text-zinc-400 text-sm font-display"><span
-                  class="text-zinc-300">{{
-                    formatKilobytes(element.current / 1000)
-                  }}</span>
+              <span
+                class="mt-2 inline-flex items-center gap-x-1 text-zinc-400 text-sm font-display"
+                ><span class="text-zinc-300">{{
+                  formatKilobytes(element.current / 1000)
+                }}</span>
                 /
-                <span class="">{{ formatKilobytes(element.max / 1000) }}</span>
-                <ServerIcon class="size-5" />
-              </span>
+                <span class="">{{ formatKilobytes(element.max / 1000) }}</span
+                ><ServerIcon class="size-5"
+              /></span>
             </div>
             <button @click="() => cancelGame(element.meta)" class="group">
-              <XMarkIcon class="transition size-8 flex-none text-zinc-600 group-hover:text-zinc-300"
-                aria-hidden="true" />
+              <XMarkIcon
+                class="transition size-8 flex-none text-zinc-600 group-hover:text-zinc-300"
+                aria-hidden="true"
+              />
             </button>
           </div>
         </li>
         <p v-else>Loading...</p>
       </template>
     </draggable>
-    <div class="text-zinc-600 uppercase font-semibold font-display w-full text-center" v-if="queue.queue.length == 0">
+    <div
+      class="text-zinc-600 uppercase font-semibold font-display w-full text-center"
+      v-if="queue.queue.length == 0"
+    >
       No items in the queue
     </div>
   </div>
@@ -65,8 +91,12 @@
 <script setup lang="ts">
 import { ServerIcon, XMarkIcon } from "@heroicons/vue/20/solid";
 import { invoke } from "@tauri-apps/api/core";
-import { useStatus } from "~/composables/game";
-import type { DownloadableMetadata, Game, GameStatus, QueueMetadata } from "~/types";
+import { GameStatusEnum, type DownloadableMetadata, type Game, type GameStatus } from "~/types";
+
+// const actionNames = {
+//   [GameStatusEnum.Downloading]: "downloading",
+//   [GameStatusEnum.Verifying]: "verifying",
+// }
 
 const windowWidth = ref(window.innerWidth);
 window.addEventListener("resize", (event) => {
@@ -82,7 +112,9 @@ const speedMax = computed(
 );
 const previousGameId = ref<string | undefined>();
 
-const downloads: Ref<Map<DownloadableMetadata, { queueMeta: QueueMetadata, status: Ref<GameStatus> }>> = ref(new Map());
+const games: Ref<{
+  [key: string]: { game: Game; status: Ref<GameStatus>; cover: string };
+}> = ref({});
 
 function resetHistoryGraph() {
   speedHistory.value = [];
@@ -126,14 +158,13 @@ watch(stats, (v) => {
 
 function loadGamesForQueue(v: typeof queue.value) {
   for (const {
-    meta,
+    meta: { id },
   } of v.queue) {
-    if (downloads.value.get(meta)) return;
+    if (games.value[id]) return;
     (async () => {
-      const queueMeta: QueueMetadata = await invoke("get_queue_metadata", {meta});
-      const status = useStatus(meta)!;
-      const cover = await useObject(queueMeta.cover);
-      downloads.value.set(meta, { queueMeta: { ...queueMeta, cover }, status });
+      const gameData = await useGame(id);
+      const cover = await useObject(gameData.game.mCoverObjectId);
+      games.value[id] = { ...gameData, cover };
     })();
   }
 }

main/pages/settings/debug.vue

@@ -68,7 +68,7 @@
             Open Data Directory
           </button>
           <button
-            @click="() => queue_url_download()"
+            @click="() => openLogFile()"
             type="button"
             class="inline-flex items-center gap-x-2 rounded-md bg-blue-600 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
           >
@@ -106,8 +106,6 @@ const systemData = await invoke<{
   dataDir: string;
 }>("fetch_system_data");
 
-console.log(systemData);
-
 clientId.value = systemData.clientId;
 baseUrl.value = systemData.baseUrl;
 dataDir.value = systemData.dataDir;
@@ -115,15 +113,6 @@ dataDir.value = systemData.dataDir;
 const currentPlatform = await platform();
 platformInfo.value = currentPlatform;
 
-async function queue_url_download() {
-  try {
-    await invoke("queue_url_download", { url: "https://codeload.github.com/Drop-OSS/drop-app/zip/refs/heads/develop"});
-  }
-  catch (e) {
-    console.error(e);
-  }
-}
-
 async function openDataDir() {
   if (!dataDir.value) return;
   try {

main/pages/store/index.vue

@@ -0,0 +1,37 @@
+<template>
+  <div class="grow w-full h-full flex items-center justify-center">
+    <div class="flex flex-col items-center">
+      <BuildingStorefrontIcon
+        class="h-12 w-12 text-blue-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">
+          Store not supported in client
+        </h1>
+        <div class="mt-4">
+          <p class="text-sm text-zinc-400 max-w-lg">
+            Currently, Drop requires you to view the store in your browser.
+            Please click the button below to open it in your default browser.
+          </p>
+          <NuxtLink
+            :href="storeUrl"
+            target="_blank"
+            class="mt-6 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"
+          >
+            Open Store <ArrowTopRightOnSquareIcon class="size-4" />
+          </NuxtLink>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+import {
+  ArrowTopRightOnSquareIcon,
+  BuildingStorefrontIcon,
+} from "@heroicons/vue/20/solid";
+import { invoke } from "@tauri-apps/api/core";
+
+const storeUrl = await invoke<string>("gen_drop_url", { path: "/store" });
+</script>

main/tsconfig.json

@@ -0,0 +1,5 @@
+{
+  // https://nuxt.com/docs/guide/concepts/typescript
+  "extends": "./.nuxt/tsconfig.json",
+  "exclude": ["src-tauri/**/*"]
+}

main/types.ts

@@ -38,7 +38,6 @@ export type Game = {
 };
 
 export type GameVersion = {
-  versionName: string;
   launchCommandTemplate: string;
 };
 
@@ -55,16 +54,19 @@ export enum GameStatusEnum {
   Remote = "Remote",
   Queued = "Queued",
   Downloading = "Downloading",
+  Validating = "Validating",
   Installed = "Installed",
   Updating = "Updating",
   Uninstalling = "Uninstalling",
   SetupRequired = "SetupRequired",
   Running = "Running",
+  PartiallyInstalled = "PartiallyInstalled",
 }
 
 export type GameStatus = {
   type: GameStatusEnum;
   version_name?: string;
+  install_dir?: string;
 };
 
 export enum DownloadableType {
@@ -76,7 +78,7 @@ export enum DownloadableType {
 
 export type DownloadableMetadata = {
   id: string;
-  version?: string;
+  version: string;
   downloadType: DownloadableType;
 };
 
@@ -85,10 +87,3 @@ export type Settings = {
   maxDownloadThreads: number;
   forceOffline: boolean;
 };
-
-
-export type QueueMetadata = {
-  mName: string;
-  cover: string;
-  mShortDescription: string;
-}

optimize-appimage.sh

@@ -0,0 +1,22 @@
+## This script is largely useless, because there's not much we can do about AppImage size
+
+ARCH=$(uname -m)
+
+# build tauri apps
+# NO_STRIP=true yarn tauri build -- --verbose
+
+# unpack appimage
+APPIMAGE=$(ls ./src-tauri/target/release/bundle/appimage/*.AppImage)
+"$APPIMAGE" --appimage-extract
+
+# strip binary
+APPIMAGE_UNPACK="./squashfs-root"
+find $APPIMAGE_UNPACK -type f -exec strip -s {} \;
+
+APPIMAGETOOL=$(echo "obsolete-appimagetool-$ARCH.AppImage")
+wget -O $APPIMAGETOOL "https://github.com/AppImage/AppImageKit/releases/download/13/$APPIMAGETOOL"
+chmod +x $APPIMAGETOOL
+
+APPIMAGE_OUTPUT=$(./$APPIMAGETOOL $APPIMAGE_UNPACK | grep ".AppImage" | grep squashfs-root | awk '{ print $6 }')
+
+mv $APPIMAGE_OUTPUT "$APPIMAGE"

package.json

@@ -1,45 +1,22 @@
 {
   "name": "drop-app",
   "private": true,
-  "version": "0.3.0-rc-2",
   "type": "module",
   "scripts": {
-    "build": "nuxt build",
-    "dev": "nuxt dev",
-    "generate": "nuxt generate",
-    "preview": "nuxt preview",
-    "postinstall": "nuxt prepare",
+    "build": "node ./build.mjs",
     "tauri": "tauri"
   },
   "dependencies": {
-    "@headlessui/vue": "^1.7.23",
-    "@heroicons/vue": "^2.1.5",
-    "@nuxtjs/tailwindcss": "^6.12.2",
-    "@tauri-apps/api": ">=2.0.0",
-    "@tauri-apps/plugin-deep-link": "~2",
-    "@tauri-apps/plugin-dialog": "^2.0.1",
-    "@tauri-apps/plugin-os": "~2",
-    "@tauri-apps/plugin-shell": "^2.2.1",
-    "koa": "^2.16.1",
-    "markdown-it": "^14.1.0",
-    "micromark": "^4.0.1",
-    "nuxt": "^3.16.0",
-    "scss": "^0.2.4",
-    "vue": "latest",
-    "vue-router": "latest",
-    "vuedraggable": "^4.1.0"
+    "@tauri-apps/api": "^2.7.0",
+    "@tauri-apps/plugin-deep-link": "^2.4.1",
+    "@tauri-apps/plugin-dialog": "^2.3.2",
+    "@tauri-apps/plugin-opener": "^2.4.0",
+    "@tauri-apps/plugin-os": "^2.3.0",
+    "@tauri-apps/plugin-shell": "^2.3.0",
+    "pino": "^9.7.0",
+    "pino-pretty": "^13.1.1"
   },
   "devDependencies": {
-    "@tailwindcss/forms": "^0.5.9",
-    "@tailwindcss/typography": "^0.5.15",
-    "@tauri-apps/cli": ">=2.0.0",
-    "@types/markdown-it": "^14.1.2",
-    "autoprefixer": "^10.4.20",
-    "postcss": "^8.4.47",
-    "sass-embedded": "^1.79.4",
-    "tailwindcss": "^3.4.13",
-    "typescript": "^5.8.3",
-    "vue-tsc": "^2.2.10"
-  },
-  "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
+    "@tauri-apps/cli": "^2.7.1"
+  }
 }

pages/store/index.vue

@@ -1,4 +0,0 @@
-<template>
-  <iframe src="server://drop.local/store" class="w-full h-full" />
-</template>
-<script setup lang="ts"></script>

src-tauri/Cargo.toml

@@ -1,9 +1,9 @@
 [package]
 name = "drop-app"
-version = "0.3.0-rc-2"
+version = "0.3.1"
 description = "The client application for the open-source, self-hosted game distribution platform Drop"
 authors = ["Drop OSS"]
-edition = "2021"
+edition = "2024"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
@@ -25,7 +25,6 @@ tauri-build = { version = "2.0.0", features = [] }
 [dependencies]
 tauri-plugin-shell = "2.2.1"
 serde_json = "1"
-serde-binary = "0.5.0"
 rayon = "1.10.0"
 webbrowser = "1.0.2"
 url = "2.5.2"
@@ -67,6 +66,13 @@ filetime = "0.2.25"
 walkdir = "2.5.0"
 known-folders = "1.2.0"
 native_model = { version = "0.6.1", features = ["rmp_serde_1_3"] }
+tauri-plugin-opener = "2.4.0"
+bitcode = "0.6.6"
+reqwest-websocket = "0.5.0"
+futures-lite = "2.6.0"
+page_size = "0.6.0"
+sysinfo = "0.36.1"
+humansize = "2.1.3"
 # tailscale = { path = "./tailscale" }
 
 [dependencies.dynfmt]
@@ -74,8 +80,8 @@ version = "0.1.5"
 features = ["curly"]
 
 [dependencies.tauri]
-version = "2.1.1"
-features = ["tray-icon"]
+version = "2.7.0"
+features = ["protocol-asset", "tray-icon"]
 
 [dependencies.tokio]
 version = "1.40.0"
@@ -100,7 +106,7 @@ features = ["other_errors"] # You can also use "yaml_enc" or "bin_enc"
 [dependencies.reqwest]
 version = "0.12"
 default-features = false
-features = ["json", "http2", "blocking", "rustls-tls-webpki-roots"]
+features = ["json", "http2", "blocking", "rustls-tls", "native-tls-alpn", "rustls-tls-webpki-roots"]
 
 [dependencies.serde]
 version = "1"

src-tauri/build.rs

@@ -1,3 +1,3 @@
 fn main() {
-    tauri_build::build()
+    tauri_build::build();
 }

src-tauri/capabilities/default.json

@@ -14,6 +14,7 @@
     "core:window:allow-close",
     "deep-link:default",
     "dialog:default",
-    "os:default"
+    "os:default",
+    "opener:default"
   ]
 }

src-tauri/src/client/autostart.rs

@@ -1,4 +1,4 @@
-use crate::database::db::{borrow_db_checked, borrow_db_mut_checked, save_db};
+use crate::database::db::{borrow_db_checked, borrow_db_mut_checked};
 use log::debug;
 use tauri::AppHandle;
 use tauri_plugin_autostart::ManagerExt;
@@ -17,7 +17,6 @@ pub fn toggle_autostart_logic(app: AppHandle, enabled: bool) -> Result<(), Strin
     let mut db_handle = borrow_db_mut_checked();
     db_handle.settings.autostart = enabled;
     drop(db_handle);
-    save_db();
 
     Ok(())
 }

src-tauri/src/client/cleanup.rs

@@ -13,10 +13,10 @@ pub fn cleanup_and_exit(app: &AppHandle, state: &tauri::State<'_, std::sync::Mut
     let download_manager = state.lock().unwrap().download_manager.clone();
     match download_manager.ensure_terminated() {
         Ok(res) => match res {
-            Ok(_) => debug!("download manager terminated correctly"),
-            Err(_) => error!("download manager failed to terminate correctly"),
+            Ok(()) => debug!("download manager terminated correctly"),
+            Err(()) => error!("download manager failed to terminate correctly"),
         },
-        Err(e) => panic!("{:?}", e),
+        Err(e) => panic!("{e:?}"),
     }
 
     app.exit(0);

src-tauri/src/client/commands.rs

@@ -1,8 +1,4 @@
-use std::sync::Arc;
-
-use crate::{
-    client::url_downloader::URLDownloader, download_manager::{download_manager::DownloadManagerSignal, downloadable::Downloadable}, error::download_manager_error::DownloadManagerError, AppState
-};
+use crate::AppState;
 
 #[tauri::command]
 pub fn fetch_state(
@@ -13,22 +9,3 @@ pub fn fetch_state(
     drop(guard);
     Ok(cloned_state)
 }
-
-#[tauri::command]
-pub fn queue_url_download(
-    state: tauri::State<'_, std::sync::Mutex<AppState<'_>>>,
-    url: String
-) -> Result<(), DownloadManagerError<DownloadManagerSignal>> {
-    let sender = state.lock().unwrap().download_manager.get_sender();
-    let game_download_agent = Arc::new(Box::new(URLDownloader::new(
-        String::from("Test URL Download"),
-        "/home/quexeky/Downloads/test_url_download",
-        sender,
-        url,
-    )) as Box<dyn Downloadable + Send + Sync>);
-    Ok(state
-        .lock()
-        .unwrap()
-        .download_manager
-        .queue_download(game_download_agent)?)
-}

src-tauri/src/client/mod.rs

@@ -1,4 +1,3 @@
 pub mod autostart;
 pub mod cleanup;
 pub mod commands;
-pub mod url_downloader;

src-tauri/src/client/url_downloader.rs

@@ -1,173 +0,0 @@
-use std::{
-    path::{Path, PathBuf},
-    sync::{mpsc::Sender, Arc, Mutex},
-    usize,
-};
-
-use log::{debug, error};
-use reqwest::redirect::Policy;
-use tauri::{AppHandle, Emitter};
-
-use crate::{
-    database::
-        models::data::{DownloadType, DownloadableMetadata}
-    ,
-    download_manager::{
-        download_manager::{DownloadManagerSignal, DownloadStatus},
-        downloadable::Downloadable,
-        util::{
-            download_thread_control_flag::{DownloadThreadControl, DownloadThreadControlFlag},
-            progress_object::{ProgressHandle, ProgressObject},
-        },
-    },
-    error::application_download_error::ApplicationDownloadError,
-    games::downloads::download_logic::{DropDownloadPipeline, DropWriter},
-    DB,
-};
-
-pub struct URLDownloader {
-    id: String,
-    version: String,
-    url: String,
-    control_flag: DownloadThreadControl,
-    progress: Arc<ProgressObject>,
-    target: PathBuf,
-    sender: Sender<DownloadManagerSignal>,
-    status: Mutex<DownloadStatus>,
-}
-
-struct URLDownloaderManager {
-    current_offset: usize,
-}
-
-impl URLDownloader {
-    pub fn new<S: Into<String>, P: AsRef<Path>>(
-        id: String,
-        target: P,
-        sender: Sender<DownloadManagerSignal>,
-        url: S,
-    ) -> Self {
-        // Don't run by default
-        let control_flag = DownloadThreadControl::new(DownloadThreadControlFlag::Stop);
-
-        Self {
-            id,
-            version: String::new(),
-            control_flag,
-            target: target.as_ref().into(),
-            progress: Arc::new(ProgressObject::new(0, 0, sender.clone())),
-            sender,
-            status: Mutex::new(DownloadStatus::Queued),
-            url: url.into(),
-        }
-    }
-
-    fn download(&self, _app_handle: &AppHandle) -> Result<bool, ApplicationDownloadError> {
-        // TODO: Fix these unwraps and implement From<io::Error> for ApplicationDownloadError
-        let client = reqwest::blocking::Client::builder()
-            .redirect(Policy::default())
-            .build()
-            .unwrap();
-
-        let response = client.head(&self.url).send().unwrap();
-        let content_length = response
-            .headers()
-            .get(reqwest::header::CONTENT_LENGTH)
-            .map(|x| x.to_str().unwrap().parse().unwrap())
-            .unwrap_or(usize::MAX);
-        let response = client.get(&self.url).send().unwrap();
-
-        self.set_progress_object_params(content_length);
-
-        let progress = self.progress.get(0);
-
-        let progress_handle = ProgressHandle::new(progress, self.progress.clone());
-
-        let mut pipeline = DropDownloadPipeline::new(
-            response,
-            DropWriter::new(&self.target),
-            &self.control_flag,
-            progress_handle,
-            content_length,
-        );
-        
-
-        let completed = pipeline
-            .copy()
-            .map_err(|e| ApplicationDownloadError::IoError(e.kind()))?;
-        if !completed {
-            return Ok(false);
-        };
-
-        Ok(true)
-    }
-    fn set_progress_object_params(&self, max: usize) {
-        // Avoid re-setting it
-        if self.progress.get_max() != 0 {
-            return;
-        }
-
-        self.progress.set_max(max);
-        self.progress.set_size(1);
-        self.progress.set_time_now();
-    }
-}
-
-impl Downloadable for URLDownloader {
-    fn download(&self, app_handle: &AppHandle) -> Result<bool, ApplicationDownloadError> {
-        *self.status.lock().unwrap() = DownloadStatus::Downloading;
-        self.download(app_handle)
-    }
-
-    fn progress(&self) -> Arc<ProgressObject> {
-        self.progress.clone()
-    }
-
-    fn control_flag(&self) -> DownloadThreadControl {
-        self.control_flag.clone()
-    }
-
-    fn metadata(&self) -> DownloadableMetadata {
-        DownloadableMetadata {
-            id: self.id.clone(),
-            version: Some(self.version.clone()),
-            download_type: DownloadType::Tool,
-        }
-    }
-
-    fn on_initialised(&self, _app_handle: &tauri::AppHandle) {
-        *self.status.lock().unwrap() = DownloadStatus::Queued;
-    }
-
-    fn on_error(&self, app_handle: &tauri::AppHandle, error: &ApplicationDownloadError) {
-        *self.status.lock().unwrap() = DownloadStatus::Error;
-        app_handle
-            .emit("download_error", error.to_string())
-            .unwrap();
-
-        error!("error while managing download: {}", error);
-
-        let mut handle = DB.borrow_data_mut().unwrap();
-        handle
-            .applications
-            .transient_statuses
-            .remove(&self.metadata());
-    }
-
-    fn on_complete(&self, _app_handle: &tauri::AppHandle) {
-        debug!("Completed url download");
-    }
-
-    // TODO: fix this function. It doesn't restart the download properly, nor does it reset the state properly
-    fn on_incomplete(&self, _app_handle: &tauri::AppHandle) {
-        debug!("Incomplete url download");
-    }
-
-    fn on_cancelled(&self, _app_handle: &tauri::AppHandle) {
-        debug!("Cancelled url download");
-    }
-
-    fn status(&self) -> DownloadStatus {
-        self.status.lock().unwrap().clone()
-    }
-}

src-tauri/src/database/commands.rs

@@ -6,10 +6,12 @@ use std::{
 
 use serde_json::Value;
 
-use crate::{database::db::borrow_db_mut_checked, error::download_manager_error::DownloadManagerError};
+use crate::{
+    database::{db::borrow_db_mut_checked, scan::scan_install_dirs}, error::download_manager_error::DownloadManagerError,
+};
 
 use super::{
-    db::{borrow_db_checked, save_db, DATA_ROOT_DIR},
+    db::{borrow_db_checked, DATA_ROOT_DIR},
     debug::SystemData,
     models::data::Settings,
 };
@@ -26,8 +28,6 @@ pub fn fetch_download_dir_stats() -> Vec<PathBuf> {
 pub fn delete_download_dir(index: usize) {
     let mut lock = borrow_db_mut_checked();
     lock.applications.install_dirs.remove(index);
-    drop(lock);
-    save_db();
 }
 
 #[tauri::command]
@@ -58,7 +58,8 @@ pub fn add_download_dir(new_dir: PathBuf) -> Result<(), DownloadManagerError<()>
     }
     lock.applications.install_dirs.push(new_dir);
     drop(lock);
-    save_db();
+
+    scan_install_dirs();
 
     Ok(())
 }
@@ -72,8 +73,6 @@ pub fn update_settings(new_settings: Value) {
     }
     let new_settings: Settings = serde_json::from_value(current_settings).unwrap();
     db_lock.settings = new_settings;
-    drop(db_lock);
-    save_db();
 }
 #[tauri::command]
 pub fn fetch_settings() -> Settings {
@@ -85,7 +84,7 @@ pub fn fetch_system_data() -> SystemData {
     SystemData::new(
         db_handle.auth.as_ref().unwrap().client_id.clone(),
         db_handle.base_url.clone(),
-        DATA_ROOT_DIR.lock().unwrap().to_string_lossy().to_string(),
+        DATA_ROOT_DIR.to_string_lossy().to_string(),
         std::env::var("RUST_LOG").unwrap_or_else(|_| "info".to_string()),
     )
 }

src-tauri/src/database/db.rs

@@ -1,23 +1,24 @@
 use std::{
     fs::{self, create_dir_all},
+    mem::ManuallyDrop,
+    ops::{Deref, DerefMut},
     path::PathBuf,
-    sync::{LazyLock, Mutex, RwLockReadGuard, RwLockWriteGuard},
+    sync::{Arc, LazyLock, RwLockReadGuard, RwLockWriteGuard},
 };
 
 use chrono::Utc;
 use log::{debug, error, info, warn};
 use native_model::{Decode, Encode};
 use rustbreak::{DeSerError, DeSerializer, PathDatabase, RustbreakError};
-use serde::{de::DeserializeOwned, Serialize};
+use serde::{Serialize, de::DeserializeOwned};
 use url::Url;
 
 use crate::DB;
 
 use super::models::data::Database;
 
-pub static DATA_ROOT_DIR: LazyLock<Mutex<PathBuf>> =
-    LazyLock::new(|| Mutex::new(dirs::data_dir().unwrap().join("drop")));
-
+pub static DATA_ROOT_DIR: LazyLock<Arc<PathBuf>> =
+    LazyLock::new(|| Arc::new(dirs::data_dir().unwrap().join("drop")));
 
 // Custom JSON serializer to support everything we need
 #[derive(Debug, Default, Clone)]
@@ -27,15 +28,16 @@ impl<T: native_model::Model + Serialize + DeserializeOwned> DeSerializer<T>
     for DropDatabaseSerializer
 {
     fn serialize(&self, val: &T) -> rustbreak::error::DeSerResult<Vec<u8>> {
-        native_model::rmp_serde_1_3::RmpSerde::encode(val).map_err(|e| DeSerError::Internal(e.to_string()))
+        native_model::rmp_serde_1_3::RmpSerde::encode(val)
+            .map_err(|e| DeSerError::Internal(e.to_string()))
     }
 
     fn deserialize<R: std::io::Read>(&self, mut s: R) -> rustbreak::error::DeSerResult<T> {
         let mut buf = Vec::new();
         s.read_to_end(&mut buf)
             .map_err(|e| rustbreak::error::DeSerError::Other(e.into()))?;
-        let val =
-            native_model::rmp_serde_1_3::RmpSerde::decode(buf).map_err(|e| DeSerError::Internal(e.to_string()))?;
+        let val = native_model::rmp_serde_1_3::RmpSerde::decode(buf)
+            .map_err(|e| DeSerError::Internal(e.to_string()))?;
         Ok(val)
     }
 }
@@ -50,15 +52,14 @@ pub trait DatabaseImpls {
 }
 impl DatabaseImpls for DatabaseInterface {
     fn set_up_database() -> DatabaseInterface {
-        let data_root_dir = DATA_ROOT_DIR.lock().unwrap();
-        let db_path = data_root_dir.join("drop.db");
-        let games_base_dir = data_root_dir.join("games");
-        let logs_root_dir = data_root_dir.join("logs");
-        let cache_dir = data_root_dir.join("cache");
-        let pfx_dir = data_root_dir.join("pfx");
+        let db_path = DATA_ROOT_DIR.join("drop.db");
+        let games_base_dir = DATA_ROOT_DIR.join("games");
+        let logs_root_dir = DATA_ROOT_DIR.join("logs");
+        let cache_dir = DATA_ROOT_DIR.join("cache");
+        let pfx_dir = DATA_ROOT_DIR.join("pfx");
 
-        debug!("creating data directory at {:?}", data_root_dir);
-        create_dir_all(data_root_dir.clone()).unwrap();
+        debug!("creating data directory at {DATA_ROOT_DIR:?}");
+        create_dir_all(DATA_ROOT_DIR.as_path()).unwrap();
         create_dir_all(&games_base_dir).unwrap();
         create_dir_all(&logs_root_dir).unwrap();
         create_dir_all(&cache_dir).unwrap();
@@ -66,20 +67,18 @@ impl DatabaseImpls for DatabaseInterface {
 
         let exists = fs::exists(db_path.clone()).unwrap();
 
-        match exists {
-            true => match PathDatabase::load_from_path(db_path.clone()) {
+        if exists {
+            match PathDatabase::load_from_path(db_path.clone()) {
                 Ok(db) => db,
                 Err(e) => handle_invalid_database(e, db_path, games_base_dir, cache_dir),
-            },
-            false => {
-                let default = Database::new(games_base_dir, None, cache_dir);
-                debug!(
-                    "Creating database at path {}",
-                    db_path.as_os_str().to_str().unwrap()
-                );
-                PathDatabase::create_at_path(db_path, default)
-                    .expect("Database could not be created")
             }
+        } else {
+            let default = Database::new(games_base_dir, None, cache_dir);
+            debug!(
+                "Creating database at path {}",
+                db_path.as_os_str().to_str().unwrap()
+            );
+            PathDatabase::create_at_path(db_path, default).expect("Database could not be created")
         }
     }
 
@@ -100,17 +99,14 @@ fn handle_invalid_database(
     games_base_dir: PathBuf,
     cache_dir: PathBuf,
 ) -> rustbreak::Database<Database, rustbreak::backend::PathBackend, DropDatabaseSerializer> {
-    warn!("{}", _e);
+    warn!("{_e}");
     let new_path = {
         let time = Utc::now().timestamp();
         let mut base = db_path.clone();
-        base.set_file_name(format!("drop.db.backup-{}", time));
+        base.set_file_name(format!("drop.db.backup-{time}"));
         base
     };
-    info!(
-        "old database stored at: {}",
-        new_path.to_string_lossy().to_string()
-    );
+    info!("old database stored at: {}", new_path.to_string_lossy());
     fs::rename(&db_path, &new_path).unwrap();
 
     let db = Database::new(
@@ -122,32 +118,60 @@ fn handle_invalid_database(
     PathDatabase::create_at_path(db_path, db).expect("Database could not be created")
 }
 
-pub fn borrow_db_checked<'a>() -> RwLockReadGuard<'a, Database> {
+// To automatically save the database upon drop
+pub struct DBRead<'a>(RwLockReadGuard<'a, Database>);
+pub struct DBWrite<'a>(ManuallyDrop<RwLockWriteGuard<'a, Database>>);
+impl<'a> Deref for DBWrite<'a> {
+    type Target = Database;
+
+    fn deref(&self) -> &Self::Target {
+        &self.0
+    }
+}
+impl<'a> DerefMut for DBWrite<'a> {
+    fn deref_mut(&mut self) -> &mut Self::Target {
+        &mut self.0
+    }
+}
+impl<'a> Deref for DBRead<'a> {
+    type Target = Database;
+
+    fn deref(&self) -> &Self::Target {
+        &self.0
+    }
+}
+impl Drop for DBWrite<'_> {
+    fn drop(&mut self) {
+        unsafe {
+            ManuallyDrop::drop(&mut self.0);
+        }
+
+        match DB.save() {
+            Ok(()) => {}
+            Err(e) => {
+                error!("database failed to save with error {e}");
+                panic!("database failed to save with error {e}")
+            }
+        }
+    }
+}
+
+pub fn borrow_db_checked<'a>() -> DBRead<'a> {
     match DB.borrow_data() {
-        Ok(data) => data,
+        Ok(data) => DBRead(data),
         Err(e) => {
-            error!("database borrow failed with error {}", e);
-            panic!("database borrow failed with error {}", e);
+            error!("database borrow failed with error {e}");
+            panic!("database borrow failed with error {e}");
         }
     }
 }
 
-pub fn borrow_db_mut_checked<'a>() -> RwLockWriteGuard<'a, Database> {
+pub fn borrow_db_mut_checked<'a>() -> DBWrite<'a> {
     match DB.borrow_data_mut() {
-        Ok(data) => data,
+        Ok(data) => DBWrite(ManuallyDrop::new(data)),
         Err(e) => {
-            error!("database borrow mut failed with error {}", e);
-            panic!("database borrow mut failed with error {}", e);
-        }
-    }
-}
-
-pub fn save_db() {
-    match DB.save() {
-        Ok(_) => {}
-        Err(e) => {
-            error!("database failed to save with error {}", e);
-            panic!("database failed to save with error {}", e)
+            error!("database borrow mut failed with error {e}");
+            panic!("database borrow mut failed with error {e}");
         }
     }
 }