Merge branch 'develop' into 102-forget-password-backend-fix

.env

@@ -9,4 +9,4 @@ DEV_DB_HOST=localhost
 DEV_DB_PORT=5432
 
 # JWT Secret Key
-JWT_SECRET="NKrbO2lpCsOpVAlqAPsjZ0tZXzIoKru7gAmYZ7XlHn0="
+JWT_SECRET="NKrbO2lpCsOpVAlqAPsjZ0tZXzIoKru7gAmYZ7XlHn0=qqwqeq"

.github/workflows/deploy.yml

@@ -0,0 +1,41 @@
+name: Deploy to Staging
+
+on:
+  push:
+    branches:
+      - staging
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [22.x]
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ matrix.node-version }}
+
+      - name: Set up SSH
+        env:
+          SSH_PRIVATE_KEY: ${{ secrets.SSH_PRIVATE_KEY }}
+          SSH_PASSPHRASE: ${{ secrets.SSH_PASSPHRASE }}
+        run: |
+          mkdir -p ~/.ssh
+          echo "$SSH_PRIVATE_KEY" > ~/.ssh/id_rsa
+          chmod 600 ~/.ssh/id_rsa
+          eval $(ssh-agent -s)
+          echo "$SSH_PASSPHRASE" | ssh-add ~/.ssh/id_rsa
+
+      - name: Deploy to DigitalOcean Droplet
+        env:
+          DO_USERNAME: ${{ secrets.DO_USERNAME }}
+        run: |
+          ssh -o StrictHostKeyChecking=no $DO_USERNAME@your_droplet_ip << EOF
+          cd ~/bluewave-onboarding && git pull && docker compose down && docker compose build && docker compose up -d
+          EOF

docker-compose.yml

@@ -37,10 +37,11 @@ services:
       - ./frontend:/app
       - /app/node_modules
     ports:
-      - "5173:5173"
+      - "4173:4173"
     environment:
-      - NODE_ENV=${NODE_ENV}
+      - NODE_ENV=production
     command: >
-      bash -c "if [ \"$$NODE_ENV\" = \"production\" ] ; then npm run build && npm run preview ; fi"
+      bash -c "npm run build && npm run preview"
+
 volumes:
-  pgdata:
+  pgdata:

frontend/Dockerfile

@@ -8,6 +8,10 @@ RUN npm install
 
 COPY . .
 
-EXPOSE 5173
+ENV NODE_OPTIONS="--max-old-space-size=4096"
 
-CMD if [ "$$NODE_ENV" = "production" ] ; then npm run build && npm run preview ; else npm run dev ; fi
+RUN npm run build
+
+EXPOSE 4173
+
+CMD ["npm", "run", "preview"]

frontend/src/App.jsx

