import Link from "next/link";

type Props = {
  previewEnabled: boolean;
};

export function PreviewBanner({previewEnabled}: Props) {
  if (!previewEnabled) {
    return (
      <div className="mb-6 rounded-lg border border-slate-200 bg-white px-4 py-3 text-sm text-slate-700">
        Viewing published content. Enable preview by opening
        {" "}
        <code className="rounded bg-slate-100 px-1 py-0.5">
          /api/preview?secret=YOUR_SECRET&slug=/
        </code>
        .
      </div>
    );
  }

  return (
    <div className="mb-6 rounded-lg border border-amber-300 bg-amber-50 px-4 py-3 text-sm text-amber-900">
      Preview mode is enabled (draft + published content).
      {" "}
      <Link href="/api/preview/exit" className="font-semibold underline">
        Exit preview
      </Link>
    </div>
  );
}