HTML 77.2%
TypeScript 10.5%
Python 9.6%
JavaScript 2.5%
1'use client';2import { useState } from 'react';3import { rollbackAction } from '@/lib/admin/actions';4import { ActionButton } from './ui';56/**7 * Rollback with confirmation: the operator must repeat the run id (works without JS through the same form; with JS the8 * field appears inline). The server action refuses when the confirmation does not match.9 */10export function RollbackButton({ runId, connector, returnTo, disabled }: { runId: string; connector: string; returnTo: string; disabled?: boolean }) {11 const [open, setOpen] = useState(false);12 const [typed, setTyped] = useState('');13 if (!open)14 return (15 <button type="button" onClick={() => setOpen(true)} disabled={disabled} className="inline-flex h-8 items-center border border-danger/60 px-2 text-xs font-medium text-danger hover:bg-danger-soft disabled:cursor-not-allowed disabled:opacity-40" title="Retract this run's claims, close its rows, flag its events (deletes nothing)" data-rollback>16 Rollback17 </button>18 );19 return (20 <form action={rollbackAction} className="flex flex-wrap items-center gap-1.5" data-rollback-form>21 <input type="hidden" name="run_id" value={runId} />22 <input type="hidden" name="return" value={returnTo} />23 <label className="flex items-center gap-1 text-[11px] text-ink-2">24 <span className="whitespace-nowrap">25 Type the run id to confirm ({connector}):26 </span>27 <input name="confirm" value={typed} onChange={(e) => setTyped(e.target.value)} placeholder={runId} className="mono h-8 w-64 border border-rule bg-surface px-2 text-[11px] text-ink focus:border-danger focus:outline-none" autoFocus />28 </label>29 <ActionButton tone="danger" disabled={typed !== runId} title="Confirmed rollback">30 Confirm rollback31 </ActionButton>32 <button type="button" onClick={() => setOpen(false)} className="h-8 px-2 text-xs text-ink-3 hover:text-ink">33 Cancel34 </button>35 </form>36 );37}38