feat: improve stats dashboard and annotation settings

stats/src/hooks/useAnimeDetail.ts

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useCallback } from 'react';
 import { getStatsClient } from './useStatsApi';
 import type { AnimeDetailData } from '../types/stats';
 
@@ -6,6 +6,7 @@ export function useAnimeDetail(animeId: number | null) {
   const [data, setData] = useState<AnimeDetailData | null>(null);
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
+  const [reloadKey, setReloadKey] = useState(0);
 
   useEffect(() => {
     if (animeId === null) return;
@@ -16,7 +17,9 @@ export function useAnimeDetail(animeId: number | null) {
       .then(setData)
       .catch((err: Error) => setError(err.message))
       .finally(() => setLoading(false));
-  }, [animeId]);
+  }, [animeId, reloadKey]);
 
-  return { data, loading, error };
+  const reload = useCallback(() => setReloadKey((k) => k + 1), []);
+
+  return { data, loading, error, reload };
 }

stats/src/hooks/useVocabulary.ts

@@ -5,6 +5,7 @@ import type { VocabularyEntry, KanjiEntry } from '../types/stats';
 export function useVocabulary() {
   const [words, setWords] = useState<VocabularyEntry[]>([]);
   const [kanji, setKanji] = useState<KanjiEntry[]>([]);
+  const [knownWords, setKnownWords] = useState<Set<string>>(new Set());
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
 
@@ -12,8 +13,8 @@ export function useVocabulary() {
     setLoading(true);
     setError(null);
     const client = getStatsClient();
-    Promise.allSettled([client.getVocabulary(500), client.getKanji(200)])
-      .then(([wordsResult, kanjiResult]) => {
+    Promise.allSettled([client.getVocabulary(500), client.getKanji(200), client.getKnownWords()])
+      .then(([wordsResult, kanjiResult, knownResult]) => {
         const errors: string[] = [];
 
         if (wordsResult.status === 'fulfilled') {
@@ -28,6 +29,10 @@ export function useVocabulary() {
           errors.push(kanjiResult.reason.message);
         }
 
+        if (knownResult.status === 'fulfilled') {
+          setKnownWords(new Set(knownResult.value));
+        }
+
         if (errors.length > 0) {
           setError(errors.join('; '));
         }
@@ -35,5 +40,5 @@ export function useVocabulary() {
       .finally(() => setLoading(false));
   }, []);
 
-  return { words, kanji, loading, error };
+  return { words, kanji, knownWords, loading, error };
 }