import { useNavigate } from "@tanstack/react-router";
import { useViewer } from "~/hooks/use-viewer";
import { cn } from "~/utils/cn";

/**
 * Opens the abuse form prefilled with what is being reported: an absolute `url` (hosted sites) or a forge
 * `path` (default: the current page) plus an optional `hash`, made absolute on click so it works behind any
 * PUBLIC_URL. Hidden only from `owner`, the account that owns what is reported; admins can report too.
 */
export function ReportLink({
  owner,
  path,
  hash = "",
  url,
  label = "Report",
  className,
}: {
  owner?: string;
  path?: string;
  hash?: string;
  url?: string;
  label?: string;
  className?: string;
}) {
  const navigate = useNavigate();
  const viewer = useViewer();
  if (owner && viewer && viewer.name.toLowerCase() === owner.toLowerCase()) return null;
  return (
    <a
      href="/abuse"
      rel="nofollow"
      className={cn("text-xs text-kumo-subtle hover:text-kumo-danger", className)}
      onClick={(event) => {
        event.preventDefault();
        void navigate({
          to: "/abuse",
          search: { url: url ?? `${window.location.origin}${path ?? window.location.pathname}${hash}` },
        });
      }}
    >
      {label}
    </a>
  );
}