Skip to content

feat: add select-all checkbox and lift selection state to parent#12900

Draft
RobinAngele wants to merge 2 commits into
nextcloud:mainfrom
RobinAngele:feat/select-all-checkbox
Draft

feat: add select-all checkbox and lift selection state to parent#12900
RobinAngele wants to merge 2 commits into
nextcloud:mainfrom
RobinAngele:feat/select-all-checkbox

Conversation

@RobinAngele
Copy link
Copy Markdown

@RobinAngele RobinAngele commented May 7, 2026 •
edited
Loading

Depends on: #12899

Refs #4285
Refs #7880
Refs #6070
Refs #7276
Refs #11526

Follow-up: #12901 adds filter-based mass selection

Summary

Adds a "Select all X messages" checkbox above the envelope list and lifts
envelope selection state from individual EnvelopeList instances to the
Mailbox parent, enabling cross-group shift-click range selection and
global select-all/unselect-all.

Together with #12901 this fully closes #4285 and #7880.

Changes by file

Mailbox.vue

  • Select-all checkbox using NcCheckboxRadioSwitch at the top of the list
  • Shows "Select all N messages" with the current visible page count
  • Hidden once selection mode is active (multiselect header takes over)
  • margin-top: 8px so it doesn't sit flush against the sticky search bar
  • selection array in data — single source of truth for selection state
  • selectAll(), unselectAll() methods for global control
  • flatEnvelopeList, selectMode, allSelected computed properties
  • onUpdateSelection(), onSelectRange(), getGroupFlatIndex() methods
  • Passes selection prop down to EnvelopeList children
  • Listens for update:selection and select-range events from children
  • Resets selection on mailbox or filter change
  • .select-all-bar CSS

EnvelopeList.vue

  • selection prop (type Array, replaces local data().selection)
  • flatIndex prop (type Number, for cross-group shift-click indexing)
  • Watch on selection prop with immediate: true to sync flags.selected
  • emitLocalSelection() method — emits update:selection to parent
  • Shift-click now emits select-range with global flat indices
  • Deleted local selection from data() and setEnvelopeSelected mutations

How to test

  1. Open a mailbox → "Select all N messages" checkbox visible at top
  2. Click it → all visible messages selected → multiselect header appears
  3. Shift-click across messages in different date groups → range selected
  4. Change mailbox or filter → checkbox resets to unchecked
  5. Unselect all → checkbox reappears

Screenshots

Select All - Screenshot_20260507_061040

RobinAngele and others added 2 commits May 7, 2026 11:07
fix: add missing ImportantIcon and correct favorite/unfavorite bulk a…
df5a120 
…ctions

- Add missing ImportantIcon import and component registration in
  EnvelopeList so the 'Mark as important' icon renders during
  bulk selection
- Fix favorite/unfavorite bulk action logic: rename methods to
  favoriteAll/unfavoriteAll and use explicit favFlag values
  (true/false) instead of inverted computed checks that failed
  when all selected messages shared the same state

AI-assisted: Cline (Claude)
Signed-off-by: RobinAngele <robin@robin4consulting.com>
feat: add select-all checkbox and lift selection state to parent
c5a8cfd 
Add a 'Select all X messages' checkbox above the envelope list using
NcCheckboxRadioSwitch from @nextcloud/vue, allowing users to select
all visible messages at once.

Lift envelope selection state from individual EnvelopeList instances
up to the Mailbox parent component. This enables:
- Cross-group shift-click range selection via flat envelope indexing
- Consistent selection state across grouped envelope lists
- Global select-all / unselect-all from the parent level

Also pass the selection array as a prop to EnvelopeList and add
proper event handling for update:selection and select-range.

Closes: nextcloud#4285
Refs: nextcloud#7880, nextcloud#6070, nextcloud#7276

AI-assisted: Cline (Claude)
Signed-off-by: RobinAngele <robin@robin4consulting.com>
This was referenced May 7, 2026
Closed
Open
RobinAngele pushed a commit to RobinAngele/nextcloud-mail that referenced this pull request May 8, 2026
feat: add filter-based mass selection via search modal
754e830 
Add a 'Select all matching' button to the search parameters dialog
and enable selecting all messages matching a filter across all pages.

Search modal:
- New 'Select all matching' button in SearchMessages.vue dialog
- Emits 'select-all-matching' event via the MailboxThread bus

Mass loading:
- Mailbox.vue onBusSelectAllMatching forces a fresh load, then
  iterates loadMore() until all pages are fetched
- Spinner + 'Selecting messages…' shown during loading
- Checkbox disabled while loading

