feat(observability): make project-level log component names clickable

[kavix]

Purpose

Resolves #3436

In the project-level logging view, log records include the component name as plain text. This PR makes the component name a clickable link that navigates directly to that component's logging view, making it much easier to drill down from project logs to component logs.

Goals

• Make the componentName field in the LogEntry table a clickable React <Link>.
• Preserve the current time range and relevant filters (e.g., environment, log level) by passing location.search to the target URL.

Approach

• Updated LogEntry.tsx in openchoreo-observability to wrap the ComponentName field with @backstage/core-components Link.
• Used useLocation from react-router-dom to dynamically append current URL search params to the target component's route, preserving all active filters and time ranges automatically.
• Updated LogEntry.test.tsx to wrap the component in a <MemoryRouter> to satisfy react-router-dom hooks.
• Added a .changeset file for the @openchoreo/backstage-plugin-openchoreo-observability package.

User stories

• As a developer, when I see an error from component X in the project logs, I want to click the component name to navigate to all of component X's logs without having to manually navigate there or re-apply my filters.

Release note

Added clickable component names in the project-level logging view to seamlessly navigate to component-scoped logs while preserving active filters.

Documentation

N/A - Minor UI improvement to existing logging view.

Training

N/A

Certification

N/A

Marketing

N/A

Automation tests

• Unit tests

  Updated LogEntry.test.tsx to ensure proper routing context using MemoryRouter. All existing snapshot and behavior tests pass with the new Link structure.

• Integration tests

  No changes needed.

Security checks

• Followed secure coding standards in http://wso2.com/technical-reports/wso2-secure-engineering-guidelines? yes
• Ran FindSecurityBugs plugin and verified report? yes
• Confirmed that this PR doesn't commit any keys, passwords, tokens, usernames, or other secrets? yes

Samples

N/A

Related PRs

None.

Migrations (if applicable)

N/A

Test environment

• Tested on local k3d developer environment.

Learning

• Explored how Backstage core components handle routing and query parameter preservation using useLocation.

Summary by CodeRabbit

• New Features
  • Component names in the project-level logging view are now clickable, taking you to the component-scoped logging view while preserving the current time range, active filters, and URL query parameters.
• Tests
  • Added/updated test coverage for component-name link rendering and navigation behavior, and improved reliability for confirmation-dialog and SSH key test cases.
• Chores
  • Reduced noisy React “act” console output during test runs and updated packaging metadata for the test utilities package.

[coderabbitai]

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

• @coderabbitai resume to resume automatic reviews.
• @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

• ▶️ Resume reviews
• 🔍 Trigger review

📝 Walkthrough

Walkthrough

LogEntry now renders the ComponentName cell as a clickable link, and runtime logs pages pass entity metadata through LogsTable. Tests add router context and link assertions, while shared test setup and a few async tests were adjusted for environment and timing behavior.

Changes

Clickable Component Names in Runtime Logs

Layer / File(s)	Summary
LogEntry link construction plugins/openchoreo-observability/src/components/RuntimeLogs/LogEntry.tsx	Adds routing imports, runtime-logs path construction, and optional entityNamespace/entityKind props. ComponentName now renders as a conditional Link that preserves the query string and stops row click propagation.
Runtime logs entity metadata wiring plugins/openchoreo-observability/src/components/RuntimeLogs/LogsTable.tsx, plugins/openchoreo-observability/src/components/RuntimeLogs/ObservabilityProjectRuntimeLogsPage.tsx, plugins/openchoreo-observability/src/components/RuntimeLogs/ObservabilityRuntimeLogsPage.tsx	LogsTable accepts and forwards entity metadata, and both runtime logs pages supply entityNamespace and entityKind from the current entity.
Router-backed coverage and release note plugins/openchoreo-observability/src/components/RuntimeLogs/LogEntry.test.tsx, .changeset/clickable-log-components.md	LogEntry tests use MemoryRouter and assert the generated link target, and a changeset marks the observability package for a minor release.

Test Environment Stabilization

