local-it/mitgliederverwaltung
2
3
Fork 0
Code Issues 66 Pull requests 6 Projects 3 Releases Packages 1 Activity Actions

UI for adding and removing members on the group show page #401

Open
simon wants to merge 5 commits from feature/ui-for-adding-members-groups into main
pull from: feature/ui-for-adding-members-groups
merge into: local-it:main
Conversation 0 Commits 5 Files changed 12 +3057 -3
simon commented 2026-02-03 15:21:52 +01:00
Owner
Copy link

Description of the implemented changes

The changes were:

  • Bugfixing
  • New Feature
  • Breaking Change
  • Refactoring

UI for adding and removing members on the group show page. Members can be added via an inline search (combobox) and removed via a per-row action; authorization and accessibility are covered.

What has been changed?

Group show page (lib/mv_web/live/group_live/show.ex)

  • Add members: Inline “Add Member” area with search input (debounced), dropdown of available members (filtered by search, excluding current group members), multi-select and “Add members” button. Uses search_members, select_member, add_selected_members and related state.
  • Remove member: Per-row “Remove” button (trash icon) with confirmation; remove_member event and server-side authorization.
  • State: available_members, selected_member_ids / selected_members, member_search_query, show_member_dropdown, focused_member_index for combobox behaviour.
  • Logic: load_available_members (with available_members_base_query and group_member_ids_set helpers to keep complexity and length/1 usage in check), perform_add_members, group reload after add/remove.

Documentation

  • docs/groups-architecture.md: Updated to reflect the new add/remove member UI and behaviour.

Internationalisation

  • priv/gettext: New/updated strings for add member, search placeholder, remove, and related labels (EN/DE).

Tests

  • show_add_member_test.exs: Add member flow, validation, error handling.
  • show_remove_member_test.exs: Remove member flow and confirmation.
  • show_add_remove_members_test.exs: Combined add/remove scenarios.
  • show_member_search_test.exs: Search, dropdown, filtering (members already in group not shown in dropdown); assertions limited to #member-dropdown where relevant.
  • show_authorization_test.exs: Permission checks for add/remove (admin vs read-only).
  • show_accessibility_test.exs: ARIA, keyboard, focus, labels for new controls.
  • show_integration_test.exs: End-to-end group show behaviour.
  • Other: Removed unused Member alias and fixed unused variable warnings in several test files; user_live/index_test.exs and show_authorization_test.exs unused variable fixes.

Definition of Done

Code Quality

  • No new technical depths
  • Linting passed
  • Documentation is added were needed

Accessibility

  • New elements are properly defined with html-tags
  • Colour contrast follows WCAG criteria
  • Aria labels are added when needed
  • Everything is accessible by keyboard
  • Tab-Order is comprehensible
  • All interactive elements have a visible focus

Testing

  • Tests for new code are written
  • All tests pass
  • axe-core dev tools show no critical or major issues

Additional Notes

  • Add/remove actions are gated by existing group permissions (e.g. admin for add/remove).
  • Member search uses the existing Member :search action; results are filtered client-side so current group members do not appear in the dropdown.
  • When there are no available members (e.g. all matching members already in the group), the dropdown is not rendered (length(@available_members) == 0).
## Description of the implemented changes The changes were: - [ ] Bugfixing - [x] New Feature - [ ] Breaking Change - [ ] Refactoring **UI for adding and removing members on the group show page.** Members can be added via an inline search (combobox) and removed via a per-row action; authorization and accessibility are covered. --- ## What has been changed? ### Group show page (`lib/mv_web/live/group_live/show.ex`) - **Add members:** Inline “Add Member” area with search input (debounced), dropdown of available members (filtered by search, excluding current group members), multi-select and “Add members” button. Uses `search_members`, `select_member`, `add_selected_members` and related state. - **Remove member:** Per-row “Remove” button (trash icon) with confirmation; `remove_member` event and server-side authorization. - **State:** `available_members`, `selected_member_ids` / `selected_members`, `member_search_query`, `show_member_dropdown`, `focused_member_index` for combobox behaviour. - **Logic:** `load_available_members` (with `available_members_base_query` and `group_member_ids_set` helpers to keep complexity and `length/1` usage in check), `perform_add_members`, group reload after add/remove. ### Documentation - **docs/groups-architecture.md:** Updated to reflect the new add/remove member UI and behaviour. ### Internationalisation - **priv/gettext:** New/updated strings for add member, search placeholder, remove, and related labels (EN/DE). ### Tests - **show_add_member_test.exs:** Add member flow, validation, error handling. - **show_remove_member_test.exs:** Remove member flow and confirmation. - **show_add_remove_members_test.exs:** Combined add/remove scenarios. - **show_member_search_test.exs:** Search, dropdown, filtering (members already in group not shown in dropdown); assertions limited to `#member-dropdown` where relevant. - **show_authorization_test.exs:** Permission checks for add/remove (admin vs read-only). - **show_accessibility_test.exs:** ARIA, keyboard, focus, labels for new controls. - **show_integration_test.exs:** End-to-end group show behaviour. - **Other:** Removed unused `Member` alias and fixed unused variable warnings in several test files; `user_live/index_test.exs` and `show_authorization_test.exs` unused variable fixes. --- ## Definition of Done ### Code Quality - [x] No new technical depths - [x] Linting passed - [ ] Documentation is added were needed ### Accessibility - [x] New elements are properly defined with html-tags - [x] Colour contrast follows WCAG criteria - [x] Aria labels are added when needed - [x] Everything is accessible by keyboard - [x] Tab-Order is comprehensible - [x] All interactive elements have a visible focus ### Testing - [x] Tests for new code are written - [x] All tests pass - [x] axe-core dev tools show no critical or major issues --- ## Additional Notes - Add/remove actions are gated by existing group permissions (e.g. admin for add/remove). - Member search uses the existing Member `:search` action; results are filtered client-side so current group members do not appear in the dropdown. - When there are no available members (e.g. all matching members already in the group), the dropdown is not rendered (`length(@available_members) == 0`).
simon added 3 commits 2026-02-03 15:21:53 +01:00
test: add tdd tests for group member add functionality
Some checks failed
continuous-integration/drone/push Build is failing
Details
a536485b30
feat: add ui to add members to groups
All checks were successful
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/promote/production Build is passing
Details
7f001c55c5
simon added 2 commits 2026-02-03 16:31:11 +01:00
fix: failing test due to merge
Some checks failed
continuous-integration/drone/push Build is failing
Details
continuous-integration/drone/promote/production Build is passing
Details
e4671e816b
Some checks failed
continuous-integration/drone/push Build is failing
Details
continuous-integration/drone/promote/production Build is passing
Required
Details
This pull request has changes conflicting with the target branch.
  • priv/gettext/de/LC_MESSAGES/default.po
  • priv/gettext/default.pot
View command line instructions

Checkout

From your project repository, check out a new branch and test the changes.
git fetch -u origin feature/ui-for-adding-members-groups:feature/ui-for-adding-members-groups
git checkout feature/ui-for-adding-members-groups
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels   
bug

Something is not working

  
duplicate

This issue or pull request already exists

  
enhancement

New feature

  
help wanted

Need some help

  
high priority

   
invalid

Something is wrong

  
L

5 h

  
low priority

   
M

3 h

  
medium priority

   
needs refinement

   
optional

   
question

More information is needed

  
S

1 h

  
UX research

   
wontfix

This won't be fixed

No labels
bug
duplicate
enhancement
help wanted
high priority
invalid
L
low priority
M
medium priority
needs refinement
optional
question
S
UX research
wontfix
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference: local-it/mitgliederverwaltung#401
No description provided.
Delete branch "feature/ui-for-adding-members-groups"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?