RC-4: correct imports for AppContext

aliases.js

@@ -7,7 +7,7 @@ const aliases = (prefix = `src`) => ({
   'app/shared-components': `${prefix}/app/shared-components`,
   'app/configs': `${prefix}/app/configs`,
   'app/theme-layouts': `${prefix}/app/theme-layouts`,
-  'app/AppContext': `${prefix}/app/AppContext`,
+  'app/contexts/AppContext': `${prefix}/app/contexts/AppContext`,
 });
 
 module.exports = aliases;

jsconfig.json

@@ -1,16 +1,34 @@
 {
-    "compilerOptions": {
-        "baseUrl": "./",
-        "paths": {
-              "@fuse/*": ["./src/@fuse/*"],
-              "@history*": ["./src/@history"],
-              "@lodash": ["./src/@lodash"],
-              "@mock-api": ["./src/@mock-api"],
-              "app/store/*": ["./src/app/store/*"],
-              "app/shared-components/*": ["./src/app/shared-components/*"],
-              "app/configs/*": ["./src/app/configs/*"],
-              "app/theme-layouts/*": ["./src/app/theme-layouts/*"],
-              "app/AppContext": ["./src/app/AppContext"]
-        }
+      "compilerOptions": {
+            "baseUrl": "./",
+            "paths": {
+                  "@fuse/*": [
+                        "./src/@fuse/*"
+                  ],
+                  "@history*": [
+                        "./src/@history"
+                  ],
+                  "@lodash": [
+                        "./src/@lodash"
+                  ],
+                  "@mock-api": [
+                        "./src/@mock-api"
+                  ],
+                  "app/store/*": [
+                        "./src/app/store/*"
+                  ],
+                  "app/shared-components/*": [
+                        "./src/app/shared-components/*"
+                  ],
+                  "app/configs/*": [
+                        "./src/app/configs/*"
+                  ],
+                  "app/theme-layouts/*": [
+                        "./src/app/theme-layouts/*"
+                  ],
+                  "app/contexts/AppContext": [
+                        "./src/app/contexts/AppContext"
+                  ]
+            }
       }
-}
+}

src/@fuse/core/FuseAuthorization/FuseAuthorization.js

