"use client";
import { useEffect, useState } from "react";
type Values = { authEnabled: boolean; authVkEnabled: boolean; authYandexEnabled: boolean; authTelegramEnabled: boolean; authMaxEnabled: boolean; ordersEnabled: boolean; ordersPickupEnabled: boolean; ordersDeferredEnabled: boolean; marketingEnabled: boolean; address: string; phone: string; orderRetentionYears: number; claimRetentionYears: number; emptyAccountRetentionDays: number; backupRetentionDays: number };
type DeliveryEnv = "test" | "production";
type DostavistaSettings = { mode: DeliveryEnv; configured: Record<DeliveryEnv, boolean> };
export function AdminSiteSettings() {
  const [values, setValues] = useState<Values>({ authEnabled: false, authVkEnabled: true, authYandexEnabled: true, authTelegramEnabled: true, authMaxEnabled: true, ordersEnabled: false, ordersPickupEnabled: true, ordersDeferredEnabled: true, marketingEnabled: false, address: "", phone: "", orderRetentionYears: 5, claimRetentionYears: 3, emptyAccountRetentionDays: 30, backupRetentionDays: 90 });
  const [message, setMessage] = useState("");
  const [dostavista, setDostavista] = useState<DostavistaSettings | null>(null);
  const [dostavistaBusy, setDostavistaBusy] = useState(false);
  const [dostavistaMessage, setDostavistaMessage] = useState("");
  useEffect(() => { fetch("/api/admin/settings").then((response) => response.ok ? response.json() : null).then((data) => data && setValues(data)); }, []);
  useEffect(() => { setDostavistaBusy(true); fetch("/api/admin/settings/dostavista", { cache: "no-store" }).then(async (response) => { const body = await response.json(); if (!response.ok) throw new Error(body.message || "Не удалось загрузить настройку Достависты."); setDostavista(body); }).catch((error) => setDostavistaMessage(error instanceof Error ? error.message : "Не удалось загрузить настройку Достависты.")).finally(() => setDostavistaBusy(false)); }, []);
  async function save(next: Values) {
    setValues(next);
    const csrf = document.cookie.split("; ").find((part) => part.startsWith("kiln-admin-csrf="))?.split("=")[1];
    const response = await fetch("/api/admin/settings", { method: "PATCH", headers: { "content-type": "application/json", ...(csrf ? { "x-csrf-token": decodeURIComponent(csrf) } : {}) }, body: JSON.stringify(next) });
    setMessage(response.ok ? "Настройки сохранены" : "Не удалось сохранить настройку");
  }
  async function changeDostavista(mode: DeliveryEnv) {
    if (!dostavista || dostavista.mode === mode || dostavistaBusy) return;
    if (mode === "production" && !window.confirm("Боевая среда — реальные заказы и платные доставки. Переключить на боевую среду?")) return;
    setDostavistaBusy(true); setDostavistaMessage("");
    try {
      const csrf = document.cookie.split("; ").find((part) => part.startsWith("kiln-admin-csrf="))?.split("=")[1];
      const response = await fetch("/api/admin/settings/dostavista", { method: "PATCH", headers: { "content-type": "application/json", ...(csrf ? { "x-csrf-token": decodeURIComponent(csrf) } : {}) }, body: JSON.stringify({ mode }) });
      const body = await response.json();
      if (!response.ok) throw new Error(body.message || "Не удалось изменить среду Достависты.");
      setDostavista(body); setDostavistaMessage("Среда изменена. Настройка применяется только к новым доставкам.");
    } catch (error) { setDostavistaMessage(error instanceof Error ? error.message : "Не удалось изменить среду Достависты."); }
    finally { setDostavistaBusy(false); }
  }
  return <div className="mb-8 grid gap-5"><section className="card grid gap-5 p-5">
    <div><p className="eyebrow">Настройки сайта</p><h2 className="mt-1 text-2xl">Контакты и публичные функции</h2></div>
    <label className="grid gap-1"><span className="text-sm">Адрес ресторана</span><input className="input" value={values.address} onChange={(event) => setValues({ ...values, address: event.target.value })} onBlur={() => save(values)} /></label>
    <label className="grid gap-1"><span className="text-sm">Телефон ресторана</span><input className="input" type="tel" value={values.phone} onChange={(event) => setValues({ ...values, phone: event.target.value })} onBlur={() => save(values)} /></label>
    <div className="grid gap-4 border-t border-white/10 pt-5"><div><strong>Сроки обработки персональных данных</strong><p className="text-sm text-kiln-milk/60">Изменение создаёт новую редакцию настроек и фиксируется в аудите.</p></div><div className="grid gap-3 sm:grid-cols-2"><label className="grid gap-1"><span className="text-sm">Заказы, лет (минимум 5)</span><input className="input" type="number" min={5} max={20} value={values.orderRetentionYears} onChange={(event) => setValues({ ...values, orderRetentionYears: Number(event.target.value) })} onBlur={() => save(values)} /></label><label className="grid gap-1"><span className="text-sm">Споры, лет (минимум 3)</span><input className="input" type="number" min={3} max={20} value={values.claimRetentionYears} onChange={(event) => setValues({ ...values, claimRetentionYears: Number(event.target.value) })} onBlur={() => save(values)} /></label><label className="grid gap-1"><span className="text-sm">Пустой ЛК, дней (минимум 30)</span><input className="input" type="number" min={30} max={3650} value={values.emptyAccountRetentionDays} onChange={(event) => setValues({ ...values, emptyAccountRetentionDays: Number(event.target.value) })} onBlur={() => save(values)} /></label><label className="grid gap-1"><span className="text-sm">Резервные копии, дней (30–90)</span><input className="input" type="number" min={30} max={90} value={values.backupRetentionDays} onChange={(event) => setValues({ ...values, backupRetentionDays: Number(event.target.value) })} onBlur={() => save(values)} /></label></div></div>
    <label className="flex items-center justify-between gap-4"><span><strong>Авторизация</strong><br /><small className="text-kiln-milk/60">Разрешить вход через VK и Яндекс</small></span><input type="checkbox" checked={values.authEnabled} onChange={(event) => save({ ...values, authEnabled: event.target.checked })} /></label>
    <div className="ml-4 grid gap-4 border-l border-white/10 pl-4">
      <label className="flex items-center justify-between gap-4"><span><strong>VK</strong><br /><small className="text-kiln-milk/60">Показывать и разрешать вход через VK</small></span><input type="checkbox" checked={values.authVkEnabled} onChange={(event) => save({ ...values, authVkEnabled: event.target.checked })} /></label>
      <label className="flex items-center justify-between gap-4"><span><strong>Яндекс</strong><br /><small className="text-kiln-milk/60">Показывать и разрешать вход через Яндекс</small></span><input type="checkbox" checked={values.authYandexEnabled} onChange={(event) => save({ ...values, authYandexEnabled: event.target.checked })} /></label>
      <label className="flex items-center justify-between gap-4"><span><strong>Telegram</strong><br /><small className="text-kiln-milk/60">Показывать и разрешать вход через Telegram</small></span><input type="checkbox" checked={values.authTelegramEnabled} onChange={(event) => save({ ...values, authTelegramEnabled: event.target.checked })} /></label>
      <label className="flex items-center justify-between gap-4"><span><strong>MAX</strong><br /><small className="text-kiln-milk/60">Показывать и разрешать вход через MAX</small></span><input type="checkbox" checked={values.authMaxEnabled} onChange={(event) => save({ ...values, authMaxEnabled: event.target.checked })} /></label>
    </div>
    <label className="flex items-center justify-between gap-4"><span><strong>Приём заказов</strong><br /><small className="text-kiln-milk/60">Разрешить создание заказов через сайт</small></span><input type="checkbox" checked={values.ordersEnabled} onChange={(event) => save({ ...values, ordersEnabled: event.target.checked })} /></label>
    <label className="flex items-center justify-between gap-4"><span><strong>Самовывоз</strong><br /><small className="text-kiln-milk/60">Разрешить оформление самовывоза</small></span><input type="checkbox" checked={values.ordersPickupEnabled} onChange={(event) => save({ ...values, ordersPickupEnabled: event.target.checked })} /></label>
    <label className="flex items-center justify-between gap-4"><span><strong>Отложенные заказы</strong><br /><small className="text-kiln-milk/60">Разрешить заказ к дате и времени</small></span><input type="checkbox" checked={values.ordersDeferredEnabled} onChange={(event) => save({ ...values, ordersDeferredEnabled: event.target.checked })} /></label>
    <label className="flex items-center justify-between gap-4"><span><strong>Маркетинговое согласие</strong><br /><small className="text-kiln-milk/60">Показывать в checkout пункт «Хочу получать новости и предложения КИЛН»</small></span><input type="checkbox" checked={values.marketingEnabled} onChange={(event) => save({ ...values, marketingEnabled: event.target.checked })} /></label>
    {message ? <p className="text-sm text-kiln-milk/60">{message}</p> : null}
  </section><section className="card grid gap-4 p-5"><div><p className="eyebrow">Интеграции</p><h2 className="mt-1 text-2xl">Среда Достависты</h2></div>{!dostavista ? <p className="muted">{dostavistaBusy ? "Загружаем…" : "Настройка недоступна."}</p> : <><div className="flex flex-wrap items-center gap-3"><span>Текущий режим:</span><span className={`inline-flex rounded-full border px-2 py-0.5 text-xs font-semibold ${dostavista.mode === "production" ? "border-red-400/50 bg-red-500/10 text-red-200" : "border-sky-400/50 bg-sky-500/10 text-sky-200"}`}>Dostavista · {dostavista.mode === "production" ? "PROD" : "TEST"}</span></div><p className={`rounded-lg border p-3 text-sm ${dostavista.mode === "production" ? "border-red-400/50 bg-red-500/10 text-red-100" : "border-sky-400/40 bg-sky-500/10 text-sky-100"}`}>{dostavista.mode === "production" ? "Боевая среда — будут создаваться реальные платные доставки." : "Тестовая среда — реальные деньги за доставку не списываются."}</p><div className="grid gap-3 sm:grid-cols-2">{(["test", "production"] as const).map((mode) => <button key={mode} className={`button ${dostavista.mode === mode ? "button-primary" : "button-secondary"}`} disabled={dostavistaBusy || dostavista.mode === mode || !dostavista.configured[mode]} onClick={() => void changeDostavista(mode)}><span className="grid text-left"><strong>{mode === "test" ? "Тестовая" : "Боевая"}</strong><small>{dostavista.configured[mode] ? "настроена" : "не настроена"}</small></span></button>)}</div><p className="muted text-sm">Переключение влияет только на новые доставки. Уже созданные доставки продолжают работать в своей исходной среде.</p></>}{dostavistaMessage ? <p className="text-sm text-kiln-flame">{dostavistaMessage}</p> : null}</section></div>;
}