Flesh out volume data

src/lib/components/Reader/Reader.svelte

@@ -62,7 +62,13 @@
       if (showSecondPage() && page + 1 === pages.length && newPage > page) {
         return;
       }
-      updateProgress(volume.mokuroData.volume_uuid, clamp(newPage, 1, pages?.length));
+      const pageClamped = clamp(newPage, 1, pages?.length);
+      updateProgress(
+        volume.mokuroData.volume_uuid,
+        pageClamped,
+        getCharCount(pages, pageClamped) || 0,
+        pageClamped === pages.length
+      );
       zoomDefault();
     }
   }

src/lib/components/Settings/Settings.svelte

@@ -8,6 +8,7 @@
   import ReaderSettings from './Reader/ReaderSettings.svelte';
   import Profiles from './Profiles/Profiles.svelte';
   import CatalogSettings from './CatalogSettings.svelte';
+  import Stats from './Stats.svelte';
 
   let transitionParams = {
     x: 320,
@@ -47,6 +48,7 @@
       <AnkiConnectSettings />
       <Profiles />
       <CatalogSettings />
+      <Stats />
     </Accordion>
     <div class="flex flex-col gap-2">
       <Button outline on:click={onReset}>Reset</Button>

src/lib/components/Settings/Stats.svelte

@@ -0,0 +1,30 @@
+<script lang="ts">
+  import { volumes } from '$lib/settings';
+  import { AccordionItem, P } from 'flowbite-svelte';
+
+  $: completed = Object.values($volumes).reduce((total: number, { completed }) => {
+    if (completed) {
+      total++;
+    }
+    return total;
+  }, 0);
+
+  $: pagesRead = Object.values($volumes).reduce((total: number, { progress }) => {
+    total += progress;
+    return total;
+  }, 0);
+
+  $: charsRead = Object.values($volumes).reduce((total: number, { chars }) => {
+    total += chars;
+    return total;
+  }, 0);
+</script>
+
+<AccordionItem>
+  <span slot="header">Stats</span>
+  <div>
+    <p>Completed volumes: {completed}</p>
+    <p>Pages read: {pagesRead}</p>
+    <p>Characters read: {charsRead}</p>
+  </div>
+</AccordionItem>

src/lib/components/VolumeItem.svelte

@@ -1,5 +1,4 @@
 <script lang="ts">
-  import { goto } from '$app/navigation';
   import { page } from '$app/stores';
   import { progress } from '$lib/settings';
   import type { Volume } from '$lib/types';