{{#let (or @order @resource) as |resource|}}
    <Pill
        @resource={{resource}}
        @onClick={{@onClick}}
        @anchorClass={{@anchorClass}}
        @imageClass={{@imageClass}}
        @imageWrapperClass={{@imageWrapperClass}}
        @contentWrapperClass={{@contentWrapperClass}}
        @titleClass={{@titleClass}}
        @subtitleClass={{@subtitleClass}}
        ...attributes
    >
        <:image>
            <div class="pt-1">
                <div class="rounded-md bg-white p-1">
                    <img src={{concat "data:image/png;base64," resource.tracking_number.qr_code}} class="w-12 h-12" alt={{resource.public_id}} />
                </div>
            </div>
        </:image>
        <:default>
            <div class="text-sm font-semibold">{{n-a resource.tracking}}</div>
            <div class="flex flex-row space-x-1">
                <Badge @status={{@resource.status}} />
                {{#if @resource.dispatched_at}}
                    <Badge @status="dispatched">{{concat "Dispatched at " @resource.dispatchedAt}}</Badge>
                {{/if}}
            </div>
            <div class="mt-1">
                <div class="text-xs text-gray-400 dark:text-gray-500">Date Created: {{@resource.createdAt}}</div>
                <div class="text-xs text-gray-400 dark:text-gray-500">Type: {{smart-humanize @resource.type}}</div>
            </div>
        </:default>
    </Pill>
{{/let}}