Skip to content

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

Open
RobinAngele wants to merge 2 commits intonextcloud:mainfrom
RobinAngele:feat/select-all-checkbox
Open

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

Conversation

@RobinAngele
Copy link
Copy Markdown

@RobinAngele RobinAngele commented May 7, 2026

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
…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>
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>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Select all messages in mailbox

1 participant