fix(breadcrumb): added horizontal scrolling to prevent overflow#818
fix(breadcrumb): added horizontal scrolling to prevent overflow#818RealPhobia wants to merge 4 commits into
Conversation
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthrough
ChangesBreadcrumb Layout Update
Estimated code review effort🎯 1 (Trivial) | ⏱️ ~3 minutes Possibly related issues
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. Comment |
|
I accidently closed the pr. |
ChatThere are 3 ways to chat with CodeRabbit:
CodeRabbit commands
Other keywords and placeholders
Status, support, documentation and community
|
|
@coderabbitai resolve |
✅ Action performedComments resolved. Approval is disabled; enable |
|
Tip For best results, initiate chat on the files or code changes. 🧩 Analysis chain🏁 Script executed: #!/bin/bash
set -euo pipefail
# Get PR details and checks
echo "=== PR Status ==="
gh pr view 818 --repo crynta/terax-ai --json state,title,statusCheckRollup
echo ""
echo "=== Pre-merge checks / reviews ==="
gh pr checks 818 --repo crynta/terax-ai 2>&1 || true
echo ""
echo "=== PR comments ==="
gh pr view 818 --repo crynta/terax-ai --comments --json comments 2>&1 | head -200Length of output: 16758 🏁 Script executed: #!/bin/bash
# Look at the breadcrumb.tsx file
cat src/components/ui/breadcrumb.tsx 2>/dev/null || fd -i breadcrumb.tsx --exec cat {}Length of output: 2838
|
What
Added horizontal scrolling to the Breadcrumb component so that long file paths no longer overflow the screen.
Why
Before, deeply nested paths would break the flex-box layout, causing the breadcrumb UI to expand beyond the window bounds and become non-visible. Also half fulfills #616 (fixes breadcrumb overflow issue)
How
Added
min-w-0to the parentnavwrapper in breadcrumb.tsx to allow the flex-box children to shrink below their content size so when I addedoverflow-x-auto,whitespace-nowrap, andflex-nowrapto the BreadcrumbList, it would allow for horizontal scrolling and not allow for the flex-box to expand past a single line.Testing
I tried it on my mac from pnpm tauri dev.
pnpm exec tsc --noEmitcleansrc-tauri/)cargo test --lockedandcargo clippy --all-targets --locked -- -D warningsclean#[tauri::command]signature) called out below so the FE caller can be updated in locksteppnpm tauri devScreenshots / GIFs
Before:
After:

(its more smooth than in the gif)
Summary by CodeRabbit