brandxtech/frontend
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

theme is saving properly to local storage

Browse source
This commit is contained in:
Carter 2025-04-16 12:29:02 -06:00
parent 9df40db30f
commit 67f8645a25
2 changed files with 49 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

83
src/navigation/Router.tsx
View file

@ -8,7 +8,6 @@ import { ErrorBoundary } from "react-error-boundary";
import { getWhitelabel } from "services/whiteLabel"; import { getWhitelabel } from "services/whiteLabel";
import Ventilation from "pages/VentEditor"; import Ventilation from "pages/VentEditor";
import { useGlobalState } from "providers"; import { useGlobalState } from "providers";
import { Box } from "@mui/material";
const DeviceHistory = lazy(() => import("pages/DeviceHistory")); const DeviceHistory = lazy(() => import("pages/DeviceHistory"));
const DevicePage = lazy(() => import("pages/Device")); const DevicePage = lazy(() => import("pages/Device"));
@ -289,54 +288,52 @@ export default function Router() {
return ( return (
<BrowserRouter> <BrowserRouter>
<Header /> <Header />
{/* <Box sx={{ height: "100%", minHeight: "200px" }}> */} <Suspense fallback={<LoadingScreen message="Loading Page"/>}>
<Suspense fallback={<LoadingScreen message="Loading Page"/>}> <Routes>
<Routes>
{/* Redirects */} {/* Redirects */}
<Route path="/callback" element={<Navigate to="/" />} /> <Route path="/callback" element={<Navigate to="/" />} />
{/* <Route path="/team/:teamID" element={<Navigate to="/teams/:teamID" />} /> */} {/* <Route path="/team/:teamID" element={<Navigate to="/teams/:teamID" />} /> */}
{/* <Route path="/device/:deviceID" element={<Navigate to="/devices/:devicesID" />} /> */} {/* <Route path="/device/:deviceID" element={<Navigate to="/devices/:devicesID" />} /> */}
<Route path="" element={<Navigate to={whiteLabel.homePage ? whiteLabel.homePage : "/devices"} />} /> <Route path="" element={<Navigate to={whiteLabel.homePage ? whiteLabel.homePage : "/devices"} />} />
{/* Page routes */} {/* Page routes */}
{/* <Route index element={<Typography>Hello!</Typography>} /> */} {/* <Route index element={<Typography>Hello!</Typography>} /> */}
<Route path="users" element={<Users/>} /> <Route path="users" element={<Users/>} />
<Route path="tasks" element={<Tasks />} /> <Route path="tasks" element={<Tasks />} />
<Route path="transactions" element={<Transactions />} /> <Route path="transactions" element={<Transactions />} />
{user.hasFeature("installer") && {user.hasFeature("installer") &&
<Route path="cableEstimate" element={<BinCableEstimator />} /> <Route path="cableEstimate" element={<BinCableEstimator />} />
} }
{user.hasFeature("developer") && {user.hasFeature("developer") &&
<Route path="api" element={<APIDocs />} /> <Route path="api" element={<APIDocs />} />
} }
{user.hasFeature("admin") && {user.hasFeature("admin") &&
<Route path="logs" element={<Logs />} /> <Route path="logs" element={<Logs />} />
} }
<Route path="fields" element={<Fields />} /> <Route path="fields" element={<Fields />} />
<Route path="marketplace" element={<Marketplace />} /> <Route path="marketplace" element={<Marketplace />} />
{user.hasFeature("admin") && ( {user.hasFeature("admin") && (
<Route path="firmware" element={<Firmware />} /> <Route path="firmware" element={<Firmware />} />
)} )}
<Route path="nfc" element={<Nfc />} /> <Route path="nfc" element={<Nfc />} />
{/* Map pages */} {/* Map pages */}
<Route path="visualFarm" element={<FieldMap />} /> <Route path="visualFarm" element={<FieldMap />} />
<Route path="aviationMap" element={<AviationMap />} /> <Route path="aviationMap" element={<AviationMap />} />
<Route path="constructionMap" element={<ConstructionSiteMap />} /> <Route path="constructionMap" element={<ConstructionSiteMap />} />
<Route path="/logout" element={<Logout />} />
<Route path="grainbags/:bagID" element={<GrainBag />} />
{/*
<ErrorBoundary FallbackComponent={ErrorFallback}>
<Route path="*" element={<RelativeRoutes/>} />
</ErrorBoundary> */}
<Route path="/logout" element={<Logout />} />
<Route path="grainbags/:bagID" element={<GrainBag />} />
{/*
<ErrorBoundary FallbackComponent={ErrorFallback}>
<Route path="*" element={<RelativeRoutes/>} /> <Route path="*" element={<RelativeRoutes/>} />
</ErrorBoundary> */}
</Routes> <Route path="*" element={<RelativeRoutes/>} />
</Suspense>
{/* </Box> */} </Routes>
</Suspense>
</BrowserRouter> </BrowserRouter>
) )
} }

6
src/theme/AppThemeProvider.tsx
View file

@ -24,7 +24,11 @@ export const useThemeMode = () => {
}; };
export const AppThemeProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => { export const AppThemeProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
const [mode, setMode] = useState<ThemeMode>("system");
const savedTheme = localStorage.getItem("theme");
const isValidTheme = (theme: string | null): theme is ThemeMode =>
theme === "light" || theme === "dark" || theme === "system";
const [mode, setMode] = useState<ThemeMode>(isValidTheme(savedTheme) ? savedTheme : "system");
const prefersDark = useMediaQuery("(prefers-color-scheme: dark)"); const prefersDark = useMediaQuery("(prefers-color-scheme: dark)");
const resolvedMode: PaletteMode = mode === "system" ? (prefersDark ? "dark" : "light") : mode; const resolvedMode: PaletteMode = mode === "system" ? (prefersDark ? "dark" : "light") : mode;