You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
89 lines
2.3 KiB
89 lines
2.3 KiB
import { EGoal, Goals } from "@/model/enums/Enums";
|
|
import React, {
|
|
forwardRef,
|
|
ReactElement,
|
|
useImperativeHandle,
|
|
useState,
|
|
} from "react";
|
|
import { View } from "react-native";
|
|
import CheckBox from "../CheckBox";
|
|
import {
|
|
AntDesignIconNames,
|
|
CommunityIconNames,
|
|
EntypoIconNames,
|
|
FontAwesome6IconNames,
|
|
IonIconNames,
|
|
} from "../Icons";
|
|
import Question, { QuestionChildProps } from "./Question";
|
|
|
|
export interface GoalQuestionRef {
|
|
getAnswer: () => EGoal;
|
|
}
|
|
|
|
export default forwardRef<GoalQuestionRef, QuestionChildProps>(
|
|
({ ...props }, ref): ReactElement => {
|
|
const [checkedItems, setCheckedItems] = useState([
|
|
true,
|
|
...Array(4).fill(false),
|
|
]);
|
|
|
|
interface IData {
|
|
label: string;
|
|
commIcon?: CommunityIconNames;
|
|
antIcon?: AntDesignIconNames;
|
|
entypoIcon?: EntypoIconNames;
|
|
fontAwesomeIcon?: FontAwesome6IconNames;
|
|
ionIcon?: IonIconNames;
|
|
}
|
|
|
|
const data: IData[] = [
|
|
{ label: "Perte de poids", commIcon: "weight" },
|
|
{ label: "Renforcement musculaire", commIcon: "arm-flex-outline" },
|
|
{ label: "Prise de masse", ionIcon: "beer-outline" },
|
|
{ label: "Amélioration endurance", fontAwesomeIcon: "shield-heart" },
|
|
{ label: "Maintenir en forme", antIcon: "linechart" },
|
|
];
|
|
|
|
const handleChange = (index: number) => {
|
|
const newCheckedState = checkedItems.map((_, i) => i === index);
|
|
setCheckedItems(newCheckedState);
|
|
};
|
|
|
|
useImperativeHandle(ref, () => ({
|
|
getAnswer: () => {
|
|
let selected = 0;
|
|
checkedItems.forEach((item, index) => {
|
|
if (item) {
|
|
selected = index;
|
|
}
|
|
});
|
|
return Goals[selected];
|
|
},
|
|
}));
|
|
|
|
return (
|
|
<Question
|
|
question="Quel est votre objectif dans l'application ?"
|
|
{...ref}
|
|
{...props}
|
|
>
|
|
<View className="gap-2">
|
|
{data.map((item, index) => (
|
|
<CheckBox
|
|
key={index}
|
|
label={item.label}
|
|
value={checkedItems[index]}
|
|
onChange={() => handleChange(index)}
|
|
fontAwesome6Icon={item.fontAwesomeIcon}
|
|
communityIcon={item.commIcon}
|
|
antIcon={item.antIcon}
|
|
entypoIcon={item.entypoIcon}
|
|
IonIcon={item.ionIcon}
|
|
/>
|
|
))}
|
|
</View>
|
|
</Question>
|
|
);
|
|
}
|
|
);
|