feat: phase 2

Newfound motivation

src/components/ModStore.vue

@@ -1,35 +1,18 @@
 <script setup lang="ts">
-import { Reactive, onMounted, reactive } from 'vue';
-import { invoke } from '@tauri-apps/api/core';
+import { onMounted } from 'vue';
 import ModStoreEntry from './ModStoreEntry.vue';
-import { ModEntry } from '../types';
+import { usePkgStore } from '../stores';
 
-const local: Reactive<{ [key: string]: ModEntry }> = reactive({});
-const listings: Reactive<ModEntry[]> = reactive([]);
+const pkgs = usePkgStore();
 
-const reload = async () => {
-    const modsRaw: ModEntry[] = await invoke('get_packages');
-    Object.keys(local).forEach((key) => {
-        delete local[key];
-    });
-    for (const m of modsRaw) {
-        local[`${m.namespace}-${m.name}`] = m;
-    }
-};
-
-onMounted(async () => {
-    Object.assign(listings, await invoke('get_listings'));
-    reload();
+onMounted(() => {
+    pkgs.fetch();
 });
 </script>
 
 <template>
-    <div v-for="l in listings" class="flex flex-row">
-        <ModStoreEntry
-            :mod="l"
-            :isLocal="local[`${l.namespace}-${l.name}`] !== undefined"
-            v-on:updated="reload()"
-        />
+    <div v-for="p in pkgs.allRemote" class="flex flex-row">
+        <ModStoreEntry :pkg="p" />
     </div>
 </template>