From fb104e0b7fa14d1fefdd4a3a95383cbbe5046895 Mon Sep 17 00:00:00 2001
From: gbuomprisco <giancarlopsk@gmail.com>
Date: Thu, 13 Jun 2024 22:28:15 +0800
Subject: [PATCH] Simplify team account layout sidebar

The team account layout sidebar has been simplified by removing collapsible functionality and unneeded dependencies. The changes aim to improve clarity and reduce complexity in the codebase. With a lesser number of dependencies, future updates or improvements should be easier.
---
 .../team-account-layout-sidebar.tsx           | 101 ++----------------
 1 file changed, 8 insertions(+), 93 deletions(-)

diff --git a/apps/web/app/home/[account]/_components/team-account-layout-sidebar.tsx b/apps/web/app/home/[account]/_components/team-account-layout-sidebar.tsx
index 2df34e41a..d431f4fda 100644
--- a/apps/web/app/home/[account]/_components/team-account-layout-sidebar.tsx
+++ b/apps/web/app/home/[account]/_components/team-account-layout-sidebar.tsx
@@ -1,19 +1,5 @@
-'use client';
-
 import { User } from '@supabase/supabase-js';
-
-import { ArrowLeftCircle, ArrowRightCircle } from 'lucide-react';
-
-import { If } from '@kit/ui/if';
 import { Sidebar, SidebarContent } from '@kit/ui/sidebar';
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
-} from '@kit/ui/tooltip';
-import { Trans } from '@kit/ui/trans';
-import { cn } from '@kit/ui/utils';
 
 import { ProfileAccountDropdownContainer } from '~/components//personal-account-dropdown-container';
 import { TeamAccountNotifications } from '~/home/[account]/_components/team-account-notifications';
@@ -35,17 +21,13 @@ export function TeamAccountLayoutSidebar(props: {
   user: User;
 }) {
   return (
-    <Sidebar collapsed={props.collapsed}>
-      {({ collapsed, setCollapsed }) => (
-        <SidebarContainer
-          collapsed={collapsed}
-          setCollapsed={setCollapsed}
-          account={props.account}
-          accountId={props.accountId}
-          accounts={props.accounts}
-          user={props.user}
-        />
-      )}
+    <Sidebar>
+      <SidebarContainer
+        account={props.account}
+        accountId={props.accountId}
+        accounts={props.accounts}
+        user={props.user}
+      />
     </Sidebar>
   );
 }
@@ -54,8 +36,6 @@ function SidebarContainer(props: {
   account: string;
   accountId: string;
   accounts: AccountModel[];
-  collapsed: boolean;
-  setCollapsed: (collapsed: boolean) => void;
   collapsible?: boolean;
   user: User;
 }) {
@@ -89,75 +69,10 @@ function SidebarContainer(props: {
         <SidebarContent>
           <ProfileAccountDropdownContainer
             user={props.user}
-            collapsed={props.collapsed}
+            collapsed={false}
           />
-
-          <If condition={props.collapsible}>
-            <AppSidebarFooterMenu
-              collapsed={props.collapsed}
-              setCollapsed={props.setCollapsed}
-            />
-          </If>
         </SidebarContent>
       </div>
     </>
   );
 }
-
-function AppSidebarFooterMenu(props: {
-  collapsed: boolean;
-  setCollapsed: (collapsed: boolean) => void;
-}) {
-  return (
-    <CollapsibleButton
-      collapsed={props.collapsed}
-      onClick={props.setCollapsed}
-    />
-  );
-}
-
-function CollapsibleButton({
-  collapsed,
-  onClick,
-}: React.PropsWithChildren<{
-  collapsed: boolean;
-  onClick: (collapsed: boolean) => void;
-}>) {
-  const className = cn(
-    `bg-background absolute -right-[10.5px] bottom-4 cursor-pointer block`,
-  );
-
-  const iconClassName = 'bg-background text-muted-foreground h-5 w-5';
-
-  return (
-    <TooltipProvider>
-      <Tooltip>
-        <TooltipTrigger
-          className={className}
-          aria-label={collapsed ? 'Expand sidebar' : 'Collapse sidebar'}
-          onClick={() => onClick(!collapsed)}
-        >
-          <ArrowRightCircle
-            className={cn(iconClassName, {
-              hidden: !collapsed,
-            })}
-          />
-
-          <ArrowLeftCircle
-            className={cn(iconClassName, {
-              hidden: collapsed,
-            })}
-          />
-        </TooltipTrigger>
-
-        <TooltipContent sideOffset={20}>
-          <Trans
-            i18nKey={
-              collapsed ? 'common:expandSidebar' : 'common:collapseSidebar'
-            }
-          />
-        </TooltipContent>
-      </Tooltip>
-    </TooltipProvider>
-  );
-}