Merge pull request #68 from Suwayomi/main

versioning

.github/workflows/build.yml

@@ -54,7 +54,7 @@ jobs:
         uses: docker/build-push-action@v3
         with:
           context: .
-          build-args: VERSION=${{ needs.GenTag.outputs.value }}
+          build-args: version=${{ needs.GenTag.outputs.value }}
           push: true
           tags: |
             ghcr.io/${{ steps.string.outputs.lowercase }}:latest,
@@ -74,6 +74,7 @@ jobs:
       - name: Install bun dependencies
         run: bun i
       - run: bun run build
+      - run: sed -i "s@BUILD_VERSION_PLACEHOLDER@${{ needs.GenTag.outputs.value }}@" ./build/index.html
       - name: Generate zip
         working-directory: ./build
         run: zip -r  Tachidesk-VUI-Web.zip ./*

Dockerfile

@@ -6,6 +6,8 @@ COPY . .
 FROM develop-stage as build-stage
 RUN bun install
 RUN bun run build
+ARG version="DevBuild"
+RUN sed -i "s@BUILD_VERSION_PLACEHOLDER@${version}@" ./build/index.html
 # production stage
 FROM nginxinc/nginx-unprivileged:1.23.2-alpine-slim as production-stage
 USER root

src/app.d.ts

@@ -7,3 +7,7 @@ declare namespace App {
 	// interface Error {}
 	// interface Platform {}
 }
+
+declare interface Window {
+	version: string | undefined;
+}

src/app.html

@@ -4,6 +4,9 @@
 		<meta charset="utf-8" />
 		<link rel="icon" href="%sveltekit.assets%/favicon.png" />
 		<meta name="viewport" content="width=device-width" />
+		<script>
+			window.version = 'BUILD_VERSION_PLACEHOLDER';
+		</script>
 		<!-- if i need to add UI env variables in the future -->
 		<!-- <script>
 			// CONFIGURATIONS_PLACEHOLDER

src/routes/(app)/downloads/+page.svelte

@@ -8,12 +8,11 @@
 		type DownloadChangedSubscription
 	} from '$lib/generated';
 	import { AppBarData } from '$lib/MountTitleAction';
-	import type { FetchResult, Observable } from '@apollo/client';
 	import { ProgressBar } from '@skeletonlabs/skeleton';
 	import DownloadsActions from './DownloadsActions.svelte';
 	import { filter } from './downloadsStores';
 
-	let downloads: Observable<FetchResult<DownloadChangedSubscription>> = downloadChanged({
+	let downloads = downloadChanged({
 		fetchPolicy: 'network-only'
 	});
 	AppBarData('Downloads', { component: DownloadsActions, props: { downloads } });

src/routes/(app)/manga/[MangaID]/(manga)/chaptersSide.svelte

@@ -7,26 +7,35 @@
 	import TooltipIconButton from '$lib/components/TooltipIconButton.svelte';
 	import {
 		deleteDownloadedChapters,
+		// downloadsOnChapters,
 		enqueueChapterDownloads,
 		updateChapters,
 		type GetMangaQuery
 	} from '$lib/generated';
 	import { longpress } from '$lib/press';
 	import { screens } from '$lib/screens';
+	import { ChapterSort, ChapterTitle, MangaMeta } from '$lib/simpleStores';
 	import { HelpDoSelect, HelpSelectall, HelpUpdateChapters, dlreabook } from '$lib/util';
 	import type { ApolloQueryResult } from '@apollo/client';
 	import { getModalStore, popup } from '@skeletonlabs/skeleton';
 	import { fade } from 'svelte/transition';
 	import ChaptersFilterModal from './ChaptersFilterModal.svelte';
 	import { selected, selectmode, type chaptertype } from './mangaStores';
-	import { MangaMeta, ChapterSort, ChapterTitle } from '$lib/simpleStores';
 
 	export let manga: ApolloQueryResult<GetMangaQuery> | undefined;
 	export let MangaID: number;
 
 	const modalStore = getModalStore();
 	const toastStore = getToastStore();
 	const mangaMeta = MangaMeta(MangaID);
+	// WIP add Downloads subscription to see chapter download status
+	// const downloads = downloadsOnChapters({
+	// 	fetchPolicy: 'network-only'
+	// });
+
+	// $: if ($downloads?.data?.downloadChanged) {
+	// 	console.log($downloads.data.downloadChanged);
+	// }
 
 	$: chaptersInfo = manga?.data.manga?.chapters.nodes as
 		| GetMangaQuery['manga']['chapters']['nodes']

src/routes/(app)/settings/about/+page.svelte

@@ -20,6 +20,14 @@
 				{$about.data.about.buildType}
 			</div>
 		</div>
+		{#if window.version}
+			<div class="pl-4 py-2">
+				<div class="text-xl">client version</div>
+				<div class="opacity-80">
+					VUI-{window.version}
+				</div>
+			</div>
+		{/if}
 		<div class="pl-4 py-2">
 			<div class="text-xl">Server version</div>
 			<div class="opacity-80">