feat(stats): add sentence search tab and fix mining card behavior

- Add Search tab with realtime subtitle sentence search, media context, and mining actions
- Persist library card size selection across reloads
- Fix selection text written only for sentence cards, not word/audio cards
- Fix word mining audio routed to SentenceAudio field when present
- Fix sentence card created immediately before slow media generation completes
- Fix Anki config resolved at request time for sentence mining
- Prefer non-Signs/Songs tracks when auto-selecting secondary subtitle language
This commit is contained in:
2026-06-05 01:39:06 -07:00
parent e9d97fb01e
commit eb5e07cfc0
33 changed files with 1532 additions and 128 deletions
@@ -36,7 +36,6 @@ export function VocabularyTab({
}: VocabularyTabProps) {
const { words, kanji, knownWords, loading, error } = useVocabulary();
const [selectedKanjiId, setSelectedKanjiId] = useState<number | null>(null);
const [search, setSearch] = useState('');
const [hideNames, setHideNames] = useState(false);
const [showExclusionManager, setShowExclusionManager] = useState(false);
@@ -116,14 +115,7 @@ export function VocabularyTab({
/>
</div>
<div className="flex items-center gap-3">
<input
type="text"
value={search}
onChange={(e) => setSearch(e.target.value)}
placeholder="Search words..."
className="flex-1 bg-ctp-surface0 border border-ctp-surface1 rounded-lg px-3 py-2 text-sm text-ctp-text placeholder:text-ctp-overlay2 focus:outline-none focus:border-ctp-blue"
/>
<div className="flex items-center justify-end gap-3">
{hasNames && (
<button
type="button"
@@ -178,12 +170,7 @@ export function VocabularyTab({
onSelectWord={handleSelectWord}
/>
<WordList
words={filteredWords}
selectedKey={null}
onSelectWord={handleSelectWord}
search={search}
/>
<WordList words={filteredWords} selectedKey={null} onSelectWord={handleSelectWord} />
<KanjiBreakdown
kanji={kanji}
@@ -179,15 +179,15 @@ export function WordDetailPanel({
};
return (
<div className="fixed inset-0 z-40">
<div className="fixed inset-0 z-40 flex items-center justify-center p-4">
<button
type="button"
aria-label="Close word detail panel"
className="absolute inset-0 bg-ctp-crust/70 backdrop-blur-[2px]"
onClick={onClose}
/>
<aside className="absolute right-0 top-0 h-full w-full max-w-xl border-l border-ctp-surface1 bg-ctp-mantle shadow-2xl">
<div className="flex h-full flex-col">
<aside className="relative flex max-h-[85vh] w-full max-w-xl flex-col overflow-hidden rounded-xl border border-ctp-surface1 bg-ctp-mantle shadow-2xl">
<div className="flex min-h-0 flex-1 flex-col">
<div className="flex items-start justify-between border-b border-ctp-surface1 px-5 py-4">
<div className="min-w-0">
<div className="text-xs uppercase tracking-[0.18em] text-ctp-overlay1">
@@ -22,7 +22,7 @@ export function posColor(pos: string): string {
export function PosBadge({ pos }: { pos: string }) {
return (
<span className={`rounded-full px-2 py-0.5 text-[11px] font-medium ${posColor(pos)}`}>
<span className={`rounded-full px-2 py-0.5 text-[11px] font-medium whitespace-nowrap ${posColor(pos)}`}>
{pos.replace(/_/g, ' ')}
</span>
);