components are forced to be a client components while they don't have any interactivity

Question

I have Index component that has 3 components, Questions, Answers and Pagination:

"use client";
import { useLocale } from "next-intl";
import { useEffect, useState } from "react"; // Import useState for managing state
import Answers from "./Answers";
import Pagination from "./Pagination";
import Questions from "./Questions";

const Index = ({ course }) => {
  const [questions, setQuestions] = useState([]);
  const locale = useLocale();
  useEffect(() => {
    const getQuestions = async () => {
      const response = await fetch(
        `http://localhost:3000/${locale}/courses/${course}/api`
      );
      const data = await response.json();
      setQuestions(data);
    };
    getQuestions();
  }, []);

  // State for pagination
  const [currentPage, setCurrentPage] = useState(1);
  const questionsPerPage = 5;

  // Calculate the questions to display for the current page
  const indexOfLastQuestion = currentPage * questionsPerPage;
  const indexOfFirstQuestion = indexOfLastQuestion - questionsPerPage;
  const currentQuestions = questions.slice(
    indexOfFirstQuestion,
    indexOfLastQuestion
  );

  // Function to handle page change
  const handlePageChange = (pageNumber) => {
    setCurrentPage(pageNumber);
  };

  return (
    <section className="container padding">
      <Questions currentQuestions={currentQuestions} />

      <Answers currentPage={currentPage} currentQuestions={currentQuestions} />

      <Pagination
        currentPage={currentPage}
        questions={questions}
        questionsPerPage={questionsPerPage}
        handlePageChange={handlePageChange}
      />
    </section>
  );
};

export default Index;

Pagination component need to be a client component because it has interactivity while Questions and Answers component don't need to be client component because they don't have any interactivity, but they take prop currentQuestions which tells them what Questions and Answers to display, this prop comes from client component Index and that automatically turns them to be client compoenent, how to solve this conflict ?