From 8dd172ba00d06de1d1bd87dbeea7d8b01048d647 Mon Sep 17 00:00:00 2001
From: Abdul Rahman <81605929+abdulrahmancodes@users.noreply.github.com>
Date: Fri, 10 Apr 2026 21:30:59 +0530
Subject: [PATCH] Fix: Select next sidebar menu item after removing current
 item (#19505)

---
 ...seNavigationMenuItemEditOrganizeActions.ts | 45 +++++++++++++++++--
 1 file changed, 41 insertions(+), 4 deletions(-)

diff --git a/packages/twenty-front/src/modules/navigation-menu-item/edit/side-panel/hooks/useNavigationMenuItemEditOrganizeActions.ts b/packages/twenty-front/src/modules/navigation-menu-item/edit/side-panel/hooks/useNavigationMenuItemEditOrganizeActions.ts
index eaefda4e69..452f126a24 100644
--- a/packages/twenty-front/src/modules/navigation-menu-item/edit/side-panel/hooks/useNavigationMenuItemEditOrganizeActions.ts
+++ b/packages/twenty-front/src/modules/navigation-menu-item/edit/side-panel/hooks/useNavigationMenuItemEditOrganizeActions.ts
@@ -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();
       }