"use client";

import Link from "next/link";

export function VideoNavStrip({
  prevHref,
  nextHref,
  position,
  videoId,
}: {
  prevHref?: string;
  nextHref?: string;
  position?: { index: number; total: number };
  // The umtool front door, when UMTOOL_URL is set on the editor. One link:
  // "open in umtool" scaffolds a report video from this exact video.
  umtoolUrl?: string | null;
  videoId: string;
}) {
  return (
    <div className="flex items-center justify-between gap-3 text-sm">
      {prevHref ? (
        <Link
          href={prevHref}
          aria-label="previous video"
          className="px-2 py-1 rounded border border-border hover:bg-muted"
        >
          ◀ prev
        </Link>
      ) : (
        <span
          aria-hidden="true"
          className="px-2 py-1 rounded border border-border text-muted-foreground"
        >
          ◀ prev
        </span>
      )}
      <span className="font-mono text-xs text-muted-foreground truncate">
        {position
          ? `${position.index + 1} / ${position.total} · ${videoId}`
          : videoId}
      </span>
      {nextHref ? (
        <Link
          href={nextHref}
          aria-label="next video"
          className="px-2 py-1 rounded border border-border hover:bg-muted"
        >
          next ▶
        </Link>
      ) : (
        <span
          aria-hidden="true"
          className="px-2 py-1 rounded border border-border text-muted-foreground"
        >
          next ▶
        </span>
      )}
    </div>
  );
}