"use client";

import { SectionEditor } from "../_components/SectionEditor";
import { InputField, TextareaField } from "../_components/FormField";
import { ArrayEditor } from "../_components/ArrayEditor";
import type { ContactInfo } from "@/types/content";

export default function ContactEditorPage() {
  return (
    <SectionEditor<ContactInfo> sectionKey="contact" title="Контакты">
      {(data, update) => (
        <>
          <InputField
            label="Заголовок секции"
            value={data.title}
            onChange={(v) => update({ ...data, title: v })}
          />
          <InputField
            label="Телефон"
            value={data.phone}
            onChange={(v) => update({ ...data, phone: v })}
            type="tel"
          />
          <InputField
            label="Instagram"
            value={data.instagram}
            onChange={(v) => update({ ...data, instagram: v })}
            type="url"
          />
          <InputField
            label="Часы работы"
            value={data.workingHours}
            onChange={(v) => update({ ...data, workingHours: v })}
          />
          <ArrayEditor
            label="Адреса"
            items={data.addresses}
            onChange={(addresses) => update({ ...data, addresses })}
            renderItem={(addr, _i, updateItem) => (
              <InputField label="Адрес" value={addr} onChange={updateItem} />
            )}
            createItem={() => ""}
            addLabel="Добавить адрес"
          />
          <TextareaField
            label="URL карты (Yandex Maps iframe)"
            value={data.mapEmbedUrl}
            onChange={(v) => update({ ...data, mapEmbedUrl: v })}
            rows={2}
          />
        </>
      )}
    </SectionEditor>
  );
}
