---
import Layout from '../layouts/Layout.astro'
import '../styles/globals.css'
import { getCollection, type CollectionEntry } from 'astro:content'
import { Header } from '../sections/Header'
import { Footer } from '../sections/Footer'
import { Enum_Category_Group } from '../graphql/graphql'
import { categoriesListQuery } from '../graphql-documents/categories.gql.generated'
import { CategoryView } from '../views/CategoryView'
import type { CategoriesListQuery } from '../graphql/graphql'
import type { SiteConfigContact } from '../lib/cms/contact/types'
import { siteConfigQuery } from '../graphql-documents/site-config.gql.generated'

export async function getStaticPaths() {
  const categories = await getCollection('categories')
  const [siteResult, solutionCategoriesResult, serviceCategoriesResult] = await Promise.all([
    siteConfigQuery.execute(),
    categoriesListQuery.execute({ group: Enum_Category_Group.Solution }),
    categoriesListQuery.execute({ group: Enum_Category_Group.Service }),
  ])
  if (siteResult.errors?.length) {
    throw new Error(siteResult.errors.map(e => e.message).join(', '))
  }
  if (solutionCategoriesResult.errors?.length) {
    throw new Error(solutionCategoriesResult.errors.map(e => e.message).join(', '))
  }
  if (serviceCategoriesResult.errors?.length) {
    throw new Error(serviceCategoriesResult.errors.map(e => e.message).join(', '))
  }
  const contacts = siteResult.data?.siteConfig?.contacts?.filter(c => c != null) ?? []
  const solutionCategories = solutionCategoriesResult.data?.categories?.filter(c => c != null) ?? []
  const serviceCategories = serviceCategoriesResult.data?.categories?.filter(c => c != null) ?? []

  return categories.map((entry: CollectionEntry<'categories'>) => ({
    params: { slug: entry.id },
    props: {
      title: entry.data.title,
      description: entry.data.description,
      vendors: entry.data.vendors,
      contacts,
      solutionCategories,
      serviceCategories,
    },
  }))
}

interface Props {
  title: string
  description: string
  vendors: {
    name: string
    description: string
    products?: string[]
  }[]
  contacts: SiteConfigContact[]
  solutionCategories: NonNullable<CategoriesListQuery['categories'][number]>[]
  serviceCategories: NonNullable<CategoriesListQuery['categories'][number]>[]
}

const { title, description, vendors, contacts, solutionCategories, serviceCategories } = Astro.props as Props
---

<Layout>
  <div class="min-h-screen bg-white w-full overflow-x-hidden">
    <Header
      client:load
      contacts={contacts}
      solutionCategories={solutionCategories}
      serviceCategories={serviceCategories}
    />
    <CategoryView client:load title={title} description={description} vendors={vendors} />
    <Footer client:load contacts={contacts} solutionCategories={solutionCategories} />
  </div>
</Layout>