diff --git a/client/src/javascript/components/sidebar/SearchBox.tsx b/client/src/javascript/components/sidebar/SearchBox.tsx index e23786d2..8907159f 100644 --- a/client/src/javascript/components/sidebar/SearchBox.tsx +++ b/client/src/javascript/components/sidebar/SearchBox.tsx @@ -10,7 +10,7 @@ const SearchBox: FC = observer(() => { const {i18n} = useLingui(); const inputRef = useRef(null); - const {searchFilter} = TorrentFilterStore.filters; + const {searchFilter} = TorrentFilterStore; useEffect(() => { if (inputRef.current != null) { diff --git a/client/src/javascript/components/sidebar/StatusFilters.tsx b/client/src/javascript/components/sidebar/StatusFilters.tsx index 1d1f4ad1..a5eb5fe4 100644 --- a/client/src/javascript/components/sidebar/StatusFilters.tsx +++ b/client/src/javascript/components/sidebar/StatusFilters.tsx @@ -71,8 +71,8 @@ const StatusFilters: FC = observer(() => { key={filter.slug} icon={filter.icon} isActive={ - (filter.slug === '' && !TorrentFilterStore.filters.statusFilter.length) || - TorrentFilterStore.filters.statusFilter.includes(filter.slug as TorrentStatus) + (filter.slug === '' && !TorrentFilterStore.statusFilter.length) || + TorrentFilterStore.statusFilter.includes(filter.slug as TorrentStatus) } name={filter.label} slug={filter.slug} diff --git a/client/src/javascript/components/sidebar/TagFilters.tsx b/client/src/javascript/components/sidebar/TagFilters.tsx index 754eeb80..48ac400a 100644 --- a/client/src/javascript/components/sidebar/TagFilters.tsx +++ b/client/src/javascript/components/sidebar/TagFilters.tsx @@ -32,8 +32,7 @@ const TagFilters: FC = observer(() => { count={TorrentFilterStore.taxonomy.tagCounts[filter] || 0} key={filter} isActive={ - (filter === '' && !TorrentFilterStore.filters.tagFilter.length) || - TorrentFilterStore.filters.tagFilter.includes(filter) + (filter === '' && !TorrentFilterStore.tagFilter.length) || TorrentFilterStore.tagFilter.includes(filter) } name={filter} slug={filter} diff --git a/client/src/javascript/components/sidebar/TrackerFilters.tsx b/client/src/javascript/components/sidebar/TrackerFilters.tsx index 7f8e895e..e1a45f20 100644 --- a/client/src/javascript/components/sidebar/TrackerFilters.tsx +++ b/client/src/javascript/components/sidebar/TrackerFilters.tsx @@ -31,8 +31,7 @@ const TrackerFilters: FC = observer(() => { count={TorrentFilterStore.taxonomy.trackerCounts[filter] || 0} key={filter} isActive={ - (filter === '' && !TorrentFilterStore.filters.trackerFilter.length) || - TorrentFilterStore.filters.trackerFilter.includes(filter) + (filter === '' && !TorrentFilterStore.trackerFilter.length) || TorrentFilterStore.trackerFilter.includes(filter) } name={filter} slug={filter} diff --git a/client/src/javascript/components/torrent-list/TorrentList.tsx b/client/src/javascript/components/torrent-list/TorrentList.tsx index 3435ceed..0229915c 100644 --- a/client/src/javascript/components/torrent-list/TorrentList.tsx +++ b/client/src/javascript/components/torrent-list/TorrentList.tsx @@ -36,7 +36,7 @@ const TorrentList: FC = observer(() => { useEffect(() => { const dispose = reaction( - () => TorrentFilterStore.filters, + () => TorrentFilterStore.filterTrigger, () => { if (listViewportRef.current != null) { listViewportRef.current.scrollTo(0); diff --git a/client/src/javascript/stores/TorrentFilterStore.ts b/client/src/javascript/stores/TorrentFilterStore.ts index c7b654aa..0201b6d4 100644 --- a/client/src/javascript/stores/TorrentFilterStore.ts +++ b/client/src/javascript/stores/TorrentFilterStore.ts @@ -6,17 +6,12 @@ import type {Taxonomy} from '@shared/types/Taxonomy'; import torrentStatusMap, {TorrentStatus} from '@shared/constants/torrentStatusMap'; class TorrentFilterStore { - filters: { - searchFilter: string; - statusFilter: Array; - tagFilter: Array; - trackerFilter: Array; - } = { - searchFilter: '', - statusFilter: [], - tagFilter: [], - trackerFilter: [], - }; + searchFilter = ''; + statusFilter: Array = []; + tagFilter: Array = []; + trackerFilter: Array = []; + + filterTrigger = false; taxonomy: Taxonomy = { statusCounts: {}, @@ -27,12 +22,7 @@ class TorrentFilterStore { }; @computed get isFilterActive() { - return ( - this.filters.searchFilter !== '' || - this.filters.statusFilter.length || - this.filters.tagFilter.length || - this.filters.trackerFilter.length - ); + return this.searchFilter !== '' || this.statusFilter.length || this.tagFilter.length || this.trackerFilter.length; } constructor() { @@ -40,12 +30,11 @@ class TorrentFilterStore { } clearAllFilters() { - this.filters = { - searchFilter: '', - statusFilter: [], - tagFilter: [], - trackerFilter: [], - }; + this.searchFilter = ''; + this.statusFilter = []; + this.tagFilter = []; + this.trackerFilter = []; + this.filterTrigger = !this.filterTrigger; } handleTorrentTaxonomyDiffChange(diff: Operation[]) { @@ -57,14 +46,13 @@ class TorrentFilterStore { } setSearchFilter(filter: string) { - this.filters = { - ...this.filters, - searchFilter: filter, - }; + this.searchFilter = filter; + this.filterTrigger = !this.filterTrigger; } setStatusFilters(filter: TorrentStatus | '', event: KeyboardEvent | MouseEvent | TouchEvent) { - this.computeFilters(torrentStatusMap, this.filters.statusFilter, filter, event); + this.computeFilters(torrentStatusMap, this.statusFilter, filter, event); + this.filterTrigger = !this.filterTrigger; } setTagFilters(filter: string, event: KeyboardEvent | MouseEvent | TouchEvent) { @@ -78,13 +66,15 @@ class TorrentFilterStore { tags.splice(tags.indexOf('untagged'), 1); tags.splice(1, 0, 'untagged'); - this.computeFilters(tags, this.filters.tagFilter, filter, event); + this.computeFilters(tags, this.tagFilter, filter, event); + this.filterTrigger = !this.filterTrigger; } setTrackerFilters(filter: string, event: KeyboardEvent | MouseEvent | TouchEvent) { const trackers = Object.keys(this.taxonomy.trackerCounts).sort((a, b) => a.localeCompare(b)); - this.computeFilters(trackers, this.filters.trackerFilter, filter, event); + this.computeFilters(trackers, this.trackerFilter, filter, event); + this.filterTrigger = !this.filterTrigger; } private computeFilters( @@ -107,7 +97,7 @@ class TorrentFilterStore { // from the previously selected index to the currently selected index, // add all filters to the selected array. - // if the newly selcted index is larger than the previous, start from + // if the newly selected index is larger than the previous, start from // the newly selected index and work backwards. otherwise go forwards. const increment = currentKeyIndex > lastKeyIndex ? -1 : 1; diff --git a/client/src/javascript/stores/TorrentStore.ts b/client/src/javascript/stores/TorrentStore.ts index 9b1a79b1..742e63d2 100644 --- a/client/src/javascript/stores/TorrentStore.ts +++ b/client/src/javascript/stores/TorrentStore.ts @@ -24,7 +24,7 @@ class TorrentStore { } @computed get filteredTorrents(): Array { - const {searchFilter, statusFilter, tagFilter, trackerFilter} = TorrentFilterStore.filters; + const {searchFilter, statusFilter, tagFilter, trackerFilter} = TorrentFilterStore; let filteredTorrents = Object.assign([], this.sortedTorrents) as Array;