Merge pull request #87 from splitly25/jwt-bug

Fix UI default theme, login session time

Author: tgkhang

api/src/controllers/userController.js

@@ -1,7 +1,7 @@
 import { StatusCodes } from 'http-status-codes'
 import { userService } from '~/services/userService.js'
 import ms from 'ms'
-import { chain } from 'lodash'
+import { env } from '~/config/environment'
 
 const createNew = async (req, res, next) => {
   try {
@@ -28,7 +28,7 @@ const login = async (req, res, next) => {
       httpOnly: true,
       secure: true,
       sameSite: 'none',
-      maxAge: ms('7d'),
+      maxAge: ms(env.ACCESS_JWT_EXPIRES_IN),
     })
     res.status(StatusCodes.OK).json(result)
   } catch (error) {
@@ -38,7 +38,11 @@ const login = async (req, res, next) => {
 
 const logout = async (req, res, next) => {
   try {
-    res.clearCookie('accessToken')
+    res.clearCookie('accessToken', {
+      httpOnly: true,
+      secure: true,
+      sameSite: 'none',
+    })
     res.status(StatusCodes.OK).json({ loggedOut: true })
   } catch (error) {
     next(error)

api/src/providers/JwtProvider.js

@@ -1,22 +1,23 @@
-import JWT from 'jsonwebtoken';
+import JWT from 'jsonwebtoken'
+import ms from 'ms'
 
 const generateToken = async (payload, secret_key, expiresIn = '1h') => {
   try {
-    return JWT.sign(payload, secret_key, { algorithm: 'HS256', expiresIn: expiresIn });
+    return JWT.sign(payload, secret_key, { algorithm: 'HS256', expiresIn: ms(expiresIn) })
   } catch (error) {
-    throw new Error('Token generation failed');
+    throw new Error('Token generation failed')
   }
-};
+}
 
 const verifyToken = async (token, secret_key) => {
   try {
-    return JWT.verify(token, secret_key);
+    return JWT.verify(token, secret_key)
   } catch (error) {
-    throw new Error('Invalid or expired token');
+    throw new Error('Invalid or expired token')
   }
-};
+}
 
 export const JwtProvider = {
   generateToken,
   verifyToken,
-};
+}

web/src/main.jsx

@@ -1,7 +1,7 @@
 // import { StrictMode } from 'react'
 import { createRoot } from 'react-dom/client'
 import CssBaseline from '@mui/material/CssBaseline'
-import { ThemeProvider } from '@mui/material/styles'
+import { Experimental_CssVarsProvider as CssVarsProvider } from '@mui/material/styles'
 import theme from '~/theme.js'
 import { ToastContainer } from 'react-toastify'
 import { ConfirmProvider } from 'material-ui-confirm'
@@ -27,7 +27,7 @@ createRoot(document.getElementById('root')).render(
     <Provider store={store}>
       <PersistGate loading={null} persistor={persistor}>
         <ChatbotProvider>
-          <ThemeProvider theme={theme}>
+          <CssVarsProvider theme={theme} defaultMode="light">
             <ConfirmProvider
               defaultOptions={{
                 dialogActionsProps: { maxWidth: 'xs' },
@@ -40,7 +40,7 @@ createRoot(document.getElementById('root')).render(
               <App />
               <ToastContainer />
             </ConfirmProvider>
-          </ThemeProvider>
+          </CssVarsProvider>
         </ChatbotProvider>
       </PersistGate>
     </Provider>