Site Settings
Remove Settings
From NextJS

How to remove site settings from app?

  • At first, Remove SettingsProvider wrapper component from src/app/layout.jsx file.
  • After that, Remove useSettings hook & settings argument from createCustomTheme function
  • After that, Copy the code from below step-3 and paste it createCustomTheme function

Step 1

src/app/layout.jsx

_13
const RootLayout = ({ children }) => {
_13
return (
_13
<html lang="en">
_13
<body className={inter.className}>
_13
{/** <SettingsProvider> */}
_13
{children}
_13
{/** </SettingsProvider> */}
_13
</body>
_13
</html>
_13
);
_13
};
_13
_13
export default RootLayout;

Step 2

src/theme/ThemeProvider.jsx

_15
const ThemeProvider = ({ children }) => {
_15
// const { settings } = useSettings();
_15
// const theme = createCustomTheme(settings);
_15
_15
const theme = createCustomTheme();
_15
_15
return (
_15
<MuiThemeProvider theme={theme}>
_15
<CssBaseline />
_15
{children}
_15
</MuiThemeProvider>
_15
);
_15
};
_15
_15
export default ThemeProvider;

Step 3

theme/createTheme.js

_47
// REMOVE THIS CODE
_47
_47
// export const createCustomTheme = (settings) => {
_47
// /**
_47
// * settings.theme value is 'light' or 'dark'
_47
// * update settings in contexts/settingsContext.jsx
_47
// */
_47
// let themeOptions = themesOptions[settings.theme];
_47
_47
// if (!themeOptions) {
_47
// themeOptions = themesOptions[THEMES.LIGHT];
_47
// }
_47
_47
// const mergedThemeOptions = merge({}, baseOptions, themeOptions, {
_47
// direction: settings.direction,
_47
// });
_47
_47
// let theme = createTheme(mergedThemeOptions as ThemeOptions);
_47
_47
// // set shadows
_47
// theme.shadows = shadows(theme);
_47
// // set components
_47
// theme.components = componentsOverride(theme);
_47
_47
// if (settings.responsiveFontSizes) {
_47
// theme = responsiveFontSizes(theme);
_47
// }
_47
_47
// return theme;
_47
// };
_47
_47
// ADD THIS CODE
_47
_47
export const createCustomTheme = () => {
_47
let themeOptions = themesOptions[THEMES.LIGHT];
_47
_47
const mergedThemeOptions = merge({}, baseOptions, themeOptions);
_47
_47
let theme = createTheme(mergedThemeOptions);
_47
_47
// set shadows
_47
theme.shadows = shadows(theme);
_47
// set components
_47
theme.components = componentsOverride(theme);
_47
_47
return theme;
_47
};