refactor: remove useless values in auth pages configs

package.json

@@ -27,6 +27,7 @@
         "date-fns": "2.29.3",
         "draft-js": "0.11.7",
         "draftjs-to-html": "0.9.1",
+        "firebase": "^9.22.1",
         "framer-motion": "10.10.0",
         "history": "5.3.0",
         "i18next": "22.4.14",

public/robots.txt

@@ -0,0 +1,3 @@
+User-agent: *
+Disallow: /
+Sitemap: /sitemap.xml

src/app/configs/routesConfig.js

@@ -2,19 +2,17 @@ import FuseUtils from '@fuse/utils';
 import FuseLoading from '@fuse/core/FuseLoading';
 import { Navigate } from 'react-router-dom';
 import settingsConfig from 'app/configs/settingsConfig';
-import SignInConfig from '../main/sign-in/SignInConfig';
-import SignUpConfig from '../main/sign-up/SignUpConfig';
-import SignOutConfig from '../main/sign-out/SignOutConfig';
 import Error404Page from '../main/404/Error404Page';
-import ExampleConfig from '../main/example/ExampleConfig';
+import navigationPagesConfigs from '../main/navigationPages/navigationPagesConfig';
+import authPagesConfig from '../main/authPages/authPagesConfig';
 
-const routeConfigs = [ExampleConfig, SignOutConfig, SignInConfig, SignUpConfig];
+const routeConfigs = [...navigationPagesConfigs, ...authPagesConfig];
 
 const routes = [
   ...FuseUtils.generateRoutesFromConfigs(routeConfigs, settingsConfig.defaultAuth),
   {
     path: '/',
-    element: <Navigate to="/example" />,
+    element: <Navigate to="/" />,
     auth: settingsConfig.defaultAuth,
   },
   {

src/app/main/authPages/sign-in/SignInConfig.js

@@ -13,18 +13,6 @@ const SignInConfig = {
         navbar: {
           display: false,
         },
-        toolbar: {
-          display: false,
-        },
-        footer: {
-          display: false,
-        },
-        leftSidePanel: {
-          display: false,
-        },
-        rightSidePanel: {
-          display: false,
-        },
       },
     },
   },

src/app/main/authPages/sign-out/SignOutConfig.js

@@ -12,18 +12,6 @@ const SignOutConfig = {
         navbar: {
           display: false,
         },
-        toolbar: {
-          display: false,
-        },
-        footer: {
-          display: false,
-        },
-        leftSidePanel: {
-          display: false,
-        },
-        rightSidePanel: {
-          display: false,
-        },
       },
     },
   },

src/app/main/authPages/sign-up/SignUpConfig.js

@@ -13,18 +13,6 @@ const SignUpConfig = {
         navbar: {
           display: false,
         },
-        toolbar: {
-          display: false,
-        },
-        footer: {
-          display: false,
-        },
-        leftSidePanel: {
-          display: false,
-        },
-        rightSidePanel: {
-          display: false,
-        },
       },
     },
   },

src/app/main/navigationPages/dashboard/Dashboard.js

@@ -0,0 +1,41 @@
+import { styled } from '@mui/material/styles';
+import { useTranslation } from 'react-i18next';
+import FusePageSimple from '@fuse/core/FusePageSimple';
+import DemoContent from '@fuse/core/DemoContent';
+
+const Root = styled(FusePageSimple)(({ theme }) => ({
+  '& .FusePageSimple-header': {
+    backgroundColor: theme.palette.background.paper,
+    borderBottomWidth: 1,
+    borderStyle: 'solid',
+    borderColor: theme.palette.divider,
+  },
+  '& .FusePageSimple-toolbar': {},
+  '& .FusePageSimple-content': {},
+  '& .FusePageSimple-sidebarHeader': {},
+  '& .FusePageSimple-sidebarContent': {},
+}));
+
+function DashboardPage(props) {
+  const { t } = useTranslation('dashboardPage');
+
+  return (
+    <Root
+      header={
+        <div className="p-24">
+          <h4>{t('TITLE')}</h4>
+        </div>
+      }
+      content={
+        <div className="p-24">
+          <h4>Content</h4>
+          <br />
+          <DemoContent />
+        </div>
+      }
+      scroll="content"
+    />
+  );
+}
+
+export default DashboardPage;

