diff --git a/.changeset/itchy-teachers-jam.md b/.changeset/itchy-teachers-jam.md new file mode 100644 index 0000000000000..b6ddf809c621f --- /dev/null +++ b/.changeset/itchy-teachers-jam.md @@ -0,0 +1,5 @@ +--- +"@rocket.chat/meteor": patch +--- + +Fixes an issue where menus inside sidebar keeps opened even if the sidebar is collapsed diff --git a/apps/meteor/client/sidebar/header/UserMenu.tsx b/apps/meteor/client/sidebar/header/UserMenu.tsx index b4aa8b1ba2892..1f2239baa20e2 100644 --- a/apps/meteor/client/sidebar/header/UserMenu.tsx +++ b/apps/meteor/client/sidebar/header/UserMenu.tsx @@ -7,6 +7,7 @@ import { useHandleMenuAction, type GenericMenuItemProps, } from '@rocket.chat/ui-client'; +import { useLayout } from '@rocket.chat/ui-contexts'; import { useState, memo } from 'react'; import { useTranslation } from 'react-i18next'; @@ -17,7 +18,7 @@ import { useUserMenu } from './hooks/useUserMenu'; const UserMenu = ({ user }: { user: IUser }) => { const { t } = useTranslation(); const [isOpen, setIsOpen] = useState(false); - + const { sidebar } = useLayout(); const sections = useUserMenu(user); const items = sections.reduce((acc, { items }) => [...acc, ...items], [] as GenericMenuItemProps[]); @@ -36,6 +37,7 @@ const UserMenu = ({ user }: { user: IUser }) => { onAction={handleAction} isOpen={isOpen} onOpenChange={setIsOpen} + disabled={sidebar.isCollapsed} /> @@ -50,6 +52,7 @@ const UserMenu = ({ user }: { user: IUser }) => { onAction={handleAction} isOpen={isOpen} onOpenChange={setIsOpen} + disabled={sidebar.isCollapsed} /> diff --git a/apps/meteor/client/sidebar/header/actions/Administration.tsx b/apps/meteor/client/sidebar/header/actions/Administration.tsx index 15650d17c08ae..9305359141af2 100644 --- a/apps/meteor/client/sidebar/header/actions/Administration.tsx +++ b/apps/meteor/client/sidebar/header/actions/Administration.tsx @@ -1,5 +1,6 @@ import { Sidebar } from '@rocket.chat/fuselage'; import { GenericMenu } from '@rocket.chat/ui-client'; +import { useLayout } from '@rocket.chat/ui-contexts'; import type { HTMLAttributes } from 'react'; import { useTranslation } from 'react-i18next'; @@ -9,10 +10,12 @@ type AdministrationProps = Omit, 'is'>; const Administration = (props: AdministrationProps) => { const { t } = useTranslation(); - + const { sidebar } = useLayout(); const sections = useAdministrationMenu(); - return ; + return ( + + ); }; export default Administration; diff --git a/apps/meteor/client/sidebar/header/actions/CreateRoom.tsx b/apps/meteor/client/sidebar/header/actions/CreateRoom.tsx index 4bf9e57057c2e..38f4f85c5ecf2 100644 --- a/apps/meteor/client/sidebar/header/actions/CreateRoom.tsx +++ b/apps/meteor/client/sidebar/header/actions/CreateRoom.tsx @@ -1,5 +1,6 @@ import { Sidebar } from '@rocket.chat/fuselage'; import { GenericMenu } from '@rocket.chat/ui-client'; +import { useLayout } from '@rocket.chat/ui-contexts'; import type { HTMLAttributes } from 'react'; import { useTranslation } from 'react-i18next'; @@ -9,10 +10,19 @@ type CreateRoomProps = Omit, 'is'>; const CreateRoom = (props: CreateRoomProps) => { const { t } = useTranslation(); - + const { sidebar } = useLayout(); const sections = useCreateRoom(); - return ; + return ( + + ); }; export default CreateRoom; diff --git a/apps/meteor/client/sidebar/header/actions/Sort.tsx b/apps/meteor/client/sidebar/header/actions/Sort.tsx index 013f23fcacc83..8c94ebcd646e7 100644 --- a/apps/meteor/client/sidebar/header/actions/Sort.tsx +++ b/apps/meteor/client/sidebar/header/actions/Sort.tsx @@ -1,5 +1,6 @@ import { Sidebar } from '@rocket.chat/fuselage'; import { GenericMenu } from '@rocket.chat/ui-client'; +import { useLayout } from '@rocket.chat/ui-contexts'; import type { HTMLAttributes } from 'react'; import { useTranslation } from 'react-i18next'; @@ -9,11 +10,19 @@ type SortProps = Omit, 'is'>; const Sort = (props: SortProps) => { const { t } = useTranslation(); - + const { sidebar } = useLayout(); const sections = useSortMenu(); return ( - + ); };