<Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
    <div class="modal-body-container">
        <div class="mb-4 rounded-md border border-gray-200 bg-gray-50 p-3 dark:border-gray-700 dark:bg-gray-800">
            <div class="text-xs font-semibold uppercase text-gray-500 dark:text-gray-400">{{@options.subjectLabel}}</div>
            <div class="mt-1 text-sm font-semibold text-gray-900 dark:text-gray-100">{{@options.subjectName}}</div>
            <div class="mt-1 text-xs text-gray-500 dark:text-gray-400">{{t "modals.assigned-orders.help-text" count=@options.orders.length}}</div>
        </div>

        <div class="space-y-2">
            {{#each @options.orders as |order|}}
                <div class="rounded-md border border-gray-200 p-3 dark:border-gray-700">
                    <div class="flex items-start gap-3">
                        <Checkbox
                            @value={{includes order.id @options.selectedOrderIds}}
                            @onToggle={{fn @options.toggleOrder order}}
                            @alignItems="center"
                            @labelClass="mb-0i"
                        />
                        <div class="min-w-0 flex-1">
                            <div class="flex items-center justify-between gap-2">
                                <div class="truncate text-sm font-semibold text-gray-900 dark:text-gray-100">
                                    {{or order.tracking order.public_id order.id}}
                                </div>
                                <div class="flex shrink-0 items-center gap-1">
                                    {{#if order.is_current_job}}
                                        <Badge @hideStatusDot={{true}} @status="info">{{t "common.current-job"}}</Badge>
                                    {{/if}}
                                    <Badge @hideStatusDot={{true}} @status={{order.status}} />
                                </div>
                            </div>
                            <div class="mt-1 truncate text-xs text-gray-500 dark:text-gray-400">
                                {{or order.internal_id order.public_id}}
                            </div>
                        </div>
                    </div>
                </div>
            {{/each}}
        </div>
    </div>
</Modal::Default>