src/app/main/navigationPages/dashboard/DashboardConfig.js

@@ -0,0 +1,47 @@
+import i18next from 'i18next';
+
+import Dashboard from './Dashboard';
+import en from './i18n/en';
+
+i18next.addResourceBundle('en', 'dashboardPage', en);
+
+const DashboardConfig = {
+  settings: {
+    layout: {
+      config: {},
+    },
+  },
+  routes: [
+    {
+      path: 'dashboard',
+      element: <Dashboard />,
+    },
+  ],
+};
+
+export default DashboardConfig;
+
+/**
+ * Lazy load Example
+ */
+/*
+import React from 'react';
+
+const Example = lazy(() => import('./Example'));
+
+const ExampleConfig = {
+  settings: {
+    layout: {
+      config: {},
+    },
+  },
+  routes: [
+    {
+      path: 'example',
+      element: <Example />,
+    },
+  ],
+};
+
+export default ExampleConfig;
+*/

src/app/main/navigationPages/dashboard/i18n/en.js

@@ -0,0 +1,3 @@
+const locale = {};
+
+export default locale;

src/app/main/navigationPages/favorites/Favorites.js

@@ -0,0 +1,41 @@
+import { styled } from '@mui/material/styles';
+import { useTranslation } from 'react-i18next';
+import FusePageSimple from '@fuse/core/FusePageSimple';
+import DemoContent from '@fuse/core/DemoContent';
+
+const Root = styled(FusePageSimple)(({ theme }) => ({
+  '& .FusePageSimple-header': {
+    backgroundColor: theme.palette.background.paper,
+    borderBottomWidth: 1,
+    borderStyle: 'solid',
+    borderColor: theme.palette.divider,
+  },
+  '& .FusePageSimple-toolbar': {},
+  '& .FusePageSimple-content': {},
+  '& .FusePageSimple-sidebarHeader': {},
+  '& .FusePageSimple-sidebarContent': {},
+}));
+
+function FavoritesPage(props) {
+  const { t } = useTranslation('favoritesPage');
+
+  return (
+    <Root
+      header={
+        <div className="p-24">
+          <h4>{t('TITLE')}</h4>
+        </div>
+      }
+      content={
+        <div className="p-24">
+          <h4>Content</h4>
+          <br />
+          <DemoContent />
+        </div>
+      }
+      scroll="content"
+    />
+  );
+}
+
+export default FavoritesPage;

src/app/main/navigationPages/favorites/FavoritesConfig.js

@@ -0,0 +1,47 @@
+import i18next from 'i18next';
+
+import en from './i18n/en';
+import Favorites from './Favorites';
+
+i18next.addResourceBundle('en', 'favoritesPage', en);
+
+const FavoritesConfig = {
+  settings: {
+    layout: {
+      config: {},
+    },
+  },
+  routes: [
+    {
+      path: 'favorites',
+      element: <Favorites />,
+    },
+  ],
+};
+
+export default FavoritesConfig;
+
+/**
+ * Lazy load Example
+ */
+/*
+import React from 'react';
+
+const Example = lazy(() => import('./Example'));
+
+const ExampleConfig = {
+  settings: {
+    layout: {
+      config: {},
+    },
+  },
+  routes: [
+    {
+      path: 'example',
+      element: <Example />,
+    },
+  ],
+};
+
+export default ExampleConfig;
+*/

src/app/main/navigationPages/favorites/i18n/en.js

@@ -0,0 +1,3 @@
+const locale = {};
+
+export default locale;

src/app/main/navigationPages/history/History.js

@@ -0,0 +1,41 @@
+import { styled } from '@mui/material/styles';
+import { useTranslation } from 'react-i18next';
+import FusePageSimple from '@fuse/core/FusePageSimple';
+import DemoContent from '@fuse/core/DemoContent';
+
+const Root = styled(FusePageSimple)(({ theme }) => ({
+  '& .FusePageSimple-header': {
+    backgroundColor: theme.palette.background.paper,
+    borderBottomWidth: 1,
+    borderStyle: 'solid',
+    borderColor: theme.palette.divider,
+  },
+  '& .FusePageSimple-toolbar': {},
+  '& .FusePageSimple-content': {},
+  '& .FusePageSimple-sidebarHeader': {},
+  '& .FusePageSimple-sidebarContent': {},
+}));
+
+function HistoryPage(props) {
+  const { t } = useTranslation('historyPage');
+
+  return (
+    <Root
+      header={
+        <div className="p-24">
+          <h4>{t('TITLE')}</h4>
+        </div>
+      }
+      content={
+        <div className="p-24">
+          <h4>Content</h4>
+          <br />
+          <DemoContent />
+        </div>
+      }
+      scroll="content"
+    />
+  );
+}
+
+export default HistoryPage;

src/app/main/navigationPages/history/HistoryConfig.js

@@ -0,0 +1,47 @@
+import i18next from 'i18next';
+
+import en from './i18n/en';
+import History from './History';
+
+i18next.addResourceBundle('en', 'historyPage', en);
+
+const HistoryConfig = {
+  settings: {
+    layout: {
+      config: {},
+    },
+  },
+  routes: [
+    {
+      path: 'history',
+      element: <History />,
+    },
+  ],
+};
+
+export default HistoryConfig;
+
+/**
+ * Lazy load Example
+ */
+/*
+import React from 'react';
+
+const Example = lazy(() => import('./Example'));
+
+const ExampleConfig = {
+  settings: {
+    layout: {
+      config: {},
+    },
+  },
+  routes: [
+    {
+      path: 'example',
+      element: <Example />,
+    },
+  ],
+};
+
+export default ExampleConfig;
+*/

src/app/main/navigationPages/history/i18n/en.js

@@ -0,0 +1,3 @@
+const locale = {};
+
+export default locale;

src/app/main/navigationPages/navigationPagesConfig.js

@@ -0,0 +1,8 @@
+import DashboardConfig from './dashboard/DashboardConfig';
+import FavoritesConfig from './favorites/FavoritesConfig';
+import HistoryConfig from './history/HistoryConfig';
+import ProfileConfig from './profile/ProfileConfig';
+
+const navigationPagesConfigs = [DashboardConfig, FavoritesConfig, HistoryConfig, ProfileConfig];
+
+export default navigationPagesConfigs;

src/app/main/navigationPages/profile/Profile.js

@@ -0,0 +1,41 @@
+import { styled } from '@mui/material/styles';
+import { useTranslation } from 'react-i18next';
+import FusePageSimple from '@fuse/core/FusePageSimple';
+import DemoContent from '@fuse/core/DemoContent';
+
+const Root = styled(FusePageSimple)(({ theme }) => ({
+  '& .FusePageSimple-header': {
+    backgroundColor: theme.palette.background.paper,
+    borderBottomWidth: 1,
+    borderStyle: 'solid',
+    borderColor: theme.palette.divider,
+  },
+  '& .FusePageSimple-toolbar': {},
+  '& .FusePageSimple-content': {},
+  '& .FusePageSimple-sidebarHeader': {},
+  '& .FusePageSimple-sidebarContent': {},
+}));
+
+function ProfilePage(props) {
+  const { t } = useTranslation('profilePage');
+
+  return (
+    <Root
+      header={
+        <div className="p-24">
+          <h4>{t('TITLE')}</h4>
+        </div>
+      }
+      content={
+        <div className="p-24">
+          <h4>Content</h4>
+          <br />
+          <DemoContent />
+        </div>
+      }
+      scroll="content"
+    />
+  );
+}
+
+export default ProfilePage;

src/app/main/navigationPages/profile/ProfileConfig.js

