diff --git a/entrypoints/sidepanel/components/collections/CollectionHeader.tsx b/entrypoints/sidepanel/components/collections/CollectionHeader.tsx index 38d505e..e1364a0 100644 --- a/entrypoints/sidepanel/components/collections/CollectionHeader.tsx +++ b/entrypoints/sidepanel/components/collections/CollectionHeader.tsx @@ -12,6 +12,7 @@ import saveTabsToCollection from "@/utils/saveTabsToCollection"; export default function CollectionHeader({ dragHandleRef, dragHandleProps }: CollectionHeaderProps): React.ReactElement { + const [contextOpen, setContextOpen] = useState(false); const [listLocation] = useSettings("listLocation"); const isTab: boolean = listLocation === "tab" || listLocation === "pinned"; const { updateCollection } = useCollections(); @@ -53,7 +54,7 @@ export default function CollectionHeader({ dragHandleRef, dragHandleProps }: Col mergeClasses( cls.toolbar, "CollectionView__toolbar", - alwaysShowToolbars === true && cls.showToolbar + (alwaysShowToolbars === true || contextOpen) && cls.showToolbar ) } > { tabCount < 1 ? @@ -61,10 +62,10 @@ export default function CollectionHeader({ dragHandleRef, dragHandleProps }: Col { isTab ? i18n.t("collections.menu.add_all") : i18n.t("collections.menu.add_selected") } : - + setContextOpen(e.open) } /> } - + setContextOpen(e.open) } /> ); diff --git a/entrypoints/sidepanel/components/collections/CollectionMoreButton.tsx b/entrypoints/sidepanel/components/collections/CollectionMoreButton.tsx index 92ab169..db0fc24 100644 --- a/entrypoints/sidepanel/components/collections/CollectionMoreButton.tsx +++ b/entrypoints/sidepanel/components/collections/CollectionMoreButton.tsx @@ -1,14 +1,14 @@ import { useDialog } from "@/contexts/DialogProvider"; import { useDangerStyles } from "@/hooks/useDangerStyles"; import useSettings from "@/hooks/useSettings"; -import { Button, Menu, MenuDivider, MenuItem, MenuList, MenuPopover, MenuTrigger, Tooltip } from "@fluentui/react-components"; +import { Button, Menu, MenuDivider, MenuItem, MenuList, MenuOpenChangeData, MenuOpenEvent, MenuPopover, MenuTrigger, Tooltip } from "@fluentui/react-components"; import * as ic from "@fluentui/react-icons"; import CollectionContext, { CollectionContextType } from "../../contexts/CollectionContext"; import { useCollections } from "../../contexts/CollectionsProvider"; import exportCollectionToBookmarks from "../../utils/exportCollectionToBookmarks"; import EditDialog from "../EditDialog"; -export default function CollectionMoreButton({ onAddSelected }: CollectionMoreButtonProps): React.ReactElement +export default function CollectionMoreButton({ onAddSelected, onOpenChange }: CollectionMoreButtonProps): React.ReactElement { const [listLocation] = useSettings("listLocation"); const isTab: boolean = listLocation === "tab" || listLocation === "pinned"; @@ -56,7 +56,7 @@ export default function CollectionMoreButton({ onAddSelected }: CollectionMoreBu ); return ( - +