Themes modal udpated

src/pages/homepage/components/SettingsButton.tsx

@@ -1,58 +1,58 @@
-import { Button, Menu, NavLink, Select } from '@mantine/core';
-import { useEffect, useState } from 'react';
-import { FiMenu, FiMonitor } from 'react-icons/fi';
-import {useQueryAPI} from '../../../hooks/useAPI';
-import button from '../../../styles/Button.module.css';
-import menu from '../../../styles/Menu.module.css';
-import navLink from '../../../styles/NavLink.module.css';
-import selectClasses from '../../../styles/Select.module.css';
+import { Button, Menu, NavLink, Select } from "@mantine/core";
+import { useEffect, useState } from "react";
+import { FiMenu, FiMonitor } from "react-icons/fi";
+import { useQueryAPI } from "../../../hooks/useAPI";
+import button from "../../../styles/Button.module.css";
+import menu from "../../../styles/Menu.module.css";
+import navLink from "../../../styles/NavLink.module.css";
+import selectClasses from "../../../styles/Select.module.css";
+
+function SettingsButton({ contentType, setContentType, theme }: any) {
+	const { data, isFetched } = useQueryAPI({ endpoint: "api/appCategories" });
+	const [categories, setCategories] = useState([
+		{ value: "All", label: "All" },
+	]);
 
-function SettingsButton({contentType, setContentType, theme}: any) {
-	const { data, isFetched } = useQueryAPI({ endpoint: 'api/appCategories' });
-	const [categories, setCategories] = useState([{value: 'All', label: 'All'}]);
-	
 	useEffect(() => {
-		if(data) {
-			const list: [any] = data.map((category: any) => {return {value: category.category, label: category.category}}) || [];
-			list.unshift({value: 'All', label: 'All'});
+		if (data) {
+			const list: [any] =
+				data.map((category: any) => {
+					return { value: category.category, label: category.category };
+				}) || [];
+			list.unshift({ value: "All", label: "All" });
 			setCategories(list);
 		}
 	}, [data, isFetched]);
 
 	function runWakeCommand() {
 		const requestOptions = {
-			method: 'GET',
-			headers: { 'Content-Type': 'application/json' },
+			method: "GET",
+			headers: { "Content-Type": "application/json" },
 		};
-		fetch('/trigger/api/wakeDakota', requestOptions);
+		fetch("/trigger/api/wakeDakota", requestOptions);
 	}
 	return (
-		<Menu
-			withinPortal={false}
-			withArrow
-			shadow='md'
-			position='top'
-		>
+		<Menu withinPortal={false} withArrow shadow="md" position="top">
 			<Menu.Target>
 				<Button className={button.settingsButton} classNames={button}>
 					<FiMenu />
 				</Button>
 			</Menu.Target>
-			<Menu.Dropdown
-				className={menu.dropdown}
-			>
+			<Menu.Dropdown className={menu.dropdown}>
 				<NavLink
-					label='Settings'
-					component='a'
-					href='/trigger/settings'
+					label="Settings"
+					component="a"
+					href="/trigger/settings"
 					className={navLink.defaultNavLink}
 					classNames={navLink}
 				/>
-				<NavLink label='Quick Actions'
+				<NavLink
+					label="Quick Actions"
 					className={navLink.defaultNavLink}
-					classNames={navLink}>
+					classNames={navLink}
+				>
 					<NavLink
-						label='Wake Dakota'
+						label="Wake Dakota"
 						leftSection={<FiMonitor />}
 						onClick={() => runWakeCommand()}
 						className={navLink.defaultNavLink}
@@ -60,12 +60,12 @@ function SettingsButton({contentType, setContentType, theme}: any) {
 					/>
 				</NavLink>
 				<Select
-					label='Homepage Filter'
+					label="Homepage Filter"
 					data={categories ?? []}
 					defaultValue={contentType}
 					withCheckIcon={false}
 					onChange={(data: any) => {
-						setContentType(data)
+						setContentType(data);
 					}}
 					classNames={selectClasses}
 					comboboxProps={{ withinPortal: false }}