Ling0925
/
buster
mirror of https://github.com/buster-so/buster.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update SidebarSettings.tsx

This commit is contained in:
Nate Kelley 2025-03-24 15:19:28 -06:00
parent d385ccd302
commit 44f7f713b9
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
2 changed files with 68 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

112
web/src/components/features/sidebars/SidebarPrimary.tsx
View File

@ -150,13 +150,16 @@ export const SidebarPrimary = React.memo(() => {
const onCloseSupportModal = useMemoizedFn(() => setOpenSupportModal(false)); const onCloseSupportModal = useMemoizedFn(() => setOpenSupportModal(false));
const HeaderMemoized = useMemo(() => <SidebarPrimaryHeader />, []);
const FooterMemoized = useMemo(() => <SidebarUserFooter />, []);
return ( return (
<> <>
<Sidebar <Sidebar
content={sidebarItems} content={sidebarItems}
header={<SidebarPrimaryHeader />} header={HeaderMemoized}
activeItem={currentRoute} activeItem={currentRoute}
footer={<SidebarUserFooter />} footer={FooterMemoized}
/> />
<GlobalModals openSupportModal={openSupportModal} onCloseSupportModal={onCloseSupportModal} /> <GlobalModals openSupportModal={openSupportModal} onCloseSupportModal={onCloseSupportModal} />
@ -166,67 +169,60 @@ export const SidebarPrimary = React.memo(() => {
SidebarPrimary.displayName = 'SidebarPrimary'; SidebarPrimary.displayName = 'SidebarPrimary';
const SidebarPrimaryHeader = React.memo( const SidebarPrimaryHeader: React.FC = () => {
() => { const onChangePage = useAppLayoutContextSelector((s) => s.onChangePage);
const onChangePage = useAppLayoutContextSelector((s) => s.onChangePage); useHotkeys('C', () => {
useHotkeys('C', () => { onChangePage(BusterRoutes.APP_HOME);
onChangePage(BusterRoutes.APP_HOME); });
});
return ( return (
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<BusterLogoWithText /> <BusterLogoWithText />
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Tooltip title="Settings"> <Tooltip title="Settings">
<Link href={createBusterRoute({ route: BusterRoutes.SETTINGS_PROFILE })}> <Link href={createBusterRoute({ route: BusterRoutes.SETTINGS_PROFILE })}>
<Button prefix={<Gear />} variant="ghost" /> <Button prefix={<Gear />} variant="ghost" />
</Link> </Link>
</Tooltip> </Tooltip>
<Tooltip title="Start a chat" shortcuts={['C']}> <Tooltip title="Start a chat" shortcuts={['C']}>
<Link href={createBusterRoute({ route: BusterRoutes.APP_HOME })}> <Link href={createBusterRoute({ route: BusterRoutes.APP_HOME })}>
<Button <Button
size="tall" size="tall"
rounding={'large'} rounding={'large'}
prefix={ prefix={
<div className="flex items-center justify-center"> <div className="flex items-center justify-center">
<PencilSquareIcon /> <PencilSquareIcon />
</div> </div>
} }
/> />
</Link> </Link>
</Tooltip> </Tooltip>
</div>
</div> </div>
); </div>
}, );
() => true };
);
SidebarPrimaryHeader.displayName = 'SidebarPrimaryHeader'; const GlobalModals = ({
openSupportModal,
onCloseSupportModal
}: {
openSupportModal: boolean;
onCloseSupportModal: () => void;
}) => {
const onToggleInviteModal = useAppLayoutContextSelector((s) => s.onToggleInviteModal);
const openInviteModal = useAppLayoutContextSelector((s) => s.openInviteModal);
const onCloseInviteModal = useMemoizedFn(() => onToggleInviteModal(false));
const isAnonymousUser = useUserConfigContextSelector((state) => state.isAnonymousUser);
const GlobalModals = React.memo( if (isAnonymousUser) return null;
({
openSupportModal,
onCloseSupportModal
}: {
openSupportModal: boolean;
onCloseSupportModal: () => void;
}) => {
const onToggleInviteModal = useAppLayoutContextSelector((s) => s.onToggleInviteModal);
const openInviteModal = useAppLayoutContextSelector((s) => s.openInviteModal);
const onCloseInviteModal = useMemoizedFn(() => onToggleInviteModal(false));
const isAnonymousUser = useUserConfigContextSelector((state) => state.isAnonymousUser);
if (isAnonymousUser) return null; return (
<>
return ( <InvitePeopleModal open={openInviteModal} onClose={onCloseInviteModal} />
<> <SupportModal open={openSupportModal} onClose={onCloseSupportModal} />
<InvitePeopleModal open={openInviteModal} onClose={onCloseInviteModal} /> </>
<SupportModal open={openSupportModal} onClose={onCloseSupportModal} /> );
</> };
);
}
);
GlobalModals.displayName = 'GlobalModals'; GlobalModals.displayName = 'GlobalModals';
const favoritesDropdown = ( const favoritesDropdown = (

16
web/src/components/features/sidebars/SidebarSettings.tsx
View File

@ -74,12 +74,24 @@ export const SidebarSettings: React.FC<{}> = React.memo(({}) => {
return items; return items;
}, [isAdmin]); }, [isAdmin]);
console.log(currentParentRoute);
return ( return (
<Sidebar <Sidebar
content={content} content={content}
header={<SidebarSettingsHeader />} header={useMemo(
() => (
<SidebarSettingsHeader />
),
[]
)}
activeItem={currentParentRoute} activeItem={currentParentRoute}
footer={<SidebarUserFooter />} footer={useMemo(
() => (
<SidebarUserFooter />
),
[]
)}
/> />
); );
}); });