From 89ae246f85abc0b15b3d94265aa9976e5e5d05a1 Mon Sep 17 00:00:00 2001
From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com>
Date: Thu, 20 Aug 2026 19:40:12 +0200
Subject: [PATCH] Task/improve sorting in account selector component (#7670)

* Improve sorting

* Update changelog
---
 CHANGELOG.md                                              | 6 ++++++
 .../lib/account-selector/account-selector.component.html  | 2 +-
 .../lib/account-selector/account-selector.component.ts    | 8 ++++++++
 3 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index eb7b34022..31ebe5ce2 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## Unreleased
+
+### Changed
+
+- Improved the sorting to be case-insensitive in the account selector component
+
 ## 3.55.0 - 2026-08-19
 
 ### Added
diff --git a/libs/ui/src/lib/account-selector/account-selector.component.html b/libs/ui/src/lib/account-selector/account-selector.component.html
index 3fd21e58a..0ba679706 100644
--- a/libs/ui/src/lib/account-selector/account-selector.component.html
+++ b/libs/ui/src/lib/account-selector/account-selector.component.html
@@ -28,7 +28,7 @@
       <mat-option [value]="null" />
     }
 
-    @for (account of accounts(); track account.id) {
+    @for (account of sortedAccounts(); track account.id) {
       <mat-option [value]="account.id">
         <div class="d-flex">
           <gf-entity-logo
diff --git a/libs/ui/src/lib/account-selector/account-selector.component.ts b/libs/ui/src/lib/account-selector/account-selector.component.ts
index 819abbf92..06c179108 100644
--- a/libs/ui/src/lib/account-selector/account-selector.component.ts
+++ b/libs/ui/src/lib/account-selector/account-selector.component.ts
@@ -61,6 +61,14 @@ export class GfAccountSelectorComponent
     });
   });
 
+  public readonly sortedAccounts = computed(() => {
+    return [...this.accounts()].sort((a, b) => {
+      return (a.name ?? '')
+        .toLowerCase()
+        .localeCompare((b.name ?? '').toLowerCase());
+    });
+  });
+
   private readonly ngControl = inject(NgControl, {
     optional: true,
     self: true