fix(help-panel): use client-side nav for internal links#346
fix(help-panel): use client-side nav for internal links#346platex-rehor-bot wants to merge 4 commits into
Conversation
Summary by CodeRabbit
Walkthrough
ChangesHelp panel navigation
build-tools pointer update
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 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 `@src/components/HelpPanel/HelpPanelTabs/APIPanel.tsx`:
- Around line 239-253: The APIPanel navigation handlers are replacing link
semantics with button-like behavior, so restore anchor behavior in the affected
link components while still intercepting only unmodified same-tab clicks. Update
the click handling around handleClick and the related APIPanel link renderers to
keep href and component="a", call preventDefault() only when the click is a
plain left-click with no modifier keys, and then route through navigateKeepPanel
using the resolved URL/path. Apply the same pattern to the other affected link
blocks so users retain open-in-new-tab, copy-link, and assistive tech link
semantics.
In `@src/components/HelpPanel/HelpPanelTabs/LearnPanel.tsx`:
- Around line 656-658: The catalog navigation in LearnPanel currently uses
Button with navigateKeepPanel, which removes native link semantics and hurts
accessibility. Update the control in LearnPanel to render as an anchor-like link
(preserving href/semantic link behavior) and only intercept the click for an
unmodified same-tab navigation, while letting modified clicks and default
browser link behavior work normally.
🪄 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: Organization UI
Review profile: CHILL
Plan: Enterprise
Run ID: 1a2b8f72-6e86-4ebe-b292-d13967671043
📒 Files selected for processing (3)
src/components/HelpPanel/HelpPanelTabs/APIPanel.test.tsxsrc/components/HelpPanel/HelpPanelTabs/APIPanel.tsxsrc/components/HelpPanel/HelpPanelTabs/LearnPanel.tsx
RHCLOUD-47951 Replace <a href> anchor tags with useNavigateKeepPanel hook in APIPanel and LearnPanel. Anchor tags trigger full page reloads which destroy the React tree, reset Jotai atoms, and close the help panel. The useNavigateKeepPanel hook performs SPA navigation via chromeHistory.push and re-asserts drawer state to keep the panel open. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
RHCLOUD-47951 Restore native link behavior (href, component="a") on APIPanel and LearnPanel navigation buttons so users retain open-in-new-tab, copy-link, and assistive tech link semantics. Only intercept unmodified same-tab clicks for client-side navigation via navigateKeepPanel. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
a05f398 to
ea279f2
Compare
|
/retest |
5 similar comments
|
/retest |
|
/retest |
|
/retest |
|
/retest |
|
/retest |
RHCLOUD-47951 Updates insights-frontend-builder-common to e2157f0 which includes nodejs-22 image tag update (9.8-1780375952) and logging fixes. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
There was a problem hiding this comment.
🧹 Nitpick comments (1)
build-tools (1)
1-1: 🩺 Stability & Availability | 🔵 TrivialKeep the build-tools bump tied to a passing Tekton build.
.tekton/learning-resources-push.yamlusesbuild-tools/Dockerfile, so this submodule update directly affects the image build; only merge it if the target commit is the intended upstream revision and the pipeline still passes.🤖 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 `@build-tools` at line 1, The build-tools submodule bump must stay aligned with a passing Tekton build because `.tekton/learning-resources-push.yaml` depends on `build-tools/Dockerfile`. Verify the submodule points to the intended upstream revision, then confirm the Tekton pipeline still succeeds before merging. If the build fails, adjust or revert the build-tools commit until `build-tools` and the Tekton image build are consistent.
🤖 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 `@build-tools`:
- Line 1: The build-tools submodule bump must stay aligned with a passing Tekton
build because `.tekton/learning-resources-push.yaml` depends on
`build-tools/Dockerfile`. Verify the submodule points to the intended upstream
revision, then confirm the Tekton pipeline still succeeds before merging. If the
build fails, adjust or revert the build-tools commit until `build-tools` and the
Tekton image build are consistent.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Enterprise
Run ID: 9d5c0d0c-79e0-4107-ab35-01336436648c
📒 Files selected for processing (4)
build-toolssrc/components/HelpPanel/HelpPanelTabs/APIPanel.test.tsxsrc/components/HelpPanel/HelpPanelTabs/APIPanel.tsxsrc/components/HelpPanel/HelpPanelTabs/LearnPanel.tsx
✅ Files skipped from review due to trivial changes (1)
- src/components/HelpPanel/HelpPanelTabs/APIPanel.test.tsx
🚧 Files skipped from review as they are similar to previous changes (2)
- src/components/HelpPanel/HelpPanelTabs/LearnPanel.tsx
- src/components/HelpPanel/HelpPanelTabs/APIPanel.tsx
Konflux CI noteThe Red Hat Konflux / learning-resources-on-pull-request check is failing due to an infrastructure issue — the This has been retried 6 times over the past several hours, and I also updated the All other checks pass: GH Actions (install, test-component, test-storybook), CodeRabbit, and Snyk. The code changes are unrelated to the Docker build — they only modify TypeScript source files in For reference, PR #345 on this same repo passes Konflux because it uses the The Konflux check should pass automatically once the registry recovers. A |
|
/retest |
|
@coderabbitai Thanks for the nitpick on build-tools — good point about keeping the submodule aligned with a passing pipeline. The Once the registry recovers, the pipeline should pass. I've triggered another |
|
Tip For best results, initiate chat on the files or code changes.
|
|
/retest |
6 similar comments
|
/retest |
|
/retest |
|
/retest |
|
/retest |
|
/retest |
|
/retest |
This reverts commit 60d7a1e.
|
Reverted the This should help with the Konflux build since the same image tag ( |
|
/retest |
Konflux CI root cause analysisAfter further investigation, the
Root cause: The All other CI checks (GitHub Actions, Snyk, CodeRabbit) pass. This is an upstream pipeline infrastructure issue in the konflux-pipelines repo. |
|
/retest |
1 similar comment
|
/retest |
1 participant
Description
RHCLOUD-47951
When navigating from the help panel (APIs tab, Learn tab) to an internal console link, the panel closes and resets. This happens because the links use plain
<a href>anchor tags, which trigger full page reloads. Full reloads destroy the React tree and reset all Jotai atoms — including the drawer expanded state — causing the panel to close.This PR replaces the anchor-based links in
APIPanelandLearnPanelwith the existinguseNavigateKeepPanelhook, which performs client-side SPA navigation viachromeHistory.push()and re-asserts drawer state to keep the panel open.Screenshots
Non-visual change — the behavior change is that the help panel now stays open during navigation instead of closing. No visual UI elements are altered.
Anything reviewers should know?
useNavigateKeepPanelhook already existed and was used bySearchResultItem.tsx— this PR extends its usage toAPIPanelandLearnPanelpopstateevent afterchromeHistory.push()so federated modules (likeapi-frontend) detect URL changes and re-render correctlydrawerPanelContentafter a 50ms delay to counteract any route-change cleanup that might close the paneluseNavigateKeepPanelto the remaining links that were still using plain anchorsChecklist
AI disclosure
Assisted by: Claude Code