Skip to content

chore(dashboard): reuse existing claude creds when migrating demo agent fixes NV-7856#11343

Merged
LetItRock merged 3 commits into
nextfrom
nv-7856-reuse-existing-anthropic-credential-for-demo-agents
May 29, 2026
Merged

chore(dashboard): reuse existing claude creds when migrating demo agent fixes NV-7856#11343
LetItRock merged 3 commits into
nextfrom
nv-7856-reuse-existing-anthropic-credential-for-demo-agents

Conversation

@LetItRock
Copy link
Copy Markdown
Contributor

@LetItRock LetItRock commented May 28, 2026

What changed? Why was the change needed?

Agents - Reuse existing Claude credentials when migrating an agent that used demo creds.

What changed

When migrating agents that previously used demo Claude (Anthropic) credentials, the UI now prefers reusing an existing real Anthropic integration instead of creating new demo/duplicate creds. A new IntegrationDropdown lets users pick a non-demo Anthropic integration; the DemoClaudeUpgradePanel then either migrates the agent using the selected integration ID or validates inline credentials, creates a new active AGENT integration, and migrates with that ID. This prevents credential duplication and simplifies migrating demo agents to users' own Anthropic accounts.

Affected areas

dashboard: Added an IntegrationDropdown component to list and select existing (non-demo) integrations; updated DemoClaudeUpgradePanel to support two migration flows (reuse selected integration or create-from-inline credentials), adjusted dialog copy/flow and CTA labels, and added status/validation UI. Also broadened GenerationStep.text to ReactNode to allow richer onboarding status labels.

Key technical decisions

  • Prefer reusing an existing non-demo Anthropic integration ID when available; otherwise validate inputs and create an active AGENT integration before migration.
  • The upgrade panel auto-selects the most recent usable Anthropic integration on open and only shows the inline credentials form when no real integration is available.

Testing

No automated tests were added; manual verification is required for integration selection, credential validation, both migration paths, and the updated dialog flow.

Review Change Stack

Screenshots

Screen.Recording.2026-05-28.at.18.05.57.mov
Screen.Recording.2026-05-28.at.18.25.35.mov

@LetItRock LetItRock self-assigned this May 28, 2026
@greptile-apps
Copy link
Copy Markdown

greptile-apps Bot commented May 28, 2026

PR author is not in the allowed authors list.

@linear-code
Copy link
Copy Markdown

linear-code Bot commented May 28, 2026

NV-7856

@netlify
Copy link
Copy Markdown

netlify Bot commented May 28, 2026

Deploy Preview for dashboard-v2-novu-staging ready!

Name Link
🔨 Latest commit 1336650
🔍 Latest deploy log https://app.netlify.com/projects/dashboard-v2-novu-staging/deploys/6a1961a4dd29a6000816560d
😎 Deploy Preview https://deploy-preview-11343.dashboard-v2.novu-staging.co
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 28, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 06685106-7199-4236-af86-401559d3063c

📥 Commits

Reviewing files that changed from the base of the PR and between 9aba12f and 1336650.

📒 Files selected for processing (1)
  • apps/dashboard/src/components/agents/demo-claude-upgrade-panel.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
  • apps/dashboard/src/components/agents/demo-claude-upgrade-panel.tsx

📝 Walkthrough

Walkthrough

Adds an IntegrationDropdown component, widens GenerationStatus step labels to ReactNode, and refactors DemoClaudeUpgradePanel to support selecting an existing Anthropic integration or creating inline credentials before migrating demo agents.

Changes

Agent Anthropic Integration and Upgrade Flow

