Uh oh!
There was an error while loading. Please reload this page.
AI Session Interface Update for Knowledge Graph - #333
Conversation
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Make the right-hand knowledge-map panel on the active Tutor session collapsible via a draggable edge tab (desktop only): - railOpen state persisted to localStorage (sapling_learn_rail_open), hydrated on mount - rail widened to 400px; width/min-width slide 0<->400 via --dur/--ease, aside kept mounted with overflow:hidden (reduced-motion covered by the existing global rule) - edge tab: knowledge-graph glyph + rotating chevron, brand-forest when open / text-muted when collapsed; click toggles, pointer-drag moves the width live and snaps at the halfway point (<4px press = click) - strip the white card around the graph so it floats on the transparent rail; KnowledgeGraph/physics untouched - hide the shared graph recenter control on the Learn rail only via a scoped .learn-map-rail CSS rule (Dashboard/Tree keep it) Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Deploying with |
| Status | Name | Latest Commit | Preview URL | Updated (UTC) |
|---|---|---|---|---|
| ✅ Deployment successful! View logs | frontend-staging | 8bce5b0 | Commit Preview URL Branch Preview URL | Jul 10 2026, 01:19 AM |
Warning Review limit reached
Next review available in:36 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughThe PR adds a typed, agent-first concept scan with legacy fallback and regression tests. It also adds a persistent, draggable desktop knowledge-map rail in Tutor sessions and hides its reset control. ChangesConcept scan agent migration
Knowledge-map rail interaction
Estimated code review effort: 4 (Complex) | ~45 minutes Possibly related PRs
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 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 |
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 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/src/components/screens/Learn.tsx`:
- Around line 407-415: Update onRailTabPointerUp and the pointercancel routing
around the rail tab so cancelled gestures abort without toggling or snapping the
rail. Track whether the event is a cancellation and verify the active pointer
belongs to the current drag before committing; on cancellation or mismatched
pointer, release/clear drag state and return without calling setRailOpen.
- Around line 703-712: Make the knowledge-map rail toggle button
keyboard-operable by adding a keyboard handler to the button rendered in Learn,
activating the same toggle action used by the pointer interaction for Enter and
Space while preventing default Space behavior; preserve the existing pointer
drag handlers and avoid triggering the action for other keys.
- Line 113: Update the hydration tracking in the Learn component: replace the
useRef-based railHydrated flag with state, set it to true only after the stored
collapsed state has been applied, and gate the persistence effect on that state
so it cannot write the initial value before hydration completes.
🪄 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 Plus
Run ID: a0d54f59-ddf2-4369-99f5-1593582d704a
📒 Files selected for processing (8)
backend/agents/_providers.pybackend/agents/concept_scan.pybackend/routes/documents.pybackend/tests/test_concept_scan.pydocs/superpowers/plans/2026-07-08-scan-concepts-agent-migration.mddocs/superpowers/specs/2026-07-08-scan-concepts-agent-migration-design.mdfrontend/src/app/globals.cssfrontend/src/components/screens/Learn.tsx
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
Address code-review findings on the collapsible knowledge-map rail: - track hydration with state (not a ref) so the persist effect is gated until the stored collapsed state is applied, preventing the initial value from clobbering storage on mount - route pointercancel through a shared drag terminator that verifies the pointer id and aborts without toggling/snapping on cancellation - make the edge tab keyboard-operable: Enter/Space toggle the rail (Space default prevented), pointer drag handlers preserved Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Collapsible draggable knowledge-map rail on the Tutor session
Makes the right-hand knowledge-map panel on the active Tutor session collapsible via a draggable edge tab. Desktop-only affordance; the mobile
graphtab path is unchanged. Scoped toLearn.tsxplus a one-lineglobals.cssrule.What changed
railOpenstate (default open), persisted tolocalStorage["sapling_learn_rail_open"]and hydrated on mount, so it survives reloads.width/min-widthanimate0 ↔ 400with the existing--dur/--easetokens (cubic-bezier(0.2,0.7,0.2,1)). The<aside>stays mounted withoverflow: hidden; inner content is pinned at a fixed 400px so it clips cleanly during the slide (and the graph's measured bounds stay stable). Reduced-motion is already handled by the global rule atglobals.css:416.--brand-forestwhen open,--text-mutedwhen collapsed. Click toggles; pointer-drag moves the width live within[0, 400](transition disabled mid-drag) and snaps open/closed at the 200px midpoint. A <4px press counts as a click.aria-label/aria-expanded/titleset.cardwrapper so the graph floats on the transparent rail. The graph itself was already transparent;KnowledgeGraph/KnowledgeGraph2Dand the force simulation are untouched — no re-parameterization, sameResizeObserversizing..learn-map-rail button[title="Reset view"] { display: none }rule. The sharedKnowledgeGraph2Dis not modified, so Dashboard/Tree keep their recenter button. Zoom+/−and the2Dbadge remain.Notes / deviations from spec
KnowledgeGraph2D(used by Dashboard + Tree), which the spec said not to modify — so it's suppressed with a scoped CSS rule rather than removed from the component. Tradeoff: the selector keys off the button'stitle="Reset view". Happy to switch to an opt-inhideRecenterprop if preferred.globals.csskeyframe/reduced-motion addition was needed — the global reduced-motion rule already neutralizes the new transitions.Verification
npm run lint→ 0 errors (only pre-existing warnings).npm run typecheck→ clean for the changed files. (The 6.next/dev/types/validator.tserrors are pre-existing stale local artifacts — confirmed identical with these changes stashed — and won't appear on a clean CI checkout.)Summary by CodeRabbit
New Features
UI Improvements