import React from 'react';
import { notFound } from 'next/navigation';

import BasicPageTemplate from '@/templates/BasicPageTemplate';
import RoomContents from '@/sections/RoomContents';
import Api from '@/api';
import { getDictionary } from '@/libraries/dictionary';
import { formatFloor } from '@/utils/formatFloor';
import { Locale, defaultLocale } from '@/i18n.config';
import { FloorKeyType, RoomContentType } from '@/types';

export default async function RoomPage({
  params: { floor, lang, room, section },
}: {
  params: {
    floor: FloorKeyType;
    lang: Locale;
    room: string;
    section: string;
  };
}) {
  const d = await getDictionary(lang);
  const content: RoomContentType = await Api.rooms.getBySlug(room, lang);
  const quiz = !!content?.show_quiz ? await Api.quiz.getContent(lang) : [];
  const floorId = formatFloor(floor, true);

  if (!content || content?.floor !== floorId) {
    return notFound();
  }

  return (
    <BasicPageTemplate lang={lang || defaultLocale} title={content?.name}>
      <RoomContents
        content={content}
        lang={lang}
        quiz={quiz}
        room={content?.name}
        section={section}
        translations={{
          backToTop: d?.phrases?.backToTheTop,
          incorrectAnswer: d?.phrases?.incorrectAnswer,
          nextRoom: d?.phrases?.nextRoom,
          questionTitle: d?.words?.question,
        }}
      />
    </BasicPageTemplate>
  );
};