@@ -22,17 +22,13 @@ import { Error404 } from "./scenes/errors/404";
 import { Error403 } from "./scenes/errors/403";
 
 function App() {
-  const { isLoggedIn } = useAuth(); //commented out for testing
-  // const isLoggedIn = true;
+  const { isLoggedIn } = useAuth();
+
   return (
     <>
       <Routes>
-        <Route
-          path="/"
-          element={isLoggedIn ? <Private Component={Home} /> : <LoginPage />}
-        />
-        {/* <Route path="/home" element={<Private Component={Home} />} /> */}
-        {/* <Route path="/" element={<Home/>} />         */}
+        <Route path="/"element={isLoggedIn ? <Private Component={Home} /> : <LoginPage />}/>
+        <Route path="/home" element={<Private Component={Home} />} />
         <Route path="/login" element={<LoginPage />} />
         <Route path="/signup" element={<CreateAccountPage />} />
         <Route path="/forgot-password" element={<ForgotPasswordPage />} />

frontend/src/components/Header/DropdownMenu/DropdownMenu.jsx

@@ -7,14 +7,16 @@ import LogoutOutlinedIcon from '@mui/icons-material/LogoutOutlined';
 import { useNavigate } from 'react-router-dom';
 import { logout } from '../../../services/loginServices';
 import toastEmitter, { TOAST_EMITTER_KEY } from '../../../utils/toastEmitter';
+import { useAuth } from '../../../services/authProvider';
 
 const DropdownMenu = () => {
     const navigate = useNavigate();
+    const { logoutAuth } = useAuth();
 
     const handleLogoutClick = async () => {
         await logout();
+        logoutAuth();
         toastEmitter.emit(TOAST_EMITTER_KEY, 'Logout successfull');
-        window.location.reload(); // TODO: should remove reload func
         navigate('/');
     };
 

frontend/src/scenes/login/CreateAccountPage.jsx

@@ -13,7 +13,7 @@ function CreateAccountPage() {
   const [passwordChecks, setPasswordChecks] = useState({ hasSpecialCharacter: false, atLeastEightCharacters: false });
   const [error, setError] = useState('');
   const navigate = useNavigate();
-  const { login } = useAuth();
+  const { loginAuth } = useAuth();
 
   const handleInputChange = (e) => {
     const { name, value } = e.target;
@@ -57,8 +57,8 @@ function CreateAccountPage() {
     const userData = { name: name, surname: surname, email: email, password: password };
 
     try {
-      const response = await signUp(userData);
-      login(); 
+      await signUp(userData);
+      loginAuth();
       navigate('/');
     } catch (error) {
       if (error.response && error.response.data) {

frontend/src/scenes/login/LoginPage.jsx

@@ -5,6 +5,7 @@ import { login } from '../../services/loginServices';
 import { useNavigate } from 'react-router-dom';
 import CustomLink from '../../components/CustomLink/CustomLink';
 import toastEmitter, { TOAST_EMITTER_KEY } from '../../utils/toastEmitter';
+import { useAuth } from '../../services/authProvider';
 
 function LoginPage() {
   const [email, setEmail] = useState('');
@@ -13,13 +14,14 @@ function LoginPage() {
   const [loginError, setLoginError] = useState(false);
   const [errorMessage, setErrorMessage] = useState('');
   const navigate = useNavigate();
+  const { loginAuth } = useAuth();
 
   const handleLogin = async () => {
     try {
-      const response = await login(email, password);
+      await login(email, password);
       toastEmitter.emit(TOAST_EMITTER_KEY, `Login successfull`)
-      window.location.reload(); // TODO: should remove reload func
-      navigate('/home');
+      loginAuth();
+      navigate('/');
     } catch (error) {
       setLoginError(true);
       setErrorMessage(error.response.data.error);

frontend/src/scenes/progressSteps/ProgressStepsMain.module.scss

@@ -10,6 +10,8 @@
         flex-direction: column;
         align-items: center;
         width: 100%;
+
+
         h2{
             @include text-style(header-text, semibold);
             margin: 1.5rem;
@@ -38,8 +40,6 @@
         color:  #D0D5DD;
         padding-left: 0.5rem;
       }
-
-
 
     .buttons{
         display: flex;            

frontend/src/services/authProvider.jsx

@@ -32,12 +32,16 @@ export const AuthProvider = ({ children }) => {
         fetchUser();
     }, []);
 
-    const login = () => {
+    const loginAuth = () => {
         setIsLoggedIn(true);
     };
 
+    const logoutAuth = () => {
+        setIsLoggedIn(false);
+    };
+
     return (
-        <AuthContext.Provider value={{isLoggedIn, login}}>
+        <AuthContext.Provider value={{isLoggedIn, loginAuth, logoutAuth}}>
             {children}
         </AuthContext.Provider>
     );

frontend/src/tests/scenes/login/LoginPage.test.jsx

@@ -3,14 +3,17 @@ import { describe, it, expect, vi } from 'vitest';
 import { BrowserRouter as Router } from 'react-router-dom';
 import LoginPage from '../../../scenes/login/LoginPage';
 import * as loginServices from '../../../services/loginServices';
+import { AuthProvider } from '../../../services/authProvider'; // Import your AuthProvider
 
 vi.mock('../../../services/loginServices');
 
 describe('LoginPage', () => {
   it('renders the login page', () => {
     render(
       <Router>
-        <LoginPage />
+        <AuthProvider> 
+          <LoginPage />
+        </AuthProvider>
       </Router>
     );
 
@@ -25,7 +28,9 @@ describe('LoginPage', () => {
 
     render(
       <Router>
-        <LoginPage />
+        <AuthProvider> 
+          <LoginPage />
+        </AuthProvider>
       </Router>
     );
 
@@ -42,7 +47,9 @@ describe('LoginPage', () => {
 
     render(
       <Router>
-        <LoginPage />
+        <AuthProvider> 
+          <LoginPage />
+        </AuthProvider>
       </Router>
     );
 

frontend/src/utils/constants.js

@@ -1,6 +1,6 @@
 // API constants
 //local environment
-export const API_BASE_URL = 'http://localhost:3000/api/';
+export const API_BASE_URL = 'https://localhost:3000/api/';
 //staging environment
 // export const API_BASE_URL = 'https://onboarding-demo.bluewavelabs.ca/api/';
 // Other constants

frontend/vite.config.js

@@ -4,6 +4,10 @@ import react from '@vitejs/plugin-react-swc';
 export default defineConfig({
   base: '/',
   plugins: [react()],
+  server: {
+    host: '0.0.0.0',
+    port: 4173
+  },
   test: {
     globals: true,
     environment: 'jsdom',