"use client";

import { removeBlockedEntry } from "@/lib/actions/admin";

type Entry = {
  id: string;
  type: string;
  name: string;
  note: string | null;
};

export function BlockedEntryRow({ entry }: { entry: Entry }) {
  return (
    <li className="flex items-center justify-between gap-4 rounded-lg border border-charcoal/10 bg-warm-white p-4">
      <div>
        <span className="rounded-full bg-cream px-2 py-0.5 text-xs uppercase tracking-wide text-charcoal/60">
          {entry.type}
        </span>
        <span className="ml-2 font-medium text-charcoal">{entry.name}</span>
        {entry.note && (
          <p className="mt-1 text-sm text-charcoal/60">{entry.note}</p>
        )}
      </div>
      <button
        type="button"
        onClick={() => removeBlockedEntry(entry.id)}
        className="text-sm text-terracotta hover:underline"
      >
        Remove
      </button>
    </li>
  );
}