feat(settings): move Notification Routing into Developer Options (#1283)

app/src/components/settings/SettingsHome.tsx

@@ -186,23 +186,6 @@ const SettingsHome = () => {
       onClick: () => navigateToSettings('notifications'),
       dangerous: false,
     },
-    {
-      id: 'notification-routing',
-      title: 'Notification Routing',
-      description: 'AI importance scoring and orchestrator escalation for integration alerts',
-      icon: (
-        <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-          <path
-            strokeLinecap="round"
-            strokeLinejoin="round"
-            strokeWidth={2}
-            d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"
-          />
-        </svg>
-      ),
-      onClick: () => navigateToSettings('notification-routing'),
-      dangerous: false,
-    },
     {
       id: 'restart-tour',
       title: 'Restart Tour',

app/src/components/settings/hooks/__tests__/useSettingsNavigation.test.tsx

@@ -0,0 +1,30 @@
+import { screen } from '@testing-library/react';
+import { describe, expect, test } from 'vitest';
+
+import { renderWithProviders } from '../../../../test/test-utils';
+import { useSettingsNavigation } from '../useSettingsNavigation';
+
+/** Renders breadcrumb labels so we can assert on the hook output. */
+const BreadcrumbProbe = () => {
+  const { breadcrumbs } = useSettingsNavigation();
+  return <div data-testid="breadcrumbs">{breadcrumbs.map(b => b.label).join(' > ')}</div>;
+};
+
+describe('useSettingsNavigation breadcrumbs', () => {
+  test('notification-routing returns Settings > Developer Options', () => {
+    renderWithProviders(<BreadcrumbProbe />, {
+      initialEntries: ['/settings/notification-routing'],
+    });
+    expect(screen.getByTestId('breadcrumbs')).toHaveTextContent('Settings > Developer Options');
+  });
+
+  test('notifications returns Settings (top-level)', () => {
+    renderWithProviders(<BreadcrumbProbe />, { initialEntries: ['/settings/notifications'] });
+    expect(screen.getByTestId('breadcrumbs')).toHaveTextContent('Settings');
+  });
+
+  test('developer-options returns Settings (section page)', () => {
+    renderWithProviders(<BreadcrumbProbe />, { initialEntries: ['/settings/developer-options'] });
+    expect(screen.getByTestId('breadcrumbs')).toHaveTextContent('Settings');
+  });
+});

app/src/components/settings/hooks/useSettingsNavigation.ts

@@ -214,15 +214,15 @@ export const useSettingsNavigation = (): SettingsNavigationHook => {
       case 'memory-debug':
       case 'intelligence':
       case 'webhooks-triggers':
+      case 'notification-routing':
         return [settingsCrumb, developerCrumb];
 
       // Developer options section page
       case 'developer-options':
         return [settingsCrumb];
 
-      // Notifications panels sit at the top level of Settings.
+      // Notifications panel sits at the top level of Settings.
       case 'notifications':
-      case 'notification-routing':
         return [settingsCrumb];
 
       case 'home':

app/src/components/settings/panels/DeveloperOptionsPanel.tsx

@@ -152,6 +152,22 @@ const developerItems = [
       </svg>
     ),
   },
+  {
+    id: 'notification-routing',
+    title: 'Notification Routing',
+    description: 'AI importance scoring and orchestrator escalation for integration alerts',
+    route: 'notification-routing',
+    icon: (
+      <svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+        <path
+          strokeLinecap="round"
+          strokeLinejoin="round"
+          strokeWidth={2}
+          d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"
+        />
+      </svg>
+    ),
+  },
   {
     id: 'webhooks-triggers',
     title: 'ComposeIO Triggers',

app/src/pages/Settings.tsx

@@ -275,15 +275,15 @@ const Settings = () => {
         <Route path="voice" element={wrapSettingsPage(<VoicePanel />)} />
         <Route path="messaging" element={wrapSettingsPage(<MessagingPanel />)} />
         <Route path="notifications" element={wrapSettingsPage(<NotificationsPanel />)} />
-        <Route
-          path="notification-routing"
-          element={wrapSettingsPage(<NotificationRoutingPanel />)}
-        />
         <Route path="tools" element={wrapSettingsPage(<ToolsPanel />)} />
         {/* AI & Models leaf panels */}
         <Route path="local-model" element={wrapSettingsPage(<LocalModelPanel />)} />
         {/* Developer Options */}
         <Route path="developer-options" element={wrapSettingsPage(<DeveloperOptionsPanel />)} />
+        <Route
+          path="notification-routing"
+          element={wrapSettingsPage(<NotificationRoutingPanel />)}
+        />
         <Route path="ai" element={wrapSettingsPage(<AIPanel />)} />
         <Route path="agent-chat" element={wrapSettingsPage(<AgentChatPanel />)} />
         <Route path="cron-jobs" element={wrapSettingsPage(<CronJobsPanel />)} />