Forge Daemon Card code

@props([
    'name',
    'command',
    'user' => 'forge',
    'processes' => 1,
    'status' => 'Running',
    'statusVariant' => 'green',
    'directory' => null,
    'restartCommand' => null,
    'logPath' => null,
])

@php
    /*
    | Supervisor daemon card for long-running Forge background processes.
    | Includes command, user, process count, working directory and log location.
    |
    | Usage:
    |   <x-ui.forge-daemon-card name="Reverb" command="php artisan reverb:start" />
    */
    $highlightShell = function (string $line): \Illuminate\Support\HtmlString {
        $escaped = e($line);
        $escaped = preg_replace('/(&quot;.*?&quot;|&#039;.*?&#039;)/', '<span class="tok-str">$1</span>', $escaped) ?? $escaped;
        $escaped = preg_replace('/(\$[A-Z_]+(?:\(\))?)/', '<span class="tok-var">$1</span>', $escaped) ?? $escaped;
        $escaped = preg_replace('/(^|\s)(php|composer|npm|git|sudo|cd|echo|curl|forge)(?=\s|$)/', '$1<span class="tok-fn">$2</span>', $escaped) ?? $escaped;
        $escaped = preg_replace('/(\s--?[A-Za-z0-9][A-Za-z0-9-]*)/', '<span class="tok-key">$1</span>', $escaped) ?? $escaped;
        $escaped = preg_replace('/(\b\d+(?:\.\d+)?\b)/', '<span class="tok-num">$1</span>', $escaped) ?? $escaped;

        return new \Illuminate\Support\HtmlString($escaped);
    };
@endphp

<article {{ $attributes->merge(['class' => 'min-w-0 rounded-xl border border-gray-200 bg-white p-5 shadow-sm dark:border-gray-800 dark:bg-gray-900']) }}>
    <div class="flex 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-sm font-semibold text-gray-900 dark:text-white">{{ $name }}</p>
            <p class="mt-1 truncate text-xs text-gray-500 dark:text-gray-400">Runs as {{ $user }} with {{ $processes }} {{ Str::plural('process', (int) $processes) }}</p>
        </div>

        <x-ui.badge :variant="$statusVariant" size="sm" dot>{{ $status }}</x-ui.badge>
    </div>

    <pre class="mt-4 max-w-full overflow-x-auto rounded-lg bg-gray-950 px-3 py-2 font-mono text-xs leading-6 text-gray-200 [&_.tok-key]:text-brand-300 [&_.tok-fn]:text-amber-300 [&_.tok-str]:text-green-300 [&_.tok-num]:text-amber-200 [&_.tok-var]:text-gray-100"><code>{!! $highlightShell($command) !!}</code></pre>

    <x-ui.status-bar class="mt-4" :items="array_values(array_filter([
        $directory ? ['icon' => 'folder-open', 'label' => 'Directory', 'value' => $directory] : null,
        $logPath ? ['icon' => 'file-text', 'label' => 'Log', 'value' => $logPath] : null,
        $restartCommand ? ['icon' => 'arrows-clockwise', 'label' => 'Restart', 'value' => $restartCommand] : null,
    ]))" />
</article>