()
| 43 | import { UserCombobox } from "./UserCombobox"; |
| 44 | |
| 45 | export const TasksSidebar: FC = () => { |
| 46 | const { user, permissions } = useAuthenticated(); |
| 47 | const ownerParam = useSearchParamsKey({ |
| 48 | key: "owner", |
| 49 | defaultValue: user.username, |
| 50 | }); |
| 51 | |
| 52 | const [isCollapsed, setIsCollapsed] = useState(false); |
| 53 | |
| 54 | return ( |
| 55 | <div |
| 56 | className={cn( |
| 57 | "h-full bg-surface-secondary w-full max-w-80", |
| 58 | "border-solid border-0 border-r transition-all flex flex-col", |
| 59 | { "max-w-14": isCollapsed }, |
| 60 | )} |
| 61 | > |
| 62 | <div className="p-3 flex flex-col gap-6"> |
| 63 | <div className="flex items-center place-content-between"> |
| 64 | {!isCollapsed && ( |
| 65 | <Link to="/tasks"> |
| 66 | <ProductLogo className="block size-6 m-1" /> |
| 67 | <span className="sr-only">Navigate to tasks</span> |
| 68 | </Link> |
| 69 | )} |
| 70 | |
| 71 | <TooltipProvider> |
| 72 | <Tooltip> |
| 73 | <TooltipTrigger asChild> |
| 74 | <Button |
| 75 | size="icon" |
| 76 | variant="subtle" |
| 77 | onClick={() => setIsCollapsed((v) => !v)} |
| 78 | className="[&_svg]:p-0" |
| 79 | > |
| 80 | <PanelLeftIcon /> |
| 81 | <span className="sr-only"> |
| 82 | {isCollapsed ? "Open" : "Close"} Sidebar |
| 83 | </span> |
| 84 | </Button> |
| 85 | </TooltipTrigger> |
| 86 | <TooltipContent side="right" align="center"> |
| 87 | {isCollapsed ? "Open" : "Close"} Sidebar |
| 88 | </TooltipContent> |
| 89 | </Tooltip> |
| 90 | </TooltipProvider> |
| 91 | </div> |
| 92 | |
| 93 | <TooltipProvider> |
| 94 | <Tooltip> |
| 95 | <TooltipTrigger asChild> |
| 96 | <Button |
| 97 | variant={isCollapsed ? "subtle" : "default"} |
| 98 | size={isCollapsed ? "icon" : "sm"} |
| 99 | asChild |
| 100 | className={cn({ "[&_svg]:p-0": isCollapsed })} |
| 101 | > |
| 102 | <Link to="/tasks"> |
nothing calls this directly
no test coverage detected