import { motion } from 'framer-motion';
import { HelpCircle, Info } from 'lucide-react';
import {
  Accordion,
  AccordionItem,
  AccordionTrigger,
  AccordionContent,
} from '@/components/ui/accordion';
import { faqSchema } from '@/lib/schemas';
import { sanitizedHtml } from '@/lib/sanitize';
import { getCategorySeo } from '@/data/categorySeo';
import { useT, useLang, type T } from '@/lib/i18n';

interface FaqItem { q: string; a: string; }

const FAQS_BY_CATEGORY = (t: T): Record<string, FaqItem[]> => ({
  peptides: [
    { q: t('Wat zijn research peptiden precies?', 'What exactly are research peptides?'), a: t('Research peptiden zijn korte ketens van aminozuren die uitsluitend bedoeld zijn voor in-vitro laboratoriumonderzoek. Ze worden niet geleverd voor humaan of dierlijk gebruik.', 'Research peptides are short chains of amino acids intended exclusively for in-vitro laboratory research. They are not supplied for human or animal use.') },
    { q: t('Worden jullie peptiden onafhankelijk getest?', 'Are your peptides independently tested?'), a: t('Ja, door het externe lab Janoshik Analytical, in opdracht van onze fabrikant Alpha BioPharma. Het lab is geen eigendom van de fabrikant of van ons. We streven naar ≥ 99%; de gemeten waarden en links naar de originele rapporten staan op onze pagina Labtesten.', 'Yes, by the independent lab Janoshik Analytical, commissioned by our manufacturer Alpha BioPharma. The lab is not owned by the manufacturer or by us. We aim for ≥ 99%; the measured values and links to the original reports are on our Lab Tests page.') },
    { q: t('Hoe bewaar ik peptiden correct?', 'How do I store peptides correctly?'), a: t('Gevriesdroogde (lyofiele) peptiden bewaar je op kamertemperatuur, uit direct licht en zonder grote temperatuurschommelingen. Na reconstitutie met bacteriostatisch water bewaar je het flesje in de koelkast (2–8 °C) en gebruik je het bij voorkeur binnen 30 dagen.', 'Freeze-dried (lyophilized) peptides should be stored at room temperature, out of direct light and without large temperature fluctuations. After reconstitution with bacteriostatic water, store the vial in the fridge (2–8 °C) and use it preferably within 30 days.') },
    { q: t('Hoe reconstitueer ik een peptide vial?', 'How do I reconstitute a peptide vial?'), a: t('Voeg met een insulinespuit bacteriostatisch water langzaam toe langs de wand van het flesje, zwenk voorzichtig (niet schudden) tot alles is opgelost. Gebruik onze Peptide Calculator om de exacte hoeveelheid water en eenheden per prik te berekenen.', 'Using an insulin syringe, slowly add bacteriostatic water along the wall of the vial, gently swirl (do not shake) until everything has dissolved. Use our Peptide Calculator to calculate the exact amount of water and units per shot.') },
  ],
  'healing-recovery': [
    { q: t('Wat zijn healing peptiden zoals BPC-157 en TB-500?', 'What are healing peptides like BPC-157 and TB-500?'), a: t('BPC-157 en TB-500 (Thymosin β4) worden in onderzoek gebruikt vanwege hun rol in weefselherstel, angiogenese en ontstekingsmodulatie. Ze zijn uitsluitend bestemd voor in-vitro onderzoek.', 'BPC-157 and TB-500 (Thymosin β4) are used in research because of their role in tissue repair, angiogenesis and inflammation modulation. They are intended exclusively for in-vitro research.') },
    { q: t('Welke zuiverheid hanteren jullie voor healing peptiden?', 'What purity do you apply for healing peptides?'), a: t('We streven bij al onze healing peptiden naar een zuiverheid van ≥ 99%. De meeste batches halen dat; de exacte, onafhankelijk gemeten waarde per batch vind je op onze pagina Labtesten.', 'For all our healing peptides we aim for a purity of ≥ 99%. Most batches achieve this; the exact, independently measured value per batch can be found on our Lab Tests page.') },
    { q: t('Hoe verhouden BPC-157 en TB-500 zich tot elkaar?', 'How do BPC-157 and TB-500 relate to each other?'), a: t('BPC-157 wordt in onderzoek vooral geassocieerd met gastro-intestinaal en pees-herstel, TB-500 met bredere systemische weefselregeneratie. Beide worden regelmatig samen bestudeerd in preklinisch onderzoek.', 'BPC-157 is mainly associated in research with gastrointestinal and tendon repair, while TB-500 is associated with broader systemic tissue regeneration. Both are regularly studied together in preclinical research.') },
  ],
  'growth-hormone-hgh': [
    { q: t('Wat is HGH (Human Growth Hormone)?', 'What is HGH (Human Growth Hormone)?'), a: t('HGH is een polypeptide-hormoon dat in onderzoek wordt bestudeerd voor zijn rol in celgroei, weefselherstel en metabole processen. Wij leveren HGH uitsluitend voor in-vitro laboratoriumonderzoek.', 'HGH is a polypeptide hormone studied in research for its role in cell growth, tissue repair and metabolic processes. We supply HGH exclusively for in-vitro laboratory research.') },
    { q: t('Wat is het verschil tussen HGH en GH-releasing peptiden?', 'What is the difference between HGH and GH-releasing peptides?'), a: t('HGH is het hormoon zelf. GH-releasing peptiden (zoals Ipamorelin, GHRP-2/6) en GHRH-analogen (zoals CJC-1295, Sermorelin) stimuleren in onderzoek de eigen afgifte van groeihormoon.', "HGH is the hormone itself. GH-releasing peptides (such as Ipamorelin, GHRP-2/6) and GHRH analogues (such as CJC-1295, Sermorelin) are studied for stimulating the body's own growth hormone release.") },
    { q: t('Hoe bewaar ik HGH na reconstitutie?', 'How do I store HGH after reconstitution?'), a: t('Onaangebroken vials bewaar je bij 2–8 °C. Na reconstitutie met bacteriostatisch water blijft HGH doorgaans 14–21 dagen stabiel in de koelkast, mits koud en donker bewaard.', 'Unopened vials should be stored at 2–8 °C. After reconstitution with bacteriostatic water, HGH generally remains stable in the fridge for 14–21 days, provided it is kept cold and dark.') },
  ],
  'glp-1': [
    { q: t('Wat zijn GLP-1 analogen zoals Tirzepatide en Retatrutide?', 'What are GLP-1 analogues like Tirzepatide and Retatrutide?'), a: t('GLP-1 (en GLP-1/GIP/glucagon) analogen zijn peptiden die in onderzoek worden gebruikt om incretine-signalering te bestuderen. Ze worden uitsluitend geleverd voor in-vitro onderzoeksdoeleinden.', 'GLP-1 (and GLP-1/GIP/glucagon) analogues are peptides used in research to study incretin signalling. They are supplied exclusively for in-vitro research purposes.') },
    { q: t('Hoe bewaar ik GLP-1 peptiden na reconstitutie?', 'How do I store GLP-1 peptides after reconstitution?'), a: t('Bewaar het gereconstitueerde flesje in de koelkast (2–8 °C), afgeschermd van licht, en gebruik het bij voorkeur binnen 30 dagen.', 'Store the reconstituted vial in the fridge (2–8 °C), shielded from light, and use it preferably within 30 days.') },
    { q: t('Zijn jullie GLP-1 peptiden getest?', 'Are your GLP-1 peptides tested?'), a: t('Ja. Elke batch wordt getest op zuiverheid en concentratie in een extern laboratorium. De rapporten staan op de pagina Labtesten.', 'Yes. Every batch is tested for purity and concentration at an independent laboratory. The reports are on the Lab Tests page.') },
  ],
  'anti-aging': [
    { q: t('Welke peptiden worden in anti-aging onderzoek gebruikt?', 'Which peptides are used in anti-aging research?'), a: t('Peptiden zoals Epithalon, GHK-Cu en NAD+ precursors worden in preklinisch onderzoek bestudeerd op cellulaire veroudering, telomeer-behoud en huidmatrix-eiwitten.', 'Peptides such as Epithalon, GHK-Cu and NAD+ precursors are studied in preclinical research for cellular aging, telomere maintenance and skin matrix proteins.') },
    { q: t('Wat maakt GHK-Cu bijzonder?', 'What makes GHK-Cu special?'), a: t('GHK-Cu is een koper-bindend tripeptide dat in vitro effecten vertoont op collageen- en elastine-synthese en weefselremodellering.', 'GHK-Cu is a copper-binding tripeptide that shows in vitro effects on collagen and elastin synthesis and tissue remodeling.') },
    { q: t('Zijn deze peptiden geschikt voor humaan gebruik?', 'Are these peptides suitable for human use?'), a: t('Nee. Al onze producten zijn uitsluitend bestemd voor in-vitro laboratoriumonderzoek en worden niet geleverd voor humaan of dierlijk gebruik.', 'No. All our products are intended exclusively for in-vitro laboratory research and are not supplied for human or animal use.') },
  ],
  tanning: [
    { q: t('Wat is Melanotan II in onderzoekscontext?', 'What is Melanotan II in a research context?'), a: t('Melanotan II is een synthetisch peptide dat in onderzoek melanocortine-receptoren activeert en in vitro melanogenese stimuleert.', 'Melanotan II is a synthetic peptide that activates melanocortin receptors in research and stimulates melanogenesis in vitro.') },
    { q: t('Hoe bewaar ik Melanotan II?', 'How do I store Melanotan II?'), a: t('Gevriesdroogd op kamertemperatuur, uit direct licht. Na reconstitutie bewaren in de koelkast (2–8 °C) en binnen 30 dagen gebruiken.', 'Freeze-dried at room temperature, out of direct light. After reconstitution, store in the fridge (2–8 °C) and use within 30 days.') },
  ],
  cosmetic: [
    { q: t('Welke peptiden vallen onder cosmetisch onderzoek?', 'Which peptides fall under cosmetic research?'), a: t('Cosmetische peptiden zoals GHK-Cu, Argireline en Matrixyl worden in vitro bestudeerd op hun effecten op huidmatrix-eiwitten, collageensynthese en cellulair herstel.', 'Cosmetic peptides such as GHK-Cu, Argireline and Matrixyl are studied in vitro for their effects on skin matrix proteins, collagen synthesis and cellular repair.') },
    { q: t('Zijn cosmetische peptiden lab-getest?', 'Are cosmetic peptides lab-tested?'), a: t('Ja. Alle peptiden — cosmetisch of anderszins — worden onafhankelijk getest op zuiverheid. We streven naar ≥ 99%; de gemeten waarden staan op onze pagina Labtesten.', 'Yes. All peptides — cosmetic or otherwise — are independently tested for purity. We aim for ≥ 99%; the measured values are on our Lab Tests page.') },
  ],
  nootropic: [
    { q: t('Wat zijn nootropische peptiden?', 'What are nootropic peptides?'), a: t('Nootropische peptiden zoals Semax, Selank en Cerebrolysin-fragmenten worden in onderzoek bestudeerd op neurotrofe en neuromodulatoire eigenschappen.', 'Nootropic peptides such as Semax, Selank and Cerebrolysin fragments are studied in research for neurotrophic and neuromodulatory properties.') },
    { q: t('Hoe stabiel zijn nootropische peptiden na reconstitutie?', 'How stable are nootropic peptides after reconstitution?'), a: t('Doorgaans 21–30 dagen bij 2–8 °C, afgeschermd van licht. Volg altijd de aanbevelingen bij de specifieke batch.', 'Typically 21–30 days at 2–8 °C, shielded from light. Always follow the recommendations for the specific batch.') },
  ],
});

