From c7dd6aa59cf16d8bb0f7f5647a2350c26787f0d6 Mon Sep 17 00:00:00 2001
From: "bert.hausmans" <bert@hausmans.nl>
Date: Wed, 15 Apr 2026 01:15:16 +0200
Subject: [PATCH] fix: slug in parentheses, capitalize status, lighter
 timestamps, rename button

Both organisation pages: slug wrapped in parentheses, billing status
label capitalized, timestamps use text-disabled for lighter appearance,
edit button labeled "Bewerken" consistently.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 apps/app/src/pages/organisation/index.vue          | 8 ++++----
 apps/app/src/pages/platform/organisations/[id].vue | 4 ++--
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/apps/app/src/pages/organisation/index.vue b/apps/app/src/pages/organisation/index.vue
index 8920ad99..f8509210 100644
--- a/apps/app/src/pages/organisation/index.vue
+++ b/apps/app/src/pages/organisation/index.vue
@@ -225,16 +225,16 @@ function confirmRevokeInvitation() {
           <div class="d-flex align-center gap-x-2">
             <h4 class="text-h4">
               {{ organisation.name }}
-              <span class="text-body-2 text-medium-emphasis font-weight-regular ms-2">{{ organisation.slug }}</span>
+              <span class="text-body-2 text-medium-emphasis font-weight-regular ms-2">({{ organisation.slug }})</span>
             </h4>
             <VChip
               :color="statusColor[organisation.billing_status]"
               size="small"
             >
-              {{ organisation.billing_status }}
+              {{ organisation.billing_status.charAt(0).toUpperCase() + organisation.billing_status.slice(1) }}
             </VChip>
           </div>
-          <span class="text-caption text-medium-emphasis">
+          <span class="text-caption text-disabled">
             Aangemaakt op {{ formatDate(organisation.created_at) }}
             &middot; Gewijzigd op {{ formatDate(organisation.updated_at) }}
           </span>
@@ -244,7 +244,7 @@ function confirmRevokeInvitation() {
           prepend-icon="tabler-edit"
           @click="isEditDialogOpen = true"
         >
-          Naam bewerken
+          Bewerken
         </VBtn>
       </div>
 
diff --git a/apps/app/src/pages/platform/organisations/[id].vue b/apps/app/src/pages/platform/organisations/[id].vue
index 1f683f82..106513ca 100644
--- a/apps/app/src/pages/platform/organisations/[id].vue
+++ b/apps/app/src/pages/platform/organisations/[id].vue
@@ -243,7 +243,7 @@ function formatDate(iso: string): string {
             <div class="d-flex align-center gap-x-2">
               <h4 class="text-h4">
                 {{ org.name }}
-                <span class="text-body-2 text-medium-emphasis font-weight-regular ms-2">{{ org.slug }}</span>
+                <span class="text-body-2 text-medium-emphasis font-weight-regular ms-2">({{ org.slug }})</span>
               </h4>
               <VChip
                 :color="billingStatusColor[org.billing_status]"
@@ -252,7 +252,7 @@ function formatDate(iso: string): string {
                 {{ org.billing_status_label ?? org.billing_status }}
               </VChip>
             </div>
-            <span class="text-caption text-medium-emphasis">
+            <span class="text-caption text-disabled">
               Aangemaakt op {{ formatDate(org.created_at) }}
               &middot; Gewijzigd op {{ formatDate(org.updated_at) }}
             </span>