Merge branch 'dev' of github.com:LucasVbr/projet-web4 into dev

src/components/Carousel.tsx

@@ -23,7 +23,7 @@ const Carousel = ({images, borderRadius: bRadius}: Props) => {
   return (
       <Flex px={2} align="center" borderRadius={bRadius} overflow={'hidden'}
             justify={'space-between'} bgColor={'purple.50'} height={500}
-            bgImage={images[currentIndex]} bgSize={'contain'}
+            bgImage={images[currentIndex]} bgSize={'cover'}
             bgRepeat={'no-repeat'} bgPosition={'center'} width={'100%'}>
         <IconButton aria-label="left-arrow" borderRadius="full"
                     onClick={handleClickPrevious}>

src/components/chat/ChatList.tsx

@@ -1,6 +1,7 @@
 import {Chat, User} from '@prisma/client';
 import ChatListItem from '@/components/chat/ChatListItem';
 import {useEffect, useState} from 'react';
+import {Stack, StackDivider} from '@chakra-ui/react';
 
 type Props = {
   user: User
@@ -18,11 +19,11 @@ export default function ChatList({user}: Props) {
   }, []);
 
   return (
-      <>
+      <Stack divider={<StackDivider/>} spacing={2}>
         {chats.map(
             (chat: Chat & { User: User[] }, index: number) =>
                 <ChatListItem key={index} chat={chat} user={user}/>)
         }
-      </>
+      </Stack>
   );
 }

src/components/chat/ChatListItem.tsx

@@ -1,26 +1,24 @@
 import {Chat, User} from '@prisma/client';
-import {Box, Flex, Image, Text} from '@chakra-ui/react';
+import {Box, Button, Flex, Image, Text} from '@chakra-ui/react';
 import {useRouter} from 'next/router';
 
 type Props = {
   user: User,
-  chat: Chat & {User: User[]}
+  chat: Chat & { User: User[] }
 };
 
 export default function ChatListItem({user, chat}: Props) {
   const router = useRouter();
-  const otherUser = chat.User.find((u: User) => u.id !== user.id) as User
+  const otherUser = chat.User.find((u: User) => u.id !== user.id) as User;
 
   console.log(chat);
 
   return (
-      <>
-        <Flex cursor={"pointer"} onClick={() => router.push(`/chat/${chat.id}`)}>
-          <Image borderRadius={'full'} boxSize='50px' src={otherUser.images[0] ?? "/blank_profile_picture.webp"}/>
-          <Box>
-            <Text>{otherUser.firstName} {otherUser.lastName}</Text>
-          </Box>
-        </Flex>
-      </>
+      <Flex alignItems={"center"} gap={5} cursor={'pointer'} onClick={() => router.push(`/chat/${chat.id}`)}>
+        <Image borderRadius={'full'} boxSize="50px" src={otherUser.images[0] ?? '/blank_profile_picture.webp'}/>
+        <Box>
+          <Text>{otherUser.firstName} {otherUser.lastName}</Text>
+        </Box>
+      </Flex>
   );
 }

src/components/chat/MessageList.tsx

@@ -1,6 +1,6 @@
 import type {Message as MessageType, User} from '@prisma/client';
 import Message from '@/components/chat/Message';
-import {Flex} from '@chakra-ui/react';
+import {Flex, Box} from '@chakra-ui/react';
 
 type Props = {
   user: User,
@@ -9,12 +9,14 @@ type Props = {
 
 const MessageList = ({messages, user}: Props) => {
   return (
-      <Flex direction={'column'} gap={1}>
-        {messages.map((message, index) => <Message
-            align={user.id === message.UserID ? 'right' : 'left'} key={index}
-            message={message}/>
-        )}
-      </Flex>
+      <Box w={'70vh'} overflow={'scroll'}>
+        <Flex direction={'column'} gap={1} justifyContent={'flex-end'}>
+          {messages.map((message, index) => <Message
+              align={user.id === message.UserID ? 'right' : 'left'} key={index}
+              message={message}/>,
+          )}
+        </Flex>
+      </Box>
   );
 };
 

src/components/layout/dashboard/card_user/CardUser.tsx

@@ -17,13 +17,16 @@ import PassionTagList from "@/components/layout/dashboard/card_user/PassionTagLi
 import { useState } from "react";
 import SearchFailCard from "./SearchFailCard";
 import LoadingPage from "@/components/LoadingPage";
+import {User} from '@prisma/client';
 
-export default function CardUser({
-  users,
-  loggedUser,
-  setMatch,
-  refetchLoggedUser,
-}) {
+type Props = {
+  users: User[]
+  loggedUser: User
+  setMatch: any
+  refetchLoggedUser: any
+}
+
+export default function CardUser({users, loggedUser, setMatch, refetchLoggedUser}: Props) {
   const toast = useToast({
     position: "top",
     duration: 2000,

src/components/layout/dashboard/left_panel/LeftPanel.tsx

@@ -68,13 +68,6 @@ export default function LeftPanel(props) {
             Carte
           </LeftPanelButton>
 
-          <LeftPanelButton
-            leftIcon={<AiFillMessage />}
-            onClickHandler={() => router.push("/chat")}
-          >
-            Messages
-          </LeftPanelButton>
-
           <LeftPanelButton
             leftIcon={<BsFillPersonFill />}
             onClickHandler={() => router.push("/profile")}