From 43868917168f6f4bdeaa42bec10685c84e35c0e6 Mon Sep 17 00:00:00 2001
From: worldwidepixel <58098422+worldwidepixel@users.noreply.github.com>
Date: Wed, 11 Jun 2025 15:24:04 -0700
Subject: [PATCH] feat(frontend): Organisations are now sorted alphabetically
 in dashboard and on user pages (#3755)

* feat: Organisations are now sorted alphabetically in dashboard and on user pages

* Use computed ref

---------

Co-authored-by: Prospector <prospectordev@gmail.com>
Co-authored-by: Prospector <6166773+Prospector@users.noreply.github.com>
---
 apps/frontend/src/pages/dashboard/organizations.vue | 4 +++-
 apps/frontend/src/pages/user/[id].vue               | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/apps/frontend/src/pages/dashboard/organizations.vue b/apps/frontend/src/pages/dashboard/organizations.vue
index 168e688e0..38eecc9e0 100644
--- a/apps/frontend/src/pages/dashboard/organizations.vue
+++ b/apps/frontend/src/pages/dashboard/organizations.vue
@@ -14,7 +14,7 @@
       <template v-if="orgs?.length > 0">
         <div class="orgs-grid">
           <nuxt-link
-            v-for="org in orgs"
+            v-for="org in sortedOrgs"
             :key="org.id"
             :to="`/organization/${org.slug}`"
             class="universal-card button-base recessed org"
@@ -67,6 +67,8 @@ const { data: orgs, error } = useAsyncData("organizations", () => {
   });
 });
 
+const sortedOrgs = computed(() => orgs.value.sort((a, b) => a.name.localeCompare(b.name)));
+
 const onlyAcceptedMembers = (members) => members.filter((member) => member?.accepted);
 
 if (error.value) {
diff --git a/apps/frontend/src/pages/user/[id].vue b/apps/frontend/src/pages/user/[id].vue
index d54a38ed0..11f567866 100644
--- a/apps/frontend/src/pages/user/[id].vue
+++ b/apps/frontend/src/pages/user/[id].vue
@@ -303,7 +303,7 @@
           <h2 class="text-lg text-contrast">{{ formatMessage(messages.profileOrganizations) }}</h2>
           <div class="flex flex-wrap gap-2">
             <nuxt-link
-              v-for="org in organizations"
+              v-for="org in sortedOrgs"
               :key="org.id"
               v-tooltip="org.name"
               class="organization"
@@ -516,6 +516,8 @@ try {
   });
 }
 
+const sortedOrgs = computed(() => organizations.value.sort((a, b) => a.name.localeCompare(b.name)));
+
 if (!user.value) {
   throw createError({
     fatal: true,