@props(['type', 'id', 'model' => null, 'label' => false])

@php
    $marked = auth()->check() && $model && auth()->user()->hasBookmarked($model);
@endphp

@auth
<form method="POST" action="{{ route('bookmark.toggle', [$type, $id]) }}" class="inline">
    @csrf
    <button type="submit"
        class="inline-flex items-center gap-2 rounded-full px-3 py-2 text-sm font-semibold transition
               {{ $marked ? 'bg-primary/15 text-primary' : 'bg-ink/5 text-muted hover:text-ink' }}"
        aria-label="{{ $marked ? 'Hapus dari Daftar Saya' : 'Simpan ke Daftar Saya' }}">
        <x-icon name="bookmark" class="w-5 h-5" :fill="$marked"/>
        @if($label)<span>{{ $marked ? 'Tersimpan' : 'Simpan' }}</span>@endif
    </button>
</form>
@else
<a href="{{ route('login') }}" class="inline-flex items-center gap-2 rounded-full bg-ink/5 px-3 py-2 text-sm font-semibold text-muted hover:text-ink">
    <x-icon name="bookmark" class="w-5 h-5"/>@if($label)<span>Simpan</span>@endif
</a>
@endauth