"use client";

import { useState, useTransition } from "react";
import { toggleNotifyNewRequests } from "@/lib/actions/requests";

export function NewRequestToggle({ initialEnabled }: { initialEnabled: boolean }) {
  const [enabled, setEnabled] = useState(initialEnabled);
  const [, startTransition] = useTransition();

  return (
    <label className="flex w-fit items-center gap-2 text-sm text-charcoal">
      <input
        type="checkbox"
        checked={enabled}
        onChange={() => {
          setEnabled((e) => !e);
          startTransition(() => {
            toggleNotifyNewRequests();
          });
        }}
        className="h-4 w-4 accent-terracotta"
      />
      Notify me when a new request comes in
    </label>
  );
}