Skip to content

feat(editor): Add dynamic credentials UI for ChatHub#25685

Merged
cstuncsik merged 14 commits intomasterfrom
iam-253-dynamic-creds-ui-for-chat
Feb 27, 2026
Merged

feat(editor): Add dynamic credentials UI for ChatHub#25685
cstuncsik merged 14 commits intomasterfrom
iam-253-dynamic-creds-ui-for-chat

Conversation

@cstuncsik
Copy link
Contributor

Summary

Implements the complete user-facing dynamic credentials UI for ChatHub, allowing users to authenticate required OAuth credentials before running workflows that use dynamic credential resolution.

Key Features:

  • Credential status display with warning/info callouts in chat input area
  • Side panel drawer for managing credential connections
  • OAuth popup flow with XSS protection
  • Real-time credential count tracking
  • Feature gated behind useDynamicCredentials() flag

Related Linear tickets, Github issues, and Community forum posts

https://linear.app/n8n/issue/IAM-253

Review / Merge checklist

  • PR title and summary are descriptive
  • Tests included (20 unit tests for useDynamicCredentialsStatus composable)
  • i18n support added (15 new keys in en.json)
  • Docs updated or follow-up ticket created

Implements user-facing UI for dynamic credentials in ChatHub:
- New composable: useDynamicCredentialsStatus for credential state management and OAuth flow
- New component: DynamicCredentialsDrawer for credential connection UI
- Integration in ChatPrompt and ChatView with conditional rendering based on credential status
- API functions to fetch execution status and authorize/revoke credentials
- i18n support for all UI strings
- Comprehensive unit tests for the composable

Feature is gated behind useDynamicCredentials() feature flag and enterprise license check.

Related: IAM-253

Co-Authored-By: Claude Haiku 4.5 <[email protected]>
@codecov
Copy link

codecov bot commented Feb 12, 2026

Bundle Report

Changes will increase total bundle size by 100.66kB (0.24%) ⬆️. This is within the configured threshold ✅

