import React from "react";
import Question, { QuestionChildProps } from "./Question";
import SegmentedControl from "../ui/SegmentedControl";
import { Image } from "react-native";

//@ts-ignore
import BenchImage from "@/assets/images/bench.png";

export default React.forwardRef<any, QuestionChildProps>(
  (props, ref): React.ReactElement => {
    const ANSWERS = ["Non", "Oui"];
    const [answer, setAnswer] = React.useState("Oui");

    return (
      <Question
        question="Êtes-vous un novice de la musculation ?"
        {...ref}
        {...props}
      >
        <Image className="self-center" source={BenchImage} alt="" />
        <SegmentedControl
          values={ANSWERS}
          selectedIndex={ANSWERS.indexOf(answer)}
          onValueChange={setAnswer}
        />
      </Question>
    );
  }
);