Layer / File(s)	Summary
Shared React test environment setup plugins/openchoreo/src/setupTests.ts	Sets IS_REACT_ACT_ENVIRONMENT on available globals and wraps console.error to ignore specific CSS parsing and act-environment messages.
Async test timing and dialog assertions plugins/openchoreo/src/components/Environments/components/SetupDetailPane.test.tsx, plugins/openchoreo/src/components/Secrets/CreateSecretDialog.test.tsx	Auto-deploy rollback tests now wait for the confirmation dialog to close after confirm, and the SSH private-key test uses an explicit longer timeout.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Suggested reviewers

• sameerajayasoma
• stefinie123

Poem

🐇 Hop, hop—through logs I dart,
Each component name now links with heart.
Query strings tucked in my fluffy pouch,
Tests stand ready on the couch.
Act alerts hush; the bunny beams,
While runtime logs now follow streams.

🚥 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
Title check	✅ Passed	The title clearly summarizes the main change: making project-level log component names clickable.
Description check	✅ Passed	The description follows the template well and covers purpose, goals, approach, tests, and release notes.
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

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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]

Actionable comments posted: 1

🧹 Nitpick comments (1)

plugins/openchoreo-observability/src/components/RuntimeLogs/LogEntry.test.tsx (1)

52-56: ⚡ Quick win

Add a route-preservation assertion for location.search.

The router wrapper is correct, but this setup still doesn’t protect the core behavior added in LogEntry (carrying query params to the component link). Consider using MemoryRouter initialEntries with a query string and asserting the rendered href includes it.

🤖 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
`@plugins/openchoreo-observability/src/components/RuntimeLogs/LogEntry.test.tsx`
around lines 52 - 56, The MemoryRouter wrapper in the render function needs to
be configured to pass a query string via initialEntries, and the test needs an
assertion to verify that the rendered LogEntry component's link href includes
those query parameters. Modify the MemoryRouter to include an initialEntries
prop with a URL containing a query string (e.g., path with ?param=value), then
add an assertion that checks the href attribute of the rendered link element in
LogEntry includes that query string parameter to ensure the component properly
preserves route search parameters.

🤖 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 `@plugins/openchoreo-observability/src/components/RuntimeLogs/LogEntry.tsx`:
- Line 155: The route being built in the `to` prop at line 155 hardcodes
`default/component` in the URL path, but the runtime-logs route requires dynamic
namespace and kind values to work correctly for entities outside the default
namespace. Replace the hardcoded `default/component` with actual entityNamespace
and entityKind values obtained from parent context or a canonical entity
reference, using `default/component` only as an explicit fallback when these
values are not available. This ensures the navigation route correctly matches
the entity's actual namespace and kind.

---

Nitpick comments:
In
`@plugins/openchoreo-observability/src/components/RuntimeLogs/LogEntry.test.tsx`:
- Around line 52-56: The MemoryRouter wrapper in the render function needs to be
configured to pass a query string via initialEntries, and the test needs an
assertion to verify that the rendered LogEntry component's link href includes
those query parameters. Modify the MemoryRouter to include an initialEntries
prop with a URL containing a query string (e.g., path with ?param=value), then
add an assertion that checks the href attribute of the rendered link element in
LogEntry includes that query string parameter to ensure the component properly
preserves route search parameters.

🪄 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: defaults

Review profile: CHILL

Plan: Pro

Run ID: d556478f-92ec-4957-b67e-e8f0a4dc32e6

📥 Commits

Reviewing files that changed from the base of the PR and between 8381554 and f1d26ab.

📒 Files selected for processing (3)

• .changeset/clickable-log-components.md
• plugins/openchoreo-observability/src/components/RuntimeLogs/LogEntry.test.tsx
• plugins/openchoreo-observability/src/components/RuntimeLogs/LogEntry.tsx

[stefinie123]

@kavix Tests are failing. Shall we fix the failing tests and update the PR

[kavix]

@stefinie123 Can you check Now?

[stefinie123]

@kavix tests and linter are failing again. Run yarn lint and yarn run test <relative path to test> locally to check the issues and fix them