From 7efeb08bb7b5a7cf7081fa1135121440663003ed Mon Sep 17 00:00:00 2001
From: DrMint <thomas.barillot@etu.u-bordeaux.fr>
Date: Sun, 20 Feb 2022 15:18:14 +0100
Subject: [PATCH] Return buttons now close the subpanel in mobile

---
 src/components/Button.tsx                       | 3 +++
 src/components/PanelComponents/ReturnButton.tsx | 6 +++++-
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/components/Button.tsx b/src/components/Button.tsx
index 9f87826..0eafcfb 100644
--- a/src/components/Button.tsx
+++ b/src/components/Button.tsx
@@ -1,4 +1,5 @@
 import Link from "next/link";
+import { MouseEventHandler } from "react";
 
 type ButtonProps = {
   className?: string;
@@ -6,11 +7,13 @@ type ButtonProps = {
   children: React.ReactChild | React.ReactChild[];
   active?: boolean;
   locale?: string;
+  onClick?: MouseEventHandler<HTMLDivElement>;
 };
 
 export default function Button(props: ButtonProps): JSX.Element {
   const button = (
     <div
+      onClick={props.onClick}
       className={`grid place-content-center place-items-center border-[1px] border-dark text-dark rounded-full px-4 pt-[0.4rem] pb-[0.5rem] transition-all  ${
         props.className
       } ${
diff --git a/src/components/PanelComponents/ReturnButton.tsx b/src/components/PanelComponents/ReturnButton.tsx
index 21611d4..e684ff2 100644
--- a/src/components/PanelComponents/ReturnButton.tsx
+++ b/src/components/PanelComponents/ReturnButton.tsx
@@ -1,5 +1,7 @@
 import Button from "components/Button";
 import { GetWebsiteInterfaceQuery } from "graphql/operations-types";
+import { useDispatch } from "react-redux";
+import { setSubPanelOpen } from "redux/AppLayoutSlice";
 
 type ReturnButtonProps = {
   href: string;
@@ -8,8 +10,10 @@ type ReturnButtonProps = {
 };
 
 export default function ReturnButton(props: ReturnButtonProps): JSX.Element {
+  const dispatch = useDispatch();
+
   return (
-    <Button href={props.href}>
+    <Button onClick={() => dispatch(setSubPanelOpen(false))} href={props.href}>
       ❮&emsp;{props.langui.global_return_label} {props.title}
     </Button>
   );