COO-1650: Troubleshooting panel not updated by internal URL changes.

[alanconway]

The metric page "Insert example query" button changes the URL from inside the browser,
these changes are not picked up by useLocation.
Extended the useLocationQuery hook to notice these changes.

/cherry-pick release-0.4

Summary by CodeRabbit

• Bug Fixes

  • Show "No Correlation" when queries are empty and avoid unnecessary network fetches
  • Display "Empty Graph" with a clear message when no graph data is returned

• Improvements

  • More reliable browser navigation handling for back/forward actions

• Localization

  • Added user-facing messages and guidance for empty/no-correlation states

[openshift-ci-robot]

@alanconway: This pull request references COO-1650 which is a valid jira issue.

Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the bug to target the "4.22.0" version, but no target version was set.

Details

In response to this:

The metric page "Insert example query" button changes the URL from inside the browser,
these changes are not picked up by useLocation.
Extended the useLocationQuery hook to notice these changes.

/cherry-pick release-0.4

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository: openshift/coderabbit/.coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: ffa8e325-5a57-4719-9163-db0db7733307

📥 Commits

Reviewing files that changed from the base of the PR and between e56417c and 6803620.

📒 Files selected for processing (4)

• web/locales/en/plugin__troubleshooting-panel-console-plugin.json
• web/src/components/Korrel8rPanel.tsx
• web/src/hooks/useLocationQuery.ts
• web/src/hooks/useQueryParams.ts

💤 Files with no reviewable changes (1)

• web/src/hooks/useQueryParams.ts

🚧 Files skipped from review as they are similar to previous changes (1)

• web/src/hooks/useLocationQuery.ts

---

Walkthrough

Replaces react-router-dom-v5-compat location usage with a custom useBrowserLocation hook and removes useQueryParams. Adds guard clauses and explicit empty-result handling to Korrel8rPanel, and adds new i18n keys for empty/no-correlation messages.

Changes

Cohort / File(s)	Summary
Korrel8rPanel Guard Logic web/src/components/Korrel8rPanel.tsx	Added early-return when trimmed query is empty; set explicit "No Correlation" result. Conditional graph handling: only set graph result when response.nodes exists and is non-empty; otherwise set "Empty Graph" with message. Updated effect dependency to use search.queryStr. Minor comment wording change.
Browser Location / Query Hooks web/src/hooks/useLocationQuery.ts, web/src/hooks/useQueryParams.ts	Replaced useLocation from react-router-dom-v5-compat with new useBrowserLocation that snapshots window.location, listens to popstate, and wraps history.pushState/replaceState. Removed useQueryParams file/export entirely.
Localization Additions web/locales/en/plugin__troubleshooting-panel-console-plugin.json	Added translation keys for "Empty Graph", "No Correlation", "No correlation results were found", and the "Use the [Focus] button..." instructional text.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (2 warnings)

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.
Test Structure And Quality	⚠️ Warning	Pull request introduces significant code changes to critical functionality but does not include corresponding unit tests for the new custom React hooks and component modifications.	Add unit tests for useBrowserLocation hook, useLocationQuery hook, and Korrel8rPanel component modifications following existing Jest/TypeScript patterns in the repository.

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately reflects the main objective of the PR: fixing the troubleshooting panel's failure to update when internal URL changes occur via the metric page's query button.
Stable And Deterministic Test Names	✅ Passed	PR does not modify test files; existing tests follow stable naming conventions with static descriptive titles and no dynamic values.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

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 and usage tips.}

[openshift-ci]

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: alanconway

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Details

Needs approval from an approver in each of these files:

• OWNERS [alanconway]

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[openshift-ci-robot]

@alanconway: This pull request references COO-1650 which is a valid jira issue.

Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the bug to target the "4.22.0" version, but no target version was set.

Details

In response to this:

The metric page "Insert example query" button changes the URL from inside the browser,
these changes are not picked up by useLocation.
Extended the useLocationQuery hook to notice these changes.

/cherry-pick release-0.4

Summary by CodeRabbit

• Bug Fixes
• Search now displays "No Correlation" message when queries are empty with helpful guidance
• Graph results show "Empty Graph" message when no data is available
• Improved browser navigation handling for back/forward button actions

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

[coderabbitai]

Actionable comments posted: 3

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@web/src/components/Korrel8rPanel.tsx`:
- Around line 85-90: The two hardcoded user-facing strings in Korrel8rPanel (the
empty-query branch using queryStr and the later call around onResult at the
second location) must be localized: replace literal titles/messages passed into
onResult with calls to the i18n translation function (e.g., t('...')) and use
appropriate translation keys, ensuring Korrel8rPanel imports/uses the same
translation hook or function your app uses (so wrap the 'No Correlation' title
and the 'Use the [Focus] button...' message, and the similar strings at the
second onResult call, with t(...)). Ensure the translation keys are descriptive
and consistent with existing keys in your project.
- Around line 104-108: The check response?.nodes treats empty arrays as truthy
so an empty graph is rendered; update the condition in Korrel8rPanel (the branch
where onResult is called) to treat empty arrays as empty results (e.g., check
Array.isArray(response.nodes) && response.nodes.length > 0) and call onResult({
graph: new korrel8r.Graph(response) }) only when nodes are non-empty; otherwise
call onResult with translated strings (use the component's i18n function, e.g.,
t('Empty Graph') and t('No correlation results were found')) so the empty-state
message is localized.

---

ℹ️ Review info

Configuration used: Repository: openshift/coderabbit/.coderabbit.yaml

Review profile: CHILL

Plan: Pro

Cache: Disabled due to data retention organization setting

Knowledge base: Disabled due to data retention organization setting

📥 Commits

Reviewing files that changed from the base of the PR and between 0428701 and e56417c.

📒 Files selected for processing (3)

• web/src/components/Korrel8rPanel.tsx
• web/src/hooks/useLocationQuery.ts
• web/src/hooks/useQueryParams.ts

💤 Files with no reviewable changes (1)

• web/src/hooks/useQueryParams.ts

[anpingli]

/label qe-approved

[openshift-ci-robot]

@alanconway: This pull request references COO-1650 which is a valid jira issue.

Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the bug to target the "4.22.0" version, but no target version was set.

Details

In response to this:

The metric page "Insert example query" button changes the URL from inside the browser,
these changes are not picked up by useLocation.
Extended the useLocationQuery hook to notice these changes.

/cherry-pick release-0.4

Summary by CodeRabbit

• Bug Fixes
• Search now displays "No Correlation" message when queries are empty with helpful guidance
• Graph results show "Empty Graph" message when no data is available
• Improved browser navigation handling for back/forward button actions

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

[openshift-ci-robot]

@alanconway: This pull request references COO-1650 which is a valid jira issue.

Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the bug to target the "4.22.0" version, but no target version was set.

Details

In response to this:

The metric page "Insert example query" button changes the URL from inside the browser,
these changes are not picked up by useLocation.
Extended the useLocationQuery hook to notice these changes.

/cherry-pick release-0.4

Summary by CodeRabbit

• Bug Fixes

• Show "No Correlation" when queries are empty and avoid unnecessary network fetches

• Display "Empty Graph" with a clear message when no graph data is returned

• Improvements

• More reliable browser navigation handling for back/forward actions

• Localization

• Added user-facing messages and guidance for empty/no-correlation states

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository.

[openshift-ci]

@alanconway: all tests passed!

Full PR test history. Your PR dashboard.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository. I understand the commands that are listed here.