const GENERIC_FAQS = (t: T): FaqItem[] => [
  { q: t('Zijn de peptiden lab-getest?', 'Are the peptides lab-tested?'), a: t('Ja. Iedere batch wordt in een extern laboratorium getest op zuiverheid en concentratie. Bekijk onze pagina Labtesten voor de rapporten.', 'Yes. Every batch is tested at an independent laboratory for purity and concentration. Check our Lab Tests page for the reports.') },
  { q: t('Waarvoor zijn deze peptiden bestemd?', 'What are these peptides intended for?'), a: t('Al onze peptiden worden uitsluitend geleverd voor in-vitro laboratoriumonderzoek. Ze zijn niet bedoeld voor humaan of dierlijk gebruik.', 'All our peptides are supplied exclusively for in-vitro laboratory research. They are not intended for human or animal use.') },
  { q: t('Hoe verloopt de levering?', 'How does delivery work?'), a: t('Wij versturen 100% discreet vanuit de EU — zonder logo of vermelding van de inhoud. Vóór 12:00 besteld = dezelfde werkdag verzonden; na vrijdag 12:00 en in het weekend op maandag. Binnen Nederland en België meestal de volgende werkdag in huis.', 'We ship 100% discreetly from the EU — with no logo or mention of the contents. Ordered before 12:00 on a weekday means it ships that same working day; orders after Friday 12:00 and over the weekend ship on Monday. Within the Netherlands and Belgium it is usually delivered the next working day.') },
  { q: t('Welke betaalmethoden accepteren jullie?', 'Which payment methods do you accept?'), a: t('Je rekent veilig af met iDEAL, Bancontact, bankoverschrijving of crypto. Alle transacties zijn versleuteld en wij bewaren geen betaalgegevens.', 'You can pay securely with iDEAL, Bancontact, bank transfer or crypto. All transactions are encrypted and we do not store payment details.') },
];

