fix(selection): keep shift selection item visible

[doubleface]

Share DOM scroll helpers between rectangular selection and keyboard range selection. Use the actual scroll container to reveal the current item when extending a selection with Shift+Arrow.

Capture.video.du.2026-06-15.17-28-11.webm

https://app.notion.com/p/linagora/Add-scroll-when-use-Shift-arrow-to-select-37c62718bad18053823dec07e36bf911

Summary by CodeRabbit

• New Features

  • Shift selection now automatically scrolls the newly selected item into view when using Shift+Click or Shift+Arrow keyboard navigation (based on the active scroll container).
  • Rectangular selection auto-scrolls smoothly as you drag near the edges.

• Tests

  • Expanded shift-selection test coverage to verify proper event wiring and that auto-scrolling occurs only when the target item is outside the visible container.

[bundlemon]

BundleMon

Unchanged files (20)

Status	Path	Size	Limits
✅	static/js/cozy.(hash).js	928.62KB	-
✅	static/resource/(hash).js	336.09KB	-
✅	services/qualificationMigration.js	282.66KB	-
✅	services/dacc.js	262.48KB	-
✅	static/js/main.(hash).js	48.06KB	-
✅	static/js/lib-react.(hash).js	43.88KB	-
✅	static/css/cozy.(hash).css	31.42KB	-
✅	static/js/lib-polyfill.(hash).js	22.77KB	-
✅	static/js/lib-router.(hash).js	21.86KB	-
✅	static/js/public.(hash).js	19.79KB	-
✅	static/css/main.(hash).css	13.57KB	-
✅	static/js/intents.(hash).js	9.2KB	-
✅	static/js/(chunkId).(hash).js	8.6KB	-
✅	manifest.webapp	3.09KB	-
✅	static/css/public.(hash).css	2.34KB	-
✅	static/js/async/(chunkId).(hash).js	2.06KB	-
✅	main/index.html	772B	-
✅	public/index.html	705B	-
✅	intents/index.html	645B	-
✅	assets/manifest.json	185B	-

Total files change +1B 0%

Groups updated (1)

Status	Path	Size	Limits
✅	**/*.js	5.98MB (+202B 0%)	-

Unchanged groups (2)

Status	Path	Size	Limits
✅	**/*.{png,svg,ico}	2.16MB	-
✅	**/*.css	78.72KB	-

Final result: ✅

View report in BundleMon website ➡️

---

Current branch size history | Target branch size history

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: b9695578-c7a3-42ec-9bcb-2203d7e97e59

📥 Commits

Reviewing files that changed from the base of the PR and between 617ea25 and e61131f.

📒 Files selected for processing (5)

• src/hooks/useShiftSelection/index.spec.tsx
• src/hooks/useShiftSelection/index.tsx
• src/modules/selection/RectangularSelection.jsx
• src/modules/selection/scrollHelpers.ts
• src/modules/views/Folder/virtualized/FolderViewBodyContent.jsx

---

Walkthrough

A new scrollHelpers.ts module is added to src/modules/selection/ exporting two functions: scrollContainerByDirection (scrolls a container by a direction vector scaled by a step) and scrollElementIntoViewInContainer (scrolls a container to bring an element fully into view using bounding rect comparisons). RectangularSelection.jsx replaces its inline scrollBy logic and removes the local step constant in favor of scrollContainerByDirection. useShiftSelection gains an optional scrollElement parameter, an internal scrollToItem helper that uses scrollElementIntoViewInContainer, and calls to that helper after shift+click and shift+arrow interactions. FolderViewBodyContent passes scrollElement into the hook. Tests are updated to mock the required DOM APIs and assert scroll behavior.

Suggested labels

e2e

Suggested reviewers

• JF-Cozy
• lethemanh
• zatteo
• codescene-delta-analysis

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and concisely summarizes the main change: ensuring shift-selected items remain visible by auto-scrolling them into view.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

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

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/shift-arrow-autoscroll

---

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.}

[coderabbitai]

Actionable comments posted: 1

🧹 Nitpick comments (1)

src/modules/selection/scrollHelpers.ts (1)

11-29: 💤 Low value

Consider documenting the vertical-only scroll behavior.

The function only handles vertical scrolling (top/bottom overflow) but does not address horizontal scrolling (left/right overflow). If this is intentional for the current use case (vertical lists), consider adding a JSDoc comment to clarify this constraint.

📝 Proposed documentation addition

+/**
+ * Scrolls a container to bring an element fully into view vertically.
+ * Only handles vertical overflow; horizontal scrolling is not implemented.
+ *
+ * `@param` container - The scrollable container element
+ * `@param` element - The element to scroll into view
+ */
 const scrollElementIntoViewInContainer = (
   container: HTMLElement,
   element: Element
 ): void => {

🤖 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 `@src/modules/selection/scrollHelpers.ts` around lines 11 - 29, Add JSDoc
documentation to the scrollElementIntoViewInContainer function to clarify that
it only handles vertical scrolling behavior (top and bottom overflow). The
comment should explicitly note that horizontal scrolling (left and right
overflow) is not currently implemented, making the intentional scope of this
function clear to other developers who may use it or maintain it in the future.

🤖 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/modules/selection/scrollHelpers.ts`:
- Around line 3-9: The scrollContainerByDirection function accesses direction[0]
and direction[1] without validating that the direction array has at least 2
elements, which will result in undefined values and cause scrollBy to receive
NaN arguments. Add validation at the start of the function to check that
direction.length is at least 2, and either throw an error with a descriptive
message or return early if the validation fails.

---

Nitpick comments:
In `@src/modules/selection/scrollHelpers.ts`:
- Around line 11-29: Add JSDoc documentation to the
scrollElementIntoViewInContainer function to clarify that it only handles
vertical scrolling behavior (top and bottom overflow). The comment should
explicitly note that horizontal scrolling (left and right overflow) is not
currently implemented, making the intentional scope of this function clear to
other developers who may use it or maintain it in the future.

🪄 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: Pro

Run ID: c2d8dc97-faf0-44b8-82d7-3d6cd4ddb7ef

📥 Commits

Reviewing files that changed from the base of the PR and between b70b8cd and 30205a1.

📒 Files selected for processing (5)

• src/hooks/useShiftSelection/index.spec.tsx
• src/hooks/useShiftSelection/index.tsx
• src/modules/selection/RectangularSelection.jsx
• src/modules/selection/scrollHelpers.ts
• src/modules/views/Folder/virtualized/FolderViewBodyContent.jsx

[codescene-delta-analysis]

Our agent can fix these. Install it.

Gates Passed
3 Quality Gates Passed

Quality Gate Profile: The Bare Minimum
Install CodeScene MCP: safeguard and uplift AI-generated code. Catch issues early with our IDE extension and CLI tool.