"use client";

import { useState } from "react";
import { useRouter } from "next/navigation";
import { promoteJobAction, reorderJobAction } from "../actions";

type Props = {
  jobId: string;
  // Whether the job can move toward / away from the head of its queue. The
  // running head is never displaced, so the first queued job can't move up.
  canMoveUp?: boolean;
  canMoveDown?: boolean;
};

// Granular manual control for a QUEUED job: nudge it up/down one slot in its
// queue, or promote it to the front (it runs next when the queue frees). Mirrors
// the move buttons in the auto-queue PolicyTreeEditor.
export function ReorderJobButtons({ jobId, canMoveUp, canMoveDown }: Props) {
  const [busy, setBusy] = useState(false);
  const router = useRouter();
  const run = async (fn: () => Promise<unknown>) => {
    setBusy(true);
    try {
      await fn();
      router.refresh();
    } finally {
      setBusy(false);
    }
  };
  const btn =
    "px-1.5 py-1 rounded border border-border text-xs font-medium text-muted-foreground hover:bg-muted disabled:opacity-40";
  // Only render an action that's actually possible: a first-queued job can't move
  // up or promote; a last-queued job can't move down.
  return (
    <div className="flex items-center gap-1">
      {canMoveUp && (
        <button
          type="button"
          disabled={busy}
          onClick={() => run(() => promoteJobAction(jobId))}
          aria-label={`promote job ${jobId} to front of queue`}
          title="Run next (move to front of queue)"
          className={btn}
        >
          Promote
        </button>
      )}
      {canMoveUp && (
        <button
          type="button"
          disabled={busy}
          onClick={() => run(() => reorderJobAction(jobId, -1))}
          aria-label={`move job ${jobId} up`}
          title="Move up one slot"
          className={btn}
        >
          ↑
        </button>
      )}
      {canMoveDown && (
        <button
          type="button"
          disabled={busy}
          onClick={() => run(() => reorderJobAction(jobId, 1))}
          aria-label={`move job ${jobId} down`}
          title="Move down one slot"
          className={btn}
        >
          ↓
        </button>
      )}
    </div>
  );
}