Ai Approval Request code

@props([
    'action' => '#',
    'method' => 'POST',
    'title' => 'Approve this change?',
    'description' => null,
    'requestId' => null,
    'requestIdName' => 'approval_id',
    'approveLabel' => 'Approve',
    'rejectLabel' => 'Reject',
    'approveValue' => 'approve',
    'rejectValue' => 'reject',
    'decisionName' => 'decision',
])

@php
    /*
    | Pending approval card for ask-first agent workflows.
    |
    | Usage:
    |   <x-ui.ai-approval-request
    |       title="Run php artisan test?"
    |       description="The agent wants to verify the workflow suite."
    |       request-id="apr_123"
    |   >
    |       <x-slot:preview>php artisan test --compact</x-slot:preview>
    |   </x-ui.ai-approval-request>
    */
    $httpMethod = strtoupper($method);
    $formMethod = in_array($httpMethod, ['GET', 'POST'], true) ? $httpMethod : 'POST';
    $usesMethodSpoofing = ! in_array($httpMethod, ['GET', 'POST'], true);
@endphp

<form
    method="{{ $formMethod }}"
    action="{{ $action }}"
    {{ $attributes->merge(['class' => 'min-w-0 overflow-hidden rounded-2xl border border-amber-200 bg-white shadow-sm dark:border-amber-900/60 dark:bg-gray-900']) }}
>
    @if ($usesMethodSpoofing)
        @method($httpMethod)
    @endif

    @csrf

    @if ($requestId)
        <input type="hidden" name="{{ $requestIdName }}" value="{{ $requestId }}">
    @endif

    <div class="border-b border-amber-100 px-4 py-4 dark:border-amber-900/40 sm:px-5">
        <p class="break-words text-sm font-semibold text-gray-900 dark:text-white">{{ $title }}</p>
        @if ($description)
            <p class="mt-1 break-words text-sm leading-6 text-gray-600 dark:text-gray-400">{{ $description }}</p>
        @endif
    </div>

    @isset($preview)
        <div class="border-b border-gray-200 bg-gray-50 px-4 py-3 dark:border-gray-800 dark:bg-gray-950 sm:px-5">
            <p class="mb-2 text-xs font-medium uppercase tracking-wide text-gray-500 dark:text-gray-400">Preview</p>
            <div class="text-sm text-gray-800 dark:text-gray-200">{{ $preview }}</div>
        </div>
    @endif

    @if (trim($slot) !== '')
        <div class="border-b border-gray-200 px-4 py-3 dark:border-gray-800 sm:px-5">{{ $slot }}</div>
    @endif

    <div class="flex flex-col-reverse gap-2 px-4 py-3 sm:flex-row sm:justify-end sm:gap-3 sm:px-5">
        <x-ui.button type="submit" name="{{ $decisionName }}" value="{{ $rejectValue }}" variant="outline" size="sm" class="w-full sm:w-auto">
            {{ $rejectLabel }}
        </x-ui.button>
        <x-ui.button type="submit" name="{{ $decisionName }}" value="{{ $approveValue }}" size="sm" class="w-full sm:w-auto">
            {{ $approveLabel }}
        </x-ui.button>
    </div>
</form>