Command menu refactoring (#9257)
Refactored the `CommandMenu` component to make it more readable and easier to refactor. The file was way too big so I introduced a few hooks and eliminated code duplication. Introduced: - `useMatchCommands` hook to match commands with the search - `useCommandMenuCommands` which returns all command menu commands - `useMatchingCommandMenuCommands` to return the commands matched with the search - `CommandMenuContainer` to simplify the `DefaultLayout` - Unmounted the `CommandMenu` when it wasn't opened to improve performances I also introduced a new behavior: Automatically select the first item when opening the command menu: https://github.com/user-attachments/assets/4b683d49-570e-47c9-8939-99f42ed8691c
This commit is contained in:
@ -1,23 +0,0 @@
|
||||
import { actionMenuEntriesComponentSelector } from '@/action-menu/states/actionMenuEntriesComponentSelector';
|
||||
import { ActionMenuComponentInstanceContext } from '@/action-menu/states/contexts/ActionMenuComponentInstanceContext';
|
||||
import { Command } from '@/command-menu/types/Command';
|
||||
import { computeCommandMenuCommands } from '@/command-menu/utils/computeCommandMenuCommands';
|
||||
import { createComponentSelectorV2 } from '@/ui/utilities/state/component-state/utils/createComponentSelectorV2';
|
||||
|
||||
export const commandMenuCommandsComponentSelector = createComponentSelectorV2<
|
||||
Command[]
|
||||
>({
|
||||
key: 'commandMenuCommandsComponentSelector',
|
||||
componentInstanceContext: ActionMenuComponentInstanceContext,
|
||||
get:
|
||||
({ instanceId }) =>
|
||||
({ get }) => {
|
||||
const actionMenuEntries = get(
|
||||
actionMenuEntriesComponentSelector.selectorFamily({
|
||||
instanceId,
|
||||
}),
|
||||
);
|
||||
|
||||
return computeCommandMenuCommands(actionMenuEntries);
|
||||
},
|
||||
});
|
||||
Reference in New Issue
Block a user