@@ -50,7 +50,6 @@ class FuseAuthorization extends Component {
     const { location, userRole } = this.props;
     const { pathname } = location;
     const redirectUrl = loginRedirectUrl || this.defaultLoginRedirectUrl;
-    console.log(location, userRole, redirectUrl);
 
     /*
         User is guest

src/app/configs/settingsConfig.js

@@ -19,7 +19,7 @@ const settingsConfig = {
    To make whole app accessible without authorization by default set defaultAuth: null
    *** The individual route configs which has auth option won't be overridden.
    */
-  defaultAuth: ['admin'],
+  defaultAuth: ['admin', 'staff', 'user'],
   /*
     Default redirect url for the logged-in user,
    */

src/app/contexts/AuthContext.js

@@ -4,7 +4,7 @@ import { useDispatch } from 'react-redux';
 import FuseSplashScreen from '@fuse/core/FuseSplashScreen';
 import { showMessage } from 'app/store/fuse/messageSlice';
 import { logoutUser, setUser } from 'app/store/userSlice';
-import jwtService from './services/jwtService';
+import { authService, firebase } from '../services';
 
 const AuthContext = React.createContext();
 
@@ -14,44 +14,35 @@ function AuthProvider({ children }) {
   const dispatch = useDispatch();
 
   useEffect(() => {
-    jwtService.on('onAutoLogin', () => {
-      dispatch(showMessage({ message: 'Signing in with JWT' }));
-
-      /**
-       * Sign in and retrieve user data with stored token
-       */
-      jwtService
-        .signInWithToken()
-        .then((user) => {
-          success(user, 'Signed in with JWT');
-        })
-        .catch((error) => {
-          pass(error.message);
-        });
-    });
-
-    jwtService.on('onLogin', (user) => {
-      success(user, 'Signed in');
-    });
-
-    jwtService.on('onLogout', () => {
+    authService.on('onLogout', () => {
       pass('Signed out');
 
       dispatch(logoutUser());
     });
 
-    jwtService.on('onAutoLogout', (message) => {
-      pass(message);
+    authService.init(firebase.auth, firebase.db);
 
-      dispatch(logoutUser());
+    authService.onAuthStateChanged((authUser) => {
+      dispatch(showMessage({ message: 'Signing...' }));
+      if (authUser) {
+        authService
+          .getUserData(authUser.uid)
+          .then((user) => {
+            if (user) {
+              success(user, 'Signed in');
+            } else {
+              const { displayName, photoURL, email } = authUser;
+              success({ role: 'user', data: { displayName, photoURL, email } }, 'Signed in');
+            }
+          })
+          .catch((error) => {
+            pass(error.message);
+          });
+      } else {
+        pass('Signed out');
+      }
     });
 
-    jwtService.on('onNoAccessToken', () => {
-      pass();
-    });
-
-    jwtService.init();
-
     function success(user, message) {
       if (message) {
         dispatch(showMessage({ message }));

src/app/main/authPages/forgot-password/ForgotPasswordConfig.js

@@ -1,7 +1,7 @@
 import i18next from 'i18next';
 
 import ForgotPasswordPage from './ForgotPasswordPage';
-import authRoles from '../../../auth/authRoles';
+import authRoles from '../../../configs/authRoles';
 import en from './i18n/en';
 
 i18next.addResourceBundle('en', 'forgotPasswordPage', en);

src/app/main/authPages/forgot-password/ForgotPasswordPage.js

@@ -7,6 +7,7 @@ import Typography from '@mui/material/Typography';
 import { Controller, useForm } from 'react-hook-form';
 import { withTranslation } from 'react-i18next';
 import { Link } from 'react-router-dom';
+import { authService } from 'src/app/services';
 import * as yup from 'yup';
 import LeftSideCanvas from '../shared-components/LeftSideCanvas';
 
@@ -19,7 +20,7 @@ function ForgotPasswordPage({ t }) {
     email: yup.string().email(t('email_error')).required(t('email_error')),
   });
 
-  const { control, formState, handleSubmit, reset } = useForm({
+  const { control, formState, handleSubmit, setError } = useForm({
     mode: 'onChange',
     defaultValues,
     resolver: yupResolver(schema),
@@ -27,8 +28,13 @@ function ForgotPasswordPage({ t }) {
 
   const { isValid, dirtyFields, errors } = formState;
 
-  function onSubmit() {
-    reset(defaultValues);
+  function onSubmit({ email }) {
+    authService.sendPasswordResetEmail(email).catch((error) => {
+      setError('root', {
+        type: 'manual',
+        message: error.message,
+      });
+    });
   }
 
   return (

src/app/store/userSlice.js

@@ -5,7 +5,7 @@ import _ from '@lodash';
 import { setInitialSettings } from 'app/store/fuse/settingsSlice';
 import { showMessage } from 'app/store/fuse/messageSlice';
 import settingsConfig from 'app/configs/settingsConfig';
-import jwtService from '../auth/services/jwtService';
+import { authService } from '../services';
 
 export const setUser = createAsyncThunk('user/setUser', async (user, { dispatch, getState }) => {
   /*
@@ -30,24 +30,6 @@ export const updateUserSettings = createAsyncThunk(
   }
 );
 
-export const updateUserShortcuts = createAsyncThunk(
-  'user/updateShortucts',
-  async (shortcuts, { dispatch, getState }) => {
-    const { user } = getState();
-    const newUser = {
-      ...user,
-      data: {
-        ...user.data,
-        shortcuts,
-      },
-    };
-
-    dispatch(updateUserData(newUser));
-
-    return newUser;
-  }
-);
-
 export const logoutUser = () => async (dispatch, getState) => {
   const { user } = getState();
 
@@ -71,10 +53,10 @@ export const updateUserData = (user) => async (dispatch, getState) => {
     return;
   }
 
-  jwtService
+  authService
     .updateUserData(user)
     .then(() => {
-      dispatch(showMessage({ message: 'User data saved with api' }));
+      dispatch(showMessage({ message: 'User data saved' }));
     })
     .catch((error) => {
       dispatch(showMessage({ message: error.message }));
@@ -87,7 +69,6 @@ const initialState = {
     displayName: 'John Doe',
     photoURL: 'assets/images/avatars/brian-hughes.jpg',
     email: 'johndoe@withinpixels.com',
-    shortcuts: ['apps.calendar', 'apps.mailbox', 'apps.contacts', 'apps.tasks'],
   },
 };
 
@@ -99,7 +80,6 @@ const userSlice = createSlice({
   },
   extraReducers: {
     [updateUserSettings.fulfilled]: (state, action) => action.payload,
-    [updateUserShortcuts.fulfilled]: (state, action) => action.payload,
     [setUser.fulfilled]: (state, action) => action.payload,
   },
 });
@@ -108,6 +88,4 @@ export const { userLoggedOut } = userSlice.actions;
 
 export const selectUser = ({ user }) => user;
 
-export const selectUserShortcuts = ({ user }) => user.data.shortcuts;
-
 export default userSlice.reducer;

src/app/theme-layouts/shared-components/UserNavbarHeader.js

@@ -40,7 +40,7 @@ function UserNavbarHeader(props) {
           src={user.data.photoURL}
           alt={user.data.displayName}
         >
-          {user.data.displayName.charAt(0)}
+          {user.data.displayName?.charAt(0)}
         </Avatar>
       </div>
       <Typography className="username text-14 whitespace-nowrap font-medium">