Infrastructure
Forge Site Card code
Copy the implementation or inspect every file that belongs to this component unit.
resources/views/components/ui/forge-site-card.blade.php
@props([
'domain',
'forgeDomain' => null,
'repository' => null,
'branch' => null,
'php' => null,
'status' => 'Live',
'statusVariant' => 'green',
'sslStatus' => null,
'deployStatus' => null,
'deployVariant' => 'brand',
'href' => null,
'stats' => [],
])
@php
/*
| Site summary card for Forge dashboards. Combines domain, source-control,
| PHP, SSL and last-deploy metadata into one compact destination card.
|
| Usage:
| <x-ui.forge-site-card domain="app.example.com" repository="acme/app" branch="main" />
*/
$stats = collect($stats)->filter(fn (array $stat): bool => filled($stat['label'] ?? null))->values();
$classes = 'block min-w-0 rounded-xl border border-gray-200 bg-white p-5 shadow-sm transition dark:border-gray-800 dark:bg-gray-900';
@endphp
@if ($href)
<a href="{{ $href }}" {{ $attributes->merge(['class' => $classes.' hover:border-brand-300 hover:bg-gray-50 dark:hover:border-brand-800 dark:hover:bg-gray-900/70']) }}>
@else
<article {{ $attributes->merge(['class' => $classes]) }}>
@endif
<div class="flex min-w-0 flex-col gap-3 sm:flex-row sm:items-start sm:justify-between sm:gap-4">
<div class="min-w-0">
<p class="truncate text-base font-semibold text-gray-900 dark:text-white">{{ $domain }}</p>
@if ($forgeDomain)
<p class="mt-1 truncate text-xs text-gray-500 dark:text-gray-400">{{ $forgeDomain }}</p>
@endif
</div>
<x-ui.badge :variant="$statusVariant" size="sm" dot class="w-fit sm:shrink-0">{{ $status }}</x-ui.badge>
</div>
<x-ui.status-bar class="mt-4" :items="array_values(array_filter([
$repository ? ['icon' => 'git-branch', 'label' => 'Repo', 'value' => $repository] : null,
$branch ? ['icon' => 'tree-structure', 'label' => 'Branch', 'value' => $branch] : null,
$php ? ['icon' => 'code', 'label' => 'PHP', 'value' => $php] : null,
]))" />
<div class="mt-5 flex flex-wrap items-center gap-2">
@if ($sslStatus)
<x-ui.badge variant="green" size="sm" icon="lock-key">{{ $sslStatus }}</x-ui.badge>
@endif
@if ($deployStatus)
<x-ui.badge :variant="$deployVariant" size="sm" icon="rocket-launch">{{ $deployStatus }}</x-ui.badge>
@endif
</div>
@if ($stats->isNotEmpty())
<dl class="mt-5 grid grid-cols-2 gap-3 border-t border-gray-100 pt-4 dark:border-gray-800 sm:grid-cols-4">
@foreach ($stats as $stat)
<div class="min-w-0">
<dt class="truncate text-xs text-gray-500 dark:text-gray-400">{{ $stat['label'] }}</dt>
<dd class="mt-1 truncate text-sm font-semibold tabular-nums text-gray-900 dark:text-white">{{ $stat['value'] ?? '0' }}</dd>
</div>
@endforeach
</dl>
@endif
@if ($href)
</a>
@else
</article>
@endif