Remove redundant files and update pnpm lockfile

apps/web/app/home/[account]/_components/team-account-layout-sidebar.tsx

@@ -0,0 +1,150 @@
+'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 { TeamAccountAccountsSelector } from '../_components/team-account-accounts-selector';
+import { TeamAccountLayoutSidebarNavigation } from './team-account-layout-sidebar-navigation';
+
+type AccountModel = {
+  label: string | null;
+  value: string | null;
+  image: string | null;
+};
+
+export function TeamAccountLayoutSidebar(props: {
+  account: string;
+  accounts: AccountModel[];
+  collapsed: boolean;
+  user: User;
+}) {
+  return (
+    <Sidebar collapsed={props.collapsed}>
+      {({ collapsed, setCollapsed }) => (
+        <SidebarContainer
+          collapsed={collapsed}
+          setCollapsed={setCollapsed}
+          account={props.account}
+          accounts={props.accounts}
+          user={props.user}
+        />
+      )}
+    </Sidebar>
+  );
+}
+
+function SidebarContainer(props: {
+  account: string;
+  accounts: AccountModel[];
+  collapsed: boolean;
+  setCollapsed: (collapsed: boolean) => void;
+  collapsible?: boolean;
+  user: User;
+}) {
+  const { account, accounts } = props;
+
+  return (
+    <>
+      <SidebarContent className={'mt-4 justify-center'}>
+        <TeamAccountAccountsSelector
+          selectedAccount={account}
+          accounts={accounts}
+        />
+      </SidebarContent>
+
+      <SidebarContent className={`mt-5 h-[calc(100%-160px)] overflow-y-auto`}>
+        <TeamAccountLayoutSidebarNavigation account={account} />
+      </SidebarContent>
+
+      <div className={'absolute bottom-4 left-0 w-full'}>
+        <SidebarContent>
+          <div className={'flex space-x-2'}>
+            <ProfileAccountDropdownContainer
+              user={props.user}
+              collapsed={props.collapsed}
+            />
+          </div>
+
+          <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>
+  );
+}