Introduced override filters while searching setting

src/components/library/LibraryMangaGrid.tsx

@@ -11,6 +11,7 @@ import MangaGrid from 'components/MangaGrid';
 import { useLibraryOptionsContext } from 'components/context/LibraryOptionsContext';
 import { StringParam, useQueryParam } from 'use-query-params';
 import { useMediaQuery, useTheme } from '@mui/material';
+import { useSearchSettings } from 'util/searchSettings';
 
 const FILTERED_OUT_MESSAGE = 'There are no Manga matching this filter';
 
@@ -46,13 +47,16 @@ const filterManga = (
     query: NullAndUndefined<string>,
     unread: NullAndUndefined<boolean>,
     downloaded: NullAndUndefined<boolean>,
+    overrideFilters: boolean,
 ): IMangaCard[] =>
     manga.filter((m) => {
+        const isFiltered = downloadedFilter(downloaded, m) && unreadFilter(unread, m);
         if (query) {
-            return queryFilter(query, m);
+            const isQueried = queryFilter(query, m);
+            if (overrideFilters) return isQueried;
+            return isFiltered && isQueried;
         }
-
-        return downloadedFilter(downloaded, m) && unreadFilter(unread, m);
+        return isFiltered;
     });
 
 const sortByUnread = (a: IMangaCard, b: IMangaCard): number =>
@@ -114,11 +118,13 @@ const LibraryMangaGrid: React.FC<LibraryMangaGridProps & { lastLibraryUpdate: nu
     const isLargeScreen = useMediaQuery(theme.breakpoints.up('sm'));
     const defaultPageNumber = isLargeScreen ? 4 : 1;
     const [lastPageNum, setLastPageNum] = useState<number>(defaultPageNumber);
+    const { settings } = useSearchSettings();
+
     useEffect(() => {
-        setFilteredManga(filterManga(mangas, query, unread, downloaded));
+        setFilteredManga(filterManga(mangas, query, unread, downloaded, settings.overrideFilters));
         setLastPageNum(defaultPageNumber);
         window.scrollTo(0, 0);
-    }, [mangas, query, unread, downloaded]);
+    }, [mangas, query, unread, downloaded, settings.overrideFilters]);
 
     useEffect(() => {
         setSortedManga(sortManga(filteredManga, options.sorts, options.sortDesc));

src/screens/Settings.tsx

@@ -35,6 +35,7 @@ import NavbarContext from 'components/context/NavbarContext';
 import DarkTheme from 'components/context/DarkTheme';
 import useLocalStorage from 'util/useLocalStorage';
 import ListItemLink from 'components/util/ListItemLink';
+import SearchSettings from 'screens/settings/SearchSettings';
 
 export default function Settings() {
     const { setTitle, setAction } = useContext(NavbarContext);
@@ -121,6 +122,7 @@ export default function Settings() {
                         <Switch edge="end" checked={darkTheme} onChange={() => setDarkTheme(!darkTheme)} />
                     </ListItemSecondaryAction>
                 </ListItem>
+                <SearchSettings />
                 <ListItemButton>
                     <ListItemIcon>
                         <ViewModuleIcon />

src/screens/settings/SearchSettings.tsx

@@ -0,0 +1,33 @@
+import { ListItem, ListItemText, Switch } from '@mui/material';
+import ListItemSecondaryAction from '@mui/material/ListItemSecondaryAction';
+import React from 'react';
+import { useSearchSettings } from 'util/searchSettings';
+import { requestUpdateServerMetadata } from 'util/metadata';
+import makeToast from 'components/util/Toast';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import SearchIcon from '@mui/icons-material/Search';
+
+export default function SearchSettings() {
+    const { metadata, settings } = useSearchSettings();
+
+    const setSettingValue = (key: keyof ISearchSettings, value: boolean) => {
+        requestUpdateServerMetadata(metadata ?? {}, [[key, value]]).catch(() =>
+            makeToast('Failed to save the default reader settings to the server', 'warning'),
+        );
+    };
+    return (
+        <ListItem>
+            <ListItemIcon>
+                <SearchIcon />
+            </ListItemIcon>
+            <ListItemText primary="Override Filters when Searching" />
+            <ListItemSecondaryAction>
+                <Switch
+                    edge="end"
+                    checked={settings.overrideFilters}
+                    onChange={(e) => setSettingValue('overrideFilters', e.target.checked)}
+                />
+            </ListItemSecondaryAction>
+        </ListItem>
+    );
+}

src/typings.d.ts

@@ -69,7 +69,7 @@ interface IMetadataHolder<VALUES extends AllowedMetadataValueTypes = string> {
 
 type AllowedMetadataValueTypes = string | boolean | number | undefined;
 
-type MangaMetadataKeys = keyof IReaderSettings;
+type MangaMetadataKeys = keyof (IReaderSettings & ISearchSettings);
 
 type AppMetadataKeys = MangaMetadataKeys;
 
@@ -177,6 +177,10 @@ interface IReaderSettings {
     readerType: ReaderType;
 }
 
+interface ISearchSettings {
+    overrideFilters: boolean;
+}
+
 interface IReaderPage {
     index: number;
     src: string;

src/util/searchSettings.ts

@@ -0,0 +1,30 @@
+import { useQuery } from 'util/client';
+import { getMetadataFrom } from 'util/metadata';
+
+export const getDefaultSettings = () =>
+    ({
+        overrideFilters: false,
+    } as ISearchSettings);
+
+const getReaderSettingsWithDefaultValueFallback = (
+    meta?: IMetadata,
+    defaultSettings?: ISearchSettings,
+    applyMetadataMigration: boolean = true,
+): ISearchSettings => ({
+    ...(getMetadataFrom(
+        { meta },
+        Object.entries(defaultSettings ?? getDefaultSettings()) as MetadataKeyValuePair[],
+        applyMetadataMigration,
+    ) as unknown as ISearchSettings),
+});
+
+export const useSearchSettings = (): {
+    metadata?: IMetadata;
+    settings: ISearchSettings;
+    loading: boolean;
+} => {
+    const { data: meta, loading } = useQuery<IMetadata>('/api/v1/meta');
+    const settings = getReaderSettingsWithDefaultValueFallback(meta);
+
+    return { metadata: meta, settings, loading };
+};