'use client';

import React from 'react';
import {Container} from 'react-bootstrap';

import type {MediaPage} from '@/types/mediaPage';
import ArticleBody from '@/components/Articles/ArticleBody';

import './MediaPageContent.css';

interface MediaPageContentProps {
  page: MediaPage;
  /** Bloc affiché sous le contenu, par exemple le menu des sous-pages de l'association. */
  children?: React.ReactNode;
}

/**
 * Page éditoriale administrée en back-office : titre en H1 et contenu HTML assaini.
 */
export default function MediaPageContent({page, children}: MediaPageContentProps) {
  return (
    <article className="tk-page">
      <Container>
        <div className="tk-page__wrap">
          <h1 className="tk-page__title">{page.titre}</h1>
          <ArticleBody html={page.contenu} />
          {children}
        </div>
      </Container>
    </article>
  );
}