@props(['deal_id' => '', 'deal_title' => '', 'like' => false, 'favourite' => false])
<div class="action-toolbar" data-deal-title="{{$deal_title}}">
    <x-ui.button-sm @class(["text-accent-600 likeBtn", 'liked' => $like])>
        <x-heroicon-o-heart
            @class([
               "like w-4",
               'hidden' => $like
            ])
        />
        <x-heroicon-s-heart
            @class([
               "like active w-4 text-red-500",
               'hidden' => !$like
            ])
        />
    </x-ui.button-sm>

    <x-ui.button-sm class="text-accent-600 favoriteBtn">
        <x-heroicon-o-star
            @class([
               "favorite w-4",
               'hidden' => $favourite
            ])
        />

        <x-heroicon-s-star
            @class([
               "favorite active w-4 text-yellow-500",
               'hidden' => !$favourite
            ])
        />

    </x-ui.button-sm>

    <x-ui.button-sm class="text-accent-600 reportBtn">
        <x-heroicon-o-exclamation-circle class="w-4"/>
    </x-ui.button-sm>
</div>