"use client";

import * as React from "react";
import { cn } from "@/lib/utils";
import { Button } from "@/components/ui/button";
import { FormField } from "./FormField";
import { SpecificationFields, FeatureFields, FAQFields } from "./DynamicFields";
import type { ProductFormData } from "../../types/product-form";
import { SPECIFICATION_GROUPS } from "../../types/product-form";

interface SpecificationsSectionProps {
  data: ProductFormData;
  onChange: (data: Partial<ProductFormData>) => void;
  errors?: Partial<Record<keyof ProductFormData, string>>;
}

export function SpecificationsSection({
  data,
  onChange,
  errors = {},
}: SpecificationsSectionProps) {
  const handleNestedChange = <T extends object>(
    parentField: keyof ProductFormData,
    nestedField: keyof T,
    value: unknown
  ) => {
    const current = data[parentField] as T;
    onChange({
      [parentField]: { ...current, [nestedField]: value },
    } as Partial<ProductFormData>);
  };

  const handleSpecsChange = (specs: ProductFormData["specifications"]) => {
    handleNestedChange("specifications", "length" as never, specs); // Triggers update via the spread
    onChange({ specifications: specs } as Partial<ProductFormData>);
  };

  const handleFeaturesChange = (features: ProductFormData["features"]) => {
    onChange({ features } as Partial<ProductFormData>);
  };

  const handleFAQsChange = (faqs: ProductFormData["faqs"]) => {
    onChange({ faqs } as Partial<ProductFormData>);
  };

  const specificationGroups = Object.values(SPECIFICATION_GROUPS).flat();

  return (
    <div className="space-y-6">
      {/* Key Features */}
      <div className="space-y-4">
        <FeatureFields
          features={data.features}
          onChange={handleFeaturesChange}
        />
      </div>

      {/* Technical Specifications */}
      <div className="space-y-4">
        <SpecificationFields
          specifications={data.specifications}
          onChange={handleSpecsChange}
          specificationGroups={specificationGroups}
        />
      </div>

      {/* FAQs */}
      <div className="space-y-4">
        <FAQFields
          faqs={data.faqs}
          onChange={handleFAQsChange}
        />
      </div>
    </div>
  );
}

// ============================================================================
// Quick Add Templates for Common Product Types
// ============================================================================

interface SpecificationTemplate {
  name: string;
  specs: { name: string; value: string; group: string }[];
}

export const SPECIFICATION_TEMPLATES: Record<string, SpecificationTemplate> = {
  processor: {
    name: "Processor (CPU)",
    specs: [
      { name: "Processor Socket", value: "", group: "Processor" },
      { name: "Architecture", value: "", group: "Processor" },
      { name: "Core Count", value: "", group: "Processor" },
      { name: "Thread Count", value: "", group: "Processor" },
      { name: "Base Clock", value: "", group: "Processor" },
      { name: "Boost Clock", value: "", group: "Processor" },
      { name: "L3 Cache", value: "", group: "Processor" },
      { name: "TDP", value: "", group: "Processor" },
      { name: "Memory Support", value: "", group: "Memory" },
      { name: "PCI Express Version", value: "", group: "Connectivity" },
      { name: "Integrated Graphics", value: "", group: "Graphics" },
      { name: "Thermal Solution", value: "", group: "Power" },
      { name: "Manufacturing Process", value: "", group: "Processor" },
    ],
  },
  memory: {
    name: "Memory (RAM)",
    specs: [
      { name: "Type", value: "", group: "General" },
      { name: "Capacity", value: "", group: "General" },
      { name: "Speed", value: "", group: "General" },
      { name: "CAS Latency", value: "", group: "General" },
      { name: "Voltage", value: "", group: "Power" },
      { name: "Form Factor", value: "", group: "Physical" },
      { name: "ECC Support", value: "", group: "General" },
    ],
  },
  storage: {
    name: "Storage (SSD/HDD)",
    specs: [
      { name: "Interface", value: "", group: "Connectivity" },
      { name: "Capacity", value: "", group: "General" },
      { name: "Form Factor", value: "", group: "Physical" },
      { name: "Sequential Read", value: "", group: "Performance" },
      { name: "Sequential Write", value: "", group: "Performance" },
      { name: "Random Read IOPS", value: "", group: "Performance" },
      { name: "Random Write IOPS", value: "", group: "Performance" },
      { name: "Endurance (TBW)", value: "", group: "General" },
    ],
  },
  graphics: {
    name: "Graphics Card",
    specs: [
      { name: "GPU Architecture", value: "", group: "Graphics" },
      { name: "VRAM", value: "", group: "Graphics" },
      { name: "Memory Type", value: "", group: "Graphics" },
      { name: "Memory Bus Width", value: "", group: "Graphics" },
      { name: "CUDA Cores / Stream Processors", value: "", group: "Graphics" },
      { name: "Base Clock", value: "", group: "Graphics" },
      { name: "Boost Clock", value: "", group: "Graphics" },
      { name: "TDP", value: "", group: "Power" },
      { name: "Power Connectors", value: "", group: "Power" },
      { name: "Display Outputs", value: "", group: "Connectivity" },
    ],
  },
  motherboard: {
    name: "Motherboard",
    specs: [
      { name: "Socket", value: "", group: "General" },
      { name: "Chipset", value: "", group: "General" },
      { name: "Form Factor", value: "", group: "Physical" },
      { name: "Memory Slots", value: "", group: "Memory" },
      { name: "Max Memory", value: "", group: "Memory" },
      { name: "Memory Speed Support", value: "", group: "Memory" },
      { name: "PCIe x16 Slots", value: "", group: "Connectivity" },
      { name: "M.2 Slots", value: "", group: "Storage" },
      { name: "SATA Ports", value: "", group: "Storage" },
      { name: "USB Ports", value: "", group: "Connectivity" },
      { name: "Network", value: "", group: "Connectivity" },
      { name: "Audio", value: "", group: "Audio" },
    ],
  },
};