import { useState } from "react";
import { adminModerate } from "~/fns/admin";
import { useAction } from "~/hooks/use-action";
import { Button } from "~/ui/Button";
import { Callout, ErrorBanner } from "~/ui/Callout";
import { Panel } from "~/ui/Panel";
import { cn } from "~/utils/cn";
const INPUT = "rounded-md border border-kumo-line bg-kumo-base px-2 py-1 text-kumo-strong";
/** Hide or restore one repository, issue or comment by its URL. */
export function ModerateByUrl() {
const [url, setUrl] = useState("");
const [reason, setReason] = useState("");
const [done, setDone] = useState<string | null>(null);
const moderate = useAction(adminModerate);
const submit = async (hidden: boolean) => {
if (!url.trim()) return;
if (hidden && !window.confirm(`Hide or take down ${url.trim()}?`)) return;
const result = await moderate.run({ data: { url: url.trim(), hidden, reason: reason.trim() || null } });
if (result) {
setDone(`${hidden ? "Hid" : "Restored"} ${result.target.kind} ${result.target.id}`);
setUrl("");
setReason("");
}
};
return (
<Panel title="Moderate by URL">
<div className="space-y-3 p-4 text-sm">
<ErrorBanner message={moderate.error} />
{done && (
<Callout tone="success" as="output">
{done}
</Callout>
)}
<form
className="flex flex-wrap items-center gap-2"
onSubmit={(event) => {
event.preventDefault();
void submit(true);