feat(ui): move AI-assistant shell + shared routes into OSS app-mode framework

[karanh37]

Fixes https://github.com/open-metadata/openmetadata-collate/issues/6028

Moves the AI-assistant layout and shared-surface routes from the Collate ai-chat plugin into OpenMetadata OSS, with route/presentation selection driven by app mode. The goal is that only genuinely AI-specific surfaces remain downstream; everything with a classic equivalent (Explore, Observability, Context Center, Marketplace, …) lives in OSS and renders its AI presentation when useIsAiMode().

Stacks on top of #31906 (AppMode switcher) — the first commit here is that switcher, cherry-picked so this branch builds standalone; it will collapse once #31906 merges.

What's in this branch so far

• App-mode shell + nav-module framework (components/platform/ai-shell/): a mode-agnostic assistant shell (AssistantLayout, Sidebar, KeepAliveRoutes, AppModeRoutes) and an AppModule contract. Downstream plugins contribute their AI-exclusive nav + routes through new app-mode.* extension points on ExtensionPointRegistry — OSS imports no plugin code. Neutral naming (no AI prefixes); sharedAppModules is populated as domains migrate.
• Explore unified into a single mode-aware page: ExplorePageV1 renders the AI search header (moved to components/discovery/explore/ExploreHeader/) when in AI mode, and the classic page otherwise. Same /explore route in both modes — no AIExplorePage.
• Domain wave 1 moved into OSS as AppModules: observability, context-center, marketplace, plus the shared helpers/layouts they need (LiveRefreshBoundary, PermissionedLiveRoute, ListPageHeader).

Still to come (tracked, not in this draft yet)

• Remaining domains: entity, inbox/my-data, connections, chat, AI governance, and the Collate-only pipeline/alert observability pages.
• Downstream cutover (register AppModeRoutes, contribute the AI-exclusive modules + fallback) lands in the Collate repo.
• i18n: non-English locale strings for the new keys are English placeholders pending native review.

Verification

