plane/apps/app/layouts/app-layout/app-sidebar.tsx
Aaryan Khandelwal da6ecd439c
refactor: favorite projects fetch function, chore: update tooltip design (#1526)
* chore: update tooltip design

* fix: due date popup overflow

* fix: build error

* fix: build error

* chore: add key to map return value

* refactor: favorite projects sidebar list
2023-07-14 15:08:07 +05:30

37 lines
1.1 KiB
TypeScript

// hooks
import useTheme from "hooks/use-theme";
// components
import {
WorkspaceHelpSection,
WorkspaceSidebarDropdown,
WorkspaceSidebarMenu,
} from "components/workspace";
import { ProjectSidebarList } from "components/project";
export interface SidebarProps {
toggleSidebar: boolean;
setToggleSidebar: React.Dispatch<React.SetStateAction<boolean>>;
}
const Sidebar: React.FC<SidebarProps> = ({ toggleSidebar, setToggleSidebar }) => {
// theme
const { collapsed: sidebarCollapse } = useTheme();
return (
<div
className={`fixed md:relative inset-y-0 flex flex-col bg-custom-sidebar-background-100 h-full flex-shrink-0 flex-grow-0 border-r border-custom-sidebar-border-100 z-20 duration-300 ${
sidebarCollapse ? "" : "md:w-[280px]"
} ${toggleSidebar ? "left-0" : "-left-full md:left-0"}`}
>
<div className="flex h-full w-full flex-1 flex-col">
<WorkspaceSidebarDropdown />
<WorkspaceSidebarMenu />
<ProjectSidebarList />
<WorkspaceHelpSection setSidebarActive={setToggleSidebar} />
</div>
</div>
);
};
export default Sidebar;