@@ -0,0 +1,47 @@
+import i18next from 'i18next';
+
+import en from './i18n/en';
+import Profile from './Profile';
+
+i18next.addResourceBundle('en', 'profilePage', en);
+
+const ProfileConfig = {
+  settings: {
+    layout: {
+      config: {},
+    },
+  },
+  routes: [
+    {
+      path: 'profile',
+      element: <Profile />,
+    },
+  ],
+};
+
+export default ProfileConfig;
+
+/**
+ * Lazy load Example
+ */
+/*
+import React from 'react';
+
+const Example = lazy(() => import('./Example'));
+
+const ExampleConfig = {
+  settings: {
+    layout: {
+      config: {},
+    },
+  },
+  routes: [
+    {
+      path: 'example',
+      element: <Example />,
+    },
+  ],
+};
+
+export default ExampleConfig;
+*/

src/app/main/navigationPages/profile/i18n/en.js

@@ -0,0 +1,3 @@
+const locale = {};
+
+export default locale;

src/app/theme-layouts/layout1/Layout1.js

@@ -1,18 +1,13 @@
 import FuseDialog from '@fuse/core/FuseDialog';
-import { styled } from '@mui/material/styles';
 import FuseMessage from '@fuse/core/FuseMessage';
 import FuseSuspense from '@fuse/core/FuseSuspense';
+import { styled } from '@mui/material/styles';
 import AppContext from 'app/AppContext';
+import { selectFuseCurrentLayoutConfig } from 'app/store/fuse/settingsSlice';
 import { memo, useContext } from 'react';
 import { useSelector } from 'react-redux';
 import { useRoutes } from 'react-router-dom';
-import { selectFuseCurrentLayoutConfig } from 'app/store/fuse/settingsSlice';
-import FooterLayout1 from './components/FooterLayout1';
-import LeftSideLayout1 from './components/LeftSideLayout1';
 import NavbarWrapperLayout1 from './components/NavbarWrapperLayout1';
