Add quiz behind #12
Merged
anthony.richard
merged 1 commits from Quiz_Behind into Common_Quizz 4 months ago
|
After Width: | Height: | Size: 39 KiB |
@ -0,0 +1,149 @@
|
|||||||
|
import React, { forwardRef } from "react";
|
||||||
|
import { View, TouchableOpacity, ViewProps } from "react-native";
|
||||||
|
import Text from "./ui/Text";
|
||||||
|
import {
|
||||||
|
AntDesign,
|
||||||
|
Entypo,
|
||||||
|
FontAwesome6,
|
||||||
|
Ionicons,
|
||||||
|
MaterialCommunityIcons,
|
||||||
|
} from "@expo/vector-icons";
|
||||||
|
import {
|
||||||
|
AntDesignIconNames,
|
||||||
|
CommunityIconNames,
|
||||||
|
EntypoIconNames,
|
||||||
|
FontAwesome6IconNames,
|
||||||
|
FontAwesomeIconNames,
|
||||||
|
IonIconNames,
|
||||||
|
} from "./Icons";
|
||||||
|
|
||||||
|
export type CheckBoxDirection = "row" | "col";
|
||||||
|
|
||||||
|
interface CheckBoxProps extends ViewProps {
|
||||||
|
label?: string;
|
||||||
|
onChange: () => void;
|
||||||
|
antIcon?: AntDesignIconNames;
|
||||||
|
entypoIcon?: EntypoIconNames;
|
||||||
|
fontAwesomeIcon?: FontAwesomeIconNames;
|
||||||
|
fontAwesome6Icon?: FontAwesome6IconNames;
|
||||||
|
communityIcon?: CommunityIconNames;
|
||||||
|
IonIcon?: IonIconNames;
|
||||||
|
value: boolean;
|
||||||
|
isCheckIconVisible?: boolean;
|
||||||
|
endText?: string;
|
||||||
|
direction?: CheckBoxDirection;
|
||||||
|
}
|
||||||
|
|
||||||
|
export default forwardRef<any, CheckBoxProps>(
|
||||||
|
(
|
||||||
|
{
|
||||||
|
label,
|
||||||
|
onChange,
|
||||||
|
antIcon,
|
||||||
|
entypoIcon,
|
||||||
|
fontAwesomeIcon,
|
||||||
|
fontAwesome6Icon,
|
||||||
|
communityIcon,
|
||||||
|
IonIcon,
|
||||||
|
value,
|
||||||
|
isCheckIconVisible,
|
||||||
|
endText,
|
||||||
|
direction,
|
||||||
|
className,
|
||||||
|
...props
|
||||||
|
},
|
||||||
|
ref
|
||||||
|
) => {
|
||||||
|
return (
|
||||||
|
<TouchableOpacity
|
||||||
|
onPress={onChange}
|
||||||
|
className={
|
||||||
|
"items-center p-4 rounded-3xl" +
|
||||||
|
" " +
|
||||||
|
((direction ?? "row") == "row"
|
||||||
|
? "flex-row justify-between gap-4"
|
||||||
|
: "justify-center gap-1") +
|
||||||
|
" " +
|
||||||
|
(value
|
||||||
|
? "bg-orange-600 border-4 border-orange-300"
|
||||||
|
: "bg-gray-300 border-4 border-gray-300") +
|
||||||
|
" " +
|
||||||
|
(className ?? "")
|
||||||
|
}
|
||||||
|
{...props}
|
||||||
|
{...ref}
|
||||||
|
>
|
||||||
|
<View>
|
||||||
|
{antIcon ? (
|
||||||
|
<AntDesign
|
||||||
|
name={antIcon}
|
||||||
|
size={30}
|
||||||
|
color={value ? "white" : "black"}
|
||||||
|
/>
|
||||||
|
) : null}
|
||||||
|
{entypoIcon ? (
|
||||||
|
<Entypo
|
||||||
|
name={entypoIcon}
|
||||||
|
size={30}
|
||||||
|
color={value ? "white" : "black"}
|
||||||
|
/>
|
||||||
|
) : null}
|
||||||
|
{communityIcon ? (
|
||||||
|
<MaterialCommunityIcons
|
||||||
|
name={communityIcon}
|
||||||
|
size={30}
|
||||||
|
color={value ? "white" : "black"}
|
||||||
|
/>
|
||||||
|
) : null}
|
||||||
|
{fontAwesomeIcon ? (
|
||||||
|
<FontAwesome6
|
||||||
|
name={fontAwesomeIcon}
|
||||||
|
size={30}
|
||||||
|
color={value ? "white" : "black"}
|
||||||
|
/>
|
||||||
|
) : null}
|
||||||
|
{fontAwesome6Icon ? (
|
||||||
|
<FontAwesome6
|
||||||
|
name={fontAwesome6Icon}
|
||||||
|
size={30}
|
||||||
|
color={value ? "white" : "black"}
|
||||||
|
/>
|
||||||
|
) : null}
|
||||||
|
{IonIcon ? (
|
||||||
|
<Ionicons
|
||||||
|
name={IonIcon}
|
||||||
|
size={30}
|
||||||
|
color={value ? "white" : "black"}
|
||||||
|
/>
|
||||||
|
) : null}
|
||||||
|
</View>
|
||||||
|
|
||||||
|
{label != null ? (
|
||||||
|
<Text
|
||||||
|
weight="bold"
|
||||||
|
color={value ? "white" : "black"}
|
||||||
|
className={(direction ?? "row") == "row" ? "flex-1" : ""}
|
||||||
|
>
|
||||||
|
{label}
|
||||||
|
</Text>
|
||||||
|
) : null}
|
||||||
|
|
||||||
|
{isCheckIconVisible ? (
|
||||||
|
<View
|
||||||
|
className={
|
||||||
|
"h-5 w-5 rounded border justify-center items-center" +
|
||||||
|
" " +
|
||||||
|
(value ? "border-white" : "border-black")
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{value && <View className="h-2 w-2 bg-white" />}
|
||||||
|
</View>
|
||||||
|
) : null}
|
||||||
|
|
||||||
|
{endText != null ? (
|
||||||
|
<Text color={value ? "white" : "black"}>{endText}</Text>
|
||||||
|
) : null}
|
||||||
|
</TouchableOpacity>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
);
|
||||||
@ -1,68 +0,0 @@
|
|||||||
import React, {Component} from "react";
|
|
||||||
import {View, Text, TouchableOpacity, Image} from "react-native";
|
|
||||||
import {
|
|
||||||
AntDesign,
|
|
||||||
Entypo,
|
|
||||||
FontAwesome6,
|
|
||||||
MaterialCommunityIcons,
|
|
||||||
} from "@expo/vector-icons";
|
|
||||||
import {
|
|
||||||
AntDesignIconNames,
|
|
||||||
CommunityIconNames,
|
|
||||||
EntypoIconNames,
|
|
||||||
FontAwesomeIconNames,
|
|
||||||
} from "./Icons";
|
|
||||||
|
|
||||||
interface CheckButtonProps {
|
|
||||||
label: string;
|
|
||||||
value: boolean;
|
|
||||||
onChange: () => void;
|
|
||||||
antIcon?: AntDesignIconNames;
|
|
||||||
entypoIcon?: EntypoIconNames;
|
|
||||||
fontAwesomeIcon?: FontAwesomeIconNames;
|
|
||||||
communityIcon?: CommunityIconNames;
|
|
||||||
}
|
|
||||||
|
|
||||||
const CheckButton: React.FC<CheckButtonProps> = ({ label, value, onChange, antIcon,
|
|
||||||
entypoIcon,
|
|
||||||
fontAwesomeIcon,
|
|
||||||
communityIcon, }) => {
|
|
||||||
return (
|
|
||||||
<View style={{ flexBasis: "33.33%"}}>
|
|
||||||
<TouchableOpacity onPress={onChange} className={`p-5 m-1 rounded-3xl ${value ? 'bg-orange-600 border-4 border-orange-300' : 'bg-gray-300 border-4 border-gray-300'} items-center`}>
|
|
||||||
{antIcon ? (
|
|
||||||
<AntDesign
|
|
||||||
name={antIcon}
|
|
||||||
size={30}
|
|
||||||
color={value ? "white" : "black"}
|
|
||||||
/>
|
|
||||||
) : null}
|
|
||||||
{entypoIcon ? (
|
|
||||||
<Entypo
|
|
||||||
name={entypoIcon}
|
|
||||||
size={30}
|
|
||||||
color={value ? "white" : "black"}
|
|
||||||
/>
|
|
||||||
) : null}
|
|
||||||
{communityIcon ? (
|
|
||||||
<MaterialCommunityIcons
|
|
||||||
name={communityIcon}
|
|
||||||
size={30}
|
|
||||||
color={value ? "white" : "black"}
|
|
||||||
/>
|
|
||||||
) : null}
|
|
||||||
{fontAwesomeIcon ? (
|
|
||||||
<FontAwesome6
|
|
||||||
name={fontAwesomeIcon}
|
|
||||||
size={30}
|
|
||||||
color={value ? "white" : "black"}
|
|
||||||
/>
|
|
||||||
) : null}
|
|
||||||
|
|
||||||
<Text className={`${value ? 'text-white' : 'text-black'}`}>{label}</Text>
|
|
||||||
</TouchableOpacity>
|
|
||||||
</View>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default CheckButton;
|
|
||||||
@ -1,34 +0,0 @@
|
|||||||
import React, {Component} from "react";
|
|
||||||
import {View, Text, TouchableOpacity, Image} from "react-native";
|
|
||||||
import {AntDesign, FontAwesome6} from "@expo/vector-icons";
|
|
||||||
import {AntDesignIconNames} from "./Icons";
|
|
||||||
|
|
||||||
interface CheckBoxProps {
|
|
||||||
label: string;
|
|
||||||
value: boolean;
|
|
||||||
onChange: () => void;
|
|
||||||
icon: AntDesignIconNames | string;
|
|
||||||
}
|
|
||||||
|
|
||||||
const CheckBox: React.FC<CheckBoxProps> = ({ label, value, onChange, icon }) => {
|
|
||||||
let AwesomIconList = ["weight-scale", "beer"];
|
|
||||||
return (
|
|
||||||
<TouchableOpacity onPress={onChange} className={`p-5 m-1 rounded-3xl ${value ? 'bg-orange-600 border-4 border-orange-300' : 'bg-gray-300 border-4 border-gray-300'} flex-row items-center`}>
|
|
||||||
<View className="mr-2.5">
|
|
||||||
{AwesomIconList.includes(icon) ? (
|
|
||||||
<FontAwesome6 name={icon} size={30} color={value ? "white" : "black"}/>
|
|
||||||
) : (
|
|
||||||
<AntDesign name={icon ?? "arrowleft"} size={30} color={value ? "white" : "black"}/>
|
|
||||||
)}
|
|
||||||
</View>
|
|
||||||
|
|
||||||
<Text className={`${value ? 'text-white' : 'text-black'} flex-1`}>{label}</Text>
|
|
||||||
|
|
||||||
<View className={`h-5 w-5 rounded border ${value ? 'border-white' : 'border-black'} items-center justify-center mr-2.5`}>
|
|
||||||
{value && <View className="h-2 w-2 bg-white" />}
|
|
||||||
</View>
|
|
||||||
</TouchableOpacity>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default CheckBox;
|
|
||||||
@ -1,3 +1,26 @@
|
|||||||
import { AntDesign } from "@expo/vector-icons";
|
import {
|
||||||
|
AntDesign,
|
||||||
|
Entypo,
|
||||||
|
FontAwesome,
|
||||||
|
Ionicons,
|
||||||
|
MaterialCommunityIcons,
|
||||||
|
} from "@expo/vector-icons";
|
||||||
|
|
||||||
export type AntDesignIconNames = keyof typeof AntDesign.glyphMap;
|
export type AntDesignIconNames = keyof typeof AntDesign.glyphMap;
|
||||||
|
export type EntypoIconNames = keyof typeof Entypo.glyphMap;
|
||||||
|
export type FontAwesomeIconNames = keyof typeof FontAwesome.glyphMap;
|
||||||
|
export type FontAwesome6IconNames =
|
||||||
|
| "person-running"
|
||||||
|
| "person-walking"
|
||||||
|
| "person-hiking"
|
||||||
|
| "skateboarding"
|
||||||
|
| "bike"
|
||||||
|
| "basketball"
|
||||||
|
| "heart"
|
||||||
|
| "yoga"
|
||||||
|
| "setting"
|
||||||
|
| "beer"
|
||||||
|
| "shield-heart"
|
||||||
|
| "weight-scale";
|
||||||
|
export type CommunityIconNames = keyof typeof MaterialCommunityIcons.glyphMap;
|
||||||
|
export type IonIconNames = keyof typeof Ionicons.glyphMap;
|
||||||
|
|||||||
@ -0,0 +1,54 @@
|
|||||||
|
import React, { useState } from "react";
|
||||||
|
import Question, { QuestionChildProps } from "./Question";
|
||||||
|
import { Image, View, Text } from "react-native";
|
||||||
|
import { MultiSelect } from "react-native-element-dropdown";
|
||||||
|
|
||||||
|
//@ts-ignore
|
||||||
|
import WheelChair from "@/assets/images/wheelchair.png";
|
||||||
|
import { EHealthProblem } from "@/model/enums/Enums";
|
||||||
|
|
||||||
|
export default React.forwardRef<any, QuestionChildProps>(
|
||||||
|
({ ...props }, ref) => {
|
||||||
|
const [selected, setSelected] = useState<string[]>([]);
|
||||||
|
|
||||||
|
type DataItem = {
|
||||||
|
label: string;
|
||||||
|
value: EHealthProblem;
|
||||||
|
};
|
||||||
|
|
||||||
|
const data: DataItem[] = [
|
||||||
|
{ label: "Arthrose", value: "ARTHROSE" },
|
||||||
|
{ label: "Migraine", value: "MIGRAINE" },
|
||||||
|
];
|
||||||
|
|
||||||
|
const renderItem = (item: { label: string }) => {
|
||||||
|
return (
|
||||||
|
<View className="p-4">
|
||||||
|
<Text>{item.label}</Text>
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Question
|
||||||
|
question="Avez-vous des problèmes physiques ?"
|
||||||
|
{...props}
|
||||||
|
{...ref}
|
||||||
|
>
|
||||||
|
<Image className="self-center" source={WheelChair} alt="" />
|
||||||
|
<View className="border-2 border-orange-500 rounded-3xl p-4">
|
||||||
|
<MultiSelect
|
||||||
|
data={data}
|
||||||
|
labelField="label"
|
||||||
|
valueField="value"
|
||||||
|
placeholder="Selectionnez un problème physique "
|
||||||
|
searchPlaceholder="Search..."
|
||||||
|
value={selected}
|
||||||
|
onChange={setSelected}
|
||||||
|
renderItem={renderItem}
|
||||||
|
/>
|
||||||
|
</View>
|
||||||
|
</Question>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
);
|
||||||
@ -1,15 +0,0 @@
|
|||||||
import React from "react";
|
|
||||||
import Question, { QuestionChildProps } from "./Question";
|
|
||||||
|
|
||||||
export default React.forwardRef<any, QuestionChildProps>(
|
|
||||||
(props, ref): React.ReactElement => {
|
|
||||||
const { ...rest } = props;
|
|
||||||
return (
|
|
||||||
<Question
|
|
||||||
question="Comment estimez vous votre niveau d'activité ?"
|
|
||||||
{...ref}
|
|
||||||
{...rest}
|
|
||||||
></Question>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
@ -0,0 +1,146 @@
|
|||||||
|
import {
|
||||||
|
EHealthProblem,
|
||||||
|
ESleepLevel,
|
||||||
|
ESport,
|
||||||
|
ESportLevel,
|
||||||
|
} from "./enums/Enums";
|
||||||
|
|
||||||
|
export class User {
|
||||||
|
private _name: string;
|
||||||
|
private _age: number;
|
||||||
|
private _height: number;
|
||||||
|
private _weight: number;
|
||||||
|
private _sexe: boolean; // true = Male, false = Female
|
||||||
|
private _logo: string;
|
||||||
|
private _nbSessionPerWeek: number;
|
||||||
|
private _goal: string;
|
||||||
|
private _healthProblems: EHealthProblem[];
|
||||||
|
private _sport: ESport;
|
||||||
|
private _sleepLevel: ESleepLevel;
|
||||||
|
private _sportLevel: ESportLevel;
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
name: string,
|
||||||
|
age: number,
|
||||||
|
height: number,
|
||||||
|
weight: number,
|
||||||
|
sexe: boolean,
|
||||||
|
logo: string,
|
||||||
|
nbSessionPerWeek: number,
|
||||||
|
goal: string,
|
||||||
|
healthProblems: EHealthProblem[],
|
||||||
|
sport: ESport,
|
||||||
|
sleepLevel: ESleepLevel,
|
||||||
|
sportLevel: ESportLevel
|
||||||
|
) {
|
||||||
|
this._name = name;
|
||||||
|
this._age = age;
|
||||||
|
this._height = height;
|
||||||
|
this._weight = weight;
|
||||||
|
this._sexe = sexe;
|
||||||
|
this._logo = logo;
|
||||||
|
this._nbSessionPerWeek = nbSessionPerWeek;
|
||||||
|
this._goal = goal;
|
||||||
|
this._healthProblems = healthProblems;
|
||||||
|
this._sport = sport;
|
||||||
|
this._sleepLevel = sleepLevel;
|
||||||
|
this._sportLevel = sportLevel;
|
||||||
|
}
|
||||||
|
|
||||||
|
get name(): string {
|
||||||
|
return this._name;
|
||||||
|
}
|
||||||
|
|
||||||
|
get age(): number {
|
||||||
|
return this._age;
|
||||||
|
}
|
||||||
|
|
||||||
|
get height(): number {
|
||||||
|
return this._height;
|
||||||
|
}
|
||||||
|
|
||||||
|
get weight(): number {
|
||||||
|
return this._weight;
|
||||||
|
}
|
||||||
|
|
||||||
|
get sexe(): boolean {
|
||||||
|
return this._sexe;
|
||||||
|
}
|
||||||
|
|
||||||
|
get logo(): string {
|
||||||
|
return this._logo;
|
||||||
|
}
|
||||||
|
|
||||||
|
get nbSessionPerWeek(): number {
|
||||||
|
return this._nbSessionPerWeek;
|
||||||
|
}
|
||||||
|
|
||||||
|
get goals(): string {
|
||||||
|
return this._goal;
|
||||||
|
}
|
||||||
|
|
||||||
|
get healthProblems(): EHealthProblem[] {
|
||||||
|
return this._healthProblems;
|
||||||
|
}
|
||||||
|
|
||||||
|
get sports(): ESport {
|
||||||
|
return this._sport;
|
||||||
|
}
|
||||||
|
|
||||||
|
get sleepLevel(): ESleepLevel {
|
||||||
|
return this._sleepLevel;
|
||||||
|
}
|
||||||
|
|
||||||
|
get sportLevel(): ESportLevel {
|
||||||
|
return this._sportLevel;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Setters
|
||||||
|
set name(value: string) {
|
||||||
|
this._name = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set age(value: number) {
|
||||||
|
this._age = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set height(value: number) {
|
||||||
|
this._height = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set weight(value: number) {
|
||||||
|
this._weight = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set sexe(value: boolean) {
|
||||||
|
this._sexe = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set logo(value: string) {
|
||||||
|
this._logo = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set nbSessionPerWeek(value: number) {
|
||||||
|
this._nbSessionPerWeek = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set goals(value: string) {
|
||||||
|
this._goal = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set healthProblems(value: EHealthProblem[]) {
|
||||||
|
this._healthProblems = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set sports(value: ESport) {
|
||||||
|
this._sport = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set sleepLevel(value: ESleepLevel) {
|
||||||
|
this._sleepLevel = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set sportLevel(value: ESportLevel) {
|
||||||
|
this._sportLevel = value;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,42 @@
|
|||||||
|
export const Goals = [
|
||||||
|
"WEIGHT_LOSE",
|
||||||
|
"IMPROVE_MUSCLE",
|
||||||
|
"WEIGHT_GAIN",
|
||||||
|
"IMPROVE_STAMINA",
|
||||||
|
"KEEP_FIT",
|
||||||
|
] as const;
|
||||||
|
|
||||||
|
export const SportLevels = [
|
||||||
|
"NOT_SPORTY",
|
||||||
|
"BEGINNER",
|
||||||
|
"SPORTY",
|
||||||
|
"VERY_SPORTY",
|
||||||
|
"PERFORMER",
|
||||||
|
] as const;
|
||||||
|
|
||||||
|
export const Sports = [
|
||||||
|
"RUNNING",
|
||||||
|
"WALKING",
|
||||||
|
"RANDO",
|
||||||
|
"SKATEBOARD",
|
||||||
|
"BIKING",
|
||||||
|
"BASKETBALL",
|
||||||
|
"CARDIO",
|
||||||
|
"YOGA",
|
||||||
|
"ELSE",
|
||||||
|
] as const;
|
||||||
|
|
||||||
|
export const SleepLevels = [
|
||||||
|
"TERRIBLE",
|
||||||
|
"VERY_BAD",
|
||||||
|
"BAD",
|
||||||
|
"GOOD",
|
||||||
|
"EXCELLENT",
|
||||||
|
] as const;
|
||||||
|
|
||||||
|
export type EGoal = (typeof Goals)[number];
|
||||||
|
export type ESportLevel = (typeof SportLevels)[number];
|
||||||
|
export type ESport = (typeof Sports)[number];
|
||||||
|
export type ESleepLevel = (typeof SleepLevels)[number];
|
||||||
|
|
||||||
|
export type EHealthProblem = "ARTHROSE" | "MIGRAINE";
|
||||||
Loading…
Reference in new issue