@props(['type', 'record', 'notes'])
@can('notes.create')
<form method="POST" action="{{ route('app.notes.store', [$type, $record->public_id]) }}" style="margin-bottom:18px">
    @csrf
    <x-field name="body" type="textarea" placeholder="Add a note" required />
    <div class="row">
        <button class="btn primary small" type="submit">Add note</button>
        <label class="check" style="margin:0"><input type="checkbox" name="is_pinned" value="1"> <span>Pin to the top</span></label>
    </div>
</form>
@endcan

@forelse ($notes as $note)
    <div style="padding:12px 0;border-top:1px solid var(--line)">
        <div style="white-space:pre-wrap;color:var(--ink-900)">{{ $note->body }}</div>
        <div class="row between" style="margin-top:6px">
            <span class="small muted">
                @if ($note->is_pinned)<x-badge tone="warning">Pinned</x-badge> @endif
                {{ $note->author?->name ?? 'System' }} · {{ $note->created_at->diffForHumans() }}
            </span>
            @can('delete', $note)
                <form method="POST" action="{{ route('app.notes.destroy', $note) }}" data-confirm="Delete this note?">
                    @csrf @method('DELETE')
                    <button class="btn small danger" type="submit">Delete</button>
                </form>
            @endcan
        </div>
    </div>
@empty
    <p class="muted small" style="margin:0">No notes yet.</p>
@endforelse