import { getTranslations } from 'next-intl/server';
import { getLocale } from 'next-intl/server';
import { notFound } from 'next/navigation';

import { BreadcrumbItem } from '@/components/common/Breadcrumbs';
import { BreadcrumbsSlot } from '@/components/common/BreadcrumbsShell';

import { SECTION_COMPONENT_MAP } from '@/config/creator-pages/creatorPagesComponentMap';
import { CREATOR_PAGES_CONFIG, CreatorSubPageId } from '@/config/creator-pages/creatorPagesConfig';
import { defaultLocale, isAppLocale } from '@/config/i18n';
import { redirect } from '@/i18n/navigation';

export default async function CreatorSectionPage({
  params,
}: {
  params: Promise<{ id: string; section: string }>;
}) {
  const { id, section } = await params;

  // type guard
  if (!(section in SECTION_COMPONENT_MAP)) {
    notFound();
  }

  const SectionComponent = SECTION_COMPONENT_MAP[section as CreatorSubPageId];
  const tGrid = await getTranslations('creatorPage.grid');
  const sectionConfig = Object.values(CREATOR_PAGES_CONFIG).find((item) => item.id === section);
  const locale = await getLocale();
  const resolvedLocale = isAppLocale(locale) ? locale : defaultLocale;
  if (sectionConfig?.visibleLocales && !sectionConfig.visibleLocales.includes(resolvedLocale)) {
    redirect({
      href: { pathname: '/alkoto/[id]', params: { id } },
      locale: resolvedLocale,
    });
  }
  const sectionLabel = sectionConfig ? tGrid(sectionConfig.id) : null;
  const breadcrumbItems: BreadcrumbItem[] = sectionLabel
    ? [
        {
          label: sectionLabel,
          hideBelow: 'lg',
        },
      ]
    : [];

  return (
    <>
      {breadcrumbItems.length > 0 && <BreadcrumbsSlot items={breadcrumbItems} />}
      <SectionComponent creatorId={id} />
    </>
  );
}