Metadatafetcher template #176

website/app/composables/FetchKeys.ts

@@ -3,4 +3,5 @@ export const FetchKeys = {
     Chapters: { All: 'Chapters' },
     Manga: { All: 'Manga', Id: (id: string) => `Manga/${id}` },
     MangaConnector: { Id: (id: string) => `MangaConnector/${id}`, All: 'MangaConnector' },
+    Metadata: { Fetchers: 'Metadata', Links: 'Metadata/Links', Manga: (mangaId: string) => `Metadata/Links/${mangaId}` },
 };

website/app/pages/manga/[mangaId]/download/[mangaConnectorName].vue

@@ -19,7 +19,7 @@
 <script setup lang="ts">
 const route = useRoute();
 const mangaId = route.params.mangaId as string;
-const mangaConnectorName = route.params.mangaconnectorName as string;
+const mangaConnectorName = route.params.mangaConnectorName as string;
 
 const { data: manga } = await useApi('/v2/Manga/{MangaId}', { path: { MangaId: mangaId }, key: FetchKeys.Manga.Id(mangaId) });
 const libraryId = ref(manga.value?.fileLibraryId);

website/app/pages/manga/[mangaId]/index.vue

@@ -2,6 +2,7 @@
     <MangaDetailPage :manga="manga">
         <div class="grid gap-3 max-sm:grid-flow-row-dense min-sm:grid-cols-[70%_30%]">
             <ChaptersList v-if="manga" :manga-id="manga.key" />
+            <div class="flex flex-col gap-2">
                 <UCard>
                     <template #header>
                         <h1>Download</h1>
@@ -25,6 +26,21 @@
                         </div>
                     </div>
                 </UCard>
+                <UCard>
+                    <template #header>
+                        <h1>Metadata</h1>
+                    </template>
+                    <UTable v-if="metadataFetchers && metadata" :data="metadataFetchers" :columns="[{header: 'Name', id: 'name'}, {header: '', id: 'link'}]">
+                        <template #name-cell="{ row }">
+                            {{ row.original }}
+                        </template>
+                        <template #link-cell="{ row }">
+                            <UButton v-if="metadata.find(me => me.metadataFetcherName == row.original)">Unlink</UButton>
+                            <UButton v-else :to="`/manga/${mangaId}/linkMetadata/${row.original}`">Link</UButton>
+                        </template>
+                    </UTable>
+                </UCard>
+            </div>
         </div>
         <template #actions>
             <UButton trailing-icon="i-lucide-merge" :to="`${manga?.key}/merge/`" color="secondary">Merge</UButton>
@@ -49,6 +65,9 @@ const { data: manga } = await useApi('/v2/Manga/{MangaId}', {
 });
 const libraryId = ref(manga.value?.fileLibraryId);
 
+const { data: metadataFetchers } = await useApi('/v2/MetadataFetcher', { key: FetchKeys.Metadata.Fetchers });
+const { data: metadata } = await useApi('/v2/MetadataFetcher/Links/{MangaId}', { path: { MangaId: mangaId }, key: FetchKeys.Metadata.Manga(mangaId) });
+
 const setRequestedFrom = async (MangaConnectorName: string, IsRequested: boolean) => {
     await useApi('/v2/Manga/{MangaId}/DownloadFrom/{MangaConnectorName}/{IsRequested}', {
         method: 'PATCH',

website/app/pages/manga/[mangaId]/linkMetadata/[metadataFetcherName].vue

@@ -0,0 +1,31 @@
+<template>
+    <MangaDetailPage :manga="manga">
+        <UCard>
+            <template #header>
+                <h1>{{ metadataFetcherName }}</h1>
+            </template>
+            <template #default>
+                <p>tbd</p>
+            </template>
+        </UCard>
+    </MangaDetailPage>
+</template>
+
+
+<script setup lang="ts">
+
+const route = useRoute();
+const mangaId = route.params.mangaId as string;
+const metadataFetcherName = route.params.metadataFetcherName as string;
+
+const { data: manga } = await useApi('/v2/Manga/{MangaId}', {
+    path: { MangaId: mangaId },
+    key: FetchKeys.Manga.Id(mangaId),
+    onResponseError: (e) => {
+        console.error(e);
+        navigateTo('/');
+    },
+});
+
+useHead({ title: `Link Metadata ${manga.value?.name} ${metadataFetcherName}` });
+</script>

website/app/pages/search.vue

@@ -42,7 +42,7 @@
                         :expanded="i === expanded"
                         @click="expanded = expanded === i ? -1 : i">
                         <template #actions="manga">
-                            <UButton :to="`download/${connector.name}/${manga.key}`">Download</UButton>
+                            <UButton :to="`/manga/${manga.key}/download/${connector.name}`">Download</UButton>
                         </template>
                     </MangaCard>
                 </div>