import { Outlet } from "react-router-dom";
import styles from "./styles.module.scss";
import ProgressBar from "@/components/ChatsPath/components/ProgressBar";
import { useSelector } from "react-redux";
import { selectors } from "@/store";

function Quiz() {
  const currentStep = useSelector(selectors.selectCurrentStep);

  return (
    <section className={styles.container}>
      <div className={styles.content}>
        <ProgressBar currentStep={currentStep} />
      </div>
      <div className={styles["content-wrapper"]}>
        <div className={styles.content}>
          <Outlet />
        </div>
      </div>
    </section>
  );
}

export default Quiz;
