Merge remote-tracking branch 'origin/develop'

client/next.config.mjs

@@ -1,14 +1,5 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  async redirects() {
-    return [
-      {
-        source: '/',
-        destination: '/home',
-        permanent: true,
-      },
-    ];
-  },
   images: {
     remotePatterns: [
       {
@@ -17,6 +8,12 @@ const nextConfig = {
         port:'',
         pathname: '/uploads/**',
       },
+      {
+        protocol: 'http',
+        hostname: 'localhost',
+        port:'4000',
+        pathname: '/uploads/**',
+      }
     ],
   },
 };

client/src/app/[lang]/(user)/user/profile/page.tsx

@@ -5,6 +5,7 @@ import { useErrorHandling } from '@/hooks/useErrorHandling';
 import { HttpService } from '@/services';
 import { IProfileResponse, IResponse } from '@/types/api';
 import { FormEvent, useEffect, useState } from 'react';
+
 export default function Profile({
   params: { lang },
 }: {
@@ -90,6 +91,7 @@ export default function Profile({
                   className="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-cyan-600 sm:max-w-md sm:text-sm sm:leading-6"
                   required={true}
                   defaultValue={username}
+                  onChange={(e) => setUsername(e.target.value)}
                 />
               </div>
             </div>
@@ -222,6 +224,14 @@ export default function Profile({
         </div>
       </div>
 
+      {errors.length > 0 &&
+        errors.map((error: string, index) => (
+          <p key={index} className="text-red-700">
+            {error}
+          </p>
+        ))}
+      {message !== '' && <p className="text-green-700">{message}</p>}
+
       <div className="mt-6 flex items-center justify-end gap-x-6">
         <button
           type="button"

client/src/components/Navbar.tsx

@@ -64,13 +64,20 @@ export default function Navbar() {
     handleNavChange(pathname);
     handleUserLoggedIn();
   }, [pathname, searchParams]);
+  const defaultLogo = 'user.png';
+  const [avatar, setAvatar] = useState<string>(
+    `${process.env.NEXT_PUBLIC_UPLOADS_URL}/${defaultLogo}`
+  );
 
   async function handleUserLoggedIn() {
     try {
       const response = await http.service().get<IResponse>(`/users/me`);
 
       if (response.data.isConnect === true) {
         setIsLoggedIn(true);
+        setAvatar(
+          `${process.env.NEXT_PUBLIC_UPLOADS_URL}/${response.data.informations.avatar}`
+        );
       } else {
         setIsLoggedIn(false);
       }
@@ -85,28 +92,32 @@ export default function Navbar() {
 
   async function handleUserLogout() {
     try {
-      await http.service().get<IResponse>(`/auth/logout`);
+      const response = await http.service().get<IResponse>(`/auth/logout`);
+      if (response.status === 'success') {
+        location.reload();
+      }
     } catch (e: any) {}
   }
 
-  async function handleProfile() {
-    try {
-      const response = await http
-        .service()
-        .get<IProfileResponse>(`/users/profile`);
-      setAvatar(response.data.user.avatar);
-    } catch (e: any) {}
-  }
+  // async function handleProfile() {
+  //   try {
+  //     const response = await http
+  //       .service()
+  //       .get<IProfileResponse>(`/users/profile`);
 
-  useEffect(() => {
-    handleProfile();
-  }, []);
+  //     if (!response.data.user.avatar) {
+  //       setAvatar(`${process.env.NEXT_PUBLIC_UPLOADS_URL}/${defaultLogo}`);
+  //     } else {
+  //       setAvatar(
+  //         `${process.env.NEXT_PUBLIC_UPLOADS_URL}/${response.data.user.avatar}`
+  //       );
+  //     }
+  //   } catch (e: any) {}
+  // }
 
-  const [avatar, setAvatar] = useState<string | null>(null);
-  const defaultLogo = '/relaxing-hippoquests.jpeg';
-  const avatarUrl = avatar
-    ? `${process.env.NEXT_PUBLIC_UPLOADS_URL}/${avatar}`
-    : defaultLogo;
+  // useEffect(() => {
+  //   handleProfile();
+  // }, []);
 
   return (
     <Disclosure as="nav" className="bg-gray-800">
@@ -197,7 +208,7 @@ export default function Navbar() {
                                   <Image
                                     width={32}
                                     height={32}
-                                    src={avatarUrl}
+                                    src={avatar}
                                     className="h-8 w-8 rounded-full"
                                     alt=""
                                   />
@@ -229,7 +240,7 @@ export default function Navbar() {
                                   <MenuItem key="logout">
                                     {({ active }) => (
                                       <Link
-                                        href="/home"
+                                        href=""
                                         onClick={() => {
                                           handleUserLogout();
                                         }}

client/src/types/api/index.ts

@@ -5,6 +5,11 @@ export interface IResponse {
   message: string;
   data: {
     isConnect: boolean;
+    informations: {
+      role: string;
+      username: string;
+      avatar: string;
+    };
   };
 }
 

docker-compose.dev.yml

@@ -29,8 +29,7 @@ services:
       - 4000:4000
     volumes:
       - ./server/src:/app/src
-      - prochainweb-images:/app/public/uploads
+      - ./server/public/uploads:/app/public/uploads
 
 volumes:
   prochainweb-database:
-  prochainweb-images:

server/src/middleware/uploadFile.ts

@@ -41,9 +41,9 @@ export const uploadFile = (req: Request, res: Response, next: NextFunction) => {
       );
     }
 
-    if (!req.file) {
+    /* if (!req.file) {
       return next(new AppError(400, 'No file uploaded.'));
-    }
+    } */
 
     // req.body.file = req.file.filename; // Store the filename in req.body for later use
     next();

server/src/types/file.ts

@@ -0,0 +1,5 @@
+import { Express, Request } from 'express';
+
+import { Multer } from 'multer';
+
+export type File = Express.Multer.File;

server/src/types/user.ts

@@ -14,4 +14,5 @@ export interface IUser {
 export interface IUserInformations {
   role: RoleEnumType | null;
   username: string;
+  avatar: string | null;
 }

server/src/user/controller/user.controller.ts

@@ -62,18 +62,19 @@ export const updateUserHandler = async (
     const user = (await getUserInformations(req, next)) as IUser;
 
     const { username, notification } = req.body;
-
-    const fileName = req.file!.filename;
-    console.log('filename', fileName);
+    console.log('username', username);
     await updateUser({
       user,
       username,
       notification: notification === 'true' ? true : false,
-      avatar: fileName,
+      avatar: req.file,
     });
 
+    const message =
+      req.language === 'fr' ? 'Profil mis à jour' : 'Profile updated';
     res.status(200).json({
       status: 'success',
+      message,
     });
   } catch (err: any) {
     next(err);

server/src/user/dto/user.dto.ts

@@ -9,5 +9,5 @@ export interface IUserUpdateDto {
   id: string;
   username: string;
   notification: boolean;
-  avatar: string;
+  avatar: string | null;
 }

server/src/user/repository/user.repository.ts

@@ -118,6 +118,7 @@ export class UserRepository {
       select: {
         role: true,
         username: true,
+        avatar: true
       },
     });
     return userinfos;

server/src/user/routes/user.routes.ts

@@ -7,14 +7,15 @@ import {
   updateUserHandler,
 } from '../controller/user.controller';
 import { uploadFile } from '../../middleware/uploadFile';
+import {readLanguage} from "../../middleware/readLanguage";
 
 const router = express.Router();
 
 router.get('/', authenticateUser, getUserHandler);
 
 router.get('/me', getMeHandler);
 
-router.post('/update', authenticateUser, uploadFile, updateUserHandler);
+router.post('/update', readLanguage, authenticateUser, uploadFile, updateUserHandler);
 
 router.get('/profile', authenticateUser, getProfileHandler);
 

server/src/user/service/user.service.ts

@@ -5,7 +5,7 @@ import AppError from '../../utils/appError';
 import { signJwt } from '../../utils/jwt';
 import { IUserUpdateDto, UserDto } from '../dto/user.dto';
 import { UserRepository } from '../repository/user.repository';
-
+import { File } from '../../types/file';
 export const createUser = async (user: UserDto) => {
   return await UserRepository.createUser(user);
 };
@@ -108,16 +108,20 @@ export async function updateUser({
   user: IUser;
   username: string;
   notification: boolean;
-  avatar: string;
+  avatar: File | undefined;
 }) {
   const userUpdate: IUserUpdateDto = {
     id: user.id,
     username,
     notification,
-    avatar,
+    avatar: null,
   };
   try {
-    await UserRepository.updateUser(userUpdate);
+    if (!avatar) {
+      userUpdate.avatar = user.avatar;
+      await UserRepository.updateUser(userUpdate);
+    }
+    // TODO: Logic if user change avatar
   } catch (err: any) {
     console.error(err);
     throw new AppError(400, 'Erreur lors de la mise à jour du profil.');