Context-aware labels:
- 'Select N loaded messages' when more pages exist
- 'Select N matching messages' when a filter is active
- 'Select all N messages' when all pages are loaded
- Hint row: 'Scroll down to include more messages, use filter to
  refine, or click an avatar circle to select one at a time'

Depends on: nextcloud#12900 (select-all checkbox feature)
Closes: nextcloud#4285, nextcloud#7880
Refs: nextcloud#6070, nextcloud#7276, nextcloud#11526

AI-assisted: Cline (Claude)
Signed-off-by: RobinAngele <robin@robin4consulting.com>
@ChristophWurst
Copy link
Copy Markdown
Member

ChristophWurst commented May 11, 2026

Thank you for your contributions

Please update the branch. #12899 was merged. The first commit is here is obsolete.

RobinAngele pushed a commit to RobinAngele/nextcloud-mail that referenced this pull request May 11, 2026
feat: add filter-based mass selection via search modal
790b219 
Add a 'Select all matching' button to the search parameters dialog
and enable selecting all messages matching a filter across all pages.

Search modal:
- New 'Select all matching' button in SearchMessages.vue dialog
- Emits 'select-all-matching' event via the MailboxThread bus

Mass loading:
- Mailbox.vue onBusSelectAllMatching forces a fresh load, then
  iterates loadMore() until all pages are fetched
- Spinner + 'Selecting messages…' shown during loading
- Checkbox disabled while loading

Context-aware labels:
- 'Select N loaded messages' when more pages exist
- 'Select N matching messages' when a filter is active
- 'Select all N messages' when all pages are loaded
- Hint row: 'Scroll down to include more messages, use filter to
  refine, or click an avatar circle to select one at a time'

Depends on: nextcloud#12900 (select-all checkbox feature)
Closes: nextcloud#4285, nextcloud#7880
Refs: nextcloud#6070, nextcloud#7276, nextcloud#11526

AI-assisted: Cline (Claude)
Signed-off-by: RobinAngele <git@robin4consulting.com>
RobinAngele added a commit to RobinAngele/nextcloud-mail that referenced this pull request May 11, 2026
@RobinAngele
feat: add filter-based mass selection via search modal
c575d0f 
Add a 'Select all matching' button to the search parameters dialog
and enable selecting all messages matching a filter across all pages.

Search modal:
- New 'Select all matching' button in SearchMessages.vue dialog
- Emits 'select-all-matching' event via the MailboxThread bus

Mass loading:
- Mailbox.vue onBusSelectAllMatching forces a fresh load, then
  iterates loadMore() until all pages are fetched
- Spinner + 'Selecting messages…' shown during loading
- Checkbox disabled while loading

Context-aware labels:
- 'Select N loaded messages' when more pages exist
- 'Select N matching messages' when a filter is active
- 'Select all N messages' when all pages are loaded
- Hint row: 'Scroll down to include more messages, use filter to
  refine, or click an avatar circle to select one at a time'

Depends on: nextcloud#12900 (select-all checkbox feature)
Closes: nextcloud#4285, nextcloud#7880
Refs: nextcloud#6070, nextcloud#7276, nextcloud#11526

AI-assisted: Cline (Claude)
Signed-off-by: RobinAngele <git@robin4consulting.com>
@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 22, 2026

Hello there,
Thank you so much for taking the time and effort to create a pull request to our Nextcloud project.

We hope that the review process is going smooth and is helpful for you. We want to ensure your pull request is reviewed to your satisfaction. If you have a moment, our community management team would very much appreciate your feedback on your experience with this PR review process.

Your feedback is valuable to us as we continuously strive to improve our community developer experience. Please take a moment to complete our short survey by clicking on the following link: https://cloud.nextcloud.com/apps/forms/s/i9Ago4EQRZ7TWxjfmeEpPkf6

Thank you for contributing to Nextcloud and we hope to hear from you soon!

(If you believe you should not receive this message, you can add yourself to the blocklist.)

@ChristophWurst
Copy link
Copy Markdown
Member

ChristophWurst commented May 22, 2026

df5a120 is still there. Marking as draft.

@ChristophWurst ChristophWurst marked this pull request as draft May 22, 2026 07:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@ChristophWurst ChristophWurst Awaiting requested review from ChristophWurst ChristophWurst is a code owner

@GretaD GretaD Awaiting requested review from GretaD GretaD is a code owner

@kesselb kesselb Awaiting requested review from kesselb kesselb is a code owner

At least 1 approving review is required to merge this pull request.

Assignees

No one assigned

Labels

2. developing enhancement feedback-requested

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Select all messages in mailbox

2 participants

@RobinAngele @ChristophWurst