mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-18 09:20:15 +01:00
✨ fix: Minor Menu Issues (#8026)
* fix: Enable portal support in ExportAndShareMenu component * fix: MCPSubMenu with focus loop and improved button click handling * chore: remove "tools" header in toolsdropdown
This commit is contained in:
parent
2b2f7fe289
commit
5c947be455
3 changed files with 11 additions and 15 deletions
|
|
@ -68,6 +68,7 @@ export default function ExportAndShareMenu({
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<DropdownPopup
|
<DropdownPopup
|
||||||
|
portal={true}
|
||||||
menuId={menuId}
|
menuId={menuId}
|
||||||
focusLoop={true}
|
focusLoop={true}
|
||||||
unmountOnHide={true}
|
unmountOnHide={true}
|
||||||
|
|
|
||||||
|
|
@ -26,6 +26,7 @@ const MCPSubMenu = ({
|
||||||
const localize = useLocalize();
|
const localize = useLocalize();
|
||||||
|
|
||||||
const menuStore = Ariakit.useMenuStore({
|
const menuStore = Ariakit.useMenuStore({
|
||||||
|
focusLoop: true,
|
||||||
showTimeout: 100,
|
showTimeout: 100,
|
||||||
placement: 'right',
|
placement: 'right',
|
||||||
});
|
});
|
||||||
|
|
@ -35,7 +36,13 @@ const MCPSubMenu = ({
|
||||||
<Ariakit.MenuItem
|
<Ariakit.MenuItem
|
||||||
{...props}
|
{...props}
|
||||||
render={
|
render={
|
||||||
<Ariakit.MenuButton className="flex w-full cursor-pointer items-center justify-between rounded-lg p-2 hover:bg-surface-hover" />
|
<Ariakit.MenuButton
|
||||||
|
onClick={(e: React.MouseEvent<HTMLButtonElement>) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
menuStore.toggle();
|
||||||
|
}}
|
||||||
|
className="flex w-full cursor-pointer items-center justify-between rounded-lg p-2 hover:bg-surface-hover"
|
||||||
|
/>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<div className="flex items-center gap-2">
|
<div className="flex items-center gap-2">
|
||||||
|
|
@ -62,10 +69,8 @@ const MCPSubMenu = ({
|
||||||
</button>
|
</button>
|
||||||
</Ariakit.MenuItem>
|
</Ariakit.MenuItem>
|
||||||
<Ariakit.Menu
|
<Ariakit.Menu
|
||||||
gutter={-4}
|
|
||||||
shift={-8}
|
|
||||||
unmountOnHide
|
|
||||||
portal={true}
|
portal={true}
|
||||||
|
unmountOnHide={true}
|
||||||
className={cn(
|
className={cn(
|
||||||
'animate-popover-left z-50 ml-3 flex min-w-[200px] flex-col rounded-xl',
|
'animate-popover-left z-50 ml-3 flex min-w-[200px] flex-col rounded-xl',
|
||||||
'border border-border-light bg-surface-secondary p-1 shadow-lg',
|
'border border-border-light bg-surface-secondary p-1 shadow-lg',
|
||||||
|
|
|
||||||
|
|
@ -99,17 +99,7 @@ const ToolsDropdown = ({ disabled }: ToolsDropdownProps) => {
|
||||||
const mcpPlaceholder = startupConfig?.interface?.mcpServers?.placeholder;
|
const mcpPlaceholder = startupConfig?.interface?.mcpServers?.placeholder;
|
||||||
|
|
||||||
const dropdownItems = useMemo(() => {
|
const dropdownItems = useMemo(() => {
|
||||||
const items: MenuItemProps[] = [
|
const items: MenuItemProps[] = [];
|
||||||
{
|
|
||||||
render: () => (
|
|
||||||
<div className="px-3 py-2 text-xs font-semibold text-text-secondary">
|
|
||||||
{localize('com_ui_tools')}
|
|
||||||
</div>
|
|
||||||
),
|
|
||||||
hideOnClick: false,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
items.push({
|
items.push({
|
||||||
onClick: handleFileSearchToggle,
|
onClick: handleFileSearchToggle,
|
||||||
hideOnClick: false,
|
hideOnClick: false,
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue