From c77f78402142942f560ef05c1c703518fdd551c9 Mon Sep 17 00:00:00 2001
From: Alexander Schreiner <github@alexander-schreiner.de>
Date: Sat, 9 May 2026 18:14:38 +0200
Subject: [PATCH] feat: allow sorting of candidates within
 assignment-detail-component

Signed-off-by: Alexander Schreiner <github@alexander-schreiner.de>
---
 .../assignment-detail.component.html          | 34 +++++++++++++++++++
 .../assignment-detail.component.ts            | 28 +++++++++++++++
 2 files changed, 62 insertions(+)

diff --git a/client/src/app/site/pages/meetings/pages/assignments/pages/assignment-detail/components/assignment-detail/assignment-detail.component.html b/client/src/app/site/pages/meetings/pages/assignments/pages/assignment-detail/components/assignment-detail/assignment-detail.component.html
index 552488a11c..547c79f6ed 100644
--- a/client/src/app/site/pages/meetings/pages/assignments/pages/assignment-detail/components/assignment-detail/assignment-detail.component.html
+++ b/client/src/app/site/pages/meetings/pages/assignments/pages/assignment-detail/components/assignment-detail/assignment-detail.component.html
@@ -173,6 +173,40 @@ <h3>{{ 'Candidates' | translate }}</h3>
                     <div>
                         @if (assignment?.candidates?.length) {
                             <div class="candidates-list">
+                                @if (assignmentCandidates.length > 1) {
+                                    <div class="candidate-sorting-button margin-bottom-5">
+                                        <button mat-button [matMenuTriggerFor]="sortMenu">
+                                            <mat-icon>sort</mat-icon>
+                                            {{ 'Sort' | translate }}
+                                        </button>
+                                        <mat-menu #sortMenu="matMenu">
+                                            <button mat-menu-item (click)="sortCandidates('first_name')">
+                                                <mat-icon>
+                                                    {{
+                                                        currentSort === 'first_name'
+                                                            ? sortAscending
+                                                                ? 'arrow_upward'
+                                                                : 'arrow_downward'
+                                                            : ''
+                                                    }}
+                                                </mat-icon>
+                                                <span>{{ 'Given name' | translate }}</span>
+                                            </button>
+                                            <button mat-menu-item (click)="sortCandidates('last_name')">
+                                                <mat-icon>
+                                                    {{
+                                                        currentSort === 'last_name'
+                                                            ? sortAscending
+                                                                ? 'arrow_upward'
+                                                                : 'arrow_downward'
+                                                            : ''
+                                                    }}
+                                                </mat-icon>
+                                                <span>{{ 'Surname' | translate }}</span>
+                                            </button>
+                                        </mat-menu>
+                                    </div>
+                                }
                                 <os-sorting-list
                                     [count]="assignment.number_poll_candidates"
                                     [enable]="hasPerms('manage')"
diff --git a/client/src/app/site/pages/meetings/pages/assignments/pages/assignment-detail/components/assignment-detail/assignment-detail.component.ts b/client/src/app/site/pages/meetings/pages/assignments/pages/assignment-detail/components/assignment-detail/assignment-detail.component.ts
index 47c9551725..f3c8845f4e 100644
--- a/client/src/app/site/pages/meetings/pages/assignments/pages/assignment-detail/components/assignment-detail/assignment-detail.component.ts
+++ b/client/src/app/site/pages/meetings/pages/assignments/pages/assignment-detail/components/assignment-detail/assignment-detail.component.ts
@@ -24,6 +24,7 @@ import { UserControllerService } from 'src/app/site/services/user-controller.ser
 import { PromptService } from 'src/app/ui/modules/prompt-dialog';
 
 import { AgendaItemControllerService } from '../../../../../agenda/services/agenda-item-controller.service';
+import { getAssignmentDetailSubscriptionConfig } from '../../../../assignments.subscription';
 import { AssignmentPhases } from '../../../../definitions';
 import { AssignmentPollService } from '../../../../modules/assignment-poll/services/assignment-poll.service';
 import { AssignmentPollDialogService } from '../../../../modules/assignment-poll/services/assignment-poll-dialog.service';
@@ -72,6 +73,9 @@ export class AssignmentDetailComponent extends BaseMeetingComponent implements O
      */
     public candidateUserIds: number[] = [];
 
+    public currentSort: 'first_name' | 'last_name' = 'first_name';
+    public sortAscending = true;
+
     /**
      * Used for the search value selector
      */
@@ -119,6 +123,29 @@ export class AssignmentDetailComponent extends BaseMeetingComponent implements O
             : false;
     }
 
+    /**
+     * Sorts the assignment candidates by the given property. If the same property
+     * is already active, toggles the sort direction. Otherwise, sorts ascending.
+     *
+     * @param property The user name field to sort by
+     */
+    public async sortCandidates(property: 'first_name' | 'last_name'): Promise<void> {
+        if (this.currentSort === property) {
+            this.sortAscending = !this.sortAscending;
+        } else {
+            this.currentSort = property;
+            this.sortAscending = true;
+        }
+        const sorted = [...this.assignmentCandidates].sort((a, b) => {
+            const nameA = property === 'first_name' ? (a.user?.first_name ?? '') : (a.user?.last_name ?? '');
+            const nameB = property === 'first_name' ? (b.user?.first_name ?? '') : (b.user?.last_name ?? '');
+            const comparison = nameA.localeCompare(nameB);
+            return this.sortAscending ? comparison : -comparison;
+        });
+        this._assignmentCandidates = sorted;
+        await this.onSortingChange(sorted);
+    }
+
     /**
      * Checks if there are any tags available
      */
@@ -215,6 +242,7 @@ export class AssignmentDetailComponent extends BaseMeetingComponent implements O
                 }
             })
         );
+        this.modelRequestService.subscribeTo(getAssignmentDetailSubscriptionConfig(assignmentId));
     }
 
     /**