From ebe988f651c1c2539febc0f21ce2ee0877db5ece Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Luc=C3=A0s?= <vabrelucas@gmail.com>
Date: Thu, 23 Mar 2023 16:08:07 +0100
Subject: [PATCH] Edit LeftPanelButton to add variants

Took 8 minutes
---
 src/components/layout/dashboard/left_panel/LeftPanel.jsx | 8 ++++++++
 .../layout/dashboard/left_panel/LeftPanelButton.tsx      | 9 +++++----
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/components/layout/dashboard/left_panel/LeftPanel.jsx b/src/components/layout/dashboard/left_panel/LeftPanel.jsx
index 6699b75..a69770a 100644
--- a/src/components/layout/dashboard/left_panel/LeftPanel.jsx
+++ b/src/components/layout/dashboard/left_panel/LeftPanel.jsx
@@ -7,10 +7,14 @@ import {
   Spacer,
 } from '@chakra-ui/react';
 import {useRouter} from 'next/router';
+
 import {AiFillMessage} from 'react-icons/ai';
 import {BsFillPersonFill} from 'react-icons/bs';
+import {BiLogOut} from 'react-icons/bi';
+
 import LeftPanelButton
   from '@/components/layout/dashboard/left_panel/LeftPanelButton';
+import {signOut} from 'next-auth/react';
 
 export default function LeftPanel(props) {
   const router = useRouter();
@@ -42,6 +46,10 @@ export default function LeftPanel(props) {
                            onClickHandler={() => router.push('/dashboard')}>
             Profile
           </LeftPanelButton>
+          <LeftPanelButton variant={"outline"} leftIcon={<BiLogOut/>}
+                           onClickHandler={() => signOut()}>
+            Deconnexion
+          </LeftPanelButton>
         </Flex>
       </Flex>
     </Card>
diff --git a/src/components/layout/dashboard/left_panel/LeftPanelButton.tsx b/src/components/layout/dashboard/left_panel/LeftPanelButton.tsx
index 9ae0b91..1af57e4 100644
--- a/src/components/layout/dashboard/left_panel/LeftPanelButton.tsx
+++ b/src/components/layout/dashboard/left_panel/LeftPanelButton.tsx
@@ -1,19 +1,20 @@
-import {Button} from '@chakra-ui/react';
+import {Button, ResponsiveValue} from '@chakra-ui/react';
 import {ReactJSXElement} from '@emotion/react/types/jsx-namespace';
 
 type Props = {
   children?: ReactJSXElement
   onClickHandler: () => void
-  leftIcon ?: ReactJSXElement
+  leftIcon?: ReactJSXElement,
+  variant?: ResponsiveValue<'link' | 'outline' | string | 'ghost' | 'solid' | 'unstyled'>
 }
 
 export default function LeftPanelButton(props: Props) {
-  const {children, onClickHandler, leftIcon: icon} = props;
+  const {children, onClickHandler, leftIcon: icon, variant = "ghost"} = props;
 
   return (
       <Button
           colorScheme={'purple'}
-          variant={'ghost'}
+          variant={variant}
           width={'100%'}
           justifyContent={'left'}
           onClick={onClickHandler}