Fix/file tree selection parents #276

nicotsx · 2026-01-02T15:49:54Z

Summary by CodeRabbit

Tests
- Added comprehensive client-side tests for file tree selection behavior and test setup for the browser-like environment.
Bug Fixes
- Fixed selection consolidation so parent/child selections behave consistently across nested folders and edge cases.
Style
- Adjusted minimum height of loading, error, and empty state placeholders in the file browser.
Chores
- Added separate scripts and tooling for running server and client tests.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

When all childs of a folder are selected in the tree, the selected path was only simplifiyng one level. But if the reduction was also making its own parent "fully selected" it was not correctly reporting only the parent as selected

coderabbitai · 2026-01-02T15:50:05Z

Walkthrough

Adds a FileTree test suite and related test setup, updates FileTree selection consolidation and parent/child handling, changes NodeButton rendering from button to div, adjusts placeholder height utilities in the volume file browser, and adds separate client/server test scripts and test dependencies.

Changes

Cohort / File(s)	Summary
FileTree tests & logic `app/client/components/__test__/file-tree.test.tsx`, `app/client/components/file-tree.tsx`	Adds tests validating selection simplification, recursive consolidation, deselection behavior, and deep-path handling. Reworks selection consolidation loop (iterative map-based consolidation), fixes descendant removal iteration, and adjusts parent/child deselection flows.
Node UI rendering `app/client/components/file-tree.tsx`	Replaces `button` rendering with a `div` for NodeButton and adds biome-ignore comments for static interaction/key-with-click patterns.
Volume file browser UI `app/client/components/volume-file-browser.tsx`	Replaces `min-h-[200px]` with `min-h-50` in loading, error, and empty placeholder containers (styling change only).
Test setup & scripts `app/test/setup-client.ts`, `package.json`	Adds Happy DOM global registration via `app/test/setup-client.ts`. Introduces `test:server` and `test:client` scripts and updates `test` to run both. Adds devDependencies: `@happy-dom/global-registrator`, `@testing-library/dom`, `@testing-library/react`.

Pre-merge checks

✅ 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 'Fix/file tree selection parents' directly relates to the main changes in the PR, which focus on fixing file tree selection logic and parent/child deselection handling.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

📜 Recent review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between fbc4a3a and 8a88d2c.

📒 Files selected for processing (2)

app/client/components/__test__/file-tree.test.tsx
app/client/components/file-tree.tsx

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

app/client/components/file-tree.tsx
app/client/components/test/file-tree.test.tsx

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

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

coderabbitai

Actionable comments posted: 2

🧹 Nitpick comments (1)

app/client/components/file-tree.tsx (1)
196-237: Consider adding a maximum iteration limit as a safeguard for deeply nested hierarchies.

The consolidation algorithm has O(depth × fileList.length × selectedItems) complexity. While the break statement limits iterations to tree depth (typically manageable), adding a max iterations check would prevent any edge cases with unusual hierarchies from causing performance issues.
let changed = true;
let iterations = 0;
const MAX_ITERATIONS = 100; // Safeguard for pathological cases

while (changed && iterations < MAX_ITERATIONS) {
	iterations++;
	changed = false;
	// ... rest of algorithm
}

📜 Review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between f836e2f and fbc4a3a.

⛔ Files ignored due to path filters (1)

bun.lock is excluded by !**/*.lock

📒 Files selected for processing (5)

app/client/components/__test__/file-tree.test.tsx
app/client/components/file-tree.tsx
app/client/components/volume-file-browser.tsx
app/test/setup-client.ts
package.json

🧰 Additional context used

📓 Path-based instructions (3)

**/*.{ts,tsx,js,jsx,json}

📄 CodeRabbit inference engine (AGENTS.md)

Use Biome for code formatting and linting with bunx biome check --write ., format only with bunx biome format --write ., or lint with bunx biome lint .

Files:

app/client/components/__test__/file-tree.test.tsx
app/client/components/file-tree.tsx
package.json
app/test/setup-client.ts
app/client/components/volume-file-browser.tsx

**/*.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (AGENTS.md)

**/*.{ts,tsx,js,jsx}: Use tabs (not spaces) for indentation with a line width of 120 characters
Use double quotes for strings
Do not auto-organize imports - imports organization is disabled in Biome
All imports must include file extensions when targeting Node/Bun, as the project uses "type": "module"

Files:

app/client/components/__test__/file-tree.test.tsx
app/client/components/file-tree.tsx
app/test/setup-client.ts
app/client/components/volume-file-browser.tsx

app/client/**/*.{ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

app/client/**/*.{ts,tsx}: Client uses TanStack Query for server state management
Client uses Radix UI primitives with custom Tailwind styling
Use Server-Sent Events hook (use-server-events.ts) for real-time updates in the client

Files:

app/client/components/__test__/file-tree.test.tsx
app/client/components/file-tree.tsx
app/client/components/volume-file-browser.tsx

🧠 Learnings (7)