idolpx/meatloaf-config
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(SearchOverlay): persist search state across overlay open/close cycles

Browse Source
This commit is contained in:
Jaime Idolpx 2026-06-14 01:21:49 -04:00
parent e93bca4e3e
commit 6d12cebc05
1 changed files with 35 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/app/components/SearchOverlay.tsx
View File

@ -127,6 +127,19 @@ function scanPhaseLabel(phase: ScanPhase, value: number): string {
type SortField = 'name' | 'size';
type SortDir = 'asc' | 'desc';
// Persisted across overlay open/close cycles (survives unmount).
const _store = {
query: '',
results: [] as SearchResult[],
hasSearched: false,
showFilter: false,
filterSystem: null as string | null,
filterVideo: null as string | null,
filterLanguage: null as string | null,
sortField: 'name' as SortField,
sortDir: 'asc' as SortDir,
};
function FilterChips({
label, values, selected, onSelect,
}: {
@ -153,29 +166,42 @@ function FilterChips({
}
export default function SearchOverlay({ config, setConfig, onClose, onOpenFolder }: SearchOverlayProps) {
const [query, setQuery] = useState('');
const [query, setQuery] = useState(() => _store.query);
const [isSearching, setIsSearching] = useState(false);
const [isScanning, setIsScanning] = useState(false);
const [scanPhase, setScanPhase] = useState<ScanPhase | null>(null);
const [scanValue, setScanValue] = useState(0);
const [results, setResults] = useState<SearchResult[]>([]);
const [hasSearched, setHasSearched] = useState(false);
const [results, setResults] = useState<SearchResult[]>(() => _store.results);
const [hasSearched, setHasSearched] = useState(() => _store.hasSearched);
const [mountEntry, setMountEntry] = useState<SearchResult | null>(null);
const [actionEntry, setActionEntry] = useState<SearchResult | null>(null);
const [searchError, setSearchError] = useState<string | null>(null);
const [dbBytes, setDbBytes] = useState<number | null>(null);
const [dbPhase, setDbPhase] = useState<'idle' | 'downloading' | 'ready'>('idle');
const [showFilter, setShowFilter] = useState(false);
const [filterSystem, setFilterSystem] = useState<string | null>(null);
const [filterVideo, setFilterVideo] = useState<string | null>(null);
const [filterLanguage, setFilterLanguage] = useState<string | null>(null);
const [sortField, setSortField] = useState<SortField>('name');
const [sortDir, setSortDir] = useState<SortDir>('asc');
const [showFilter, setShowFilter] = useState(() => _store.showFilter);
const [filterSystem, setFilterSystem] = useState<string | null>(() => _store.filterSystem);
const [filterVideo, setFilterVideo] = useState<string | null>(() => _store.filterVideo);
const [filterLanguage, setFilterLanguage] = useState<string | null>(() => _store.filterLanguage);
const [sortField, setSortField] = useState<SortField>(() => _store.sortField);
const [sortDir, setSortDir] = useState<SortDir>(() => _store.sortDir);
useEffect(() => {
if (isLocateDbLoaded()) setDbPhase('ready');
}, []);
// Persist search state so it survives overlay close/reopen.
useEffect(() => {
_store.query = query;
_store.results = results;
_store.hasSearched = hasSearched;
_store.showFilter = showFilter;
_store.filterSystem = filterSystem;
_store.filterVideo = filterVideo;
_store.filterLanguage = filterLanguage;
_store.sortField = sortField;
_store.sortDir = sortDir;
}, [query, results, hasSearched, showFilter, filterSystem, filterVideo, filterLanguage, sortField, sortDir]);
const handleSearch = async () => {
if (!query.trim()) { toast.error('Please enter a search term'); return; }
setIsSearching(true);