TRX/Checkmate
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

remove v1 theme provider

Browse Source
This commit is contained in:
Alex Holliday committed 2026-02-20 17:59:08 +00:00
1 parent fc6300d057
commit 8d104ee30a
4 files changed
+45 -267
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

client/src/App.tsx
+4 -7
View File
@@ -3,26 +3,23 @@ import { useSelector } from "react-redux";
import "react-toastify/dist/ReactToastify.css";
import { ToastContainer } from "react-toastify";
import { ThemeProvider } from "@emotion/react";
import lightTheme from "./Utils/Theme/lightTheme";
import darkTheme from "./Utils/Theme/darkTheme";
import { CssBaseline, GlobalStyles } from "@mui/material";
import { Routes } from "./Routes";
import AppLayout from "@/Components/v2/layout/AppLayout";
import type { RootState } from "@/Types/state";
import { lightTheme, darkTheme } from "@/Utils/Theme/v2Theme";
function App() {
const mode = useSelector((state: RootState) => state.ui.mode);
const theme = mode === "light" ? lightTheme : darkTheme;
const v2theme = mode === "light" ? lightTheme : darkTheme;
return (
<ThemeProvider theme={theme}>
<ThemeProvider theme={v2theme}>
<CssBaseline />
<GlobalStyles
styles={{
body: {
// @ts-ignore
backgroundColor: theme.palette.background.main,
backgroundColor: v2theme.palette.background.default,
},
}}
/>
client/src/Components/v2/layout/AppLayout.tsx
+3 -9
View File
@@ -1,10 +1,9 @@
import Box from "@mui/material/Box";
import { useState, useEffect, useRef } from "react";
import { ThemeProvider, useTheme } from "@mui/material/styles";
import { useTheme } from "@mui/material/styles";
import { useSelector } from "react-redux";
import BackgroundSVG from "@/assets/Images/background.svg";
import type { RootState } from "@/Types/state";
import { lightTheme, darkTheme } from "@/Utils/Theme/v2Theme";
import { OfflineBanner } from "@/Components/v2/design-elements";
import { setServerUnreachableCallback, get } from "@/Utils/ApiClient";
@@ -15,8 +14,6 @@ interface AppLayoutProps {
const AppLayout = ({ children }: AppLayoutProps) => {
const theme = useTheme();
const mode = useSelector((state: RootState) => state.ui.mode);
const v2theme = mode === "dark" ? darkTheme : lightTheme;
const [serverUnreachable, setServerUnreachable] = useState(false);
const retryIntervalRef = useRef<number | null>(null);
@@ -49,8 +46,7 @@ const AppLayout = ({ children }: AppLayoutProps) => {
<Box
sx={{
minHeight: "100vh",
// @ts-expect-error custom palette property
backgroundColor: theme.palette.primaryBackground.main,
backgroundColor: theme.palette.background.default,
backgroundImage: mode === "dark" ? `url("${BackgroundSVG}")` : "none",
backgroundSize: "100% 100%",
backgroundPosition: "center",
@@ -58,9 +54,7 @@ const AppLayout = ({ children }: AppLayoutProps) => {
color: theme.palette.primary.contrastText,
}}
>
<ThemeProvider theme={v2theme}>
<OfflineBanner visible={serverUnreachable} />
</ThemeProvider>
<OfflineBanner visible={serverUnreachable} />
{children}
</Box>
);
client/src/Components/v2/layout/RootLayout.tsx
+2 -9
View File
@@ -4,23 +4,16 @@ import Stack from "@mui/material/Stack";
import { useMediaQuery } from "@mui/material";
import { useSidebar } from "@/Hooks/useSidebar";
import { useSelector } from "react-redux";
import type { RootState } from "@/Types/state";
import { lightTheme, darkTheme } from "@/Utils/Theme/v2Theme";
import { ThemeProvider, useTheme } from "@mui/material";
import { useTheme } from "@mui/material";
const RootLayout = () => {
const mode = useSelector((state: RootState) => state.ui.mode);
const v2theme = mode === "dark" ? darkTheme : lightTheme;
const theme = useTheme();
const isSmall = useMediaQuery(theme.breakpoints.down("md"));
const { collapsedWidth } = useSidebar();
return (
<Stack flexDirection="row">
<ThemeProvider theme={v2theme}>
<Sidebar />
</ThemeProvider>
<Sidebar />
<Stack
flex={1}
padding={6}
client/src/Routes/index.tsx
+36 -242
View File
@@ -1,9 +1,3 @@
// Temp v2 theme
import { ThemeProvider } from "@mui/material";
import { lightTheme, darkTheme } from "@/Utils/Theme/v2Theme";
import { useSelector } from "react-redux";
import type { RootState } from "@/store";
import { Navigate, Route, Routes as LibRoutes } from "react-router";
import RootLayout from "@/Components/v2/layout/RootLayout";
import NotFound from "@/Pages/NotFound";
@@ -60,8 +54,6 @@ import {
import CreateMonitor from "@/Pages/CreateMonitor";
const Routes = () => {
const mode = useSelector((state: RootState) => state.ui.mode);
const v2theme = mode === "light" ? lightTheme : darkTheme;
return (
<LibRoutes>
<Route
@@ -78,287 +70,129 @@ const Routes = () => {
/>
<Route
path="/uptime"
element={
<>
<ThemeProvider theme={v2theme}>
<Uptime />
</ThemeProvider>
</>
}
element={<Uptime />}
/>
<Route path="/uptime/bulk-import" />
<Route
path="/uptime/create"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateMonitor />
</ThemeProvider>
</>
}
element={<CreateMonitor />}
/>
<Route
path="/uptime/:monitorId/"
element={
<>
<ThemeProvider theme={v2theme}>
<UptimeDetails />
</ThemeProvider>
</>
}
element={<UptimeDetails />}
/>
<Route
path="/uptime/configure/:monitorId/"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateMonitor />
</ThemeProvider>
</>
}
element={<CreateMonitor />}
/>
<Route
path="pagespeed"
element={
<>
<ThemeProvider theme={v2theme}>
<PageSpeed />
</ThemeProvider>
</>
}
element={<PageSpeed />}
/>
<Route
path="pagespeed/create"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateMonitor />
</ThemeProvider>
</>
}
element={<CreateMonitor />}
/>
<Route
path="pagespeed/:monitorId"
element={
<>
<ThemeProvider theme={v2theme}>
<PageSpeedDetails />
</ThemeProvider>
</>
}
element={<PageSpeedDetails />}
/>
<Route
path="pagespeed/configure/:monitorId"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateMonitor />
</ThemeProvider>
</>
}
element={<CreateMonitor />}
/>
<Route
path="infrastructure"
element={
<>
<ThemeProvider theme={v2theme}>
<Infrastructure />
</ThemeProvider>
</>
}
element={<Infrastructure />}
/>
<Route
path="infrastructure/create"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateMonitor />
</ThemeProvider>
</>
}
element={<CreateMonitor />}
/>
<Route
path="/infrastructure/configure/:monitorId"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateMonitor />
</ThemeProvider>
</>
}
element={<CreateMonitor />}
/>
<Route
path="infrastructure/:monitorId"
element={
<>
<ThemeProvider theme={v2theme}>
<InfrastructureDetails />
</ThemeProvider>
</>
}
element={<InfrastructureDetails />}
/>
<Route
path="checks/:monitorId?"
element={
<>
<ThemeProvider theme={v2theme}>
<Checks />
</ThemeProvider>
</>
}
element={<Checks />}
/>
<Route
path="incidents/:monitorId?"
element={
<>
<ThemeProvider theme={v2theme}>
<Incidents />
</ThemeProvider>
</>
}
element={<Incidents />}
/>
<Route
path="status"
element={
<>
<ThemeProvider theme={v2theme}>
<StatusPages />
</ThemeProvider>
</>
}
element={<StatusPages />}
/>
<Route
path="status/:url"
element={
<>
<ThemeProvider theme={v2theme}>
<Status />
</ThemeProvider>
</>
}
element={<Status />}
/>
<Route
path="status/create"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateStatus />
</ThemeProvider>
</>
}
element={<CreateStatus />}
/>
<Route
path="status/configure/:url"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateStatus />
</ThemeProvider>
</>
}
element={<CreateStatus />}
/>
<Route
path="notifications"
element={
<>
<ThemeProvider theme={v2theme}>
<Notifications />
</ThemeProvider>
</>
}
element={<Notifications />}
/>
<Route
path="notifications/create"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateNotifications />
</ThemeProvider>
</>
}
element={<CreateNotifications />}
/>
<Route
path="notifications/configure/:notificationId"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateNotifications />
</ThemeProvider>
</>
}
element={<CreateNotifications />}
/>
<Route
path="maintenance"
element={
<>
<ThemeProvider theme={v2theme}>
<Maintenance />
</ThemeProvider>
</>
}
element={<Maintenance />}
/>
<Route
path="/maintenance/create/:maintenanceWindowId?"
element={
<>
<ThemeProvider theme={v2theme}>
<CreateNewMaintenanceWindow />
</ThemeProvider>
</>
}
element={<CreateNewMaintenanceWindow />}
/>
<Route
path="settings"
element={
<>
<ThemeProvider theme={v2theme}>
<Settings />
</ThemeProvider>
</>
}
element={<Settings />}
/>
<Route
path="account/profile"
element={
<ThemeProvider theme={v2theme}>
<Account open={"profile"} />
</ThemeProvider>
}
element={<Account open={"profile"} />}
/>
<Route
path="account/password"
element={
<ThemeProvider theme={v2theme}>
<Account open={"password"} />
</ThemeProvider>
}
element={<Account open={"password"} />}
/>
<Route
path="account/team"
element={
<ThemeProvider theme={v2theme}>
<Account open={"team"} />
</ThemeProvider>
}
element={<Account open={"team"} />}
/>
<Route
path="account/team/:userId"
element={
<RoleProtectedRoute roles={["superadmin"]}>
<ThemeProvider theme={v2theme}>
<EditUser />
</ThemeProvider>
<EditUser />
</RoleProtectedRoute>
}
/>
@@ -367,9 +201,7 @@ const Routes = () => {
path="logs"
element={
<RoleProtectedRoute roles={["admin", "superadmin"]}>
<ThemeProvider theme={v2theme}>
<Logs />
</ThemeProvider>
<Logs />
</RoleProtectedRoute>
}
/>
@@ -379,75 +211,37 @@ const Routes = () => {
path="/login"
element={
<>
<ThemeProvider theme={v2theme}>
<AuthLogin />
</ThemeProvider>
<AuthLogin />
</>
}
/>
<Route
path="/register"
element={
<>
<ThemeProvider theme={v2theme}>
<AuthRegister />
</ThemeProvider>
</>
}
element={<AuthRegister />}
/>
<Route
path="/register/:token"
element={
<>
<ThemeProvider theme={v2theme}>
<AuthRegister />
</ThemeProvider>
</>
}
element={<AuthRegister />}
/>
<Route
path="/forgot-password"
element={
<>
<ThemeProvider theme={v2theme}>
<AuthForgotPassword />
</ThemeProvider>
</>
}
element={<AuthForgotPassword />}
/>
<Route
path="/set-new-password/:token"
element={
<>
<ThemeProvider theme={v2theme}>
<AuthSetNewPassword />
</ThemeProvider>
</>
}
element={<AuthSetNewPassword />}
/>
<Route
path="/status/public/:url"
element={
<>
<ThemeProvider theme={v2theme}>
<Status />
</ThemeProvider>
</>
}
element={<Status />}
/>
<Route
path="*"
element={
<>
<ThemeProvider theme={v2theme}>
<NotFound />
</ThemeProvider>
</>
}
element={<NotFound />}
/>
</LibRoutes>
);