admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

CreateComponentFamilyState -> createComponentFamilyStateV2 (#11546)

Browse Source 
Refacto of createComponentFamilyState

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Guillim
2025-04-14 10:31:30 +02:00
committed by GitHub
parent 27f542e132
commit 0de8140b3a
36 changed files with 311 additions and 299 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/twenty-front/src/modules/command-menu/components/CommandMenuDefaultSelectionEffect.tsx
View File

@ -1,5 +1,7 @@
import { hasUserSelectedCommandState } from '@/command-menu/states/hasUserSelectedCommandState';
import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { useEffect } from 'react';
import { useRecoilValue } from 'recoil';
import { isDefined } from 'twenty-shared/utils';
@ -9,10 +11,12 @@ export const CommandMenuDefaultSelectionEffect = ({
}: {
selectableItemIds: string[];
}) => {
const { setSelectedItemId, selectedItemIdState } =
useSelectableList('command-menu-list');
const { setSelectedItemId } = useSelectableList('command-menu-list');
const selectedItemId = useRecoilValue(selectedItemIdState);
const selectedItemId = useRecoilComponentValueV2(
selectedItemIdComponentState,
'command-menu-list',
);
const hasUserSelectedCommand = useRecoilValue(hasUserSelectedCommandState);

10
packages/twenty-front/src/modules/command-menu/components/CommandMenuItem.tsx
View File

@ -1,8 +1,8 @@
import { isNonEmptyString } from '@sniptt/guards';
import { useRecoilValue } from 'recoil';
import { useCommandMenuOnItemClick } from '@/command-menu/hooks/useCommandMenuOnItemClick';
import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
import { isSelectedItemIdComponentFamilySelector } from '@/ui/layout/selectable-list/states/selectors/isSelectedItemIdComponentFamilySelector';
import { useRecoilComponentFamilyValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentFamilyValueV2';
import { ReactNode } from 'react';
import { IconArrowUpRight, IconComponent } from 'twenty-ui/display';
import { MenuItemCommand } from 'twenty-ui/navigation';
@ -35,8 +35,10 @@ export const CommandMenuItem = ({
Icon = IconArrowUpRight;
}
const { isSelectedItemIdSelector } = useSelectableList();
const isSelectedItemId = useRecoilValue(isSelectedItemIdSelector(id));
const isSelectedItemId = useRecoilComponentFamilyValueV2(
isSelectedItemIdComponentFamilySelector,
id,
);
return (
<MenuItemCommand

2
packages/twenty-front/src/modules/command-menu/components/CommandMenuList.tsx
View File

@ -79,7 +79,7 @@ export const CommandMenuList = ({
<ScrollWrapper componentInstanceId={`scroll-wrapper-command-menu`}>
<StyledInnerList>
<SelectableList
selectableListId="command-menu-list"
selectableListInstanceId="command-menu-list"
hotkeyScope={AppHotkeyScope.CommandMenuOpen}
selectableItemIdArray={selectableItemIds}
onEnter={(itemId) => {