Detailed changes
Bundle name Size Change
editor-ui-esm 42.48MB 100.66kB (0.24%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: editor-ui-esm

Assets Changed:

Asset Name Size Change Total Size Change (%)
assets/typescript.worker-*.js 5.36kB 10.64MB 0.05%
assets/worker-*.js 5.36kB 2.92MB 0.18%
assets/constants-*.js 8.37kB 2.89MB 0.29%
assets/src-*.js 1.42kB 2.22MB 0.06%
assets/DataTableDetailsView-*.js 268 bytes 1.59MB 0.02%
assets/ParameterInputList-*.js 7.95kB 1.47MB 0.54%
assets/index-*.js 8.93kB 1.14MB 0.79%
assets/RunData-*.js 195 bytes 1.06MB 0.02%
assets/users.store-*.js 9.09kB 1.06MB 0.87%
assets/index-*.css -2.12kB 771.28kB -0.27%
assets/ChatView-*.js 19.05kB 674.39kB 2.91%
assets/_MapCache-*.js 3.63kB 575.64kB 0.63%
assets/src-*.css 1.56kB 475.1kB 0.33%
assets/useCanvasMapping-*.js 2.31kB 442.55kB 0.52%
assets/ParameterInputList-*.css 162 bytes 205.57kB 0.08%
assets/WorkflowDiffView-*.js -65 bytes 201.38kB -0.03%
assets/WorkflowsView-*.js 60 bytes 195.92kB 0.03%
assets/NodeView-*.js 1.03kB 146.47kB 0.71%
assets/usePostMessageHandler-*.js -721 bytes 124.15kB -0.58%
assets/canvas.eventBus-*.js (New) 115.8kB 115.8kB 100.0% 🚀
assets/useCanvasMapping-*.css 246 bytes 113.09kB 0.22%
assets/router-*.js 34 bytes 104.51kB 0.03%
assets/NodeCreator-*.js 225 bytes 100.84kB 0.22%
assets/ChatView-*.css 8.24kB 94.05kB 9.6% ⚠️
assets/VirtualSchema-*.js -2 bytes 1.06kB -0.19%
assets/VirtualSchema-*.js 7 bytes 91.61kB 0.01%
assets/useCanvasOperations-*.js 901 bytes 90.58kB 1.0%
assets/WorkflowLayout-*.js 432 bytes 87.82kB 0.49%
assets/NodeSettings-*.js -44 bytes 82.67kB -0.05%
assets/FixedCollectionParameter-*.js 3.28kB 74.19kB 4.62%
assets/ProjectSettings-*.js 682 bytes 71.42kB 0.96%
assets/TriggerPanel-*.js 93 bytes 57.14kB 0.16%
assets/SettingsSso-*.js 3.38kB 53.71kB 6.72% ⚠️
assets/NodeView-*.css 1.04kB 51.15kB 2.07%
assets/chat.store-*.js 719 bytes 49.75kB 1.47%
assets/SettingsMCPView-*.js -44 bytes 47.43kB -0.09%
assets/NodeDetailsView-*.js -39 bytes 43.78kB -0.09%
assets/WorkflowHistory-*.js 86 bytes 42.55kB 0.2%
assets/NodeDetailsViewV2-*.js -39 bytes 39.19kB -0.1%
assets/useCustomAgent-*.js 676 bytes 29.18kB 2.37%
assets/ResourcesListLayout-*.js 46 bytes 27.67kB 0.17%
assets/ProjectSettings-*.css 383 bytes 27.27kB 1.42%
assets/WorkerView-*.js -2 bytes 27.21kB -0.01%
assets/useRunWorkflow-*.js 87 bytes 26.0kB 0.34%
assets/ExecutionsTime-*.js 117 bytes 25.13kB 0.47%
assets/SettingsSourceControl-*.js 79 bytes 24.79kB 0.32%
assets/CredentialsView-*.js -11 bytes 24.47kB -0.04%
assets/usePushConnection-*.js 490 bytes 24.4kB 2.05%
assets/SettingsSecretsProviders.ee-*.js 787 bytes 23.82kB 3.42%
assets/CanvasRunWorkflowButton-*.js 102 bytes 22.09kB 0.46%
assets/ToolsManagerModal-*.js -44 bytes 20.35kB -0.22%
assets/WorkflowDiffView-*.css 155 bytes 19.33kB 0.81%
assets/assistant.store-*.js -4.03kB 18.81kB -17.63%
assets/ProjectRoleView-*.js -252 bytes 17.2kB -1.44%
assets/SettingsCommunityNodesView-*.js -2 bytes 16.73kB -0.01%
assets/WorkflowHistory-*.css 18 bytes 16.37kB 0.11%
assets/FixedCollectionParameter-*.css 593 bytes 15.97kB 3.86%
assets/MigrationRules-*.js 98 bytes 14.21kB 0.69%
assets/ProjectSharing-*.js 101 bytes 12.4kB 0.82%
assets/SettingsSso-*.css 103 bytes 12.28kB 0.85%
assets/SettingsChatHubView-*.js 85 bytes 12.12kB 0.71%
assets/MCPConnectWorkflowsModal-*.js -44 bytes 11.28kB -0.39%
assets/SettingsExternalSecrets-*.js 68 bytes 11.05kB 0.62%
assets/NodeCreation-*.js 2.58kB 10.87kB 31.15% ⚠️
assets/useActions-*.js 23 bytes 9.98kB 0.23%
assets/ProjectRolesView-*.js 5 bytes 9.85kB 0.05%
assets/usePinnedData-*.js 82 bytes 9.08kB 0.91%
assets/CommunityNodeUpdateInfo-*.js (New) 8.21kB 8.21kB 100.0% 🚀
assets/ResourceFiltersDropdown-*.js 101 bytes 7.1kB 1.44%
assets/en-*.js 140 bytes 6.49kB 2.21%
assets/ProjectHeader-*.css -129 bytes 6.46kB -1.96%
assets/NodeCreation-*.css 3.53kB 6.42kB 122.16% ⚠️
assets/useWorkflowActivate-*.js 719 bytes 5.81kB 14.11% ⚠️
assets/ToolSettingsModal-*.js -44 bytes 5.68kB -0.77%
assets/externalSecrets.ee.store-*.js -55 bytes 5.54kB -0.98%
assets/sso.store-*.js 14 bytes 5.53kB 0.25%
assets/DemoDiffView-*.js 17 bytes 5.37kB 0.32%
assets/useSettingsItems-*.js -234 bytes 5.28kB -4.25%
assets/DemoLayout-*.js -44 bytes 3.73kB -1.17%
assets/CommunityNodeUpdateInfo-*.css (New) 2.86kB 2.86kB 100.0% 🚀
assets/useSecretsProviderConnection.ee-*.js 988 bytes 2.75kB 56.23% ⚠️
assets/CollectionParameter-*.js -44 bytes 1.74kB -2.47%
assets/projectRoleScopes-*.js (New) 1.19kB 1.19kB 100.0% 🚀
assets/useNodeCreatorShortcutCoachmark-*.js (New) 1.14kB 1.14kB 100.0% 🚀
assets/useDynamicCredentials-*.js 610 bytes 1.12kB 120.55% ⚠️
assets/ProjectRoleView-*.css 119 bytes 992 bytes 13.63% ⚠️
assets/nodeCreator.store-*.js (Deleted) -115.61kB 0 bytes -100.0% 🗑️
assets/QuickConnectBanner-*.js (Deleted) -8.21kB 0 bytes -100.0% 🗑️
assets/QuickConnectBanner-*.css (Deleted) -2.86kB 0 bytes -100.0% 🗑️
assets/useEnvFeatureFlag-*.js (Deleted) -858 bytes 0 bytes -100.0% 🗑️

Files in assets/ChatView-*.js:

  • ./src/features/ai/chatHub/ChatView.vue → Total Size: 309 bytes

  • ./src/features/ai/chatHub/components/DynamicCredentialsDrawer.vue → Total Size: 388 bytes

  • ./src/features/ai/chatHub/composables/useDynamicCredentialsStatus.ts → Total Size: 4.0kB

  • ./src/features/ai/chatHub/components/ChatPrompt.vue → Total Size: 332 bytes

Files in assets/chat.store-*.js:

  • ./src/features/ai/chatHub/chat.api.ts → Total Size: 5.13kB

@codecov
Copy link

codecov bot commented Feb 12, 2026

@n8n-assistant n8n-assistant bot added the n8n team Authored by the n8n team label Feb 12, 2026
@cstuncsik cstuncsik changed the title feat(chat): Add dynamic credentials UI for ChatHub feat(editor): Add dynamic credentials UI for ChatHub Feb 13, 2026
@blacksmith-sh

This comment has been minimized.

cstuncsik and others added 3 commits February 17, 2026 14:08
…ds-ui-for-chat

# Conflicts:
#	packages/frontend/editor-ui/src/features/ai/chatHub/chat.api.ts
#	packages/frontend/editor-ui/src/features/ai/chatHub/components/ChatPrompt.vue
- Add native-type="button" to Connect button to prevent form submission
  from swallowing the click event
- Shrink resize wrapper width when drawer is open to prevent overflow clipping

Co-Authored-By: Claude Opus 4.6 <[email protected]>
@cstuncsik cstuncsik marked this pull request as ready for review February 18, 2026 10:05
@cstuncsik cstuncsik requested review from a team, BGZStephen, afitzek, guillaumejacquart and phyllis-noester and removed request for a team February 18, 2026 10:05
…nable n8n resolver

The OAuth callback for dynamic credentials required a Bearer token in the
CSRF state, which is empty when using cookie-based auth from Chat Hub.
Now falls back to the credential context identity (session JWT) when no
Authorization header is present, and carries auth metadata through the
callback chain for the n8n resolver's identity resolution.

Also registers the N8N credential resolver and adds a popup-closed polling
fallback for the OAuth flow in dev environments where BroadcastChannel
is cross-origin.

Co-Authored-By: Claude Opus 4.6 <[email protected]>
@blacksmith-sh

This comment has been minimized.

cstuncsik and others added 4 commits February 20, 2026 13:43
…loses

Instead of fetching status once after the popup closes, poll up to 10
times (1s apart) until the credential becomes configured. This handles
the race condition where the backend hasn't finished storing the OAuth
token when the popup closes.

Co-Authored-By: Claude Opus 4.6 <[email protected]>
Update test assertions to match the new authMetadata parameter in
saveDynamicCredential and the credential context metadata pass-through
in the OAuth callback chain.

Co-Authored-By: Claude Opus 4.6 <[email protected]>
afitzek
afitzek previously approved these changes Feb 24, 2026
Copy link
Contributor

@afitzek afitzek left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚀

@cstuncsik cstuncsik added this pull request to the merge queue Feb 25, 2026
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Feb 25, 2026
@cstuncsik cstuncsik added this pull request to the merge queue Feb 25, 2026
@cstuncsik cstuncsik added this pull request to the merge queue Feb 25, 2026
@github-merge-queue github-merge-queue bot removed this pull request from the merge queue due to failed status checks Feb 25, 2026
- Fix dark mode: use --color--background--light-2 for drawer panel
- Auto-close credentials drawer when all accounts are connected
- Remove "connected" callout (redundant with auto-close behavior)

Co-Authored-By: Claude Opus 4.6 <[email protected]>
Copy link
Contributor

@guillaumejacquart guillaumejacquart left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks good to me

@blacksmith-sh

This comment has been minimized.

@blacksmith-sh

This comment has been minimized.

@cstuncsik cstuncsik added this pull request to the merge queue Feb 27, 2026
Merged via the queue into master with commit 26b36e0 Feb 27, 2026
129 of 134 checks passed
@cstuncsik cstuncsik deleted the iam-253-dynamic-creds-ui-for-chat branch February 27, 2026 07:36
afitzek pushed a commit that referenced this pull request Feb 27, 2026
@n8n-assistant n8n-assistant bot mentioned this pull request Mar 2, 2026
Tuukkaa pushed a commit that referenced this pull request Mar 2, 2026
This was referenced Mar 3, 2026
@n8n-assistant
Copy link
Contributor

n8n-assistant bot commented Mar 3, 2026

Got released with [email protected]

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

n8n team Authored by the n8n team Released

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants