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 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