interface CategorySEOSectionProps {
  slug: string;
  name: string;
  description?: string;
}

const CategorySEOSection = ({ slug, name, description }: CategorySEOSectionProps) => {
  const t = useT();
  const lang = useLang();
  const faqs = getCategorySeo(slug, lang)?.faqs ?? FAQS_BY_CATEGORY(t)[slug] ?? GENERIC_FAQS(t);
  const hasDescription = !!description?.trim();

  return (
    <section className="container py-12 border-t border-border/50 mt-8" aria-labelledby={`seo-${slug || 'cat'}`}>
      <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(faqSchema(faqs)) }} />

      <motion.div
        initial={{ opacity: 0, y: 16 }}
        whileInView={{ opacity: 1, y: 0 }}
        viewport={{ once: true, margin: '-100px' }}
        transition={{ duration: 0.5 }}
        className="grid lg:grid-cols-2 gap-8"
      >
        <div className="bg-card rounded-2xl border border-border/50 p-6 lg:p-8 shadow-card">
          <div className="flex items-center gap-2.5 mb-4">
            <div className="w-9 h-9 rounded-xl gradient-primary flex items-center justify-center shadow-sm">
              <Info className="w-5 h-5 text-white" />
            </div>
            <h2 id={`seo-${slug || 'cat'}`} className="text-xl md:text-2xl font-black">{t('Over', 'About')} {name}</h2>
          </div>

          {hasDescription ? (
            <div
              className="prose prose-sm dark:prose-invert max-w-none text-muted-foreground leading-relaxed [&_a]:text-primary [&_a]:no-underline hover:[&_a]:underline [&_h2]:text-foreground [&_h3]:text-foreground [&_strong]:text-foreground"
              dangerouslySetInnerHTML={sanitizedHtml(description)}
            />
          ) : (
            <p className="text-sm text-muted-foreground leading-relaxed">
              {t('Bij Peptidewinkel vind je een zorgvuldig samengesteld assortiment', 'At Peptidewinkel you will find a carefully curated range of')}{' '}
              <span className="font-semibold text-foreground">{name.toLowerCase()}</span>{' '}
              {t('van fabrikant Alpha BioPharma. Batches worden door het externe lab Janoshik getest op zuiverheid en gehalte (rapporten op Labtesten), en worden uitsluitend geleverd voor in-vitro laboratoriumonderzoek. Verzending is 100% discreet vanuit de EU. Vragen over reconstitutie of opslag? Ons team helpt je verder via Telegram of e-mail.', 'from manufacturer Alpha BioPharma. Batches are tested by the independent lab Janoshik for purity and content (reports on Lab Tests), and are supplied exclusively for in-vitro laboratory research. Shipping is 100% discreet from the EU. Questions about reconstitution or storage? Our team is happy to help via Telegram or e-mail.')}
            </p>
          )}
        </div>

        <div className="bg-card rounded-2xl border border-border/50 p-6 lg:p-8 shadow-card">
          <div className="flex items-center gap-2.5 mb-4">
            <div className="w-9 h-9 rounded-xl gradient-primary flex items-center justify-center shadow-sm">
              <HelpCircle className="w-5 h-5 text-white" />
            </div>
            <h2 className="text-xl md:text-2xl font-black">{t('Veelgestelde vragen over', 'Frequently asked questions about')} {name}</h2>
          </div>

          <Accordion type="single" collapsible className="w-full">
            {faqs.map((item, i) => (
              <AccordionItem key={i} value={`item-${i}`} className="border-border/50">
                <AccordionTrigger className="text-left text-sm font-semibold hover:no-underline hover:text-primary">
                  {item.q}
                </AccordionTrigger>
                <AccordionContent className="text-sm text-muted-foreground leading-relaxed">
                  {item.a}
                </AccordionContent>
              </AccordionItem>
            ))}
          </Accordion>
        </div>
      </motion.div>
    </section>
  );
};

export default CategorySEOSection;
