You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
38 lines
1.2 KiB
38 lines
1.2 KiB
import { useMode } from "../../stores/useMode";
|
|
import { twMerge } from "tailwind-merge";
|
|
import { forwardRef } from "react";
|
|
import { MODES } from "../../config";
|
|
import { PendingPointsFilters } from "./PendingPointsFilters/PendingPointsFilters";
|
|
import { OnApprovalPointsFilters } from "./OnApprovalPointsFilters/OnApprovalPointsFilters";
|
|
import { WorkingPointsFilters } from "./WorkingPointsFilters/WorkingPointsFilters";
|
|
import { ImportModeSidebarButtons } from "../ImportMode/SidebarButtons.jsx";
|
|
|
|
export const Sidebar = forwardRef(({ isCollapsed }, ref) => {
|
|
const { mode } = useMode();
|
|
|
|
const getFilters = () => {
|
|
if (mode === MODES.PENDING) {
|
|
return <PendingPointsFilters />;
|
|
}
|
|
|
|
if (mode === MODES.ON_APPROVAL) {
|
|
return <OnApprovalPointsFilters />;
|
|
}
|
|
|
|
return <WorkingPointsFilters />;
|
|
};
|
|
|
|
return (
|
|
<div
|
|
className={twMerge(
|
|
"h-screen p-3 overflow-y-auto shrink-0 border-solid border-border border-0 border-r-[1px] flex flex-col transition-all pt-20",
|
|
isCollapsed ? "basis-0 px-0 -translate-x-[320px]" : "basis-[320px]"
|
|
)}
|
|
ref={ref}
|
|
>
|
|
<ImportModeSidebarButtons />
|
|
<div className="flex flex-col flex-1">{getFilters()}</div>
|
|
</div>
|
|
);
|
|
});
|