From 5f089e0b9de6891e8732597dd631945c5209b84c Mon Sep 17 00:00:00 2001 From: Vladyslav Matsiiako Date: Tue, 25 Feb 2025 17:07:53 +0900 Subject: [PATCH 1/7] improve sidebars --- .../MenuIconButton/MenuIconButton.tsx | 78 +- .../MinimizedOrgSidebar.tsx | 72 +- .../components/ShareSecretForm.tsx | 4 +- .../components/PitDrawer/PitDrawer.tsx | 9 +- .../SecretListView/SecretDetailSidebar.tsx | 695 ++++++++++-------- 5 files changed, 478 insertions(+), 380 deletions(-) diff --git a/frontend/src/layouts/OrganizationLayout/components/MenuIconButton/MenuIconButton.tsx b/frontend/src/layouts/OrganizationLayout/components/MenuIconButton/MenuIconButton.tsx index 3d8aff590..7da236ef4 100644 --- a/frontend/src/layouts/OrganizationLayout/components/MenuIconButton/MenuIconButton.tsx +++ b/frontend/src/layouts/OrganizationLayout/components/MenuIconButton/MenuIconButton.tsx @@ -20,44 +20,46 @@ export const MenuIconButton = ({ ComponentPropsWithRef & { lottieIconMode?: "reverse" | "forward" }): JSX.Element => { const iconRef = useRef(null); return ( - iconRef.current?.play()} - onMouseLeave={() => iconRef.current?.stop()} - ref={inputRef} - {...props} - > -
- {icon && ( -
- { - iconRef.current = el; - }} - src={`/lotties/${icon}.json`} - loop - className="h-full w-full" - mode={lottieIconMode} - /> -
- )} -
+ iconRef.current?.play()} + onMouseLeave={() => iconRef.current?.stop()} + ref={inputRef} + {...props} > - {children} -
- +
+ {icon && ( +
+ { + iconRef.current = el; + }} + src={`/lotties/${icon}.json`} + loop + className="h-full w-full" + mode={lottieIconMode} + /> +
+ )} +
+ {children} +
+ +
); }; diff --git a/frontend/src/layouts/OrganizationLayout/components/MinimizedOrgSidebar/MinimizedOrgSidebar.tsx b/frontend/src/layouts/OrganizationLayout/components/MinimizedOrgSidebar/MinimizedOrgSidebar.tsx index 273c4f15b..63c933f64 100644 --- a/frontend/src/layouts/OrganizationLayout/components/MinimizedOrgSidebar/MinimizedOrgSidebar.tsx +++ b/frontend/src/layouts/OrganizationLayout/components/MinimizedOrgSidebar/MinimizedOrgSidebar.tsx @@ -84,6 +84,10 @@ export const MinimizedOrgSidebar = () => { const [requiredMfaMethod, setRequiredMfaMethod] = useState(MfaMethod.EMAIL); const [mfaSuccessCallback, setMfaSuccessCallback] = useState<() => void>(() => {}); const { subscription } = useSubscription(); + const [open, setOpen] = useState(false); + const [openSupport, setOpenSupport] = useState(false); + const [openUser, setOpenUser] = useState(false); + const [openOrg, setOpenOrg] = useState(false); const { user } = useUser(); const { mutateAsync } = useGetOrgTrialUrl(); @@ -160,23 +164,25 @@ export const MinimizedOrgSidebar = () => { >