-import RightSideLayout1 from './components/RightSideLayout1';
-import ToolbarLayout1 from './components/ToolbarLayout1';
-import SettingsPanel from '../shared-components/SettingsPanel';
 
 const Root = styled('div')(({ theme, config }) => ({
   ...(config.mode === 'boxed' && {
@@ -37,20 +32,10 @@ function Layout1(props) {
 
   return (
     <Root id="fuse-layout" config={config} className="w-full flex">
-      {config.leftSidePanel.display && <LeftSideLayout1 />}
-
       <div className="flex flex-auto min-w-0">
         {config.navbar.display && config.navbar.position === 'left' && <NavbarWrapperLayout1 />}
 
         <main id="fuse-main" className="flex flex-col flex-auto min-h-full min-w-0 relative z-10">
-          {config.toolbar.display && (
-            <ToolbarLayout1 className={config.toolbar.style === 'fixed' && 'sticky top-0'} />
-          )}
-
-          <div className="sticky top-0 z-99">
-            <SettingsPanel />
-          </div>
-
           <div className="flex flex-col flex-auto min-h-0 relative z-10">
             <FuseDialog />
 
@@ -58,16 +43,9 @@ function Layout1(props) {
 
             {props.children}
           </div>
-
-          {config.footer.display && (
-            <FooterLayout1 className={config.footer.style === 'fixed' && 'sticky bottom-0'} />
-          )}
         </main>
-
-        {config.navbar.display && config.navbar.position === 'right' && <NavbarWrapperLayout1 />}
       </div>
 
-      {config.rightSidePanel.display && <RightSideLayout1 />}
       <FuseMessage />
     </Root>
   );

src/app/theme-layouts/layout1/Layout1Config.js

@@ -1,5 +1,5 @@
 const config = {
-  title: 'Layout 1 - Vertical',
+  title: 'Layout 1 - Dashboard',
   defaults: {
     mode: 'container',
     containerWidth: 1570,
@@ -9,20 +9,6 @@ const config = {
       folded: true,
       position: 'left',
     },
-    toolbar: {
-      display: true,
-      style: 'fixed',
-    },
-    footer: {
-      display: true,
-      style: 'fixed',
-    },
-    leftSidePanel: {
-      display: true,
-    },
-    rightSidePanel: {
-      display: true,
-    },
   },
   form: {
     mode: {
@@ -47,7 +33,6 @@ const config = {
       title: 'Container Width (px)',
       type: 'number',
     },
-
     navbar: {
       type: 'group',
       title: 'Navbar',
@@ -98,54 +83,6 @@ const config = {
         },
       },
     },
-    toolbar: {
-      type: 'group',
-      title: 'Toolbar',
-      children: {
-        display: {
-          title: 'Display',
-          type: 'switch',
-        },
-        style: {
-          title: 'Style',
-          type: 'radio',
-          options: [
-            {
-              name: 'Fixed',
-              value: 'fixed',
-            },
-            {
-              name: 'Static',
-              value: 'static',
-            },
-          ],
-        },
-      },
-    },
-    footer: {
-      type: 'group',
-      title: 'Footer',
-      children: {
-        display: {
-          title: 'Display',
-          type: 'switch',
-        },
-        style: {
-          title: 'Style',
-          type: 'radio',
-          options: [
-            {
-              name: 'Fixed',
-              value: 'fixed',
-            },
-            {
-              name: 'Static',
-              value: 'static',
-            },
-          ],
-        },
-      },
-    },
   },
 };
 

src/app/theme-layouts/layout1/components/FooterLayout1.js

@@ -1,33 +0,0 @@
-import AppBar from '@mui/material/AppBar';
-import { ThemeProvider } from '@mui/material/styles';
-import Toolbar from '@mui/material/Toolbar';
-import { memo } from 'react';
-import { useSelector } from 'react-redux';
-import { selectFooterTheme } from 'app/store/fuse/settingsSlice';
-import clsx from 'clsx';
-
-function FooterLayout1(props) {
-  const footerTheme = useSelector(selectFooterTheme);
-
-  return (
-    <ThemeProvider theme={footerTheme}>
-      <AppBar
-        id="fuse-footer"
-        className={clsx('relative z-20 shadow-md', props.className)}
-        color="default"
-        sx={{
-          backgroundColor: (theme) =>
-            theme.palette.mode === 'light'
-              ? footerTheme.palette.background.paper
-              : footerTheme.palette.background.default,
-        }}
-      >
-        <Toolbar className="min-h-48 md:min-h-64 px-8 sm:px-12 py-0 flex items-center overflow-x-auto">
-          Footer
-        </Toolbar>
-      </AppBar>
-    </ThemeProvider>
-  );
-}
-
-export default memo(FooterLayout1);

src/app/theme-layouts/layout1/components/LeftSideLayout1.js

@@ -1,7 +0,0 @@
-import { memo } from 'react';
-
-function LeftSideLayout1() {
-  return <></>;
-}
-
-export default memo(LeftSideLayout1);

src/app/theme-layouts/layout1/components/NavbarWrapperLayout1.js

@@ -25,7 +25,7 @@ function NavbarWrapperLayout1(props) {
         </>
       </ThemeProvider>
 
-      {config.navbar.display && !config.toolbar.display && !navbar.open && <NavbarToggleFab />}
+      {config.navbar.display && !navbar.open && <NavbarToggleFab />}
     </>
   );
 }

src/app/theme-layouts/layout1/components/RightSideLayout1.js

@@ -1,15 +0,0 @@
-import { memo } from 'react';
-import QuickPanel from '../../shared-components/quickPanel/QuickPanel';
-import NotificationPanel from '../../shared-components/notificationPanel/NotificationPanel';
-
-function RightSideLayout1(props) {
-  return (
-    <>
-      <QuickPanel />
-
-      <NotificationPanel />
-    </>
-  );
-}
-
-export default memo(RightSideLayout1);

src/app/theme-layouts/layout1/components/ToolbarLayout1.js

@@ -1,103 +0,0 @@
-import { ThemeProvider } from '@mui/material/styles';
-import AppBar from '@mui/material/AppBar';
-import Hidden from '@mui/material/Hidden';
-import Toolbar from '@mui/material/Toolbar';
-import clsx from 'clsx';
-import { memo } from 'react';
-import { useSelector } from 'react-redux';
-import { selectFuseCurrentLayoutConfig, selectToolbarTheme } from 'app/store/fuse/settingsSlice';
-import { selectFuseNavbar } from 'app/store/fuse/navbarSlice';
-import AdjustFontSize from '../../shared-components/AdjustFontSize';
-import FullScreenToggle from '../../shared-components/FullScreenToggle';
-import LanguageSwitcher from '../../shared-components/LanguageSwitcher';
-import NotificationPanelToggleButton from '../../shared-components/notificationPanel/NotificationPanelToggleButton';
-import NavigationShortcuts from '../../shared-components/NavigationShortcuts';
-import NavigationSearch from '../../shared-components/NavigationSearch';
-import NavbarToggleButton from '../../shared-components/NavbarToggleButton';
-import UserMenu from '../../shared-components/UserMenu';
-import QuickPanelToggleButton from '../../shared-components/quickPanel/QuickPanelToggleButton';
-import ChatPanelToggleButton from '../../shared-components/chatPanel/ChatPanelToggleButton';
-
-function ToolbarLayout1(props) {
-  const config = useSelector(selectFuseCurrentLayoutConfig);
-  const navbar = useSelector(selectFuseNavbar);
-  const toolbarTheme = useSelector(selectToolbarTheme);
-
-  return (
-    <ThemeProvider theme={toolbarTheme}>
-      <AppBar
-        id="fuse-toolbar"
-        className={clsx('flex relative z-20 shadow-md', props.className)}
-        color="default"
-        sx={{
-          backgroundColor: (theme) =>
-            theme.palette.mode === 'light'
-              ? toolbarTheme.palette.background.paper
-              : toolbarTheme.palette.background.default,
-        }}
-        position="static"
-      >
-        <Toolbar className="p-0 min-h-48 md:min-h-64">
-          <div className="flex flex-1 px-16">
-            {config.navbar.display && config.navbar.position === 'left' && (
-              <>
-                <Hidden lgDown>
-                  {(config.navbar.style === 'style-3' ||
-                    config.navbar.style === 'style-3-dense') && (
-                    <NavbarToggleButton className="w-40 h-40 p-0 mx-0" />
-                  )}
-
-                  {config.navbar.style === 'style-1' && !navbar.open && (
-                    <NavbarToggleButton className="w-40 h-40 p-0 mx-0" />
-                  )}
-                </Hidden>
-
-                <Hidden lgUp>
-                  <NavbarToggleButton className="w-40 h-40 p-0 mx-0 sm:mx-8" />
-                </Hidden>
-              </>
-            )}
-
-            <Hidden lgDown>
-              <NavigationShortcuts />
-            </Hidden>
-          </div>
-
-          <div className="flex items-center px-8 h-full overflow-x-auto">
-            <LanguageSwitcher />
-
-            <AdjustFontSize />
-
-            <FullScreenToggle />
-
-            <NavigationSearch />
-
-            <Hidden lgUp>
-              <ChatPanelToggleButton />
-            </Hidden>
-
-            <QuickPanelToggleButton />
-
-            <NotificationPanelToggleButton />
-
-            <UserMenu />
-          </div>
-
-          {config.navbar.display && config.navbar.position === 'right' && (
-            <>
-              <Hidden lgDown>
-                {!navbar.open && <NavbarToggleButton className="w-40 h-40 p-0 mx-0" />}
-              </Hidden>
-
-              <Hidden lgUp>
-                <NavbarToggleButton className="w-40 h-40 p-0 mx-0 sm:mx-8" />
-              </Hidden>
-            </>
-          )}
-        </Toolbar>
-      </AppBar>
-    </ThemeProvider>
-  );
-}
-
-export default memo(ToolbarLayout1);