Layer / File(s) Summary
IntegrationDropdown component
apps/dashboard/src/components/agents/connectors/integration-dropdown.tsx
New dropdown component that renders a popover with status badges (valid/missing), a trigger glyph, filters Claude-managed integrations by provider, optionally excludes demo integrations, and provides a setup action plus grouped existing integrations for selection.
GenerationStatus typing update
apps/dashboard/src/components/onboarding/connect-agent/generation-status.tsx
GenerationStep.text changed from string to ReactNode allowing richer step labels.
DemoClaudeUpgradePanel refactor with dual migration paths
apps/dashboard/src/components/agents/demo-claude-upgrade-panel.tsx
Panel auto-selects the newest non-demo Anthropic integration when available or shows inline credentials panel otherwise; adds selectedIntegrationId and credentialsPanelVisible state, switches between dropdown and inline setup, and updates migration to either reuse a selected integration id or validate/create a new AGENT integration then migrate. Dialog text, CTA label, and enablement logic updated.

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant DemoUpgradePanel
  participant IntegrationDropdown
  participant MigrationService
  User->>DemoUpgradePanel: Open dialog
  DemoUpgradePanel->>DemoUpgradePanel: Load real Anthropic integrations
  alt Has real integrations
    DemoUpgradePanel->>DemoUpgradePanel: Auto-select latest
    DemoUpgradePanel->>IntegrationDropdown: Display dropdown with selection
    User->>IntegrationDropdown: (Optional) change selection
    IntegrationDropdown->>DemoUpgradePanel: onSelectIntegration()
  else No real integrations
    DemoUpgradePanel->>DemoUpgradePanel: Show inline credentials form
    User->>DemoUpgradePanel: Enter API key & workspace
  end
  User->>DemoUpgradePanel: Click "Setup agent"
  alt Path A: Reuse selected integration
    DemoUpgradePanel->>MigrationService: Migrate with selected integration id
  else Path B: Inline credentials
    DemoUpgradePanel->>MigrationService: Verify credentials, create AGENT integration
    MigrationService->>DemoUpgradePanel: Return new integration id
    DemoUpgradePanel->>MigrationService: Migrate with new integration id
  end
  MigrationService->>User: Migration complete
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

  • novuhq/novu#11336: Adjusts sorting/selection of Claude/Anthropic integrations to prefer non-demo credentials, aligning with auto-selection behavior here.
  • novuhq/novu#11271: Updates Claude-managed integration filtering; related to IntegrationDropdown provider filtering.
  • novuhq/novu#11296: Related onboarding/generation-status typing/layout changes.
🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed Title follows Conventional Commits format (chore(dashboard):) with lowercase imperative description and includes the Linear ticket reference (NV-7856) at the end as required.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint skipped: no ESLint configuration detected in root package.json. To enable, add eslint to devDependencies.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@github-actions github-actions Bot changed the title chore(dashboard): reuse existing claude creds when migrating demo agent chore(dashboard): reuse existing claude creds when migrating demo agent fixes NV-7856 May 28, 2026
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@apps/dashboard/src/components/agents/demo-claude-upgrade-panel.tsx`:
- Around line 262-266: The current isBusy variable combines
upgradeMutation.isPending and verifyMutation.isPending which causes the
migration UI (GenerationStatus and primary CTA loading) to show when only
verification is running; change the logic so migration-related UI uses only
upgradeMutation.isPending (e.g., create a migrationBusy or use
upgradeMutation.isPending directly) while verification continues to
independently disable form controls via verifyMutation.isPending; update
references to isBusy (and canMigrate/dropdownStatus if they rely on it) so
verifyMutation.isPending no longer drives migration progress UI—apply the same
separation in the similar block around the code handling lines 375-389 and keep
identifiers upgradeMutation, verifyMutation, isBusy, canMigrate,
isSetupCredentialsReady, dropdownStatusFor, verifyStatus, and
hasUsableSelectedIntegration in mind when locating the changes.
- Around line 56-57: The effect that opens the demo upgrade dialog is treating
an empty realAnthropicIntegrations as "no creds" even while
useFetchIntegrations() is still loading; update the logic in the open effect
(the useEffect that reads integrations/realAnthropicIntegrations and sets
credentialsPanelVisible) to first check the fetch's loaded flag (e.g.,
isLoading/isFetched/status from useFetchIntegrations) and only decide to show
the inline setup when integrations have finished loading; additionally add a
loading state/UI while integrations are pending and make the same loaded-check
change for the related branch handling lines ~102-117 so existing Anthropic
credentials can be auto-selected once the query resolves.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 4b279335-fea2-4aae-a402-7282518c277c

📥 Commits

Reviewing files that changed from the base of the PR and between 555c157 and 8bdbe78.

📒 Files selected for processing (3)
  • apps/dashboard/src/components/agents/connectors/integration-dropdown.tsx
  • apps/dashboard/src/components/agents/demo-claude-upgrade-panel.tsx
  • apps/dashboard/src/components/onboarding/connect-agent/generation-status.tsx

Comment thread apps/dashboard/src/components/agents/demo-claude-upgrade-panel.tsx Outdated
Comment thread apps/dashboard/src/components/agents/demo-claude-upgrade-panel.tsx
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 28, 2026

Actionable comments posted: 0

@LetItRock LetItRock merged commit 9568ba0 into next May 29, 2026
34 of 35 checks passed
@LetItRock LetItRock deleted the nv-7856-reuse-existing-anthropic-credential-for-demo-agents branch May 29, 2026 10:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant