Add overview tab to Applications - #4490
Merged
Merged
Conversation
Contributor
|
Important Review skippedToo many files! This PR contains 135 files, which is 35 over the limit of 100. To get a review, reduce the PR to 100 files or fewer by splitting it into smaller PRs or changing its base branch. Upgrade to a paid plan to raise the limit. This review couldn't start because sufficient usage credits or metered capacity aren't available. Add credits or update usage-based reviews in the billing tab, then retry. ⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (135)
You can disable this status message by setting the 📝 WalkthroughWalkthroughThe PR replaces application integration guides with an Overview experience, adds quickstart metadata and reusable UI components, introduces mobile templates, and updates mobile and Node.js authentication documentation. ChangesApplication overview and quickstarts
Estimated code review effort: 4 (Complex) | ~60 minutes Sequence Diagram(s)sequenceDiagram
participant ApplicationEditPage
participant IntegrationGuides
participant QuickstartMetadata
participant Clipboard
participant ExternalLinkConfirmDialog
ApplicationEditPage->>IntegrationGuides: render Overview
IntegrationGuides->>QuickstartMetadata: resolve application quickstarts and endpoints
IntegrationGuides->>Clipboard: copy coding-agent prompt
IntegrationGuides->>ExternalLinkConfirmDialog: confirm documentation navigation
ExternalLinkConfirmDialog-->>IntegrationGuides: confirm or cancel
IntegrationGuides-->>ApplicationEditPage: render overview content and navigation
Possibly related PRs
Suggested reviewers: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches 💡 1⚔️ Resolve merge conflicts 💡
🧪 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
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)
docs/content/getting-started/connect-your-application/node.mdx (1)
209-223: 🗄️ Data Integrity & Integration | 🟡 Minor | ⚡ Quick winFix the “What’s Next” relative link depths.
These links are one
../../level too deep for their targets:
../../../guides/agents/agent-authenticationshould be../../guides/agents/agent-authentication.../../../../sdks/node/overviewshould be../../sdoks/node/overview.Use the corrected paths so the cards point to the intended pages.
🤖 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 `@docs/content/getting-started/connect-your-application/node.mdx` around lines 209 - 223, The “What’s Next” card links use incorrect relative paths. Update the Agent Authentication href to use two parent levels, and update the Node.js SDK Reference href to the specified corrected path, preserving the existing card content and structure.
🧹 Nitpick comments (8)
frontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuides.test.tsx (1)
292-295: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low valueAssert the phone frame in this test.
The test name states that the preview renders in a phone-style frame, but the assertion only checks that
base-sign-inis present. The same assertion passes for a browser application. Assert a frame-specific property, or rename the test to match what it verifies.🤖 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 `@frontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuides.test.tsx` around lines 292 - 295, Update the test case “renders the sign-in preview in a phone-style frame” to assert a phone-frame-specific property or element in addition to base-sign-in. Use the rendered mobile preview’s identifying symbol rather than an assertion that also passes for browser applications.frontend/packages/components/src/ExternalLinkConfirm/useExternalLinkConfirmation.ts (1)
51-64: 🔒 Security & Privacy | 🔵 Trivial | ⚡ Quick winRestrict the opened URL to
httpandhttps.The hook opens any string that a caller passes. Current call sites use static template metadata, so this is not exploitable now. The hook is a shared public export, so a future caller could pass a server-provided value. A
javascript:value passed towindow.openruns in the opener context.🛡️ Proposed hardening
+const isSafeExternalUrl = (value: string): boolean => { + try { + const {protocol} = new URL(value, window.location.href); + return protocol === 'http:' || protocol === 'https:'; + } catch { + return false; + } +}; + const request = useCallback((url: string) => { + if (!isSafeExternalUrl(url)) { + return; + } setPendingUrl(url); }, []);🤖 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 `@frontend/packages/components/src/ExternalLinkConfirm/useExternalLinkConfirmation.ts` around lines 51 - 64, Restrict URL handling in the request/confirm flow of useExternalLinkConfirmation so window.open is only called for valid http or https URLs. Validate pendingUrl with the URL API immediately before opening, reject all other schemes including javascript:, and preserve the existing cleanup that clears pendingUrl.frontend/packages/components/src/CopyableField/__tests__/CopyableField.test.tsx (1)
29-36: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winAssert the logger call in the failure test.
The test name states that the component logs an error, but the test only asserts that
writeTextwas called. TheuseLoggermock returns a new object on every call, so theerrorspy is unreachable. Hoist a single spy and assert it.♻️ Proposed fix
+const mockLoggerError = vi.fn(); + vi.mock('`@thunderid/logger/react`', () => ({ useLogger: () => ({ - error: vi.fn(), + error: mockLoggerError, warn: vi.fn(), info: vi.fn(), debug: vi.fn(), }), }));await waitFor(() => { - expect(mockClipboard.writeText).toHaveBeenCalled(); + expect(mockLoggerError).toHaveBeenCalled(); });Also applies to: 62-72
🤖 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 `@frontend/packages/components/src/CopyableField/__tests__/CopyableField.test.tsx` around lines 29 - 36, Update the CopyableField failure test and its logger mock to hoist a shared error spy, ensuring the mocked useLogger returns that same spy instead of creating a new one per call. In the failure test, assert that the logger error method is called when writeText fails, while preserving the existing writeText assertion.frontend/packages/components/src/StackblitzQuickstartCard/webContainerSprite.ts (1)
19-22: 🚀 Performance & Scalability | 🔵 Trivial | ⚖️ Poor tradeoffConsider shipping this sprite as an asset file instead of an inline data URI.
The base64 string adds roughly 14 KB to the JavaScript bundle of
@thunderid/components. Every consumer of the package pays that cost, even when the card never renders. An asset file imported by URL is cached separately by the browser and can be fetched only when the card mounts. Keep the inline form only if the package build cannot emit assets.🤖 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 `@frontend/packages/components/src/StackblitzQuickstartCard/webContainerSprite.ts` around lines 19 - 22, The WEB_CONTAINER_SPRITE_DATA_URI constant unnecessarily embeds roughly 14 KB in every JavaScript bundle. Replace the inline base64 value with a separately emitted sprite asset and reference its generated URL where the quickstart card consumes WEB_CONTAINER_SPRITE_DATA_URI, preserving the existing rendering behavior and lazy loading; retain the inline form only if the package build cannot emit asset files.frontend/apps/console/src/features/applications/pages/ApplicationEditPage.tsx (1)
568-614: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winReplace the literal tab indices with named constants.
The tab order now lives in three places: the
Tablist at Lines 568-603, theTabPanelindexprops at Lines 609-672, and the navigation callbacks at Lines 613-614. Inserting or reordering a tab requires an edit in all three, and a miss produces a blank panel with no compile error. A single index map removes that risk.♻️ Proposed refactor
+const TAB_INDEX = { + overview: 0, + general: 1, + flows: 2, + customization: 3, + token: 4, + advanced: 5, +} as const;Then use
TAB_INDEX.flowsandTAB_INDEX.customizationin the callbacks andindex={TAB_INDEX.<name>}on eachTabPanel.🤖 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 `@frontend/apps/console/src/features/applications/pages/ApplicationEditPage.tsx` around lines 568 - 614, Define a single named tab-index map near the tab configuration, with entries for each tab in the existing order. Replace the numeric ids, aria-controls suffixes, TabPanel index props, and the setActiveTab values in callbacks such as onGoToFlows and onGoToCustomization with the corresponding TAB_INDEX entries, keeping tab ordering centralized and consistent.frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsx (1)
195-283: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚖️ Poor tradeoffConsider splitting this component.
IntegrationGuidesnow resolves theme and four flow queries, classifies the application, builds endpoint lists, renders quickstart cards, a full sign-in preview, and the identifier panels in a single 700-line file. The sign-in preview block at Lines 490-658 and the endpoint panel at Lines 684-707 are self-contained and read only from derived values. Extracting them into sibling components would keep each unit testable on its own.Also consider renaming the component. It no longer renders integration guides only; it renders the application overview.
🤖 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 `@frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsx` around lines 195 - 283, The IntegrationGuides component has grown beyond its name and responsibility by combining overview data, endpoint rendering, and sign-in preview rendering. Rename it to reflect the application overview and extract the self-contained sign-in preview block and endpoint panel into sibling components, passing only their derived values as props while preserving existing behavior.frontend/packages/components/src/icons/logos/vendor/NodeIcon.tsx (1)
19-64: 🎯 Functional Correctness | 🔵 Trivial | 💤 Low valueMake SVG definition IDs unique per icon instance.
The static IDs are document-global. A second
NodeIcon, or another SVG using these IDs, can resolveurl(#...)references to definitions outside this icon. UseuseId()to create an instance-specific prefix.Proposed fix
-import type {JSX} from 'react'; +import {useId, type JSX} from 'react'; export default function NodeIcon({size = 20}: NodeIconProps): JSX.Element { + const iconId = useId(); + return ( <svg width={size} height={(size * 50) / 44} viewBox="0 0 44 50"> <defs> - <clipPath id="node-hex-clip"> + <clipPath id={`${iconId}-hex-clip`}> <path ... /> </clipPath> - <linearGradient id="node-main" ...> + <linearGradient id={`${iconId}-main`} ...> ... </linearGradient> - <linearGradient id="node-r1" ...> + <linearGradient id={`${iconId}-r1`} ...> ... </linearGradient> - <linearGradient id="node-r2" ...> + <linearGradient id={`${iconId}-r2`} ...> ... </linearGradient> </defs> <path - fill="url(`#node-main`)" + fill={`url(#${iconId}-main)`} ... /> <polygon - fill="url(`#node-r1`)" - clipPath="url(`#node-hex-clip`)" + fill={`url(#${iconId}-r1)`} + clipPath={`url(#${iconId}-hex-clip)`} ... /> <polygon - fill="url(`#node-r2`)" - clipPath="url(`#node-hex-clip`)" + fill={`url(#${iconId}-r2)`} + clipPath={`url(#${iconId}-hex-clip)`} ... />🤖 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 `@frontend/packages/components/src/icons/logos/vendor/NodeIcon.tsx` around lines 19 - 64, Update the NodeIcon component to call React’s useId() and derive an instance-specific prefix for the clipPath and linearGradient IDs. Apply the prefixed IDs consistently to the definitions and matching url(...) and clipPath references in the SVG, preserving the existing rendering and size behavior.docs/content/getting-started/connect-your-application/node.mdx (1)
70-70: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winSplit the multi-action setup step.
Step 5 combines three actions: open the Advanced Settings tab, enable the
client_credentialsgrant type, and set the Client authentication method. Split this into separate steps so each action is a discrete step.As per path instructions, "Steps that chain two actions with 'and': 'Click X and fill in Y' → should be two steps."
✏️ Proposed step split
-5. Open the agent's **Advanced Settings** tab, enable the `client_credentials` grant type, and set the **Client authentication method** to `client_secret_basic`. -6. Copy the **Client ID** from the **General** tab. +5. Open the agent's **Advanced Settings** tab. +6. Enable the `client_credentials` grant type and set the **Client authentication method** to `client_secret_basic`. +7. Copy the **Client ID** from the **General** tab.🤖 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 `@docs/content/getting-started/connect-your-application/node.mdx` at line 70, Split step 5 in the getting-started setup instructions into separate numbered steps: one to open the agent’s Advanced Settings tab, one to enable the client_credentials grant type, and one to set the Client authentication method to client_secret_basic. Preserve the existing action order and wording where possible, updating subsequent step numbers as needed.Source: Path instructions
🤖 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
`@frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsx`:
- Line 482: Add fallback default strings to every identified translation call:
IntegrationGuides.tsx lines 482, 543, 547, 554, 559, 567, 571, 677, and 679;
CopyableField.tsx lines 108-109; and ExternalLinkConfirmDialog.tsx lines 77-80.
Use the existing surrounding wording and translation patterns, ensuring each t()
call has either a positional fallback or defaultValue.
- Around line 290-303: Update handleCopyPrompt to guard navigator.clipboard
before calling writeText and log failures through the existing logger, including
synchronous access/call failures. Track the copied-state reset timer with a ref
and clear it on unmount via useEffect, then reuse that timer when setting the
1.5-second reset so IntegrationGuides does not update after unmount.
In
`@frontend/apps/console/src/features/applications/data/application-templates/platform-based/browser.json`:
- Line 10: Replace the unsupported terminal=devnel StackBlitz parameter with
startScript=dev in every affected URL: browser.json#L10; full-stack.json#L10,
`#L15`, `#L20`, and `#L25`; other.json#L10; vue.json#L10; and
getQuickstartsForTemplate.test.ts#L32, `#L82`, and `#L93`.
In
`@frontend/apps/console/src/features/applications/data/application-templates/technology-based/express.json`:
- Line 10: Update the stackblitzUrl entries at
frontend/apps/console/src/features/applications/data/application-templates/technology-based/express.json:10-10,
nextjs.json:10-10, node.json:10-10, nuxt.json:10-10, react.json:10-10, and
vanilla-js.json:10-10 by replacing the unsupported terminal=devnel parameter
with startScript=<script name> from each sample’s package.json, or remove the
launch parameter where no automated command is required.
---
Outside diff comments:
In `@docs/content/getting-started/connect-your-application/node.mdx`:
- Around line 209-223: The “What’s Next” card links use incorrect relative
paths. Update the Agent Authentication href to use two parent levels, and update
the Node.js SDK Reference href to the specified corrected path, preserving the
existing card content and structure.
---
Nitpick comments:
In `@docs/content/getting-started/connect-your-application/node.mdx`:
- Line 70: Split step 5 in the getting-started setup instructions into separate
numbered steps: one to open the agent’s Advanced Settings tab, one to enable the
client_credentials grant type, and one to set the Client authentication method
to client_secret_basic. Preserve the existing action order and wording where
possible, updating subsequent step numbers as needed.
In
`@frontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuides.test.tsx`:
- Around line 292-295: Update the test case “renders the sign-in preview in a
phone-style frame” to assert a phone-frame-specific property or element in
addition to base-sign-in. Use the rendered mobile preview’s identifying symbol
rather than an assertion that also passes for browser applications.
In
`@frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsx`:
- Around line 195-283: The IntegrationGuides component has grown beyond its name
and responsibility by combining overview data, endpoint rendering, and sign-in
preview rendering. Rename it to reflect the application overview and extract the
self-contained sign-in preview block and endpoint panel into sibling components,
passing only their derived values as props while preserving existing behavior.
In
`@frontend/apps/console/src/features/applications/pages/ApplicationEditPage.tsx`:
- Around line 568-614: Define a single named tab-index map near the tab
configuration, with entries for each tab in the existing order. Replace the
numeric ids, aria-controls suffixes, TabPanel index props, and the setActiveTab
values in callbacks such as onGoToFlows and onGoToCustomization with the
corresponding TAB_INDEX entries, keeping tab ordering centralized and
consistent.
In
`@frontend/packages/components/src/CopyableField/__tests__/CopyableField.test.tsx`:
- Around line 29-36: Update the CopyableField failure test and its logger mock
to hoist a shared error spy, ensuring the mocked useLogger returns that same spy
instead of creating a new one per call. In the failure test, assert that the
logger error method is called when writeText fails, while preserving the
existing writeText assertion.
In
`@frontend/packages/components/src/ExternalLinkConfirm/useExternalLinkConfirmation.ts`:
- Around line 51-64: Restrict URL handling in the request/confirm flow of
useExternalLinkConfirmation so window.open is only called for valid http or
https URLs. Validate pendingUrl with the URL API immediately before opening,
reject all other schemes including javascript:, and preserve the existing
cleanup that clears pendingUrl.
In `@frontend/packages/components/src/icons/logos/vendor/NodeIcon.tsx`:
- Around line 19-64: Update the NodeIcon component to call React’s useId() and
derive an instance-specific prefix for the clipPath and linearGradient IDs.
Apply the prefixed IDs consistently to the definitions and matching url(...) and
clipPath references in the SVG, preserving the existing rendering and size
behavior.
In
`@frontend/packages/components/src/StackblitzQuickstartCard/webContainerSprite.ts`:
- Around line 19-22: The WEB_CONTAINER_SPRITE_DATA_URI constant unnecessarily
embeds roughly 14 KB in every JavaScript bundle. Replace the inline base64 value
with a separately emitted sprite asset and reference its generated URL where the
quickstart card consumes WEB_CONTAINER_SPRITE_DATA_URI, preserving the existing
rendering behavior and lazy loading; retain the inline form only if the package
build cannot emit asset files.
🪄 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: 160c6302-b4e5-4153-80a6-5797406a5746
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (62)
docs/content/getting-started/connect-your-application/android.mdxdocs/content/getting-started/connect-your-application/flutter.mdxdocs/content/getting-started/connect-your-application/ios.mdxdocs/content/getting-started/connect-your-application/node.mdxdocs/package.jsondocs/src/components/DeveloperShortcut.tsxdocs/src/components/Ecosystem/data.tsdocs/src/components/FloatingLogosBackground.tsxdocs/src/components/HomePage/SDKShowcaseSection.tsxdocs/src/theme/DocSidebarItem/Link/index.tsxdocs/src/theme/MDXComponents.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuide.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuide.test.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuides.test.tsxfrontend/apps/console/src/features/applications/config/TechnologyBasedApplicationTemplateMetadata.tsxfrontend/apps/console/src/features/applications/data/application-templates/platform-based/browser.jsonfrontend/apps/console/src/features/applications/data/application-templates/platform-based/full-stack.jsonfrontend/apps/console/src/features/applications/data/application-templates/platform-based/mobile.jsonfrontend/apps/console/src/features/applications/data/application-templates/platform-based/wallet.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/android.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/express.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/flutter.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/ios.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/mcp-client.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/nextjs.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/node.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/nuxt.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/other.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/react.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/vanilla-js.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/vue.jsonfrontend/apps/console/src/features/applications/models/__tests__/application-templates.test.tsfrontend/apps/console/src/features/applications/models/application-templates.tsfrontend/apps/console/src/features/applications/pages/ApplicationEditPage.tsxfrontend/apps/console/src/features/applications/pages/__tests__/ApplicationEditPage.test.tsxfrontend/apps/console/src/features/applications/utils/__tests__/getIntegrationGuidesForTemplate.test.tsfrontend/apps/console/src/features/applications/utils/__tests__/getQuickstartsForTemplate.test.tsfrontend/apps/console/src/features/applications/utils/getIntegrationGuidesForTemplate.tsfrontend/apps/console/src/features/applications/utils/getQuickstartsForTemplate.tsfrontend/packages/components/src/CopyableField/CopyableField.tsxfrontend/packages/components/src/CopyableField/__tests__/CopyableField.test.tsxfrontend/packages/components/src/ExternalLinkConfirm/ExternalLinkConfirmDialog.tsxfrontend/packages/components/src/ExternalLinkConfirm/__tests__/ExternalLinkConfirmDialog.test.tsxfrontend/packages/components/src/ExternalLinkConfirm/__tests__/useExternalLinkConfirmation.test.tsfrontend/packages/components/src/ExternalLinkConfirm/useExternalLinkConfirmation.tsfrontend/packages/components/src/StackblitzQuickstartCard/StackblitzQuickstartCard.tsxfrontend/packages/components/src/StackblitzQuickstartCard/__tests__/StackblitzQuickstartCard.test.tsxfrontend/packages/components/src/StackblitzQuickstartCard/webContainerSprite.tsfrontend/packages/components/src/icons/logos/vendor/AndroidLogo.tsxfrontend/packages/components/src/icons/logos/vendor/AppleIcon.tsxfrontend/packages/components/src/icons/logos/vendor/ExpressIcon.tsxfrontend/packages/components/src/icons/logos/vendor/FlutterLogo.tsxfrontend/packages/components/src/icons/logos/vendor/JavaScriptIcon.tsxfrontend/packages/components/src/icons/logos/vendor/NextjsIcon.tsxfrontend/packages/components/src/icons/logos/vendor/NodeIcon.tsxfrontend/packages/components/src/icons/logos/vendor/NuxtIcon.tsxfrontend/packages/components/src/icons/logos/vendor/ReactIcon.tsxfrontend/packages/components/src/icons/logos/vendor/StackblitzIcon.tsxfrontend/packages/components/src/icons/logos/vendor/VueIcon.tsxfrontend/packages/components/src/index.tsfrontend/packages/i18n/src/locales/en-US.ts
💤 Files with no reviewable changes (2)
- frontend/apps/console/src/features/applications/components/edit-application/integration-guides/tests/IntegrationGuide.test.tsx
- frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuide.tsx
brionmario
force-pushed
the
overview-tab
branch
from
August 3, 2026 12:43
51bc61b to
7567820
Compare
Contributor
There was a problem hiding this comment.
🧹 Nitpick comments (1)
frontend/packages/components/src/StackblitzQuickstartCard/StackblitzQuickstartCard.tsx (1)
56-76: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winAdd a screen-reader warning for the new-tab link.
This card renders as an anchor with
target="_blank". Sighted users see the arrow icon and CTA label, but screen reader users get no indication that activating the link opens a new tab. WCAG technique H83 recommends indicating this in the link text or through visually-hidden text.Add hidden text announcing the new-tab behavior, for example:
♿ Proposed fix to announce new-tab behavior to assistive technology
<Stack direction="row" alignItems="center" spacing={0.75} sx={{color: 'primary.main'}}> <Typography sx={{fontSize: '1rem', fontWeight: 600, color: 'inherit'}}>{ctaLabel}</Typography> <ArrowRight size={18} /> </Stack> + <Box component="span" sx={{position: 'absolute', width: 1, height: 1, overflow: 'hidden', clip: 'rect(0 0 0 0)'}}> + (opens in a new tab) + </Box>🤖 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 `@frontend/packages/components/src/StackblitzQuickstartCard/StackblitzQuickstartCard.tsx` around lines 56 - 76, Update the anchor rendered by the StackblitzQuickstartCard component to include visually hidden text announcing that activation opens a new tab. Keep the existing visible CTA and arrow unchanged, and place the accessible announcement within the link so screen readers receive it.
🤖 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.
Nitpick comments:
In
`@frontend/packages/components/src/StackblitzQuickstartCard/StackblitzQuickstartCard.tsx`:
- Around line 56-76: Update the anchor rendered by the StackblitzQuickstartCard
component to include visually hidden text announcing that activation opens a new
tab. Keep the existing visible CTA and arrow unchanged, and place the accessible
announcement within the link so screen readers receive it.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro Plus
Run ID: 65d2ae27-d23d-47b9-943e-e5d9ee66b249
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (62)
docs/content/getting-started/connect-your-application/android.mdxdocs/content/getting-started/connect-your-application/flutter.mdxdocs/content/getting-started/connect-your-application/ios.mdxdocs/content/getting-started/connect-your-application/node.mdxdocs/package.jsondocs/src/components/DeveloperShortcut.tsxdocs/src/components/Ecosystem/data.tsdocs/src/components/FloatingLogosBackground.tsxdocs/src/components/HomePage/SDKShowcaseSection.tsxdocs/src/theme/DocSidebarItem/Link/index.tsxdocs/src/theme/MDXComponents.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuide.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuide.test.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuides.test.tsxfrontend/apps/console/src/features/applications/config/TechnologyBasedApplicationTemplateMetadata.tsxfrontend/apps/console/src/features/applications/data/application-templates/platform-based/browser.jsonfrontend/apps/console/src/features/applications/data/application-templates/platform-based/full-stack.jsonfrontend/apps/console/src/features/applications/data/application-templates/platform-based/mobile.jsonfrontend/apps/console/src/features/applications/data/application-templates/platform-based/wallet.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/android.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/express.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/flutter.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/ios.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/mcp-client.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/nextjs.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/node.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/nuxt.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/other.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/react.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/vanilla-js.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/vue.jsonfrontend/apps/console/src/features/applications/models/__tests__/application-templates.test.tsfrontend/apps/console/src/features/applications/models/application-templates.tsfrontend/apps/console/src/features/applications/pages/ApplicationEditPage.tsxfrontend/apps/console/src/features/applications/pages/__tests__/ApplicationEditPage.test.tsxfrontend/apps/console/src/features/applications/utils/__tests__/getIntegrationGuidesForTemplate.test.tsfrontend/apps/console/src/features/applications/utils/__tests__/getQuickstartsForTemplate.test.tsfrontend/apps/console/src/features/applications/utils/getIntegrationGuidesForTemplate.tsfrontend/apps/console/src/features/applications/utils/getQuickstartsForTemplate.tsfrontend/packages/components/src/CopyableField/CopyableField.tsxfrontend/packages/components/src/CopyableField/__tests__/CopyableField.test.tsxfrontend/packages/components/src/ExternalLinkConfirm/ExternalLinkConfirmDialog.tsxfrontend/packages/components/src/ExternalLinkConfirm/__tests__/ExternalLinkConfirmDialog.test.tsxfrontend/packages/components/src/ExternalLinkConfirm/__tests__/useExternalLinkConfirmation.test.tsfrontend/packages/components/src/ExternalLinkConfirm/useExternalLinkConfirmation.tsfrontend/packages/components/src/StackblitzQuickstartCard/StackblitzQuickstartCard.tsxfrontend/packages/components/src/StackblitzQuickstartCard/__tests__/StackblitzQuickstartCard.test.tsxfrontend/packages/components/src/StackblitzQuickstartCard/webContainerSprite.tsfrontend/packages/components/src/icons/logos/vendor/AndroidLogo.tsxfrontend/packages/components/src/icons/logos/vendor/AppleIcon.tsxfrontend/packages/components/src/icons/logos/vendor/ExpressIcon.tsxfrontend/packages/components/src/icons/logos/vendor/FlutterLogo.tsxfrontend/packages/components/src/icons/logos/vendor/JavaScriptIcon.tsxfrontend/packages/components/src/icons/logos/vendor/NextjsIcon.tsxfrontend/packages/components/src/icons/logos/vendor/NodeIcon.tsxfrontend/packages/components/src/icons/logos/vendor/NuxtIcon.tsxfrontend/packages/components/src/icons/logos/vendor/ReactIcon.tsxfrontend/packages/components/src/icons/logos/vendor/StackblitzIcon.tsxfrontend/packages/components/src/icons/logos/vendor/VueIcon.tsxfrontend/packages/components/src/index.tsfrontend/packages/i18n/src/locales/en-US.ts
💤 Files with no reviewable changes (2)
- frontend/apps/console/src/features/applications/components/edit-application/integration-guides/tests/IntegrationGuide.test.tsx
- frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuide.tsx
🚧 Files skipped from review as they are similar to previous changes (56)
- docs/src/components/Ecosystem/data.ts
- docs/package.json
- frontend/apps/console/src/features/applications/data/application-templates/platform-based/full-stack.json
- docs/src/theme/DocSidebarItem/Link/index.tsx
- frontend/packages/components/src/ExternalLinkConfirm/tests/ExternalLinkConfirmDialog.test.tsx
- docs/src/components/HomePage/SDKShowcaseSection.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/express.json
- frontend/packages/components/src/icons/logos/vendor/FlutterLogo.tsx
- frontend/packages/components/src/icons/logos/vendor/AppleIcon.tsx
- frontend/packages/components/src/StackblitzQuickstartCard/tests/StackblitzQuickstartCard.test.tsx
- docs/content/getting-started/connect-your-application/android.mdx
- frontend/packages/components/src/icons/logos/vendor/VueIcon.tsx
- frontend/packages/components/src/CopyableField/tests/CopyableField.test.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/vanilla-js.json
- docs/content/getting-started/connect-your-application/ios.mdx
- frontend/packages/components/src/StackblitzQuickstartCard/webContainerSprite.ts
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/nuxt.json
- docs/src/components/DeveloperShortcut.tsx
- frontend/apps/console/src/features/applications/config/TechnologyBasedApplicationTemplateMetadata.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/react.json
- frontend/apps/console/src/features/applications/utils/tests/getIntegrationGuidesForTemplate.test.ts
- docs/src/components/FloatingLogosBackground.tsx
- frontend/packages/components/src/icons/logos/vendor/JavaScriptIcon.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/vue.json
- frontend/apps/console/src/features/applications/data/application-templates/platform-based/mobile.json
- frontend/apps/console/src/features/applications/data/application-templates/platform-based/browser.json
- frontend/apps/console/src/features/applications/data/application-templates/platform-based/wallet.json
- frontend/apps/console/src/features/applications/utils/getQuickstartsForTemplate.ts
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/mcp-client.json
- frontend/packages/components/src/ExternalLinkConfirm/useExternalLinkConfirmation.ts
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/nextjs.json
- frontend/apps/console/src/features/applications/utils/getIntegrationGuidesForTemplate.ts
- docs/src/theme/MDXComponents.tsx
- frontend/packages/components/src/icons/logos/vendor/StackblitzIcon.tsx
- frontend/packages/components/src/icons/logos/vendor/ExpressIcon.tsx
- frontend/packages/components/src/icons/logos/vendor/NodeIcon.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/other.json
- frontend/packages/components/src/index.ts
- frontend/packages/components/src/ExternalLinkConfirm/tests/useExternalLinkConfirmation.test.ts
- frontend/packages/components/src/CopyableField/CopyableField.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/ios.json
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/node.json
- frontend/apps/console/src/features/applications/pages/tests/ApplicationEditPage.test.tsx
- frontend/packages/components/src/icons/logos/vendor/AndroidLogo.tsx
- frontend/apps/console/src/features/applications/models/tests/application-templates.test.ts
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/flutter.json
- frontend/packages/components/src/ExternalLinkConfirm/ExternalLinkConfirmDialog.tsx
- docs/content/getting-started/connect-your-application/flutter.mdx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/android.json
- frontend/apps/console/src/features/applications/utils/tests/getQuickstartsForTemplate.test.ts
- docs/content/getting-started/connect-your-application/node.mdx
- frontend/packages/components/src/icons/logos/vendor/NuxtIcon.tsx
- frontend/apps/console/src/features/applications/pages/ApplicationEditPage.tsx
- frontend/packages/i18n/src/locales/en-US.ts
- frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsx
- frontend/apps/console/src/features/applications/models/application-templates.ts
brionmario
force-pushed
the
overview-tab
branch
from
August 5, 2026 06:39
7567820 to
9ad3ba9
Compare
Contributor
|
Note GitHub couldn't provide a complete incremental comparison for this pull request, so CodeRabbit is performing a full review instead. This review may take a little longer. |
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (2)
docs/content/getting-started/connect-your-application/node.mdx (1)
68-70: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winSplit the multi-action instructions.
Line 68 combines entering a name, selecting an owner, and creating the agent. Line 70 combines enabling the grant and selecting the client authentication method. Use one action per numbered step.
As per coding guidelines, “Steps that chain two actions with ‘and’ ... should be two steps.”
🤖 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 `@docs/content/getting-started/connect-your-application/node.mdx` around lines 68 - 70, Split the combined numbered instructions into separate steps: make entering the Agent name, selecting an Owner, and clicking Create agent distinct actions, and make enabling the client_credentials grant type and setting the client_secret_basic authentication method separate actions. Preserve the existing order and wording otherwise.Source: Coding guidelines
frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsx (1)
594-596: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winAdd fallback default strings to the two
CopyableFieldlabel calls.Lines 594 and 596 call
t('applications:edit.general.labels.applicationId')andt('applications:edit.general.labels.clientId')with no fallback. Both keys are reused from the General tab, but the rule applies to every call. For a locale missing either key, the raw key renders as the field label.🌐 Proposed fix
- <CopyableField label={t('applications:edit.general.labels.applicationId')} value={application.id} /> + <CopyableField + label={t('applications:edit.general.labels.applicationId', 'Application ID')} + value={application.id} + /> {oauth2Config?.clientId && ( - <CopyableField label={t('applications:edit.general.labels.clientId')} value={oauth2Config.clientId} /> + <CopyableField + label={t('applications:edit.general.labels.clientId', 'Client ID')} + value={oauth2Config.clientId} + /> )}As per coding guidelines: "Every i18n
t('key')call must provide a fallback default string, either as the positional fallback argument or asdefaultValuein the options object."🤖 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 `@frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsx` around lines 594 - 596, Update both t calls in IntegrationGuides to provide fallback default strings for the applicationId and clientId labels, using the positional fallback or defaultValue option while preserving the existing translation keys and CopyableField behavior.Source: Coding guidelines
🤖 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/content/getting-started/connect-your-application/node.mdx`:
- Around line 199-200: Update the “Success” callout associated with the final
index.mjs example to accurately describe its actual output: authentication, the
stock request, and the returned item. Alternatively, modify the example to
decode and print scope so the existing description is true.
In `@frontend/packages/i18n/src/locales/en-US.ts`:
- Line 2619: Update the English translation value for
edit.overview.stackblitz.subheading to include the code markup around {{name}},
matching the defaults string used by IntegrationGuides.tsx so the existing Trans
components mapping applies.
---
Nitpick comments:
In `@docs/content/getting-started/connect-your-application/node.mdx`:
- Around line 68-70: Split the combined numbered instructions into separate
steps: make entering the Agent name, selecting an Owner, and clicking Create
agent distinct actions, and make enabling the client_credentials grant type and
setting the client_secret_basic authentication method separate actions. Preserve
the existing order and wording otherwise.
In
`@frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsx`:
- Around line 594-596: Update both t calls in IntegrationGuides to provide
fallback default strings for the applicationId and clientId labels, using the
positional fallback or defaultValue option while preserving the existing
translation keys and CopyableField behavior.
🪄 Autofix
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: a0a15757-42c6-488c-a2bb-415099816e2f
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (59)
docs/content/getting-started/connect-your-application/android.mdxdocs/content/getting-started/connect-your-application/flutter.mdxdocs/content/getting-started/connect-your-application/ios.mdxdocs/content/getting-started/connect-your-application/node.mdxdocs/package.jsondocs/src/components/DeveloperShortcut.tsxdocs/src/components/Ecosystem/data.tsdocs/src/components/FloatingLogosBackground.tsxdocs/src/components/HomePage/SDKShowcaseSection.tsxdocs/src/theme/DocSidebarItem/Link/index.tsxdocs/src/theme/MDXComponents.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuide.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuide.test.tsxfrontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuides.test.tsxfrontend/apps/console/src/features/applications/config/TechnologyBasedApplicationTemplateMetadata.tsxfrontend/apps/console/src/features/applications/data/application-templates/platform-based/browser.jsonfrontend/apps/console/src/features/applications/data/application-templates/platform-based/full-stack.jsonfrontend/apps/console/src/features/applications/data/application-templates/platform-based/mobile.jsonfrontend/apps/console/src/features/applications/data/application-templates/platform-based/wallet.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/android.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/express.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/flutter.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/ios.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/mcp-client.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/nextjs.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/node.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/nuxt.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/other.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/react.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/vanilla-js.jsonfrontend/apps/console/src/features/applications/data/application-templates/technology-based/vue.jsonfrontend/apps/console/src/features/applications/models/__tests__/application-templates.test.tsfrontend/apps/console/src/features/applications/models/application-templates.tsfrontend/apps/console/src/features/applications/pages/ApplicationEditPage.tsxfrontend/apps/console/src/features/applications/pages/__tests__/ApplicationEditPage.test.tsxfrontend/apps/console/src/features/applications/utils/__tests__/getIntegrationGuidesForTemplate.test.tsfrontend/apps/console/src/features/applications/utils/__tests__/getQuickstartsForTemplate.test.tsfrontend/apps/console/src/features/applications/utils/getIntegrationGuidesForTemplate.tsfrontend/apps/console/src/features/applications/utils/getQuickstartsForTemplate.tsfrontend/packages/components/src/CopyableField/CopyableField.tsxfrontend/packages/components/src/CopyableField/__tests__/CopyableField.test.tsxfrontend/packages/components/src/ExternalLinkConfirm/__tests__/ExternalLinkConfirmDialog.test.tsxfrontend/packages/components/src/StackblitzQuickstartCard/StackblitzQuickstartCard.tsxfrontend/packages/components/src/StackblitzQuickstartCard/__tests__/StackblitzQuickstartCard.test.tsxfrontend/packages/components/src/StackblitzQuickstartCard/webContainerSprite.tsfrontend/packages/components/src/icons/logos/vendor/AndroidLogo.tsxfrontend/packages/components/src/icons/logos/vendor/AppleIcon.tsxfrontend/packages/components/src/icons/logos/vendor/ExpressIcon.tsxfrontend/packages/components/src/icons/logos/vendor/FlutterLogo.tsxfrontend/packages/components/src/icons/logos/vendor/JavaScriptIcon.tsxfrontend/packages/components/src/icons/logos/vendor/NextjsIcon.tsxfrontend/packages/components/src/icons/logos/vendor/NodeIcon.tsxfrontend/packages/components/src/icons/logos/vendor/NuxtIcon.tsxfrontend/packages/components/src/icons/logos/vendor/ReactIcon.tsxfrontend/packages/components/src/icons/logos/vendor/StackblitzIcon.tsxfrontend/packages/components/src/icons/logos/vendor/VueIcon.tsxfrontend/packages/components/src/index.tsfrontend/packages/i18n/src/locales/en-US.ts
💤 Files with no reviewable changes (2)
- frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuide.tsx
- frontend/apps/console/src/features/applications/components/edit-application/integration-guides/tests/IntegrationGuide.test.tsx
🚧 Files skipped from review as they are similar to previous changes (52)
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/mcp-client.json
- docs/src/components/DeveloperShortcut.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/react.json
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/nuxt.json
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/vue.json
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/ios.json
- frontend/apps/console/src/features/applications/data/application-templates/platform-based/full-stack.json
- docs/package.json
- frontend/packages/components/src/icons/logos/vendor/JavaScriptIcon.tsx
- frontend/packages/components/src/icons/logos/vendor/ReactIcon.tsx
- frontend/packages/components/src/icons/logos/vendor/ExpressIcon.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/vanilla-js.json
- frontend/packages/components/src/icons/logos/vendor/NodeIcon.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/other.json
- docs/src/components/HomePage/SDKShowcaseSection.tsx
- frontend/apps/console/src/features/applications/models/tests/application-templates.test.ts
- frontend/packages/components/src/StackblitzQuickstartCard/tests/StackblitzQuickstartCard.test.tsx
- frontend/apps/console/src/features/applications/data/application-templates/platform-based/mobile.json
- frontend/apps/console/src/features/applications/data/application-templates/platform-based/browser.json
- docs/content/getting-started/connect-your-application/ios.mdx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/node.json
- frontend/packages/components/src/icons/logos/vendor/StackblitzIcon.tsx
- frontend/packages/components/src/StackblitzQuickstartCard/webContainerSprite.ts
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/android.json
- frontend/apps/console/src/features/applications/data/application-templates/platform-based/wallet.json
- frontend/packages/components/src/icons/logos/vendor/NextjsIcon.tsx
- frontend/packages/components/src/icons/logos/vendor/VueIcon.tsx
- frontend/packages/components/src/icons/logos/vendor/AppleIcon.tsx
- frontend/packages/components/src/ExternalLinkConfirm/tests/ExternalLinkConfirmDialog.test.tsx
- docs/src/theme/MDXComponents.tsx
- docs/src/theme/DocSidebarItem/Link/index.tsx
- frontend/packages/components/src/icons/logos/vendor/FlutterLogo.tsx
- frontend/packages/components/src/icons/logos/vendor/AndroidLogo.tsx
- frontend/apps/console/src/features/applications/utils/getQuickstartsForTemplate.ts
- frontend/apps/console/src/features/applications/utils/tests/getQuickstartsForTemplate.test.ts
- frontend/apps/console/src/features/applications/components/edit-application/integration-guides/tests/IntegrationGuides.test.tsx
- frontend/apps/console/src/features/applications/config/TechnologyBasedApplicationTemplateMetadata.tsx
- frontend/packages/components/src/icons/logos/vendor/NuxtIcon.tsx
- frontend/packages/components/src/CopyableField/tests/CopyableField.test.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/express.json
- frontend/apps/console/src/features/applications/utils/tests/getIntegrationGuidesForTemplate.test.ts
- frontend/apps/console/src/features/applications/models/application-templates.ts
- docs/src/components/FloatingLogosBackground.tsx
- frontend/apps/console/src/features/applications/pages/tests/ApplicationEditPage.test.tsx
- frontend/packages/components/src/StackblitzQuickstartCard/StackblitzQuickstartCard.tsx
- frontend/apps/console/src/features/applications/data/application-templates/technology-based/nextjs.json
- docs/src/components/Ecosystem/data.ts
- docs/content/getting-started/connect-your-application/android.mdx
- frontend/apps/console/src/features/applications/utils/getIntegrationGuidesForTemplate.ts
- frontend/apps/console/src/features/applications/pages/ApplicationEditPage.tsx
- frontend/packages/components/src/CopyableField/CopyableField.tsx
- docs/content/getting-started/connect-your-application/flutter.mdx
| // Overview section | ||
| 'edit.overview.noGuides': 'No integration guides available for this application type.', | ||
| 'edit.overview.stackblitz.heading': 'Try the live quickstart', | ||
| 'edit.overview.stackblitz.subheading': 'Run {{name}} in StackBlitz', |
Contributor
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
Restore the <code> tags in the StackBlitz subheading.
IntegrationGuides.tsx renders this key with Trans and declares defaults="Run <code>{{name}}</code> in StackBlitz", mapping code to a monospace Box at Lines 356-363. This resource value omits the tags. Trans prefers the resource value over defaults, so the shipped English string loses the monospace styling and the components mapping never applies.
🌐 Proposed fix
- 'edit.overview.stackblitz.subheading': 'Run {{name}} in StackBlitz',
+ 'edit.overview.stackblitz.subheading': 'Run <code>{{name}}</code> in StackBlitz',📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| 'edit.overview.stackblitz.subheading': 'Run {{name}} in StackBlitz', | |
| 'edit.overview.stackblitz.subheading': 'Run <code>{{name}}</code> in StackBlitz', |
🤖 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 `@frontend/packages/i18n/src/locales/en-US.ts` at line 2619, Update the English
translation value for edit.overview.stackblitz.subheading to include the code
markup around {{name}}, matching the defaults string used by
IntegrationGuides.tsx so the existing Trans components mapping applies.
brionmario
force-pushed
the
overview-tab
branch
2 times, most recently
from
August 5, 2026 08:39
68cb7a9 to
a1f5dd5
Compare
brionmario
added
Type/Improvement
trigger-pr-builder
brionmario
force-pushed
the
overview-tab
branch
3 times, most recently
from
August 5, 2026 09:43
422d3a9 to
7e20514
Compare
DonOmalVindula
previously approved these changes
Aug 5, 2026
brionmario
force-pushed
the
overview-tab
branch
from
August 5, 2026 09:56
7e20514 to
d7573f2
Compare
Codecov Report❌ Patch coverage is 📢 Thoughts on this report? Let us know! |
brionmario
force-pushed
the
overview-tab
branch
from
August 5, 2026 10:30
d7573f2 to
9e3f580
Compare
brionmario
enabled auto-merge
August 5, 2026 10:30
DonOmalVindula
previously approved these changes
Aug 5, 2026
brionmario
force-pushed
the
overview-tab
branch
2 times, most recently
from
August 5, 2026 12:37
4316eea to
1fe1051
Compare
brionmario
force-pushed
the
overview-tab
branch
from
August 5, 2026 12:40
1fe1051 to
6c7b3e4
Compare
DonOmalVindula
approved these changes
Aug 5, 2026
This was referenced Aug 6, 2026
12 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Purpose
Introduces an Overview tab for the Application detail view, giving developers a single, consolidated landing page for an application instead of having to navigate across multiple tabs to piece together its configuration.
The Overview tab surfaces:
This closes the gap identified in #4588, where users had no at-a-glance summary of an application and had to hunt through settings to find identifiers, endpoints, and integration guidance.
Approach
Added a new Overview section composed of reusable building blocks:
Mobile quickstarts (iOS/Android/Flutter) were updated for app-native authentication, and the Node.js guide was revised to cover service-to-service authentication. Integration-guide fallback behavior was also improved to handle cases where a specific quickstart isn't available for an app's configured tech stack.
Related Issues
Related PRs
Checklist
breaking changelabel added.Security checks