"use client";

import ForumItem from "@/app/[language]/forum/components/ForumItem";
import useGetForums from "@/app/[language]/forums/query/useGetForums";
import { useParams } from "next/navigation";
import Col from "react-bootstrap/Col";
import Row from "react-bootstrap/Row";

export default function Page() {
  const { forumGroup } = useParams<{ forumGroup?: string }>();

  const { data: forums, isFetched: isForumsLoaded } = useGetForums(forumGroup);

  return (
    <Row className="g-4">
      {forums.map((forum) => (
        <Col key={forum.forumID} xs={12} md={6}>
          <ForumItem forum={forum} />
        </Col>
      ))}
    </Row>
  );
}
