import Pretitle from '@/ui/Pretitle'
import { PortableText, stegaClean } from 'next-sanity'
import { Suspense } from 'react'
import SearchForm from './SearchForm'
import type { SearchScope } from './store'
import CTAList from '@/ui/CTAList'
import moduleProps from '@/lib/moduleProps'
export default function SearchModule({
pretitle,
intro,
ctas,
scope,
path,
...props
}: Partial<{
pretitle: string
intro: any
ctas: Sanity.CTA[]
scope: SearchScope
path: string
}>) {
return (
<section className="section space-y-8" {...moduleProps(props)}>
{(pretitle || intro) && (
<header className="richtext text-center">
<Pretitle>{pretitle}</Pretitle>
<PortableText value={intro} />
</header>
)}
<div className="mx-auto max-w-screen-sm">
<Suspense fallback={<div className="skeleton-[calc(1lh+.5rem+2px)]" />}>
<SearchForm scope={stegaClean(scope)} path={stegaClean(path)} />
</Suspense>
</div>
<CTAList className="justify-center" ctas={ctas} />
</section>
)
}