From 06ce89a03ab5f98623659fef4ab4086788129926 Mon Sep 17 00:00:00 2001
From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com>
Date: Sat, 24 Jun 2023 18:12:11 +0530
Subject: [PATCH] fix: sidebar toggle button on workspace dashboard (#1389)

---
 apps/app/layouts/app-layout/app-header.tsx        |  9 +++++++--
 .../auth-layout/project-authorization-wrapper.tsx | 15 +++++++--------
 .../workspace-authorization-wrapper.tsx           | 15 +++++++--------
 3 files changed, 21 insertions(+), 18 deletions(-)

diff --git a/apps/app/layouts/app-layout/app-header.tsx b/apps/app/layouts/app-layout/app-header.tsx
index 95f998dec..1f99e044e 100644
--- a/apps/app/layouts/app-layout/app-header.tsx
+++ b/apps/app/layouts/app-layout/app-header.tsx
@@ -6,10 +6,15 @@ type Props = {
   left?: JSX.Element;
   right?: JSX.Element;
   setToggleSidebar: React.Dispatch<React.SetStateAction<boolean>>;
+  noHeader: boolean;
 };
 
-const Header: React.FC<Props> = ({ breadcrumbs, left, right, setToggleSidebar }) => (
-  <div className="relative flex w-full flex-shrink-0 flex-row items-center justify-between gap-y-4 border-b border-brand-base bg-brand-sidebar px-5 py-4">
+const Header: React.FC<Props> = ({ breadcrumbs, left, right, setToggleSidebar, noHeader }) => (
+  <div
+    className={`relative flex w-full flex-shrink-0 flex-row items-center justify-between gap-y-4 border-b border-brand-base bg-brand-sidebar px-5 py-4 ${
+      noHeader ? "md:hidden" : ""
+    }`}
+  >
     <div className="flex items-center gap-2">
       <div className="block md:hidden">
         <button
diff --git a/apps/app/layouts/auth-layout/project-authorization-wrapper.tsx b/apps/app/layouts/auth-layout/project-authorization-wrapper.tsx
index e19ea6b70..a061491cf 100644
--- a/apps/app/layouts/auth-layout/project-authorization-wrapper.tsx
+++ b/apps/app/layouts/auth-layout/project-authorization-wrapper.tsx
@@ -100,14 +100,13 @@ const ProjectAuthorizationWrapped: React.FC<Props> = ({
                 : "bg-brand-base"
             }`}
           >
-            {!noHeader && (
-              <AppHeader
-                breadcrumbs={breadcrumbs}
-                left={left}
-                right={right}
-                setToggleSidebar={setToggleSidebar}
-              />
-            )}
+            <AppHeader
+              breadcrumbs={breadcrumbs}
+              left={left}
+              right={right}
+              setToggleSidebar={setToggleSidebar}
+              noHeader={noHeader}
+            />
             <div className="h-full w-full overflow-hidden">
               <div className="h-full w-full overflow-x-hidden overflow-y-scroll">{children}</div>
             </div>
diff --git a/apps/app/layouts/auth-layout/workspace-authorization-wrapper.tsx b/apps/app/layouts/auth-layout/workspace-authorization-wrapper.tsx
index 201dd5a72..6a3050655 100644
--- a/apps/app/layouts/auth-layout/workspace-authorization-wrapper.tsx
+++ b/apps/app/layouts/auth-layout/workspace-authorization-wrapper.tsx
@@ -107,14 +107,13 @@ export const WorkspaceAuthorizationLayout: React.FC<Props> = ({
                   : "bg-brand-base"
               }`}
             >
-              {!noHeader && (
-                <AppHeader
-                  breadcrumbs={breadcrumbs}
-                  left={left}
-                  right={right}
-                  setToggleSidebar={setToggleSidebar}
-                />
-              )}
+              <AppHeader
+                breadcrumbs={breadcrumbs}
+                left={left}
+                right={right}
+                setToggleSidebar={setToggleSidebar}
+                noHeader={noHeader}
+              />
               <div className="h-full w-full overflow-hidden">
                 <div className="relative h-full w-full overflow-x-hidden overflow-y-scroll">
                   {children}