import { AdminRowActions } from "@/admin/components/AdminRowActions";
import { deleteUserContentAction, reviewContentAction } from "@/lib/actions";
import { formatDate } from "@/lib/utils";

export type UserUploadItem = {
  id: string;
  modifyHref?: string;
  reason: string | null;
  status: string;
  title: string;
  type: "gallery" | "post" | "video";
  typeLabel: string;
  updatedAt: Date;
  user: string;
  viewHref?: string;
};

type UserUploadCardProps = {
  item: UserUploadItem;
};

const statusTone: Record<string, "success" | "warning" | "error"> = {
  APPROVED: "success",
  PENDING: "warning",
  REJECTED: "error"
};

export function UserUploadCard({ item }: UserUploadCardProps) {
  return (
    <article className="admin-upload-card">
      <header className="admin-upload-card__head">
        <span className="status-badge" data-tone={statusTone[item.status] ?? "warning"}>
          {item.status}
        </span>
        <h3>{item.title}</h3>
      </header>

      <div className="admin-upload-card__meta">
        <p className="muted">
          <strong>Uploader:</strong> {item.user}
        </p>
        <p className="muted">
          <strong>Updated:</strong> {formatDate(item.updatedAt)}
        </p>
        {item.reason ? <p className="admin-error-message">{item.reason}</p> : null}
      </div>

      {item.status === "PENDING" ? <UserUploadApproval id={item.id} type={item.type} /> : null}

      <div className="admin-upload-card__actions">
        <AdminRowActions
          deleteAction={deleteUserContentAction}
          deleteConfirm={`Delete ${item.typeLabel} "${item.title}"?`}
          deleteFields={{ type: item.type }}
          deleteId={item.id}
          modifyHref={item.modifyHref}
          viewHref={item.viewHref}
        />
      </div>
    </article>
  );
}

function UserUploadApproval({ id, type }: { id: string; type: UserUploadItem["type"] }) {
  return (
    <div className="admin-upload-card__approval">
      <form action={reviewContentAction}>
        <input name="decision" type="hidden" value="approve" />
        <input name="id" type="hidden" value={id} />
        <input name="returnTo" type="hidden" value="/admin/user-uploads" />
        <input name="type" type="hidden" value={type} />
        <button className="admin-btn admin-btn-modify" type="submit">
          Approve & publish
        </button>
      </form>
      <form action={reviewContentAction} className="admin-upload-card__reject-form">
        <input name="decision" type="hidden" value="reject" />
        <input name="id" type="hidden" value={id} />
        <input name="returnTo" type="hidden" value="/admin/user-uploads" />
        <input name="type" type="hidden" value={type} />
        <input
          className="admin-form-control"
          name="rejectionReason"
          placeholder="Reject reason shown to user"
          required
        />
        <button className="admin-btn admin-btn-delete" type="submit">
          Reject upload
        </button>
      </form>
    </div>
  );
}