Fix multiple UI/UX issues - #3001
Conversation
📝 WalkthroughWalkthroughThe changes update developer-portal settings, label selection, generated resource handles, subscription-token regeneration, API specification wiring, OAuth token interactions, workflow handles, and corresponding API documentation and integration tests. ChangesSettings management
Subscription token management
Identifier generation and API contracts
Portal interactions and presentation
Estimated code review effort: 4 (Complex) | ~60 minutes Sequence Diagram(s)sequenceDiagram
participant Developer
participant ManageModal
participant ConfirmationDialog
participant SubscriptionAPI
Developer->>ManageModal: Select Regenerate
ManageModal->>ConfirmationDialog: Show confirmation
Developer->>ConfirmationDialog: Confirm
ConfirmationDialog->>SubscriptionAPI: POST /subscriptions/{subId}/regenerate-token
SubscriptionAPI-->>ConfirmationDialog: Return token or error
ConfirmationDialog->>ManageModal: Show token and update controls
Possibly related PRs
Suggested reviewers: 🚥 Pre-merge checks | ✅ 2 | ❌ 3❌ Failed checks (2 warnings, 1 inconclusive)
✅ Passed checks (2 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
There was a problem hiding this comment.
Actionable comments posted: 5
🤖 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 `@portals/developer-portal/it/ui/cypress/e2e/settings/002-key-managers.cy.js`:
- Around line 25-29: Replace the Date.now()-based suffix in
002-key-managers.cy.js lines 25-29 with crypto.randomUUID(), and use that UUID
for the key-manager and application identifiers. Apply the same UUID-based
suffix change in 001-views-labels.cy.js lines 23-27 for the view and label
identifiers, preserving the existing naming formats.
In `@portals/developer-portal/src/pages/partials/api-specification.hbs`:
- Line 9: Restore the conditional tryout proxy configuration in the Elements API
component, using the existing tryoutProxyBase value generated by the controller
and preserving direct requests only when the proxy is unavailable or
intentionally disabled. Ensure tryouts continue using tryoutProxyController.js
protections for non-CORS endpoints rather than bypassing server-side validation,
timeout, and response-size checks.
In `@portals/developer-portal/src/scripts/api-subscription-plans.js`:
- Around line 181-186: Replace the raw err.description and e.message
interpolations in the regeneration failure alerts with one generic failure
message in both
portals/developer-portal/src/scripts/api-subscription-plans.js:181-186 and
portals/developer-portal/src/scripts/mcp-subscription-plans.js:166-171. Keep
backend error details out of client-facing alerts and retain them only in
server-side logging.
- Around line 150-158: Make both regeneration dialogs keyboard and screen-reader
accessible: in portals/developer-portal/src/scripts/api-subscription-plans.js
lines 150-158 and portals/developer-portal/src/scripts/mcp-subscription-plans.js
lines 133-141, store the triggering element when opening, move focus to a dialog
action, and restore focus to that trigger when closing; in
portals/developer-portal/src/defaultContent/pages/api-landing/partials/api-subscription-plans.hbs
lines 177-189 and
portals/developer-portal/src/defaultContent/pages/mcp-landing/partials/mcp-subscription-plans.hbs
lines 193-205, add aria-labelledby to each dialog and assign the referenced ID
to its title.
In `@portals/developer-portal/src/services/keyManagerService.js`:
- Around line 142-152: Update the explicit-handle validation in the key creation
flow around hadExplicitHandle so non-string payload.handle values are rejected
with the same 400 validation response before calling trim or
HANDLE_PATTERN.test. Preserve the existing whitespace and pattern validation for
string handles, and continue deriving the handle from displayName when no valid
explicit handle is provided.
🪄 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 Plus
Run ID: eb6706fd-05f4-4d8a-883e-f3105dbfde8f
📒 Files selected for processing (24)
portals/developer-portal/it/ui/cypress/e2e/settings/001-views-labels.cy.jsportals/developer-portal/it/ui/cypress/e2e/settings/002-key-managers.cy.jsportals/developer-portal/src/controllers/viewConfigureController.jsportals/developer-portal/src/defaultContent/pages/api-landing/partials/api-subscription-plans.hbsportals/developer-portal/src/defaultContent/pages/mcp-landing/partials/mcp-subscription-plans.hbsportals/developer-portal/src/pages/partials/api-specification.hbsportals/developer-portal/src/pages/settings/partials/cfg-apis-panel.hbsportals/developer-portal/src/pages/settings/partials/cfg-keymanagers-panel.hbsportals/developer-portal/src/pages/settings/partials/cfg-modals.hbsportals/developer-portal/src/pages/settings/partials/cfg-plans-panel.hbsportals/developer-portal/src/pages/subscriptions/partials/subscription-list.hbsportals/developer-portal/src/scripts/api-subscription-plans.jsportals/developer-portal/src/scripts/mcp-subscription-plans.jsportals/developer-portal/src/scripts/settings-apis.jsportals/developer-portal/src/scripts/settings-keymanagers.jsportals/developer-portal/src/scripts/settings-labels.jsportals/developer-portal/src/scripts/settings-plans.jsportals/developer-portal/src/scripts/settings-views.jsportals/developer-portal/src/scripts/subscription.jsportals/developer-portal/src/services/keyManagerService.jsportals/developer-portal/src/services/webhookSubscriberService.jsportals/developer-portal/src/styles/settings-layout.cssportals/developer-portal/src/utils/handleSlug.jsportals/developer-portal/src/utils/handleSlug.test.js
💤 Files with no reviewable changes (1)
- portals/developer-portal/src/pages/subscriptions/partials/subscription-list.hbs
There was a problem hiding this comment.
Actionable comments posted: 8
🧹 Nitpick comments (1)
portals/developer-portal/src/dao/applicationDao.js (1)
28-36: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winDuplicate
slugifyimplementation.This is byte-for-byte identical to the
slugifyfunction already inmanage-api-workflows.js. Consider extracting a shared utility to avoid future divergence.🤖 Prompt for 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. In `@portals/developer-portal/src/dao/applicationDao.js` around lines 28 - 36, Extract the duplicated slugify implementation from applicationDao.js and manage-api-workflows.js into a shared utility, then update both callers to import and reuse that utility while preserving the existing slug generation behavior.
🤖 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 `@portals/developer-portal/src/dao/applicationDao.js`:
- Around line 38-44: The create function must safely normalize appData.handle
before trimming, accepting non-string YAML metadata.name or JSON id values
without throwing. Use the caller-supplied handle only when its coerced value is
non-empty; otherwise fall back to slugify(appData.displayName), and ensure an
empty generated slug is replaced with the established valid fallback rather than
storing an empty handle.
In `@portals/developer-portal/src/pages/application/partials/keys-token.hbs`:
- Line 47: Remove the inline onclick handler from the token-generation element
and expose applicationMetadata.displayName and serialized subscriptionScopes
through appropriately escaped data-* attributes, alongside the other required
arguments. Update the JavaScript binding for the relevant token form/modal flow
to read these dataset values and invoke openGenerateTokenModal without embedding
user-controlled values in JavaScript source.
In `@portals/developer-portal/src/scripts/oauth2-key-generation.js`:
- Around line 564-567: Replace the innerHTML interpolation in the scope-chip
creation flow with a textContent or createTextNode node for the untrusted scope
value, then append the static remove control separately and retain the existing
click behavior. Audit and update all other scope-chip rendering sinks reachable
from this input to use contextual-safe DOM APIs rather than HTML interpolation.
- Around line 271-275: Update the scope-selection logic around uiScopeChips so
it uses the modal’s presence as the condition, not uiScopeChips.length. When the
modal exists, always assign subscribedScopes from uiScopeChips, including an
empty array, while preserving the existing fallback when no modal is available.
In `@portals/developer-portal/src/services/apiKeyService.js`:
- Around line 158-164: Enforce explicit API-key handle uniqueness atomically in
the persistence layer used by the create flow around apiKeyDao.getIdByHandle,
rather than relying only on its pre-check. Add or use a database unique
constraint/index for the per-API handle, then catch the resulting duplicate-key
error and return the existing 409 conflict behavior; preserve the current
validation message and normal creation path for non-duplicates.
In `@portals/developer-portal/src/services/apiMetadataService.js`:
- Around line 1268-1277: Update docs/devportal-openapi-spec-v0.9.yaml to reflect
UUID fallback identifiers across all affected resources: at
portals/developer-portal/src/services/apiMetadataService.js lines 1268-1277,
remove id from SubscriptionPlanRequest.required; at
portals/developer-portal/src/services/keyManagerService.js lines 132-146, revise
KeyManagerRequest.id and the POST /key-managers summary to describe UUID
generation rather than displayName-derived handles; at
portals/developer-portal/src/services/webhookSubscriberService.js lines 57-61,
revise WebhookSubscriberRequest.id to document UUID-on-omission and 409
responses for duplicates.
- Around line 1268-1277: Update the SubscriptionPlanRequest schema in
devportal-openapi-spec-v0.9.yaml so id is optional rather than required, while
preserving id’s existing property definition and validation. Keep
normalizePlanHandle and the settings-plans.js create/update behavior unchanged.
In `@portals/developer-portal/src/services/webhookSubscriberService.js`:
- Around line 48-50: Update the duplicate-key error handling in
updateWebhookSubscriber to pass the webhook subscriber handle string to
_uniqueConstraintMessage instead of the entire req.body object, preserving the
actual conflicting id in the generated message.
---
Nitpick comments:
In `@portals/developer-portal/src/dao/applicationDao.js`:
- Around line 28-36: Extract the duplicated slugify implementation from
applicationDao.js and manage-api-workflows.js into a shared utility, then update
both callers to import and reuse that utility while preserving the existing slug
generation behavior.
🪄 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 Plus
Run ID: 98296bea-e531-4181-b98a-a800568094cf
📒 Files selected for processing (22)
portals/developer-portal/docs/devportal-openapi-spec-v0.9.yamlportals/developer-portal/it/ui/cypress/e2e/settings/001-views-labels.cy.jsportals/developer-portal/it/ui/cypress/e2e/settings/002-key-managers.cy.jsportals/developer-portal/src/dao/applicationDao.jsportals/developer-portal/src/defaultContent/pages/api-landing/partials/api-subscription-plans.hbsportals/developer-portal/src/defaultContent/pages/mcp-landing/partials/mcp-subscription-plans.hbsportals/developer-portal/src/pages/application/partials/keys-token.hbsportals/developer-portal/src/pages/application/partials/manage-keys-km-card.hbsportals/developer-portal/src/pages/settings/partials/cfg-modals.hbsportals/developer-portal/src/pages/settings/partials/cfg-plans-panel.hbsportals/developer-portal/src/pages/settings/partials/create-api-workflow.hbsportals/developer-portal/src/scripts/api-subscription-plans.jsportals/developer-portal/src/scripts/manage-api-workflows.jsportals/developer-portal/src/scripts/mcp-subscription-plans.jsportals/developer-portal/src/scripts/oauth2-key-generation.jsportals/developer-portal/src/scripts/settings-plans.jsportals/developer-portal/src/services/apiKeyService.jsportals/developer-portal/src/services/apiMetadataService.jsportals/developer-portal/src/services/keyManagerService.jsportals/developer-portal/src/services/webhookSubscriberService.jsportals/developer-portal/src/utils/handleSlug.jsportals/developer-portal/src/utils/handleSlug.test.js
💤 Files with no reviewable changes (2)
- portals/developer-portal/src/utils/handleSlug.js
- portals/developer-portal/src/utils/handleSlug.test.js
🚧 Files skipped from review as they are similar to previous changes (2)
- portals/developer-portal/src/defaultContent/pages/mcp-landing/partials/mcp-subscription-plans.hbs
- portals/developer-portal/src/scripts/api-subscription-plans.js
There was a problem hiding this comment.
Actionable comments posted: 4
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
portals/developer-portal/src/services/webhookSubscriberService.js (1)
52-61: 🩺 Stability & Availability | 🟠 Major | ⚡ Quick winValidate
req.bodybefore assigningpayload.handle.For requests without a required body,
req.bodycan beundefined;payload.handle = ...then throws before_validateRequiredFieldsreturns the 400. Normalize/reject non-object bodies before handle generation.🤖 Prompt for 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. In `@portals/developer-portal/src/services/webhookSubscriberService.js` around lines 52 - 61, Update createWebhookSubscriber to validate or normalize req.body before assigning payload.handle, ensuring undefined or non-object bodies reach _validateRequiredFields and produce the expected 400 response instead of throwing. Preserve the existing caller-supplied id behavior and UUID generation for valid object payloads.
🤖 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 `@docs/rest-apis/devportal/api-keys.md`:
- Line 152: The generated Markdown files must not be edited directly; update the
API-key, key-manager, subscription-plan, and webhook-subscriber identifier
wording in their generator/template, then regenerate the outputs. Apply the
generator changes for docs/rest-apis/devportal/api-keys.md:152-152,
key-managers.md:22-22, schemas.md:918-918, schemas.md:1160-1160,
schemas.md:1307-1307, schemas.md:1430-1431, and webhook-subscribers.md:22-22,
preserving the generated content consistently across all affected sites.
In
`@portals/developer-portal/src/pages/application/partials/manage-keys-km-card.hbs`:
- Around line 100-106: Update the data-key-manager value in the token modal
trigger to pass the stable key-manager ID from kmId instead of the display name
kmName, matching the identifier used by keys-token.hbs and generateOauthKey to
locate token and regeneration elements.
In `@portals/developer-portal/src/scripts/oauth2-key-generation.js`:
- Around line 213-222: Update both scope-chip implementations in
portals/developer-portal/src/scripts/oauth2-key-generation.js at lines 213-222
and 581-586 to create the remove control as a labeled button with type="button"
instead of a non-focusable span; preserve the existing delegated and direct
removal behavior while making both controls keyboard accessible.
In `@portals/developer-portal/src/services/apiKeyService.js`:
- Around line 204-208: In the transaction catch around the API-key creation
flow, update the duplicate-key handling near db.isDuplicateKeyError(err) so it
maps to the 409 response only when the violated constraint is
uq_api_key_org_api_handle. Preserve unrelated duplicate-key errors from
webhook/application publishing or other transaction steps so their original
conflict and handling remain intact.
---
Outside diff comments:
In `@portals/developer-portal/src/services/webhookSubscriberService.js`:
- Around line 52-61: Update createWebhookSubscriber to validate or normalize
req.body before assigning payload.handle, ensuring undefined or non-object
bodies reach _validateRequiredFields and produce the expected 400 response
instead of throwing. Preserve the existing caller-supplied id behavior and UUID
generation for valid object payloads.
🪄 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 Plus
Run ID: 6c3a87ec-ad7f-4ef7-a586-c7d1515b6bd4
📒 Files selected for processing (18)
docs/rest-apis/devportal/api-keys.mddocs/rest-apis/devportal/key-managers.mddocs/rest-apis/devportal/schemas.mddocs/rest-apis/devportal/webhook-subscribers.mdportals/developer-portal/database/schema.postgres.sqlportals/developer-portal/database/schema.sqlite.sqlportals/developer-portal/database/schema.sqlserver.sqlportals/developer-portal/docs/devportal-openapi-spec-v0.9.yamlportals/developer-portal/it/rest-api/webhook-subscribers/webhook-subscribers.spec.jsportals/developer-portal/it/ui/cypress/e2e/002-apis/002-rest-api-details.cy.jsportals/developer-portal/it/ui/cypress/e2e/settings/001-views-labels.cy.jsportals/developer-portal/it/ui/cypress/e2e/settings/002-key-managers.cy.jsportals/developer-portal/src/dao/applicationDao.jsportals/developer-portal/src/pages/application/partials/keys-token.hbsportals/developer-portal/src/pages/application/partials/manage-keys-km-card.hbsportals/developer-portal/src/scripts/oauth2-key-generation.jsportals/developer-portal/src/services/apiKeyService.jsportals/developer-portal/src/services/webhookSubscriberService.js
🚧 Files skipped from review as they are similar to previous changes (1)
- portals/developer-portal/docs/devportal-openapi-spec-v0.9.yaml
Purpose
Fixing multiple UI/UX issues
Fix #2939
Fix #2943
Fix #2944
Fix #2959
Fix #2963
Fix #2966
Summary
Settings — forms & fields
handleTouchedguard); same fix applied to the Labels modal.margin-bottomon.cfg-field-hint.API create/edit bugs
Handle-generation standardization (id-or-UUID/slug, 409 on conflict)
idoptional (UUID fallback) + spec update; rejects malformed ids.Subscriptions
Application key / token flow
new FormData(null)crash on a non-existent form).MCP Playground
Authorization: Bearer).API "Try Out"
tryItCorsProxyfrom the Elements UI so the sample curl no longer leaks the internal proxy URL.