From a0397dd53459f5801c0582196dbdf104ccc616a9 Mon Sep 17 00:00:00 2001
From: Vincent Sit <vincentsit00@ymail.com>
Date: Fri, 30 Aug 2024 21:07:22 +1200
Subject: [PATCH 1/2] Add toggle call when menu buttons are clicked to close
 sidebar

---
 .../react/src/components/sidebar/sidebar.tsx     | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/packages/react/src/components/sidebar/sidebar.tsx b/packages/react/src/components/sidebar/sidebar.tsx
index 8c8c9421d..e1b851496 100644
--- a/packages/react/src/components/sidebar/sidebar.tsx
+++ b/packages/react/src/components/sidebar/sidebar.tsx
@@ -147,7 +147,13 @@ export function Sidebar() {
           </Tooltip>
           <Tooltip delayDuration={0}>
             <TooltipTrigger asChild>
-              <Button variant="ghost" className="p-2" size="icon-lg" asChild>
+              <Button
+                variant="ghost"
+                className="p-2"
+                size="icon-lg"
+                asChild
+                onClick={toggle}
+              >
                 <Link to="/settings">
                   <span className="i-heroicons:cog-6-tooth" />
                 </Link>
@@ -157,7 +163,13 @@ export function Sidebar() {
           </Tooltip>{" "}
           <Tooltip delayDuration={0}>
             <TooltipTrigger asChild>
-              <Button variant="ghost" className="p-2" size="icon-lg" asChild>
+              <Button
+                variant="ghost"
+                className="p-2"
+                size="icon-lg"
+                asChild
+                onClick={toggle}
+              >
                 <Link to="/about">
                   <span className="i-heroicons:question-mark-circle" />
                 </Link>

From 5839ef216187b05f4ca8104b4bb613cd372d5a9c Mon Sep 17 00:00:00 2001
From: Vincent Sit <vincentsit00@ymail.com>
Date: Sat, 31 Aug 2024 10:09:23 +1200
Subject: [PATCH 2/2] Fix menu button not closing the sidebar when in mobile

---
 packages/react/src/components/sidebar/sidebar.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/react/src/components/sidebar/sidebar.tsx b/packages/react/src/components/sidebar/sidebar.tsx
index e1b851496..a5c8c0a70 100644
--- a/packages/react/src/components/sidebar/sidebar.tsx
+++ b/packages/react/src/components/sidebar/sidebar.tsx
@@ -29,6 +29,7 @@ export function Sidebar() {
 
   const floating = useAtomValue(isSidebarFloatingAtom);
   const [open, setOpen] = useAtom(isSidebarOpenAtom);
+  const isMobile = useAtomValue(isMobileAtom);
   const toggle = useSetAtom(toggleSidebarAtom);
   const fs = useAtomValue(sidebarShouldBeFullscreenAtom);
 
@@ -152,7 +153,7 @@ export function Sidebar() {
                 className="p-2"
                 size="icon-lg"
                 asChild
-                onClick={toggle}
+                onClick={isMobile ? toggle : undefined}
               >
                 <Link to="/settings">
                   <span className="i-heroicons:cog-6-tooth" />
@@ -168,7 +169,7 @@ export function Sidebar() {
                 className="p-2"
                 size="icon-lg"
                 asChild
-                onClick={toggle}
+                onClick={isMobile ? toggle : undefined}
               >
                 <Link to="/about">
                   <span className="i-heroicons:question-mark-circle" />