feat(ui): Add color coding to all status badges
Improved visual clarity for all status fields: - Tenant status: active=green, inactive=gray, suspended=warning, error=red - App status: ok/configured=green, pending=warning, error=red, requires_consent=warning - RBAC status: ok/configured=green, manual_assignment_required=warning, error/failed=red - Permission status: granted=green, missing=orange, error=red (from previous commit) - Canaries: ok=green badge, error=red badge, pending=yellow badge All status badges now use consistent color coding across the application for better UX and faster status recognition.
This commit is contained in:
parent
a25d413d79
commit
76f70ef79b
@ -248,12 +248,37 @@ public static function infolist(Schema $schema): Schema
|
|||||||
Infolists\Components\TextEntry::make('tenant_id')->label('Tenant ID')->copyable(),
|
Infolists\Components\TextEntry::make('tenant_id')->label('Tenant ID')->copyable(),
|
||||||
Infolists\Components\TextEntry::make('domain')->copyable(),
|
Infolists\Components\TextEntry::make('domain')->copyable(),
|
||||||
Infolists\Components\TextEntry::make('app_client_id')->label('App Client ID')->copyable(),
|
Infolists\Components\TextEntry::make('app_client_id')->label('App Client ID')->copyable(),
|
||||||
Infolists\Components\TextEntry::make('status')->badge(),
|
Infolists\Components\TextEntry::make('status')
|
||||||
Infolists\Components\TextEntry::make('app_status')->badge(),
|
->badge()
|
||||||
|
->color(fn (string $state): string => match ($state) {
|
||||||
|
'active' => 'success',
|
||||||
|
'inactive' => 'gray',
|
||||||
|
'suspended' => 'warning',
|
||||||
|
'error' => 'danger',
|
||||||
|
default => 'gray',
|
||||||
|
}),
|
||||||
|
Infolists\Components\TextEntry::make('app_status')
|
||||||
|
->badge()
|
||||||
|
->color(fn (string $state): string => match ($state) {
|
||||||
|
'ok', 'configured' => 'success',
|
||||||
|
'pending' => 'warning',
|
||||||
|
'error' => 'danger',
|
||||||
|
'requires_consent' => 'warning',
|
||||||
|
default => 'gray',
|
||||||
|
}),
|
||||||
Infolists\Components\TextEntry::make('app_notes')->label('Notes'),
|
Infolists\Components\TextEntry::make('app_notes')->label('Notes'),
|
||||||
Infolists\Components\TextEntry::make('created_at')->dateTime(),
|
Infolists\Components\TextEntry::make('created_at')->dateTime(),
|
||||||
Infolists\Components\TextEntry::make('updated_at')->dateTime(),
|
Infolists\Components\TextEntry::make('updated_at')->dateTime(),
|
||||||
Infolists\Components\TextEntry::make('rbac_status')->label('RBAC status')->badge(),
|
Infolists\Components\TextEntry::make('rbac_status')
|
||||||
|
->label('RBAC status')
|
||||||
|
->badge()
|
||||||
|
->color(fn (string $state): string => match ($state) {
|
||||||
|
'ok', 'configured' => 'success',
|
||||||
|
'manual_assignment_required' => 'warning',
|
||||||
|
'error', 'failed' => 'danger',
|
||||||
|
'not_configured' => 'gray',
|
||||||
|
default => 'gray',
|
||||||
|
}),
|
||||||
Infolists\Components\TextEntry::make('rbac_status_reason')->label('RBAC reason'),
|
Infolists\Components\TextEntry::make('rbac_status_reason')->label('RBAC reason'),
|
||||||
Infolists\Components\TextEntry::make('rbac_last_checked_at')->label('RBAC last checked')->since(),
|
Infolists\Components\TextEntry::make('rbac_last_checked_at')->label('RBAC last checked')->since(),
|
||||||
Infolists\Components\TextEntry::make('rbac_role_display_name')->label('RBAC role'),
|
Infolists\Components\TextEntry::make('rbac_role_display_name')->label('RBAC role'),
|
||||||
|
|||||||
@ -48,11 +48,18 @@
|
|||||||
@if (empty($canaries))
|
@if (empty($canaries))
|
||||||
<div class="text-sm text-gray-700">No canary results recorded.</div>
|
<div class="text-sm text-gray-700">No canary results recorded.</div>
|
||||||
@else
|
@else
|
||||||
<ul class="space-y-1 text-sm text-gray-800">
|
<ul class="space-y-1 text-sm">
|
||||||
@foreach ($canaries as $key => $status)
|
@foreach ($canaries as $key => $status)
|
||||||
<li>
|
<li class="flex items-center gap-2">
|
||||||
<span class="font-semibold">{{ $key }}:</span>
|
<span class="font-semibold text-gray-800">{{ $key }}:</span>
|
||||||
<span class="{{ $status === 'ok' ? 'text-green-700' : 'text-amber-700' }}">{{ $status }}</span>
|
<span class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium
|
||||||
|
{{ $status === 'ok' ? 'bg-green-100 text-green-700' : '' }}
|
||||||
|
{{ $status === 'error' ? 'bg-red-100 text-red-700' : '' }}
|
||||||
|
{{ $status === 'pending' ? 'bg-yellow-100 text-yellow-700' : '' }}
|
||||||
|
{{ !in_array($status, ['ok', 'error', 'pending']) ? 'bg-gray-100 text-gray-700' : '' }}
|
||||||
|
">
|
||||||
|
{{ $status }}
|
||||||
|
</span>
|
||||||
</li>
|
</li>
|
||||||
@endforeach
|
@endforeach
|
||||||
</ul>
|
</ul>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user