• yarn build (standalone OSS UI) passes.
• tsc clean for the new/changed files (the repo's pre-existing tsc backlog and the linked-@types/react dual-type noise are unaffected).
• Jest green for the moved Explore header (37) and observability suites.

🤖 Generated with Claude Code

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

[github-actions]

⚠️ UI Checkstyle passed — lint findings in changed files

🔍 ESLint findings in this PR's files — 0 error(s), 233 warning(s)

Errors block the build. Warnings do not yet — they are rules whose backlog is still
being worked down, listed so this PR does not add to it. See docs/ui-code-quality-gate.md.

0 error(s), 233 warning(s) across 84 changed file(s).

Count	Rule
59	sonarjs/no-duplicate-string
36	openmetadata-imports/no-lower-layer-page-imports
34	sonarjs/cyclomatic-complexity
31	react-hooks/exhaustive-deps
29	sonarjs/no-nested-conditional
9	sonarjs/no-nested-functions
9	sonarjs/expression-complexity
8	openmetadata-imports/no-cross-page-imports
4	openmetadata-imports/no-api-calls-in-iteration
3	openmetadata-imports/no-circular-imports

All findings

	Location	Rule	Message
🟡	src/components/AppModeSwitcher/AppModeSwitcher.tsx:48:73	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 12 which is greater than 10 authorized.","cost":2,"secondaryLocations":[{"line":48,"column":72,"endLine":48,"endColumn"
🟡	src/components/AppRouter/SettingsRouter.tsx:413:28	sonarjs/no-duplicate-string	Define a constant instead of duplicating this literal 4 times.
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:80:1	openmetadata-imports/no-internal-barrel-imports	Import the internal module directly instead of its index barrel so unrelated siblings do not enter the bundle graph.
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:309:9	react-hooks/exhaustive-deps	The 'onLoginHandler' function makes the dependencies of useMemo Hook (at line 964) change on every render. Move it inside the useMemo callback. Alternatively, w
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:394:6	react-hooks/exhaustive-deps	React Hook useCallback has missing dependencies: 'navigate', 'setApplicationLoading', 'setCurrentUser', and 'setIsAuthenticated'. Either include them or remove
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:419:9	react-hooks/exhaustive-deps	The 'resetUserDetails' function makes the dependencies of useMemo Hook (at line 964) change on every render. To fix this, wrap the definition of 'resetUserDetai
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:520:45	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 12 which is greater than 10 authorized.","cost":2,"secondaryLocations":[{"line":520,"column":44,"endLine":520,"endColum
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:582:6	react-hooks/exhaustive-deps	React Hook useEffect has missing dependencies: 'getLoggedInUserDetails' and 'startTokenExpiryTimer'. Either include them or remove the dependency array.
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:592:9	react-hooks/exhaustive-deps	The 'handleFailedLogin' function makes the dependencies of useMemo Hook (at line 964) change on every render. Move it inside the useMemo callback. Alternatively
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:650:5	react-hooks/exhaustive-deps	React Hook useCallback has missing dependencies: 'authConfig?.provider', 'handledVerifiedUser', 'navigate', 'resetUserDetails', and 'startTokenExpiryTimer'. Eit
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:695:9	react-hooks/exhaustive-deps	The 'initializeAxiosInterceptors' function makes the dependencies of useMemo Hook (at line 964) change on every render. To fix this, wrap the definition of 'ini
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:763:67	sonarjs/no-nested-functions	Refactor this code to not nest functions more than 4 levels deep.
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:770:23	openmetadata-imports/no-api-calls-in-iteration	Avoid issuing one API request per item. Fetch at the data owner, use a bulk endpoint, or use useQueries with an intentional concurrency policy.
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:782:37	sonarjs/no-nested-functions	Refactor this code to not nest functions more than 4 levels deep.
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:791:27	sonarjs/no-nested-functions	Refactor this code to not nest functions more than 4 levels deep.
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:860:30	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 17 which is greater than 10 authorized.","cost":7,"secondaryLocations":[{"line":860,"column":29,"endLine":860,"endColum
🟡	src/components/Auth/AuthProviders/AuthProvider.tsx:953:6	react-hooks/exhaustive-deps	React Hook useEffect has missing dependencies: 'cleanup', 'fetchAuthConfig', 'initializeAxiosInterceptors', and 'startTokenExpiryTimer'. Either include them or
🟡	src/components/Settings/Applications/plugins/AppPlugin.ts:19:1	openmetadata-imports/no-circular-imports	This runtime import participates in a circular dependency. Extract the shared type/constant/utility or invert the dependency.
🟡	src/components/Settings/Persona/CustomizeUI/CustomizeUI.tsx:64:5	react-hooks/exhaustive-deps	React Hook useCallback has a missing dependency: 'navigate'. Either include it or remove the dependency array. Outer scope values like 'history' aren't valid de
🟡	src/components/Settings/Users/UserProfileIcon/UserProfileIcon.component.tsx:114:9	react-hooks/exhaustive-deps	The 'handleSelectedPersonaChange' function makes the dependencies of useCallback Hook (at line 190) change on every render. Move it inside the useCallback callb
🟡	src/components/Settings/Users/UserProfileIcon/UserProfileIcon.component.tsx:155:6	react-hooks/exhaustive-deps	React Hook useMemo has unnecessary dependencies: 'currentUser?.inheritedPersonas' and 'currentUser?.personas'. Either exclude them or remove the dependency arra
🟡	src/components/Settings/Users/UserProfileIcon/UserProfileIcon.component.tsx:401:5	react-hooks/exhaustive-deps	React Hook useMemo has missing dependencies: 'handleCloseDropdown', 'onLogoutHandler', 'personaLabelRenderer', 'readMoreTeamRenderer', and 'teamLabelRenderer'.
🟡	src/components/common/FilterButton/FilterButton.tsx:84:66	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 11 which is greater than 10 authorized.","cost":1,"secondaryLocations":[{"line":84,"column":65,"endLine":84,"endColumn"
🟡	src/components/common/FilterButton/FilterButton.tsx:108:9	sonarjs/no-nested-conditional	Extract this nested ternary operation into an independent statement.
🟡	src/components/common/FilterButton/FilterButton.tsx:128:6	react-hooks/exhaustive-deps	React Hook useMemo has a missing dependency: 'selectedValues'. Either include it or remove the dependency array.
🟡	src/components/common/FilterButton/FilterButton.tsx:128:23	react-hooks/exhaustive-deps	React Hook useMemo has a complex expression in the dependency array. Extract it to a separate variable so it can be statically checked.
🟡	src/components/common/FilterButton/FilterButton.tsx:235:31	sonarjs/no-nested-conditional	Extract this nested ternary operation into an independent statement.
🟡	src/components/discovery/explore/ExploreHeader/ExploreSearchCard.tsx:145:11	sonarjs/no-nested-conditional	Extract this nested ternary operation into an independent statement.
🟡	src/components/discovery/personal-space/AIUserMenu/AIUserMenu.tsx:219:71	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 13 which is greater than 10 authorized.","cost":3,"secondaryLocations":[{"line":219,"column":70,"endLine":219,"endColum
🟡	src/components/discovery/personal-space/AIUserMenu/AIUserMenu.tsx:375:5	react-hooks/exhaustive-deps	React Hook useMemo has an unnecessary dependency: 'openPanel'. Either exclude it or remove the dependency array.
🟡	src/components/discovery/personal-space/InboxIconButton/InboxIconButton.tsx:84:9	sonarjs/no-nested-conditional	Extract this nested ternary operation into an independent statement.
🟡	src/components/discovery/personal-space/InboxPage/components/ActivityDetailDrawer.tsx:109:4	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 15 which is greater than 10 authorized.","cost":5,"secondaryLocations":[{"line":109,"column":3,"endLine":109,"endColumn
🟡	src/components/discovery/personal-space/InboxPage/components/ActivityDetailDrawer.tsx:190:10	sonarjs/expression-complexity	Reduce the number of conditional operators (4) used in the expression (maximum allowed 3).
🟡	src/components/discovery/personal-space/InboxPage/components/ActivityDetailDrawer.tsx:267:4	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 30 which is greater than 10 authorized.","cost":20,"secondaryLocations":[{"line":267,"column":3,"endLine":267,"endColum
🟡	src/components/discovery/personal-space/InboxPage/components/ActivityDetailDrawer.tsx:352:7	sonarjs/no-nested-conditional	Extract this nested ternary operation into an independent statement.
🟡	src/components/discovery/personal-space/InboxPage/components/ActivityFeedItem.tsx:71:4	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 21 which is greater than 10 authorized.","cost":11,"secondaryLocations":[{"line":71,"column":3,"endLine":71,"endColumn"
🟡	src/components/discovery/personal-space/InboxPage/components/ActivityFeedItem.tsx:100:7	sonarjs/no-nested-conditional	Extract this nested ternary operation into an independent statement.
🟡	src/components/discovery/personal-space/InboxPage/components/TaskActionCommentModal.tsx:82:4	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 23 which is greater than 10 authorized.","cost":13,"secondaryLocations":[{"line":82,"column":3,"endLine":82,"endColumn"
🟡	src/components/discovery/personal-space/InboxPage/components/TaskActionCommentModal.tsx:190:42	sonarjs/no-duplicate-string	Define a constant instead of duplicating this literal 3 times.
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:52:1	openmetadata-imports/no-lower-layer-page-imports	Pages are route-level composition modules. Move the shared implementation/type to a lower layer instead of importing a page from here.
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:158:4	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 11 which is greater than 10 authorized.","cost":1,"secondaryLocations":[{"line":158,"column":3,"endLine":158,"endColumn
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:221:10	sonarjs/expression-complexity	Reduce the number of conditional operators (4) used in the expression (maximum allowed 3).
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:276:24	sonarjs/no-duplicate-string	Define a constant instead of duplicating this literal 3 times.
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:293:4	sonarjs/cognitive-complexity	Refactor this function to reduce its Cognitive Complexity from 16 to the 15 allowed.
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:293:4	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 22 which is greater than 10 authorized.","cost":12,"secondaryLocations":[{"line":293,"column":3,"endLine":293,"endColum
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:445:41	openmetadata-imports/no-api-calls-in-iteration	Avoid issuing one API request per item. Fetch at the data owner, use a bulk endpoint, or use useQueries with an intentional concurrency policy.
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:621:7	sonarjs/no-nested-conditional	Extract this nested ternary operation into an independent statement.
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:655:9	sonarjs/no-nested-conditional	Extract this nested ternary operation into an independent statement.
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:704:33	sonarjs/cyclomatic-complexity	{"message":"Function has a complexity of 12 which is greater than 10 authorized.","cost":2,"secondaryLocations":[{"line":704,"column":32,"endLine":704,"endColum
🟡	src/components/discovery/personal-space/InboxPage/components/TaskDetailPanel.tsx:744:23	sonarjs/no-nested-conditional	Extract this nested ternary operation into an independent statement.

… and 183 more. Run make ui-checkstyle-changed locally for the full list.

---

Fix locally (fast - only checks files changed in this branch):

make ui-checkstyle-changed

[Copilot]

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

[gitar-bot]

Code Review ⚠️ Changes requested 6 resolved / 7 findings

Migrates the AI-assistant shell and shared routes into the OSS app-mode framework, but requests changes because the TeamUserSelectInput trigger lacks keyboard accessibility with no role or tabIndex.

⚠️ Quality: Team/user select trigger not keyboard-accessible

📄 openmetadata-ui/src/main/resources/ui/src/components/observability/Alerts/AlertAiDestinationConfigFields.component.tsx:253-267

The TeamUserSelectInput trigger is a plain <div> with onClick/onKeyDown but no role="button" and no tabIndex. Because the div is not in the tab order it can never receive focus, so the onKeyDown (Enter/Space) handler never fires for keyboard or screen-reader users — the dropdown is only openable with a mouse. Add role="button", tabIndex={isDisabled ? -1 : 0}, and aria-expanded/aria-haspopup, or (preferred per the design-system rules) use a real Core UI Button/Select element instead of a click-handled div.

Make the trigger focusable and expose button semantics.

<div
  aria-expanded={isDropdownOpen}
  aria-haspopup="listbox"
  className={classNames(
    ALERT_AI_FORM_CLASS_NAMES.teamUserSelectTrigger,
    isDisabled && ALERT_AI_FORM_CLASS_NAMES.teamUserSelectTriggerDisabled
  )}
  data-testid={`team-user-select-trigger-${destinationNumber}`}
  ref={triggerRef}
  role="button"
  tabIndex={isDisabled ? -1 : 0}
  onClick={isDisabled ? undefined : () => setIsDropdownOpen((p) => !p)}
  onKeyDown={/* unchanged */}>

✅ 6 resolved

✅ Bug: Tenant default "classicV1" is not translated, silently falls to Classic

📄 openmetadata-ui/src/main/resources/ui/src/hooks/useAppMode.ts:407-419 📄 openmetadata-spec/src/main/resources/json/schema/api/configuration/appConfiguration.json:12
The appConfiguration.defaultAppMode enum now permits "classicV1", but CONFIG_MODE_TO_RUNTIME only maps Classic and AI, so translateWireMode('classicV1') returns null and appDefault falls through to DEFAULT_APP_MODE. An admin who sets the tenant-wide default to classicV1 silently gets Classic. Add a classicV1 -> CLASSIC_V1_APP_MODE entry (and regenerate the DefaultAppMode enum) so the new wire value resolves.

✅ Bug: FilterButton uses missing i18n key label.no-options

📄 openmetadata-ui/src/main/resources/ui/src/components/common/FilterButton/FilterButton.tsx:212-214 📄 openmetadata-ui/src/main/resources/ui/src/locale/languages/en-us.json
When the option list is empty and no emptyLabel is passed, FilterButton renders t('label.no-options'), but that key does not exist in en-us.json (nor any other locale). Users will see the raw key string instead of translated empty-state text. Add a no-options entry under label in en-us.json (and the other locales, English placeholders consistent with the other new keys), or reuse an existing key.

✅ Bug: Fresh cross-tab hint never adopted into app-mode store at boot

📄 openmetadata-ui/src/main/resources/ui/src/components/Auth/AuthProviders/AuthProvider.tsx:193-196 📄 openmetadata-ui/src/main/resources/ui/src/components/Auth/AuthProviders/AuthProvider.tsx:221-232 📄 openmetadata-ui/src/main/resources/ui/src/hooks/useAppMode.ts:226-236
On an already-authenticated tab (e.g. cmd+click opening a new tab) with a fresh omAppModeHint but no session tuple, hydrateAndResolveAppMode returns early at line 194-196 without calling writeAppMode, and the module-init store is seeded only from the session tuple (never the hint). Since useResolvedAppMode — which previously read the hint and adopted it via writeAppMode — was deleted, nothing writes the hint's mode into useAppModeStore, so the new tab stays in DEFAULT_APP_MODE (Classic) even though a sibling tab is in ClassicV1. resolveInitialAppMode only influences the post-login navigate() path, not the returning-tab store. This defeats the cross-tab hint mechanism the code's own comments (line 221-232) claim to honor. Adopt the hint into the store in the fresh-hint branch before returning.

✅ Bug: 'on' drop onto a nested More-child silently drops the item

📄 openmetadata-ui/src/main/resources/ui/src/pages/CustomizeAppModeSidebarPage/CustomizeAppModeSidebarPage.utils.ts:266-280 📄 openmetadata-ui/src/main/resources/ui/src/pages/CustomizeAppModeSidebarPage/CustomizeAppModeSidebarPage.utils.ts:312-326
In insertNode, the position === 'on' branch only searches the top level (nodes.map(... current.key === targetKey)). If the Tree emits dropPosition: 'on' with a targetKey that is a leaf nested inside the "More" node, no top-level node matches, so the detached node is never re-inserted and insertNode returns rest without it. moveSidebarNode then passes isValidSidebarTree(next) (the structure is still valid — the item just vanished) and commits the tree, permanently losing the dragged nav item. The before/after branches handle nested targets, but on does not, and no test covers an on drop onto a More child. Guard against dropping the node by verifying it survived the insert (or reverting when the total node count decreases).

✅ Quality: import statement placed after const declaration

📄 openmetadata-ui/src/main/resources/ui/src/components/platform/ai-shell/AppModeRoutes/AppModeRoutes.tsx:30-33
In AppModeRoutes.tsx the import { useSyncActiveModule } statement now appears after the const PageNotFound = withPageSuspenseFallback(...) declaration. While imports are hoisted so this works at runtime, it violates the import/first convention and is easy to break during refactors. Move the import up with the other imports and declare PageNotFound below all imports.

...and 1 more resolved from earlier reviews

🤖 Prompt for agents

Code Review: Migrates the AI-assistant shell and shared routes into the OSS app-mode framework, but requests changes because the TeamUserSelectInput trigger lacks keyboard accessibility with no role or tabIndex.

1. ⚠️ Quality: Team/user select trigger not keyboard-accessible
   Files: openmetadata-ui/src/main/resources/ui/src/components/observability/Alerts/AlertAiDestinationConfigFields.component.tsx:253-267

   The `TeamUserSelectInput` trigger is a plain `<div>` with `onClick`/`onKeyDown` but no `role="button"` and no `tabIndex`. Because the div is not in the tab order it can never receive focus, so the `onKeyDown` (Enter/Space) handler never fires for keyboard or screen-reader users — the dropdown is only openable with a mouse. Add `role="button"`, `tabIndex={isDisabled ? -1 : 0}`, and `aria-expanded`/`aria-haspopup`, or (preferred per the design-system rules) use a real Core UI `Button`/`Select` element instead of a click-handled div.

   Fix (Make the trigger focusable and expose button semantics.):
   <div
     aria-expanded={isDropdownOpen}
     aria-haspopup="listbox"
     className={classNames(
       ALERT_AI_FORM_CLASS_NAMES.teamUserSelectTrigger,
       isDisabled && ALERT_AI_FORM_CLASS_NAMES.teamUserSelectTriggerDisabled
     )}
     data-testid={`team-user-select-trigger-${destinationNumber}`}
     ref={triggerRef}
     role="button"
     tabIndex={isDisabled ? -1 : 0}
     onClick={isDisabled ? undefined : () => setIsDropdownOpen((p) => !p)}
     onKeyDown={/* unchanged */}>

Options

Display: compact → Showing less information.

Comment with these commands to change the behavior for this request:

Compact

gitar display:verbose

_{Was this helpful? React with 👍 / 👎 | Powered by Gitar — free for open source}

[sonarqubecloud]

Quality Gate passed for 'open-metadata-ui'

Issues
68 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
1.8% Duplication on New Code

See analysis details on SonarQube Cloud