Show organization unit details in application overview

[Dilusha-Madushan]

Purpose

The Application details card on the application edit page's Overview tab showed only the Application ID and Client ID. The equivalent Agent details card on the agent edit page's Overview tab additionally shows the Organization Unit ID and Organization Unit Handle.

This left users with no way to see which OU an application belongs to. The OU is chosen during application creation and GET /applications/{id} already returns ouId, but no application edit tab surfaced it anywhere.

This PR adds Organization Unit ID and Organization Unit Handle rows to the Application details card, bringing it to parity with the Agent details card.

Approach

Frontend-only change, scoped to IntegrationGuides.tsx (the component rendering the Overview tab) and its tests.

Rendering. Two CopyableField rows were added to the details card, reusing the label wording and field treatment of AgentOverview.tsx so the two cards read identically.

Resolving the handle. The one place this could not mirror the agent implementation is where the handle comes from. The agent GET response carries ouHandle directly (the service populates it via populateOUHandleForGet when ?include=display is set), but ApplicationGetResponse has no ouHandle field. Rather than extend the application API, the handle is resolved client-side with the existing useGetOrganizationUnit(application.ouId) hook from @thunderid/configure-organization-units. This follows the pattern already used in AgentOverview, which resolves its owner label client-side from useGetUsers, and keeps the change to a single file.

Conditional rendering. Both rows are conditional, where the agent card renders its OU ID unconditionally. Agent.ouId is a required string, but Application.ouId is optional, and the handle arrives asynchronously, so an application with no OU, or one whose OU lookup has not yet resolved, shows only the rows it has values for.

Related Issues

• Application overview's "Application details" card is missing Organization Unit information #4841

Summary by CodeRabbit

• New Features
  • Application details now display the associated organization unit’s ID and handle when available.
  • If only the organization unit ID is available, the ID is shown without the handle.
  • Organization unit details are omitted when no organization unit is associated.

[coderabbitai]

📝 Walkthrough

Walkthrough

IntegrationGuides now retrieves organization unit data for an application and displays its ID and resolved handle in the application details card. Tests cover assigned, unassigned, and unresolved organization unit states.

Changes

Organization Unit Details

Layer / File(s)	Summary
Fetch and display organization unit details frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsx	IntegrationGuides retrieves organization unit data from application.ouId and conditionally displays the organization unit ID and handle.
Validate organization unit rendering frontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuides.test.tsx	Tests mock organization unit resolution and cover assigned, unassigned, and unresolved-handle states.

Estimated code review effort: 2 (Simple) | ~10 minutes

Possibly related issues

• thunder-id/thunderid#4841 — This PR implements the organization unit ID and handle display described by the issue.

Possibly related PRs

• thunder-id/thunderid#4490 — Both PRs modify IntegrationGuides.tsx and its tests; this PR adds organization unit details to the overview component introduced there.

Suggested reviewers: donomalvindula, brionmario

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely describes adding organization unit details to the application overview.
Description check	✅ Passed	The description explains the purpose, implementation, conditional behavior, related issue, and UI change with supporting tests and a screenshot.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
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.

✨ Finishing Touches 💡 1

🛠️ Fix failing CI checks 💡

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests

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 install failed. For unrecoverable errors, disable the tool in CodeRabbit configuration.

---

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

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

🧹 Nitpick comments (1)

frontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuides.test.tsx (1)

140-145: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Assert the disabled hook call for the unassigned case.

The DOM assertions verify hidden rows, but they do not verify that useGetOrganizationUnit is disabled when application.ouId is missing. Add an assertion for the same enabled-flag contract used by the sibling component.

Suggested test assertion

     renderWithProviders(<IntegrationGuides application={reactApplication} />);
+    expect(mockUseGetOrganizationUnit).toHaveBeenCalledWith(undefined, false);

🤖 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 140 - 145, Update the unassigned-application test around
IntegrationGuides to mock or inspect useGetOrganizationUnit and assert it is
called with the disabled enabled-flag when application.ouId is missing. Keep the
existing assertions verifying that both organization unit rows are hidden, and
match the enabled-option contract used by the sibling component.

🤖 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/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuides.test.tsx`:
- Around line 140-145: Update the unassigned-application test around
IntegrationGuides to mock or inspect useGetOrganizationUnit and assert it is
called with the disabled enabled-flag when application.ouId is missing. Keep the
existing assertions verifying that both organization unit rows are hidden, and
match the enabled-option contract used by the sibling component.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: c4cba702-d84c-4b4e-b3a2-fc2406d8d913

📥 Commits

Reviewing files that changed from the base of the PR and between 88727ff and eca2386.

📒 Files selected for processing (2)

• frontend/apps/console/src/features/applications/components/edit-application/integration-guides/IntegrationGuides.tsx
• frontend/apps/console/src/features/applications/components/edit-application/integration-guides/__tests__/IntegrationGuides.test.tsx

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!