diff --git a/src/test/apps/ssr/pages/_app.tsx b/src/test/apps/ssr/pages/_app.tsx
index 2997890..c407d3d 100644
--- a/src/test/apps/ssr/pages/_app.tsx
+++ b/src/test/apps/ssr/pages/_app.tsx
@@ -1,4 +1,56 @@
-import App from "next/app";
+import { useMemo } from "react";
+import Head from "next/head";
import withDarkMode from "next-dark-mode";
+import type { AppProps } from 'next/app'
+import { useDarkMode } from "next-dark-mode";
+import type { EmotionCache } from "@emotion/cache";
+import createCache from "@emotion/cache";
+import { ThemeProvider as MuiThemeProvider } from "@mui/material/styles";
+import { createTheme } from "@mui/material/styles";
+import CssBaseline from "@mui/material/CssBaseline";
+import { CacheProvider } from '@emotion/react';
-export default withDarkMode(App)
\ No newline at end of file
+let muiCache: EmotionCache | undefined = undefined;
+
+export const createMuiCache = () => muiCache = createCache({ "key": "mui", "prepend": true });
+
+export function App({ Component, pageProps }: AppProps) {
+
+ const { darkModeActive } = useDarkMode();
+
+ const theme = useMemo(
+ () => createTheme({
+ "palette": {
+ "mode": darkModeActive ? "dark" : "light",
+ "primary": {
+ "main": "#32CD32" //Limegreen
+ }
+ },
+ "typography": {
+ "subtitle2": {
+ "fontStyle": "italic"
+ }
+ }
+ }),
+ [darkModeActive]
+ );
+
+ return (
+ <>
+
+ Create Next App
+
+
+
+
+
+
+
+
+
+
+ );
+
+}
+
+export default withDarkMode(App);
\ No newline at end of file
diff --git a/src/test/apps/ssr/pages/_document.tsx b/src/test/apps/ssr/pages/_document.tsx
index e8060a9..43ef3a7 100644
--- a/src/test/apps/ssr/pages/_document.tsx
+++ b/src/test/apps/ssr/pages/_document.tsx
@@ -1,6 +1,6 @@
import BaseDocument from "next/document";
import { withEmotionCache } from "tss-react/nextJs";
-import { createMuiCache } from "./index";
+import { createMuiCache } from "./_app";
export default withEmotionCache({
"Document": BaseDocument,
diff --git a/src/test/apps/ssr/pages/index.tsx b/src/test/apps/ssr/pages/index.tsx
index d942194..abf2594 100644
--- a/src/test/apps/ssr/pages/index.tsx
+++ b/src/test/apps/ssr/pages/index.tsx
@@ -1,65 +1,17 @@
import Head from "next/head";
-import { useMemo, memo } from "react";
+import { memo } from "react";
import { GlobalStyles, useMergedClasses } from "tss-react";
import { makeStyles, useStyles, withStyles } from "../shared/makeStyles";
import { styled } from "@mui/material";
import Button from "@mui/material/Button"
-import { ThemeProvider as MuiThemeProvider } from "@mui/material/styles";
-import { createTheme } from "@mui/material/styles";
-import CssBaseline from "@mui/material/CssBaseline";
import Breadcrumbs from "@mui/material/Breadcrumbs";
import { useDarkMode } from "next-dark-mode";
-import { CacheProvider } from '@emotion/react';
-import type { EmotionCache } from "@emotion/cache";
-import createCache from "@emotion/cache";
import Typography from "@mui/material/Typography";
import type { CSSObject } from "tss-react";
import InputBase from "@mui/material/InputBase";
-let muiCache: EmotionCache | undefined = undefined;
-
-export const createMuiCache = () => muiCache = createCache({ "key": "mui", "prepend": true });
-
export default function Index() {
- const { darkModeActive } = useDarkMode();
-
- const theme = useMemo(
- () => createTheme({
- "palette": {
- "mode": darkModeActive ? "dark" : "light",
- "primary": {
- "main": "#32CD32" //Limegreen
- }
- },
- "typography": {
- "subtitle2": {
- "fontStyle": "italic"
- }
- }
- }),
- [darkModeActive]
- );
-
- return (
- <>
-
- Create Next App
-
-
-
-
-
-
-
-
-
-
- );
-}
-
-function Root() {
-
const { css } = useStyles();
return (