"use client"

import * as React from "react"

import {
  Accordion,
  AccordionContent,
  AccordionItem,
  AccordionTrigger,
} from "@/components/ui/accordion"

export function FormSection({
  title,
  defaultOpen = true,
  children,
}: {
  title: string
  defaultOpen?: boolean
  children: React.ReactNode
}) {
  return (
    <Accordion type="single" collapsible defaultValue={defaultOpen ? "open" : ""}>
      <AccordionItem value="open" className="border-none">
        <AccordionTrigger className="px-4 lg:px-6">
          {title}
        </AccordionTrigger>
        <AccordionContent className="px-4 lg:px-6">
          <div className="rounded-lg border bg-card p-4">{children}</div>
        </AccordionContent>
      </AccordionItem>
    </Accordion>
  )
}