Colored badges for status

app/Enums/ClientStatus.php

@@ -6,4 +6,12 @@ enum ClientStatus: string
 {
     case ACTIVE = 'active';
     case INACTIVE = 'inactive';
+
+    public function color(): string
+    {
+        return match ($this) {
+            self::ACTIVE => 'green',
+            self::INACTIVE => 'zinc',
+        };
+    }
 }

resources/views/components/⚡client-list.blade.php

@@ -63,7 +63,9 @@ new class extends Component {
                     <flux:table.cell>{{ $client->abbreviation }}</flux:table.cell>
                     <flux:table.cell>{{ $client->audition_date->local()->format('m/d/Y') }}</flux:table.cell>
                     <flux:table.cell>
-                        {{ $client->status }}
+                        <flux:badge :color="$client->status->color()">
+                            {{ $client->status->value }}
+                        </flux:badge>
                     </flux:table.cell>
                     <flux:table.cell>{{ $client->created_at->local()->format('m/d/Y | g:i A') }}</flux:table.cell>
                 </flux:table.row>