"use client";

import { Timer } from "lucide-react";
import { Input } from "@/components/ui/input";
import { ChaveDeAjuste, LinhaDeAjuste, SecaoDeAjustes } from "@/components/ui/folha-de-ajustes";

/*
  O corte de produção: até que horas o pedido entra na fila do mesmo dia.

  É a pergunta que o cliente faz antes de fechar — "se eu pedir agora, sai
  hoje?" — e que hoje só é respondida no WhatsApp, uma por uma. Com a hora
  gravada, a loja responde sozinha na página do produto, com o relógio
  correndo até o limite.

  Fora do horário, ou no fim de semana, a loja passa a falar do próximo dia
  útil. Prometer "hoje" às onze da noite de sábado seria mentira com relógio.

  O bloco não salva sozinho: ele é um campo da página do catálogo, e quem
  grava é o "Salvar alterações" de lá. Dois botões de salvar na mesma tela
  fazem a pessoa duvidar de qual dos dois valeu.

  Desenhado como uma seção da folha de ajustes da página (o id é o que o
  índice da folha aponta).
*/

export function CorteDeProducao({
  ligado,
  hora,
  aoMudar,
}: {
  ligado: boolean;
  hora: string;
  aoMudar: (valores: { ligado: boolean; hora: string }) => void;
}) {
  return (
    <SecaoDeAjustes
      id="visual-corte"
      Icone={Timer}
      titulo="Corte de produção"
      texto="Até que horas um pedido fechado hoje entra na produção de hoje."
    >
      <ChaveDeAjuste
        titulo="Mostrar o aviso na loja"
        texto="A página do produto passa a exibir “entra em produção hoje se finalizado até a hora”, com o tempo restante."
        ligado={ligado}
        aoMudar={(valor) => aoMudar({ ligado: valor, hora })}
      />
      {ligado ? (
        <LinhaDeAjuste
          htmlFor="corteHora"
          titulo="Hora limite"
          texto="Depois desta hora, e nos fins de semana, a loja passa a falar do próximo dia útil."
        >
          <div className="sm:max-w-[160px]">
            <Input id="corteHora" type="time" value={hora} onChange={(e) => aoMudar({ ligado, hora: e.target.value })} />
          </div>
        </LinhaDeAjuste>
      ) : null}
    </SecaoDeAjustes>
  );
}
