Introduce override filters while searching setting (#242)

* Introduced override filters while searching setting

* update branch; change strings and method names

* fix eslint issue

* code review changes

* moved search setting types into its own type

---------

Co-authored-by: akxer <>

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,34 @@
+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';
+import { SearchMetadataKeys } from 'typings';
+
+export default function SearchSettings() {
+    const { metadata, settings } = useSearchSettings();
+
+    const setSettingValue = (key: SearchMetadataKeys, value: boolean) => {
+        requestUpdateServerMetadata(metadata ?? {}, [[key, value]]).catch(() =>
+            makeToast('Failed to save the default search settings to the server', 'warning'),
+        );
+    };
+    return (
+        <ListItem>
+            <ListItemIcon>
+                <SearchIcon />
+            </ListItemIcon>
+            <ListItemText primary="Ignore Filters when Searching" />
+            <ListItemSecondaryAction>
+                <Switch
+                    edge="end"
+                    checked={settings.ignoreFilters}
+                    onChange={(e) => setSettingValue('ignoreFilters', e.target.checked)}
+                />
+            </ListItemSecondaryAction>
+        </ListItem>
+    );
+}