import { Container, Col, Row } from "react-bootstrap";
import { UpdateArticleEditor } from "@/modules/features/article/components/articleEditor";
import { fetchArticle } from "@/modules/features/article/fetch/fetchArticle";
import { Suspense } from "react";

type Props = {
    params: Promise<{
        slug: string;
    }>;
};

const Page = async ({ params }: Props) => {
    const article = fetchArticle((await params).slug);

    return (
        <div className="editor-page">
            <Container className="page">
                <Row>
                    <Col xs={12} md={{ span: 10, offset: 1 }}>
                        <Suspense fallback={<p>⌛ Chargement...</p>}>
                            <UpdateArticleEditor defaultValues={article} />
                        </Suspense>
                    </Col>
                </Row>
            </Container>
        </div>
    );
};

export default Page;