fix: clear filters no longer shows up after searching and clearing the search bar

This commit is contained in:
TrèsAbhi committed 2025-07-27 20:36:23 -05:00
1 parent 17755641a1
commit 4bc255a624
3 files changed
+5 -15

No files matched your search

@@ -21,27 +21,17 @@ export function SearchBar({ topResult, skeleton, onSelect }: SearchBarProps) {
const input = useRef<HTMLInputElement>(null); const input = useRef<HTMLInputElement>(null);
const performSearch = useCallback( const performSearch = useCallback(
debounce(() => { debounce(() => {
// tankFiltersStore.setState({ searching: false });
$tankFilters.setKey('searching', false); $tankFilters.setKey('searching', false);
if (!input.current) return; if (!input.current) return;
const sanitized = input.current.value.trim(); const sanitized = input.current.value.trim();
// tankFiltersStore.setState({ $tankFilters.setKey('search', sanitized.length === 0 ? null : sanitized);
// search: sanitized.length === 0 ? undefined : sanitized,
// });
$tankFilters.setKey(
'search',
sanitized.length === 0 ? undefined : sanitized,
);
}, 500), }, 500),
[], [],
); );
const handleChange = useCallback(() => { const handleChange = useCallback(() => {
// if (!tankFiltersStore.getState().searching) {
// tankFiltersStore.setState({ searching: true });
// }
if (!tankFilters.searching) { if (!tankFilters.searching) {
$tankFilters.setKey('searching', true); $tankFilters.setKey('searching', true);
} }
@@ -69,7 +59,7 @@ export function SearchBar({ topResult, skeleton, onSelect }: SearchBarProps) {
<TextField.Root <TextField.Root
variant="classic" variant="classic"
disabled={skeleton} disabled={skeleton}
defaultValue={tankFilters.search} defaultValue={tankFilters.search ?? undefined}
style={{ flex: 1 }} style={{ flex: 1 }}
ref={input} ref={input}
placeholder={strings.website.common.tank_search.search_bar_hint} placeholder={strings.website.common.tank_search.search_bar_hint}
@@ -60,7 +60,7 @@ export const TankSearch = memo<TankSearchProps>(
const tankFilters = useStore($tankFilters); const tankFilters = useStore($tankFilters);
const tankopediaSort = useStore($tankopediaSort); const tankopediaSort = useStore($tankopediaSort);
const tanksFiltered = useMemo(() => { const tanksFiltered = useMemo(() => {
if (tankFilters.search === undefined) { if (tankFilters.search === null) {
const filtered = awaitedTanksDefinitionsArray.filter((tank) => const filtered = awaitedTanksDefinitionsArray.filter((tank) =>
filterTank(tankFilters, tank), filterTank(tankFilters, tank),
); );
+2 -2
View File
@@ -18,7 +18,7 @@ export interface TankFilters {
classes: TankClass[]; classes: TankClass[];
types: TankType[]; types: TankType[];
testing: 'include' | 'exclude' | 'only'; testing: 'include' | 'exclude' | 'only';
search?: string; search: string | null;
searching: boolean; searching: boolean;
gunType: CaseType<GunDefinition>[]; gunType: CaseType<GunDefinition>[];
shells: [ShellType | null, ShellType | null, ShellType | null]; shells: [ShellType | null, ShellType | null, ShellType | null];
@@ -30,7 +30,7 @@ export const initialTankFilters: TankFilters = {
classes: [], classes: [],
types: [], types: [],
testing: 'include', testing: 'include',
search: undefined, search: null,
searching: false, searching: false,
gunType: [], gunType: [],
shells: [null, null, null], shells: [null, null, null],