Fix: Select next sidebar menu item after removing current item (#19505)

This commit is contained in:
Abdul Rahman
2026-04-10 21:30:59 +05:30
committed by GitHub
parent 83653a463c
commit 8dd172ba00
@@ -1,18 +1,26 @@
import { useLingui } from '@lingui/react/macro';
import { isNonEmptyString } from '@sniptt/guards';
import { useNavigate } from 'react-router-dom';
import { SidePanelPages } from 'twenty-shared/types';
import { isDefined } from 'twenty-shared/utils';
import { IconDotsVertical } from 'twenty-ui/display';
import { pendingInsertionNavigationMenuItemState } from '@/navigation-menu-item/common/states/pendingInsertionNavigationMenuItemState';
import { type PendingInsertionNavigationMenuItem } from '@/navigation-menu-item/common/types/PendingInsertionNavigationMenuItem';
import { selectedNavigationMenuItemIdInEditModeState } from '@/navigation-menu-item/common/states/selectedNavigationMenuItemIdInEditModeState';
import { type PendingInsertionNavigationMenuItem } from '@/navigation-menu-item/common/types/PendingInsertionNavigationMenuItem';
import { useNavigationMenuItemSectionItems } from '@/navigation-menu-item/display/hooks/useNavigationMenuItemSectionItems';
import { getNavigationMenuItemComputedLink } from '@/navigation-menu-item/display/utils/getNavigationMenuItemComputedLink';
import { useNavigationMenuItemMoveRemove } from '@/navigation-menu-item/edit/hooks/useNavigationMenuItemMoveRemove';
import { useNavigationMenuItemsDraftState } from '@/navigation-menu-item/edit/hooks/useNavigationMenuItemsDraftState';
import { type OrganizeActionsProps } from '@/navigation-menu-item/edit/side-panel/components/SidePanelEditOrganizeActions';
import { useSidePanelSubPageHistory } from '@/side-panel/hooks/useSidePanelSubPageHistory';
import { objectMetadataItemsSelector } from '@/object-metadata/states/objectMetadataItemsSelector';
import { useNavigateSidePanel } from '@/side-panel/hooks/useNavigateSidePanel';
import { useSidePanelMenu } from '@/side-panel/hooks/useSidePanelMenu';
import { useSidePanelSubPageHistory } from '@/side-panel/hooks/useSidePanelSubPageHistory';
import { SidePanelSubPages } from '@/side-panel/types/SidePanelSubPages';
import { useAtomStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomStateValue';
import { useSetAtomState } from '@/ui/utilities/state/jotai/hooks/useSetAtomState';
import { viewsSelector } from '@/views/states/selectors/viewsSelector';
import { type NavigationMenuItem } from '~/generated-metadata/graphql';
const computeInsertionPosition = (
@@ -45,7 +53,9 @@ const computeInsertionPosition = (
export const useNavigationMenuItemEditOrganizeActions =
(): OrganizeActionsProps => {
const { t } = useLingui();
const navigate = useNavigate();
const { closeSidePanelMenu } = useSidePanelMenu();
const { navigateSidePanel } = useNavigateSidePanel();
const { navigateToSidePanelSubPage } = useSidePanelSubPageHistory();
const selectedNavigationMenuItemIdInEditMode = useAtomStateValue(
selectedNavigationMenuItemIdInEditModeState,
@@ -59,6 +69,8 @@ export const useNavigationMenuItemEditOrganizeActions =
const { workspaceNavigationMenuItems } = useNavigationMenuItemsDraftState();
const items = useNavigationMenuItemSectionItems();
const { moveUp, moveDown, remove } = useNavigationMenuItemMoveRemove();
const objectMetadataItems = useAtomStateValue(objectMetadataItemsSelector);
const views = useAtomStateValue(viewsSelector);
const selectedItem = selectedNavigationMenuItemIdInEditMode
? items.find((item) => item.id === selectedNavigationMenuItemIdInEditMode)
@@ -98,8 +110,33 @@ export const useNavigationMenuItemEditOrganizeActions =
};
const handleRemove = () => {
if (isDefined(selectedNavigationMenuItemIdInEditMode)) {
remove(selectedNavigationMenuItemIdInEditMode);
if (!isDefined(selectedNavigationMenuItemIdInEditMode)) {
return;
}
const nextItem =
siblings[selectedIndexInSiblings + 1] ??
siblings[selectedIndexInSiblings - 1];
remove(selectedNavigationMenuItemIdInEditMode);
if (isDefined(nextItem)) {
setSelectedNavigationMenuItemIdInEditMode(nextItem.id);
const link = getNavigationMenuItemComputedLink(
nextItem,
objectMetadataItems,
views,
);
if (isNonEmptyString(link)) {
navigate(link);
}
navigateSidePanel({
page: SidePanelPages.NavigationMenuItemEdit,
pageTitle: t`Edit`,
pageIcon: IconDotsVertical,
resetNavigationStack: true,
});
} else {
setSelectedNavigationMenuItemIdInEditMode(null);
closeSidePanelMenu();
}