mirror of
https://github.com/Paris-est-Ludique/intranet.git
synced 2025-06-08 08:34:20 +02:00
Update meals, tee-shirt and hosting forms
This commit is contained in:
parent
d58c4ed3ea
commit
459ef4a85d
@ -19,12 +19,8 @@ export function AskHosting(asks: JSX.Element[], id: number): void {
|
|||||||
}, [dispatch, id, jwtToken, volunteerAsks?.hiddenAsks])
|
}, [dispatch, id, jwtToken, volunteerAsks?.hiddenAsks])
|
||||||
|
|
||||||
const [hosting] = useUserHosting()
|
const [hosting] = useUserHosting()
|
||||||
const needsHosting = get(hosting, "needsHosting", false)
|
const hostingType = get(hosting, "hostingType", false)
|
||||||
const canHostCount = get(hosting, "canHostCount", 0)
|
const needToShow = hostingType === ""
|
||||||
const distanceToFestival = get(hosting, "distanceToFestival", 0)
|
|
||||||
const hostingComment = get(hosting, "hostingComment", "")
|
|
||||||
const needToShow =
|
|
||||||
!needsHosting && canHostCount === 0 && distanceToFestival === 0 && hostingComment === ""
|
|
||||||
|
|
||||||
addAsk(
|
addAsk(
|
||||||
asks,
|
asks,
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { get } from "lodash"
|
import { get } from "lodash"
|
||||||
import { useCallback } from "react"
|
import { useCallback } from "react"
|
||||||
import { fetchVolunteerAsksSet } from "../../store/volunteerAsksSet"
|
import { fetchVolunteerAsksSet } from "../../store/volunteerAsksSet"
|
||||||
import { useAskTools, addAsk, answerLaterOnProfile } from "./utils"
|
import { useAskTools, addAsk, answerLaterOnProfileBefore } from "./utils"
|
||||||
import MealsForm, { fetchFor as fetchForMealsForm } from "../VolunteerBoard/MealsForm/MealsForm"
|
import MealsForm, { fetchFor as fetchForMealsForm } from "../VolunteerBoard/MealsForm/MealsForm"
|
||||||
import { useUserMeals } from "../VolunteerBoard/meals.utils"
|
import { useUserMeals } from "../VolunteerBoard/meals.utils"
|
||||||
|
|
||||||
@ -16,13 +16,9 @@ export function AskMeals(asks: JSX.Element[], id: number): void {
|
|||||||
)
|
)
|
||||||
}, [dispatch, id, jwtToken, volunteerAsks?.hiddenAsks])
|
}, [dispatch, id, jwtToken, volunteerAsks?.hiddenAsks])
|
||||||
|
|
||||||
const [meals] = useUserMeals()
|
const [userMeals] = useUserMeals()
|
||||||
const needsMeals = get(meals, "needsMeals", false)
|
const meals = get(userMeals, "meals", [])
|
||||||
const canHostCount = get(meals, "canHostCount", 0)
|
const needToShow = meals.length === 0
|
||||||
const distanceToFestival = get(meals, "distanceToFestival", 0)
|
|
||||||
const mealsComment = get(meals, "mealsComment", "")
|
|
||||||
const needToShow =
|
|
||||||
!needsMeals && canHostCount === 0 && distanceToFestival === 0 && mealsComment === ""
|
|
||||||
|
|
||||||
addAsk(
|
addAsk(
|
||||||
asks,
|
asks,
|
||||||
@ -30,7 +26,9 @@ export function AskMeals(asks: JSX.Element[], id: number): void {
|
|||||||
volunteerAsks,
|
volunteerAsks,
|
||||||
false,
|
false,
|
||||||
needToShow,
|
needToShow,
|
||||||
<MealsForm afterSubmit={onSubmit}>{answerLaterOnProfile}</MealsForm>
|
<MealsForm afterSubmit={onSubmit}>
|
||||||
|
{answerLaterOnProfileBefore("31 mai à minuit pour commander les repas !")}
|
||||||
|
</MealsForm>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -7,14 +7,14 @@ import { AskWelcome } from "./AskWelcome"
|
|||||||
// import { AskRetex, fetchFor as fetchForRetex } from "./AskRetex"
|
// import { AskRetex, fetchFor as fetchForRetex } from "./AskRetex"
|
||||||
import { AskDiscord, fetchFor as fetchForDiscord } from "./AskDiscord"
|
import { AskDiscord, fetchFor as fetchForDiscord } from "./AskDiscord"
|
||||||
import { AskDayWishes, fetchFor as fetchForDayWishes } from "./AskDayWishes"
|
import { AskDayWishes, fetchFor as fetchForDayWishes } from "./AskDayWishes"
|
||||||
// import { AskHosting, fetchFor as fetchForHosting } from "./AskHosting"
|
import { AskHosting, fetchFor as fetchForHosting } from "./AskHosting"
|
||||||
// import { AskMeals, fetchFor as fetchForMeals } from "./AskMeals"
|
import { AskMeals, fetchFor as fetchForMeals } from "./AskMeals"
|
||||||
// import { AskPersonalInfo, fetchFor as fetchForPersonalInfo } from "./AskPersonalInfo"
|
// import { AskPersonalInfo, fetchFor as fetchForPersonalInfo } from "./AskPersonalInfo"
|
||||||
import { AskTeamWishes, fetchFor as fetchForTeamWishes } from "./AskTeamWishes"
|
import { AskTeamWishes, fetchFor as fetchForTeamWishes } from "./AskTeamWishes"
|
||||||
// import {
|
import {
|
||||||
// AskParticipationDetails,
|
AskParticipationDetails,
|
||||||
// fetchFor as fetchForParticipationDetails,
|
fetchFor as fetchForParticipationDetails,
|
||||||
// } from "./AskParticipationDetails"
|
} from "./AskParticipationDetails"
|
||||||
// import { AskPushNotif } from "./AskPushNotif"
|
// import { AskPushNotif } from "./AskPushNotif"
|
||||||
|
|
||||||
const Asks = (): JSX.Element | null => {
|
const Asks = (): JSX.Element | null => {
|
||||||
@ -28,10 +28,10 @@ const Asks = (): JSX.Element | null => {
|
|||||||
|
|
||||||
AskDayWishes(asks, 10)
|
AskDayWishes(asks, 10)
|
||||||
AskTeamWishes(asks, 11)
|
AskTeamWishes(asks, 11)
|
||||||
// AskParticipationDetails(asks, 12)
|
AskMeals(asks, 15)
|
||||||
// AskPersonalInfo(asks, 15)
|
// AskPersonalInfo(asks, 16)
|
||||||
// AskHosting(asks, 20)
|
AskHosting(asks, 20)
|
||||||
// AskMeals(asks, 22)
|
AskParticipationDetails(asks, 22)
|
||||||
|
|
||||||
// AskPushNotif(asks, 99)
|
// AskPushNotif(asks, 99)
|
||||||
|
|
||||||
@ -42,6 +42,9 @@ const Asks = (): JSX.Element | null => {
|
|||||||
<div className={styles.notificationsContent}>
|
<div className={styles.notificationsContent}>
|
||||||
<div className={styles.formLine}>
|
<div className={styles.formLine}>
|
||||||
<label>
|
<label>
|
||||||
|
Si tu veux changer la réponse à l'une des questions posées ici, va
|
||||||
|
dans <a href="/profil">Mon profil</a> :)
|
||||||
|
<br />
|
||||||
Tu as fait le tour des dernières infos ou questions importantes,
|
Tu as fait le tour des dernières infos ou questions importantes,
|
||||||
merci ! :)
|
merci ! :)
|
||||||
<br />
|
<br />
|
||||||
@ -70,9 +73,9 @@ export const fetchFor = [
|
|||||||
// ...fetchForRetex,
|
// ...fetchForRetex,
|
||||||
...fetchForDiscord,
|
...fetchForDiscord,
|
||||||
...fetchForDayWishes,
|
...fetchForDayWishes,
|
||||||
// ...fetchForHosting,
|
...fetchForHosting,
|
||||||
// ...fetchForMeals,
|
...fetchForMeals,
|
||||||
...fetchForTeamWishes,
|
...fetchForTeamWishes,
|
||||||
// ...fetchForParticipationDetails,
|
...fetchForParticipationDetails,
|
||||||
// ...fetchForPersonalInfo,
|
// ...fetchForPersonalInfo,
|
||||||
]
|
]
|
||||||
|
@ -61,3 +61,12 @@ export const answerLaterOnProfile = (
|
|||||||
Tu pourras y répondre plus tard sur la page <a href="/profil">Mon profil</a>.
|
Tu pourras y répondre plus tard sur la page <a href="/profil">Mon profil</a>.
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
|
|
||||||
|
export function answerLaterOnProfileBefore(textDate: string): JSX.Element {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
Tu pourras y répondre plus tard sur la page <a href="/profil">Mon profil</a>.<br />
|
||||||
|
Il nous fait une réponse avant le {textDate}
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
@ -1,21 +1,21 @@
|
|||||||
import { FC, memo } from "react"
|
import { FC, memo } from "react"
|
||||||
import DayWishes from "./DayWishes/DayWishes"
|
import DayWishes from "./DayWishes/DayWishes"
|
||||||
import DayWishesFormModal from "./DayWishesForm/DayWishesFormModal"
|
import DayWishesFormModal from "./DayWishesForm/DayWishesFormModal"
|
||||||
// import Hosting from "./Hosting/Hosting"
|
import Hosting from "./Hosting/Hosting"
|
||||||
// import HostingFormModal from "./HostingForm/HostingFormModal"
|
import HostingFormModal from "./HostingForm/HostingFormModal"
|
||||||
// import Meals from "./Meals/Meals"
|
import Meals from "./Meals/Meals"
|
||||||
// import MealsFormModal from "./MealsForm/MealsFormModal"
|
import MealsFormModal from "./MealsForm/MealsFormModal"
|
||||||
// import ParticipationDetails from "./ParticipationDetails/ParticipationDetails"
|
import ParticipationDetails from "./ParticipationDetails/ParticipationDetails"
|
||||||
// import ParticipationDetailsFormModal from "./ParticipationDetailsForm/ParticipationDetailsFormModal"
|
import ParticipationDetailsFormModal from "./ParticipationDetailsForm/ParticipationDetailsFormModal"
|
||||||
import TeamWishes from "./TeamWishes/TeamWishes"
|
import TeamWishes from "./TeamWishes/TeamWishes"
|
||||||
import TeamWishesFormModal from "./TeamWishesForm/TeamWishesFormModal"
|
import TeamWishesFormModal from "./TeamWishesForm/TeamWishesFormModal"
|
||||||
import VolunteerTeam from "./VolunteerTeam/VolunteerTeam"
|
import VolunteerTeam from "./VolunteerTeam/VolunteerTeam"
|
||||||
import withUserConnected from "../../utils/withUserConnected"
|
import withUserConnected from "../../utils/withUserConnected"
|
||||||
import ContentTitle from "../ui/Content/ContentTitle"
|
import ContentTitle from "../ui/Content/ContentTitle"
|
||||||
import { fetchFor as fetchForDayWishesForm } from "./DayWishesForm/DayWishesForm"
|
import { fetchFor as fetchForDayWishesForm } from "./DayWishesForm/DayWishesForm"
|
||||||
// import { fetchFor as fetchForHostingForm } from "./HostingForm/HostingForm"
|
import { fetchFor as fetchForHostingForm } from "./HostingForm/HostingForm"
|
||||||
// import { fetchFor as fetchForMealsForm } from "./MealsForm/MealsForm"
|
import { fetchFor as fetchForMealsForm } from "./MealsForm/MealsForm"
|
||||||
// import { fetchFor as fetchForParticipationDetailsForm } from "./ParticipationDetailsForm/ParticipationDetailsForm"
|
import { fetchFor as fetchForParticipationDetailsForm } from "./ParticipationDetailsForm/ParticipationDetailsForm"
|
||||||
import { fetchFor as fetchForTeamWishesForm } from "./TeamWishesForm/TeamWishesForm"
|
import { fetchFor as fetchForTeamWishesForm } from "./TeamWishesForm/TeamWishesForm"
|
||||||
import { fetchFor as fetchForPersonalInfoForm } from "./PersonalInfoForm/PersonalInfoForm"
|
import { fetchFor as fetchForPersonalInfoForm } from "./PersonalInfoForm/PersonalInfoForm"
|
||||||
import PersonalInfo from "./PersonalInfo/PersonalInfo"
|
import PersonalInfo from "./PersonalInfo/PersonalInfo"
|
||||||
@ -42,15 +42,15 @@ const Board: FC = (): JSX.Element => (
|
|||||||
{retex && <RetexFormModal />} */}
|
{retex && <RetexFormModal />} */}
|
||||||
<DayWishes />
|
<DayWishes />
|
||||||
<DayWishesFormModal />
|
<DayWishesFormModal />
|
||||||
{/* <ParticipationDetails />
|
<ParticipationDetails />
|
||||||
<ParticipationDetailsFormModal /> */}
|
<ParticipationDetailsFormModal />
|
||||||
|
<Hosting />
|
||||||
|
<HostingFormModal />
|
||||||
|
<Meals />
|
||||||
|
<MealsFormModal />
|
||||||
<TeamWishes />
|
<TeamWishes />
|
||||||
<TeamWishesFormModal />
|
<TeamWishesFormModal />
|
||||||
<VolunteerTeam />
|
<VolunteerTeam />
|
||||||
{/* <Hosting />
|
|
||||||
<HostingFormModal />
|
|
||||||
<Meals />
|
|
||||||
<MealsFormModal /> */}
|
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
// )
|
// )
|
||||||
@ -63,8 +63,8 @@ export const fetchFor = [
|
|||||||
// ...fetchForRetexForm,
|
// ...fetchForRetexForm,
|
||||||
// ...fetchForBrunchForm,
|
// ...fetchForBrunchForm,
|
||||||
...fetchForDayWishesForm,
|
...fetchForDayWishesForm,
|
||||||
// ...fetchForHostingForm,
|
...fetchForHostingForm,
|
||||||
// ...fetchForMealsForm,
|
...fetchForMealsForm,
|
||||||
// ...fetchForParticipationDetailsForm,
|
...fetchForParticipationDetailsForm,
|
||||||
...fetchForTeamWishesForm,
|
...fetchForTeamWishesForm,
|
||||||
]
|
]
|
||||||
|
@ -7,48 +7,31 @@ import { displayModal, MODAL_IDS } from "../../../store/ui"
|
|||||||
|
|
||||||
const Hosting: FC = (): JSX.Element | null => {
|
const Hosting: FC = (): JSX.Element | null => {
|
||||||
const [userWishes] = useUserHosting()
|
const [userWishes] = useUserHosting()
|
||||||
const needsHosting = get(userWishes, "needsHosting", false)
|
const hostingType = get(userWishes, "hostingType", "")
|
||||||
const canHostCount = get(userWishes, "canHostCount", 0)
|
const canHostCount = get(userWishes, "canHostCount", 0)
|
||||||
const distanceToFestival = get(userWishes, "distanceToFestival", 0)
|
|
||||||
const comment = get(userWishes, "hostingComment", "")
|
|
||||||
const execDisplayModal = useAction(displayModal)
|
const execDisplayModal = useAction(displayModal)
|
||||||
const onEdit = useCallback(() => execDisplayModal(MODAL_IDS.HOSTING), [execDisplayModal])
|
const onEdit = useCallback(() => execDisplayModal(MODAL_IDS.HOSTING), [execDisplayModal])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.hosting}>
|
<div className={styles.hosting}>
|
||||||
<div className={styles.title}>Mon hébergement</div>
|
<div className={styles.title}>Mon hébergement</div>
|
||||||
{!needsHosting && (
|
{(hostingType === "" || hostingType === "neither") && (
|
||||||
<div className={styles.hostingLabel}>
|
<div className={styles.hostingLabel}>
|
||||||
Je n'ai pas besoin d'un hébergement proche du festival
|
Je ne peux héberger personnes que ça arrangerait.
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{needsHosting && (
|
{hostingType === "need" && (
|
||||||
<div className={styles.hostingLabel}>
|
<div className={styles.hostingLabel}>
|
||||||
J'ai <b>besoin</b> d'un hébergement proche du festival
|
J'ai précisé mon <b>besoin</b> d'un hébergement par un bénévole proche du
|
||||||
|
festival
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{canHostCount === 0 && distanceToFestival === 0 && (
|
{hostingType === "can" && (
|
||||||
<div className={styles.hostingLabel}>
|
<div className={styles.hostingLabel}>
|
||||||
Je ne peux héberger personnes de manière utile.
|
Je peux héberger <b>{canHostCount} bénévole(s)</b> !
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{canHostCount > 0 && (
|
|
||||||
<div className={styles.hostingLabel}>
|
|
||||||
Je peux héberger <b>{canHostCount} personnes</b> !
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{distanceToFestival > 0 && (
|
|
||||||
<div className={styles.hostingLabel}>
|
|
||||||
Je suis à <b>{distanceToFestival} minutes</b> du festival
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{comment && (
|
|
||||||
<div className={styles.commentLine}>
|
|
||||||
<span className={styles.commentLineTitle}>Mon commentaire :</span>
|
|
||||||
<span className={styles.commentLineText}>{comment}</span>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<div className={styles.editButton}>
|
<div className={styles.editButton}>
|
||||||
<button type="button" onClick={onEdit}>
|
<button type="button" onClick={onEdit}>
|
||||||
Modifier
|
Modifier
|
||||||
|
@ -1,9 +1,19 @@
|
|||||||
import { FC, memo, ReactNode, useCallback, useEffect, useRef, useState } from "react"
|
import { FC, memo, ReactNode, useCallback, useEffect, useRef, useState } from "react"
|
||||||
import classnames from "classnames"
|
import classnames from "classnames"
|
||||||
import get from "lodash/get"
|
import get from "lodash/get"
|
||||||
|
import includes from "lodash/includes"
|
||||||
|
import without from "lodash/without"
|
||||||
import set from "lodash/set"
|
import set from "lodash/set"
|
||||||
import styles from "./styles.module.scss"
|
import styles from "./styles.module.scss"
|
||||||
import { useUserHosting } from "../hosting.utils"
|
import {
|
||||||
|
useUserHosting,
|
||||||
|
nightList,
|
||||||
|
NightOption,
|
||||||
|
nightChoiceSelectionDefaultState,
|
||||||
|
NightChoices,
|
||||||
|
bedList,
|
||||||
|
hostLocations,
|
||||||
|
} from "../hosting.utils"
|
||||||
import FormButton from "../../Form/FormButton/FormButton"
|
import FormButton from "../../Form/FormButton/FormButton"
|
||||||
import { fetchVolunteerHostingSetIfNeed } from "../../../store/volunteerHostingSet"
|
import { fetchVolunteerHostingSetIfNeed } from "../../../store/volunteerHostingSet"
|
||||||
import IgnoreButton from "../../Form/IgnoreButton/IgnoreButton"
|
import IgnoreButton from "../../Form/IgnoreButton/IgnoreButton"
|
||||||
@ -14,91 +24,522 @@ type Props = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const HostingForm: FC<Props> = ({ children, afterSubmit }): JSX.Element => {
|
const HostingForm: FC<Props> = ({ children, afterSubmit }): JSX.Element => {
|
||||||
const [needsHosting, setNeedsHosting] = useState(false)
|
const [hostingType, setHostingType] = useState("")
|
||||||
const canHostCountRef = useRef<HTMLInputElement | null>(null)
|
const canHostCountRef = useRef<HTMLInputElement | null>(null)
|
||||||
const distanceRef = useRef<HTMLInputElement | null>(null)
|
const [nights, setNights] = useState(nightChoiceSelectionDefaultState)
|
||||||
const commentRef = useRef<HTMLTextAreaElement | null>(null)
|
const cohostVolunteerRef = useRef<HTMLInputElement | null>(null)
|
||||||
|
const petAllergiesRef = useRef<HTMLInputElement | null>(null)
|
||||||
|
const [backProblems, setBackProblems] = useState(false)
|
||||||
|
const [bedType, setBedType] = useState<string[]>([])
|
||||||
|
const [isolatedBed, setIsolatedBed] = useState(false)
|
||||||
|
const bedConfigurationRef = useRef<HTMLTextAreaElement | null>(null)
|
||||||
|
const hostAddressRef = useRef<HTMLTextAreaElement | null>(null)
|
||||||
|
const transportTypeRef = useRef<HTMLInputElement | null>(null)
|
||||||
|
const [festivalProximity, setFestivalProximity] = useState("")
|
||||||
|
const distanceToFestivalRef = useRef<HTMLInputElement | null>(null)
|
||||||
|
const [hostingAbsoluteNeed, setHostingAbsoluteNeed] = useState(false)
|
||||||
|
const hostingNeedReasonRef = useRef<HTMLTextAreaElement | null>(null)
|
||||||
const [userWishes, saveWishes] = useUserHosting()
|
const [userWishes, saveWishes] = useUserHosting()
|
||||||
|
|
||||||
const onNeedsHostingChange = (e: React.ChangeEvent<HTMLInputElement>) =>
|
|
||||||
setNeedsHosting(e.target.checked)
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!userWishes) return
|
if (!userWishes) return
|
||||||
setNeedsHosting(get(userWishes, "needsHosting", false))
|
setHostingType(get(userWishes, "hostingType", ""))
|
||||||
|
const hostingNights = get(userWishes, "hostingNights", "") as string
|
||||||
|
const newNights = hostingNights.split("").reduce(
|
||||||
|
(acc: NightChoices, abbr: string) => ({
|
||||||
|
...acc,
|
||||||
|
[abbr]: true,
|
||||||
|
}),
|
||||||
|
{} as NightChoices
|
||||||
|
)
|
||||||
|
setNights(newNights)
|
||||||
|
setBedType(get(userWishes, "bedType", []))
|
||||||
|
setBackProblems(get(userWishes, "backProblems", false))
|
||||||
set(canHostCountRef, "current.value", `${get(userWishes, "canHostCount", 0)}`)
|
set(canHostCountRef, "current.value", `${get(userWishes, "canHostCount", 0)}`)
|
||||||
set(distanceRef, "current.value", `${get(userWishes, "distanceToFestival", 0)}`)
|
set(cohostVolunteerRef, "current.value", get(userWishes, "cohostVolunteer", ""))
|
||||||
set(commentRef, "current.value", get(userWishes, "hostingComment", ""))
|
set(petAllergiesRef, "current.value", get(userWishes, "petAllergies", ""))
|
||||||
}, [commentRef, userWishes])
|
set(bedConfigurationRef, "current.value", get(userWishes, "bedConfiguration", ""))
|
||||||
|
set(hostAddressRef, "current.value", get(userWishes, "hostAddress", ""))
|
||||||
|
set(transportTypeRef, "current.value", get(userWishes, "transportType", ""))
|
||||||
|
setFestivalProximity(get(userWishes, "festivalProximity", ""))
|
||||||
|
set(distanceToFestivalRef, "current.value", get(userWishes, "distanceToFestival", ""))
|
||||||
|
set(hostingNeedReasonRef, "current.value", get(userWishes, "hostingNeedReason", ""))
|
||||||
|
setHostingAbsoluteNeed(get(userWishes, "hostingAbsoluteNeed", false))
|
||||||
|
}, [userWishes])
|
||||||
|
|
||||||
|
const onHostingTypeChange = useCallback((newHostingType: string) => {
|
||||||
|
setHostingType(newHostingType)
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
const onBackProblemsChange = useCallback((newBackProblems: boolean) => {
|
||||||
|
setBackProblems(newBackProblems)
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
const onNightClick = useCallback(
|
||||||
|
(changes: NightChoices) => {
|
||||||
|
setNights({
|
||||||
|
...nights,
|
||||||
|
...changes,
|
||||||
|
})
|
||||||
|
},
|
||||||
|
[nights, setNights]
|
||||||
|
)
|
||||||
|
|
||||||
|
function isNightUnselected(abbr: string): boolean {
|
||||||
|
return !nights[abbr] && !nights[abbr.toLowerCase()]
|
||||||
|
}
|
||||||
|
function isNightSelected(abbr: string): boolean {
|
||||||
|
return nights[abbr]
|
||||||
|
}
|
||||||
|
|
||||||
|
const onBedTypeChange = useCallback(
|
||||||
|
(bed: string) => {
|
||||||
|
if (includes(bedType, bed)) {
|
||||||
|
setBedType(without(bedType, bed))
|
||||||
|
} else {
|
||||||
|
setBedType([...bedType, bed])
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[bedType]
|
||||||
|
)
|
||||||
|
|
||||||
|
const onIsolatedBedChange = useCallback((newIsolatedBed: boolean) => {
|
||||||
|
setIsolatedBed(newIsolatedBed)
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
const onHostingAbsoluteNeedChange = useCallback((newHostingAbsoluteNeed: boolean) => {
|
||||||
|
setHostingAbsoluteNeed(newHostingAbsoluteNeed)
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
const onFestivalProximityChange = useCallback((newFestivalProximity: string) => {
|
||||||
|
setFestivalProximity(newFestivalProximity)
|
||||||
|
}, [])
|
||||||
|
|
||||||
const onChoiceSubmit = useCallback(() => {
|
const onChoiceSubmit = useCallback(() => {
|
||||||
const canHostCount = +get(canHostCountRef, "current.value", "0")
|
const canHostCount = +get(canHostCountRef, "current.value", "0")
|
||||||
const distanceToFestival = +get(distanceRef, "current.value", "0")
|
const cohostVolunteer = get(cohostVolunteerRef, "current.value", "")
|
||||||
const hostingComment = get(commentRef, "current.value", "")
|
const bedConfiguration = get(bedConfigurationRef, "current.value", "")
|
||||||
saveWishes(needsHosting, canHostCount, distanceToFestival, hostingComment)
|
const hostingNights = nightList.reduce((res, { abbr }) => {
|
||||||
|
if (nights[abbr]) {
|
||||||
|
res += abbr
|
||||||
|
}
|
||||||
|
if (nights[abbr.toLowerCase()]) {
|
||||||
|
res += abbr.toLowerCase()
|
||||||
|
}
|
||||||
|
return res
|
||||||
|
}, "")
|
||||||
|
const hostAddress = get(hostAddressRef, "current.value", "")
|
||||||
|
const petAllergies = get(petAllergiesRef, "current.value", "")
|
||||||
|
const transportType = get(transportTypeRef, "current.value", "")
|
||||||
|
const distanceToFestival = get(distanceToFestivalRef, "current.value", "")
|
||||||
|
const hostingNeedReason = get(hostingNeedReasonRef, "current.value", "")
|
||||||
|
saveWishes(
|
||||||
|
hostingType,
|
||||||
|
canHostCount,
|
||||||
|
cohostVolunteer,
|
||||||
|
backProblems,
|
||||||
|
hostingNights,
|
||||||
|
bedType,
|
||||||
|
isolatedBed,
|
||||||
|
bedConfiguration,
|
||||||
|
hostAddress,
|
||||||
|
petAllergies,
|
||||||
|
transportType,
|
||||||
|
festivalProximity,
|
||||||
|
distanceToFestival,
|
||||||
|
hostingNeedReason,
|
||||||
|
hostingAbsoluteNeed
|
||||||
|
)
|
||||||
if (afterSubmit) afterSubmit()
|
if (afterSubmit) afterSubmit()
|
||||||
}, [needsHosting, commentRef, saveWishes, afterSubmit])
|
}, [
|
||||||
|
saveWishes,
|
||||||
|
hostingType,
|
||||||
|
backProblems,
|
||||||
|
bedType,
|
||||||
|
isolatedBed,
|
||||||
|
festivalProximity,
|
||||||
|
hostingAbsoluteNeed,
|
||||||
|
afterSubmit,
|
||||||
|
nights,
|
||||||
|
])
|
||||||
|
|
||||||
|
const getNightElement = (option: NightOption, maybeText: string): JSX.Element => (
|
||||||
|
<div className={classnames(styles.inputWrapper, styles.noBottomMargin)} key={option.abbr}>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<div className={styles.nightTitle}>{option.title}</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
<label className={styles.nightLabel} key={`no${option.abbr}`}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name={`no${option.abbr}`}
|
||||||
|
onChange={() =>
|
||||||
|
onNightClick({
|
||||||
|
[option.abbr]: false,
|
||||||
|
[option.abbr.toLowerCase()]: false,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
checked={isNightUnselected(option.abbr)}
|
||||||
|
/>{" "}
|
||||||
|
Non
|
||||||
|
</label>
|
||||||
|
<label className={styles.nightLabelLong} key={option.abbr.toLowerCase()}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name={option.abbr.toLowerCase()}
|
||||||
|
onChange={() =>
|
||||||
|
onNightClick({
|
||||||
|
[option.abbr]: false,
|
||||||
|
[option.abbr.toLowerCase()]: true,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
checked={isNightSelected(option.abbr.toLowerCase())}
|
||||||
|
/>
|
||||||
|
{maybeText}
|
||||||
|
</label>
|
||||||
|
<label className={styles.nightLabel} key={option.abbr}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name={option.abbr}
|
||||||
|
onChange={() =>
|
||||||
|
onNightClick({
|
||||||
|
[option.abbr]: true,
|
||||||
|
[option.abbr.toLowerCase()]: false,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
checked={isNightSelected(option.abbr)}
|
||||||
|
/>{" "}
|
||||||
|
Oui
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<div className={styles.title}>Mon hébergement</div>
|
<div className={styles.title}>Mon hébergement</div>
|
||||||
<div className={classnames(styles.inputWrapper, styles.noBottomMargin)}>
|
|
||||||
<div className={styles.leftCol}>
|
<div
|
||||||
<div className={styles.needsHostingTitle}>
|
className={classnames(
|
||||||
Cela t'arrangerait-il d'avoir un hébergement proche du festival ?
|
styles.inputWrapper,
|
||||||
</div>
|
styles.noBottomMargin,
|
||||||
</div>
|
styles.hostingTypeForm
|
||||||
|
)}
|
||||||
|
>
|
||||||
<div className={styles.rightCol}>
|
<div className={styles.rightCol}>
|
||||||
<label className={styles.needsHostingLabel}>
|
<label className={styles.hostingTypeLabel}>
|
||||||
<input
|
<input
|
||||||
type="checkbox"
|
type="radio"
|
||||||
value="oui"
|
name="can"
|
||||||
name="needsHosting"
|
onChange={() => onHostingTypeChange("can")}
|
||||||
onChange={onNeedsHostingChange}
|
checked={hostingType === "can"}
|
||||||
checked={needsHosting}
|
|
||||||
/>{" "}
|
/>{" "}
|
||||||
Oui
|
Je peux héberger au moins un bénévole
|
||||||
|
</label>
|
||||||
|
<label className={styles.hostingTypeLabel}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name="need"
|
||||||
|
onChange={() => onHostingTypeChange("need")}
|
||||||
|
checked={hostingType === "need"}
|
||||||
|
/>{" "}
|
||||||
|
J'aurais besoin d'un hébergement de la part d'un bénévole proche du festival
|
||||||
|
</label>
|
||||||
|
<label className={styles.hostingTypeLabel}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name="neither"
|
||||||
|
onChange={() => onHostingTypeChange("")}
|
||||||
|
checked={hostingType === ""}
|
||||||
|
/>{" "}
|
||||||
|
Aucun des deux
|
||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{needsHosting && (
|
|
||||||
<div className={classnames(styles.inputWrapper, styles.noBottomMargin)}>
|
<div
|
||||||
<div>
|
className={classnames([styles.inputWrapper, hostingType !== "can" && styles.hide])}
|
||||||
Il nous serait utile de savoir à quelle temps de transport tu te trouves
|
>
|
||||||
pour privilégier les bénévoles qui viennent de province à ceux qui viennent
|
|
||||||
de l'autre bout de Paris.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
<div className={styles.inputWrapper}>
|
|
||||||
<div className={styles.leftCol}>
|
<div className={styles.leftCol}>
|
||||||
<div className={styles.canHostCountTitle}>
|
<div className={styles.canHostCountTitle}>
|
||||||
Combien de bénévoles peux-tu héberger confortablement ?
|
Combien de bénévoles peux-tu héberger ?
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.rightCol}>
|
<div className={styles.rightCol}>
|
||||||
<input className={styles.canHostCountLabel} type="text" ref={canHostCountRef} />
|
<input className={styles.canHostCountLabel} type="text" ref={canHostCountRef} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.inputWrapper}>
|
|
||||||
|
<div
|
||||||
|
className={classnames([styles.inputWrapper, hostingType !== "can" && styles.hide])}
|
||||||
|
>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<div className={styles.petAllergiesTitle}>
|
||||||
|
As-tu un animal de compagnie ? (Possibles allergies ou phobies) ?
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
<input className={styles.petAllergiesLabel} type="text" ref={petAllergiesRef} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className={classnames([
|
||||||
|
styles.inputWrapper,
|
||||||
|
styles.noBottomMargin,
|
||||||
|
hostingType !== "need" && styles.hide,
|
||||||
|
])}
|
||||||
|
>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<div className={styles.backProblemsTitle}>As-tu des problèmes de dos ?</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
<label className={styles.backProblemsLabel}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name="backProblems"
|
||||||
|
onChange={() => onBackProblemsChange(true)}
|
||||||
|
checked={backProblems}
|
||||||
|
/>{" "}
|
||||||
|
Oui
|
||||||
|
</label>
|
||||||
|
<label className={styles.backProblemsLabel}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name="backProblems"
|
||||||
|
onChange={() => onBackProblemsChange(false)}
|
||||||
|
checked={!backProblems}
|
||||||
|
/>{" "}
|
||||||
|
Non
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className={classnames([
|
||||||
|
hostingType === "" || hostingType === "neither" ? styles.hide : null,
|
||||||
|
])}
|
||||||
|
>
|
||||||
|
{nightList.map((nightOption) =>
|
||||||
|
getNightElement(
|
||||||
|
nightOption,
|
||||||
|
hostingType === "need"
|
||||||
|
? " J'aimerai bien mais pas obligatoire"
|
||||||
|
: " Je peux mais ça ne m'arrange pas trop"
|
||||||
|
)
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className={classnames([
|
||||||
|
styles.inputWrapper,
|
||||||
|
styles.noBottomMargin,
|
||||||
|
hostingType !== "can" && styles.hide,
|
||||||
|
])}
|
||||||
|
>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<div className={styles.bedTypeTitle}>Le couchage que tu proposes est-il :</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
{bedList.map((bed) => (
|
||||||
|
<label className={styles.bedTypeLabel} key={bed}>
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
value="oui"
|
||||||
|
name={bed}
|
||||||
|
onChange={() => onBedTypeChange(bed)}
|
||||||
|
checked={includes(bedType, bed)}
|
||||||
|
/>{" "}
|
||||||
|
{bed}
|
||||||
|
</label>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className={classnames([
|
||||||
|
styles.inputWrapper,
|
||||||
|
styles.noBottomMargin,
|
||||||
|
hostingType !== "can" && styles.hide,
|
||||||
|
])}
|
||||||
|
>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<div className={styles.isolatedBedTitle}>
|
||||||
|
Le couchage est-il dans une pièce séparée ?
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
<label className={styles.isolatedBedLabel}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name="isolatedBed"
|
||||||
|
onChange={() => onIsolatedBedChange(true)}
|
||||||
|
checked={isolatedBed}
|
||||||
|
/>{" "}
|
||||||
|
Oui
|
||||||
|
</label>
|
||||||
|
<label className={styles.isolatedBedLabel}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name="isolatedBed"
|
||||||
|
onChange={() => onIsolatedBedChange(false)}
|
||||||
|
checked={!isolatedBed}
|
||||||
|
/>{" "}
|
||||||
|
Non
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className={classnames([
|
||||||
|
styles.inputWrapper,
|
||||||
|
styles.bedConfigurationWrapper,
|
||||||
|
hostingType !== "can" && styles.hide,
|
||||||
|
])}
|
||||||
|
>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<div className={styles.bedConfigurationTitle}>
|
||||||
|
Si tu peux héberger plusieurs bénévoles, quelle est la configuration des
|
||||||
|
couchages proposés ?
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
<textarea id="bedConfiguration-comment" ref={bedConfigurationRef} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className={classnames([
|
||||||
|
styles.inputWrapper,
|
||||||
|
styles.hostAddressWrapper,
|
||||||
|
hostingType !== "can" && styles.hide,
|
||||||
|
])}
|
||||||
|
>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<div className={styles.hostAddressTitle}>
|
||||||
|
Où habites-tu ? Au minium, quelle ville ?
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
<textarea id="hostAddress" ref={hostAddressRef} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className={classnames([
|
||||||
|
styles.inputWrapper,
|
||||||
|
styles.noBottomMargin,
|
||||||
|
hostingType !== "need" && styles.hide,
|
||||||
|
])}
|
||||||
|
>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<div className={styles.festivalProximityTitle}>Où habites-tu ?</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
{hostLocations.map((hostLocation) => (
|
||||||
|
<label className={styles.festivalProximityLabel} key={hostLocation}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name="festivalProximity"
|
||||||
|
onChange={() => onFestivalProximityChange(hostLocation)}
|
||||||
|
checked={hostLocation === festivalProximity}
|
||||||
|
/>{" "}
|
||||||
|
{hostLocation}
|
||||||
|
</label>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className={classnames([styles.inputWrapper, hostingType !== "can" && styles.hide])}
|
||||||
|
>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<div className={styles.transportTypeTitle}>
|
||||||
|
Par quel moyen de transport prévois-tu de venir avec le/les bénévole(s) ?
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
<input
|
||||||
|
className={styles.transportTypeLabel}
|
||||||
|
type="text"
|
||||||
|
ref={transportTypeRef}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className={classnames([
|
||||||
|
styles.inputWrapper,
|
||||||
|
(hostingType === "" ||
|
||||||
|
hostingType === "neither" ||
|
||||||
|
(hostingType === "need" &&
|
||||||
|
(festivalProximity === "hors région parisienne" ||
|
||||||
|
festivalProximity === ""))) &&
|
||||||
|
styles.hide,
|
||||||
|
])}
|
||||||
|
>
|
||||||
<div className={styles.leftCol}>
|
<div className={styles.leftCol}>
|
||||||
<div className={styles.distanceToFestivalTitle}>
|
<div className={styles.distanceToFestivalTitle}>
|
||||||
À combien de minutes de transport es-tu du festival ? (En voiture si tu es
|
A combien de temps habites-tu de la pelouse de Reuilly porte à porte ?
|
||||||
en voiture, à vélo si tu as des vélos, sinon en transport en commun.)
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.rightCol}>
|
<div className={styles.rightCol}>
|
||||||
<input
|
<input
|
||||||
className={styles.distanceToFestivalLabel}
|
className={styles.distanceToFestivalLabel}
|
||||||
type="text"
|
type="text"
|
||||||
ref={distanceRef}
|
ref={distanceToFestivalRef}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.hostingCommentWrapper}>
|
|
||||||
<label htmlFor="hosting-comment">Un commentaire, une précision ?</label>
|
<div
|
||||||
<textarea id="hosting-comment" ref={commentRef} />
|
className={classnames([
|
||||||
|
styles.hostingNeedReasonWrapper,
|
||||||
|
(hostingType !== "need" ||
|
||||||
|
festivalProximity === "hors région parisienne" ||
|
||||||
|
festivalProximity === "") &&
|
||||||
|
styles.hide,
|
||||||
|
])}
|
||||||
|
>
|
||||||
|
<label htmlFor="hostingNeedReason">Pourquoi as-tu besoin d'un hébergement ?</label>
|
||||||
|
<textarea id="hostingNeedReason" ref={hostingNeedReasonRef} />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className={classnames([
|
||||||
|
styles.inputWrapper,
|
||||||
|
styles.noBottomMargin,
|
||||||
|
hostingType !== "need" && styles.hide,
|
||||||
|
])}
|
||||||
|
>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<div className={styles.hostingAbsoluteNeedTitle}>
|
||||||
|
Pourras-tu venir au festival même si on ne te trouve pas d’hébergement
|
||||||
|
bénévole ?
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
<label className={styles.hostingAbsoluteNeedLabel}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name="hostingAbsoluteNeed"
|
||||||
|
onChange={() => onHostingAbsoluteNeedChange(true)}
|
||||||
|
checked={hostingAbsoluteNeed}
|
||||||
|
/>{" "}
|
||||||
|
Oui
|
||||||
|
</label>
|
||||||
|
<label className={styles.hostingAbsoluteNeedLabel}>
|
||||||
|
<input
|
||||||
|
type="radio"
|
||||||
|
name="hostingAbsoluteNeed"
|
||||||
|
onChange={() => onHostingAbsoluteNeedChange(false)}
|
||||||
|
checked={!hostingAbsoluteNeed}
|
||||||
|
/>{" "}
|
||||||
|
Non
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div className={styles.buttonWrapper}>
|
<div className={styles.buttonWrapper}>
|
||||||
<FormButton onClick={onChoiceSubmit}>Enregistrer</FormButton>
|
<FormButton onClick={onChoiceSubmit}>Enregistrer</FormButton>
|
||||||
{children === undefined && (
|
{children === undefined && (
|
||||||
|
@ -15,6 +15,10 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hide {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
.noBottomMargin {
|
.noBottomMargin {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
@ -28,82 +32,89 @@
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.needsHostingTitle {
|
.hostingTypeForm {
|
||||||
|
padding: 10px;
|
||||||
|
border: 1px solid #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hostingTypeLabel {
|
||||||
|
text-align: left;
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.canHostCountTitle,
|
||||||
|
.backProblemsTitle,
|
||||||
|
.bedTypeTitle,
|
||||||
|
.nightTitle,
|
||||||
|
.isolatedBedTitle,
|
||||||
|
.bedConfigurationTitle,
|
||||||
|
.hostAddressTitle,
|
||||||
|
.petAllergiesTitle,
|
||||||
|
.transportTypeTitle,
|
||||||
|
.festivalProximityTitle,
|
||||||
|
.distanceToFestivalTitle,
|
||||||
|
.hostingAbsoluteNeedTitle {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 320px;
|
width: 320px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.needsHostingLabel {
|
.canHostCountLabel,
|
||||||
|
.backProblemsLabel,
|
||||||
|
.bedTypeLabel,
|
||||||
|
.isolatedBedLabel,
|
||||||
|
.bedConfigurationLabel,
|
||||||
|
.festivalProximityLabel,
|
||||||
|
.hostingAbsoluteNeedLabel {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
width: 80px;
|
width: 80px;
|
||||||
}
|
}
|
||||||
|
.petAllergiesLabel,
|
||||||
.canHostCountTitle {
|
.transportTypeLabel,
|
||||||
display: inline-block;
|
|
||||||
width: 320px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.canHostCountLabel {
|
|
||||||
text-align: left;
|
|
||||||
display: inline-block;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
width: 80px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.distanceToFestivalTitle {
|
|
||||||
display: inline-block;
|
|
||||||
width: 320px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.distanceToFestivalLabel {
|
.distanceToFestivalLabel {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
margin-left: 10px;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
width: 80px;
|
width: 180px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hostingTitle {
|
.nightLabel {
|
||||||
|
text-align: left;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 320px;
|
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
|
width: 50px;
|
||||||
}
|
}
|
||||||
|
.nightLabelLong {
|
||||||
.hostingList {
|
text-align: left;
|
||||||
@include clear-ul-style;
|
|
||||||
|
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 204px;
|
margin-left: 10px;
|
||||||
text-align: center;
|
margin-bottom: 10px;
|
||||||
|
width: 180px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hostingItem {
|
.bedConfigurationWrapper,
|
||||||
display: inline-block;
|
.hostAddressWrapper {
|
||||||
margin: 3px;
|
margin: 6px 0;
|
||||||
}
|
|
||||||
|
|
||||||
.hostingButton {
|
label {
|
||||||
margin: 0;
|
display: block;
|
||||||
padding: 7px 2px 6px;
|
padding: 6px 0 2px 4px;
|
||||||
border: 0;
|
}
|
||||||
border-radius: 0;
|
textarea {
|
||||||
width: 90px;
|
width: 100%;
|
||||||
text-align: center;
|
height: 60px;
|
||||||
color: $color-grey-dark;
|
padding: 5px;
|
||||||
background-color: $color-grey-light;
|
border: 1px solid $color-grey-light;
|
||||||
cursor: pointer;
|
background-color: $color-grey-lighter;
|
||||||
|
outline: 0;
|
||||||
&.active {
|
|
||||||
color: $color-yellow;
|
|
||||||
background-color: $color-black;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.hostingCommentWrapper {
|
.hostingNeedReasonWrapper {
|
||||||
margin: 6px 0 14px;
|
margin: 6px 0 14px;
|
||||||
|
|
||||||
label {
|
label {
|
||||||
|
@ -1,9 +1,9 @@
|
|||||||
import { FC, memo } from "react"
|
import { FC, memo, useCallback } from "react"
|
||||||
import { find, get } from "lodash"
|
import { find, get } from "lodash"
|
||||||
import styles from "./styles.module.scss"
|
import styles from "./styles.module.scss"
|
||||||
import { useUserMeals, mealDays, MealOption } from "../meals.utils"
|
import { useUserMeals, mealDays, MealOption } from "../meals.utils"
|
||||||
// import useAction from "../../../utils/useAction"
|
import useAction from "../../../utils/useAction"
|
||||||
// import { displayModal, MODAL_IDS } from "../../../store/ui"
|
import { displayModal, MODAL_IDS } from "../../../store/ui"
|
||||||
import { useUserDayWishes } from "../daysWishes.utils"
|
import { useUserDayWishes } from "../daysWishes.utils"
|
||||||
|
|
||||||
const Meals: FC = (): JSX.Element | null => {
|
const Meals: FC = (): JSX.Element | null => {
|
||||||
@ -11,8 +11,8 @@ const Meals: FC = (): JSX.Element | null => {
|
|||||||
const [userWishes] = useUserDayWishes()
|
const [userWishes] = useUserDayWishes()
|
||||||
const meals = get(userMeals, "meals", []) as string[]
|
const meals = get(userMeals, "meals", []) as string[]
|
||||||
const dayWishesString = get(userWishes, "dayWishes", []) as string[]
|
const dayWishesString = get(userWishes, "dayWishes", []) as string[]
|
||||||
// const execDisplayModal = useAction(displayModal)
|
const execDisplayModal = useAction(displayModal)
|
||||||
// const onEdit = useCallback(() => execDisplayModal(MODAL_IDS.MEALS), [execDisplayModal])
|
const onEdit = useCallback(() => execDisplayModal(MODAL_IDS.MEALS), [execDisplayModal])
|
||||||
const mealChoices = mealDays.map((meal, i: number) =>
|
const mealChoices = mealDays.map((meal, i: number) =>
|
||||||
find(meal.options, { abbr: meals[i] || "" })
|
find(meal.options, { abbr: meals[i] || "" })
|
||||||
) as MealOption[]
|
) as MealOption[]
|
||||||
@ -32,9 +32,7 @@ const Meals: FC = (): JSX.Element | null => {
|
|||||||
{dayWishesString.includes("S") ? (
|
{dayWishesString.includes("S") ? (
|
||||||
<>
|
<>
|
||||||
{getMealElement(0)}
|
{getMealElement(0)}
|
||||||
<div className={styles.mealsLabel} key="SamediSoir">
|
{getMealElement(1)}
|
||||||
Samedi soir, apéro dînatoire
|
|
||||||
</div>
|
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
<div className={styles.mealsLabel} key="Samedi">
|
<div className={styles.mealsLabel} key="Samedi">
|
||||||
@ -44,8 +42,8 @@ const Meals: FC = (): JSX.Element | null => {
|
|||||||
|
|
||||||
{dayWishesString.includes("D") ? (
|
{dayWishesString.includes("D") ? (
|
||||||
<>
|
<>
|
||||||
{getMealElement(1)}
|
|
||||||
{getMealElement(2)}
|
{getMealElement(2)}
|
||||||
|
{getMealElement(3)}
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
<div className={styles.mealsLabel} key="Dimanche">
|
<div className={styles.mealsLabel} key="Dimanche">
|
||||||
@ -53,14 +51,14 @@ const Meals: FC = (): JSX.Element | null => {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{/* <div className={styles.editButton} key="edit">
|
<div className={styles.editButton} key="edit">
|
||||||
<button type="button" onClick={onEdit}>
|
<button type="button" onClick={onEdit}>
|
||||||
Modifier
|
Modifier
|
||||||
</button>
|
</button>
|
||||||
</div> */}
|
|
||||||
<div className={styles.editButton} key="edit">
|
|
||||||
Plus modifiable
|
|
||||||
</div>
|
</div>
|
||||||
|
{/* <div className={styles.editButton} key="edit">
|
||||||
|
Plus modifiable
|
||||||
|
</div> */}
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
import { get } from "lodash"
|
import { get } from "lodash"
|
||||||
import { FC, memo, ReactNode, useCallback, useEffect, useState } from "react"
|
import set from "lodash/set"
|
||||||
|
import { FC, memo, ReactNode, useCallback, useEffect, useRef, useState } from "react"
|
||||||
import classnames from "classnames"
|
import classnames from "classnames"
|
||||||
import styles from "./styles.module.scss"
|
import styles from "./styles.module.scss"
|
||||||
import { mealDays, MealOption, useUserMeals } from "../meals.utils"
|
import { mealDays, MealOption, useUserMeals } from "../meals.utils"
|
||||||
@ -16,28 +17,39 @@ type Props = {
|
|||||||
|
|
||||||
const MealsForm: FC<Props> = ({ children, afterSubmit }): JSX.Element => {
|
const MealsForm: FC<Props> = ({ children, afterSubmit }): JSX.Element => {
|
||||||
const [saturdayLunchMeal, setSaturdayLunchMeal] = useState("")
|
const [saturdayLunchMeal, setSaturdayLunchMeal] = useState("")
|
||||||
|
const [saturdayDinnerMeal, setSaturdayDinnerMeal] = useState("")
|
||||||
const [sundayLunchMeal, setSundayLunchMeal] = useState("")
|
const [sundayLunchMeal, setSundayLunchMeal] = useState("")
|
||||||
const [sundayDinnerMeal, setSundayDinnerMeal] = useState("")
|
const [sundayDinnerMeal, setSundayDinnerMeal] = useState("")
|
||||||
const [userMeals, saveMeals] = useUserMeals()
|
const [userMeals, saveMeals] = useUserMeals()
|
||||||
const [userWishes] = useUserDayWishes()
|
const [userWishes] = useUserDayWishes()
|
||||||
const meals = get(userMeals, "meals", [])
|
const meals = get(userMeals, "meals", [])
|
||||||
const dayWishesString = get(userWishes, "dayWishes", []) as string[]
|
const dayWishesString = get(userWishes, "dayWishes", []) as string[]
|
||||||
|
const foodRef = useRef<HTMLTextAreaElement | null>(null)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setSaturdayLunchMeal(meals[0] || "")
|
setSaturdayLunchMeal(meals[0] || "")
|
||||||
setSundayLunchMeal(meals[1] || "")
|
setSaturdayDinnerMeal(meals[1] || "")
|
||||||
setSundayDinnerMeal(meals[2] || "")
|
setSundayLunchMeal(meals[2] || "")
|
||||||
}, [meals])
|
setSundayDinnerMeal(meals[3] || "")
|
||||||
|
set(foodRef, "current.value", get(userMeals, "food", ""))
|
||||||
|
}, [meals, userMeals])
|
||||||
|
|
||||||
const onChoiceSubmit = useCallback(() => {
|
const onChoiceSubmit = useCallback(() => {
|
||||||
saveMeals([saturdayLunchMeal, sundayLunchMeal, sundayDinnerMeal])
|
const food = get(foodRef, "current.value", "")
|
||||||
|
saveMeals([saturdayLunchMeal, saturdayDinnerMeal, sundayLunchMeal, sundayDinnerMeal], food)
|
||||||
if (afterSubmit) afterSubmit()
|
if (afterSubmit) afterSubmit()
|
||||||
}, [saveMeals, saturdayLunchMeal, sundayLunchMeal, sundayDinnerMeal, afterSubmit])
|
}, [
|
||||||
|
saveMeals,
|
||||||
|
saturdayLunchMeal,
|
||||||
|
saturdayDinnerMeal,
|
||||||
|
sundayLunchMeal,
|
||||||
|
sundayDinnerMeal,
|
||||||
|
afterSubmit,
|
||||||
|
])
|
||||||
|
|
||||||
const getBreakfeastElement = (dayName: string): JSX.Element => (
|
const getBreakfeastElement = (dayName: string): JSX.Element => (
|
||||||
<div key={`${dayName}Matin`}>
|
<div key={`${dayName}Matin`}>
|
||||||
<b>{dayName} matin</b>, petit dej à 8h avec jus de pomme, multifruit, café, brioches et
|
<b>{dayName} matin</b>, petit dej avec jus, café, thé, brioche, quatre-quart.
|
||||||
quatre-quarts, crêpes si bénévoles motivés.
|
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|
||||||
@ -45,9 +57,7 @@ const MealsForm: FC<Props> = ({ children, afterSubmit }): JSX.Element => {
|
|||||||
<div className={classnames(styles.inputWrapper, styles.noBottomMargin)}>
|
<div className={classnames(styles.inputWrapper, styles.noBottomMargin)}>
|
||||||
<div className={styles.leftCol}>
|
<div className={styles.leftCol}>
|
||||||
<div className={styles.needsMealsTitle}>
|
<div className={styles.needsMealsTitle}>
|
||||||
<b>{mealDays[i].name}</b>
|
<b>{mealDays[i].name}</b> :
|
||||||
{(i === 0 || i === 1) && <>, accompagné d'un délicieux brownie tout chocolat</>}
|
|
||||||
{i === 2 && <>, accompagné d'une part de tarte indéterminée</>} :
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.rightCol}>
|
<div className={styles.rightCol}>
|
||||||
@ -97,9 +107,7 @@ const MealsForm: FC<Props> = ({ children, afterSubmit }): JSX.Element => {
|
|||||||
<>
|
<>
|
||||||
{getBreakfeastElement("Samedi")}
|
{getBreakfeastElement("Samedi")}
|
||||||
{getMealElement(0, saturdayLunchMeal, setSaturdayLunchMeal)}
|
{getMealElement(0, saturdayLunchMeal, setSaturdayLunchMeal)}
|
||||||
<div className={styles.mealsLabel} key="SamediSoir">
|
{getMealElement(1, saturdayDinnerMeal, setSaturdayDinnerMeal)}
|
||||||
<b>Samedi soir</b>, apéro dînatoire
|
|
||||||
</div>
|
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
getNotVolunteerElement("Samedi")
|
getNotVolunteerElement("Samedi")
|
||||||
@ -110,8 +118,8 @@ const MealsForm: FC<Props> = ({ children, afterSubmit }): JSX.Element => {
|
|||||||
{dayWishesString.includes("D") ? (
|
{dayWishesString.includes("D") ? (
|
||||||
<>
|
<>
|
||||||
{getBreakfeastElement("Dimanche")}
|
{getBreakfeastElement("Dimanche")}
|
||||||
{getMealElement(1, sundayLunchMeal, setSundayLunchMeal)}
|
{getMealElement(2, sundayLunchMeal, setSundayLunchMeal)}
|
||||||
{getMealElement(2, sundayDinnerMeal, setSundayDinnerMeal)}
|
{getMealElement(3, sundayDinnerMeal, setSundayDinnerMeal)}
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
getNotVolunteerElement("Dimanche")
|
getNotVolunteerElement("Dimanche")
|
||||||
@ -119,9 +127,16 @@ const MealsForm: FC<Props> = ({ children, afterSubmit }): JSX.Element => {
|
|||||||
|
|
||||||
<div className={classnames(styles.inputWrapper)}>
|
<div className={classnames(styles.inputWrapper)}>
|
||||||
<div>
|
<div>
|
||||||
<b>Jeudi, vendredi et lundi</b>, chacun improvise. Peut-être resto à proximité.
|
<b>Jeudi, vendredi et lundi</b>, cocktail dejeunatoire avec salades composées,
|
||||||
|
charcuterie, fromage...
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div className={styles.foodWrapper}>
|
||||||
|
<label htmlFor="food">As-tu des restrictions alimentaires ?</label>
|
||||||
|
<textarea id="food" ref={foodRef} />
|
||||||
|
</div>
|
||||||
|
|
||||||
<div className={styles.buttonWrapper}>
|
<div className={styles.buttonWrapper}>
|
||||||
<FormButton onClick={onChoiceSubmit}>Enregistrer</FormButton>
|
<FormButton onClick={onChoiceSubmit}>Enregistrer</FormButton>
|
||||||
{children === undefined && (
|
{children === undefined && (
|
||||||
|
@ -32,7 +32,7 @@
|
|||||||
|
|
||||||
.mealsLabel {
|
.mealsLabel {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
display: inline-block;
|
display: block;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
width: 220px;
|
width: 220px;
|
||||||
}
|
}
|
||||||
@ -73,7 +73,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mealsCommentWrapper {
|
.foodWrapper {
|
||||||
margin: 6px 0 14px;
|
margin: 6px 0 14px;
|
||||||
|
|
||||||
label {
|
label {
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { FC, memo, useCallback } from "react"
|
import { FC, memo, useCallback } from "react"
|
||||||
import get from "lodash/get"
|
import get from "lodash/get"
|
||||||
import styles from "./styles.module.scss"
|
import styles from "./styles.module.scss"
|
||||||
import { foodDefaultValue, useUserParticipationDetails } from "../participationDetails.utils"
|
import { useUserParticipationDetails } from "../participationDetails.utils"
|
||||||
import { displayModal, MODAL_IDS } from "../../../store/ui"
|
import { displayModal, MODAL_IDS } from "../../../store/ui"
|
||||||
import useAction from "../../../utils/useAction"
|
import useAction from "../../../utils/useAction"
|
||||||
|
|
||||||
@ -13,8 +13,6 @@ const ParticipationDetails: FC<Props> = (): JSX.Element | null => {
|
|||||||
const [participationDetails] = useUserParticipationDetails()
|
const [participationDetails] = useUserParticipationDetails()
|
||||||
const adult = get(participationDetails, "adult", "")
|
const adult = get(participationDetails, "adult", "")
|
||||||
const tshirtSize = get(participationDetails, "tshirtSize", "")
|
const tshirtSize = get(participationDetails, "tshirtSize", "")
|
||||||
const tshirtCount = get(participationDetails, "tshirtCount", "")
|
|
||||||
const food = get(participationDetails, "food", "")
|
|
||||||
const execDisplayModal = useAction(displayModal)
|
const execDisplayModal = useAction(displayModal)
|
||||||
const onEdit = useCallback(
|
const onEdit = useCallback(
|
||||||
() => execDisplayModal(MODAL_IDS.PARTICIPATIONDETAILS),
|
() => execDisplayModal(MODAL_IDS.PARTICIPATIONDETAILS),
|
||||||
@ -24,51 +22,28 @@ const ParticipationDetails: FC<Props> = (): JSX.Element | null => {
|
|||||||
return (
|
return (
|
||||||
<div className={styles.root}>
|
<div className={styles.root}>
|
||||||
<div className={styles.title}>Mes infos logistiques</div>
|
<div className={styles.title}>Mes infos logistiques</div>
|
||||||
{tshirtCount === 0 && (
|
|
||||||
<div className={styles.line}>
|
|
||||||
Je n'ai <b>aucun t-shirt</b> et{" "}
|
|
||||||
{tshirtSize ? (
|
|
||||||
<>
|
|
||||||
je suis taillé·e <b>{tshirtSize}</b>
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<>
|
|
||||||
ma taille est <span className={styles.lineEmpty}>non renseignées</span>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{tshirtCount === 1 && (
|
|
||||||
<div className={styles.line}>
|
|
||||||
J'ai <b>un seul t-shirt</b> et{" "}
|
|
||||||
{tshirtSize ? (
|
|
||||||
<>
|
|
||||||
je suis taillé·e <b>{tshirtSize}</b>
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<>
|
|
||||||
ma taille est <span className={styles.lineEmpty}>non renseignées</span>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{tshirtCount === 2 && (
|
|
||||||
<div className={styles.line}>
|
|
||||||
J'ai au moins <b>deux t-shirts</b>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{adult === 0 && (
|
{adult === 0 && (
|
||||||
<div className={styles.line}>
|
<div className={styles.line}>
|
||||||
Le 2 juillet 2022, je serai <b>mineur·e</b>
|
Le 1er juillet 2023, je serai <b>mineur·e</b>
|
||||||
|
<br />
|
||||||
|
Attention les bénévoles mineurs doivent être dans la même équipe que leur
|
||||||
|
responsable légal !
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{adult === 1 && (
|
{adult === 1 && (
|
||||||
<div className={styles.line}>
|
<div className={styles.line}>
|
||||||
Le 2 juillet 2022, je serai <b>majeur·e</b>
|
Le 1er juillet 2023, je serai <b>majeur·e</b>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<div className={styles.line}>
|
<div className={styles.line}>
|
||||||
Préférence alimentaire : <b>{food || foodDefaultValue}</b>
|
{tshirtSize === "" && <>Je n'ai pas encore choisi de tee-shirt.</>}
|
||||||
|
{tshirtSize === "Aucun" && <>Je n'ai pas besoin de tee-shirt cette année.</>}
|
||||||
|
{tshirtSize !== "" && tshirtSize !== "Aucun" && (
|
||||||
|
<>
|
||||||
|
J'aimerai un teeshirt <b>{tshirtSize}</b>.
|
||||||
|
</>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.editButton}>
|
<div className={styles.editButton}>
|
||||||
<button type="button" onClick={onEdit}>
|
<button type="button" onClick={onEdit}>
|
||||||
|
@ -14,25 +14,15 @@ type Props = {
|
|||||||
|
|
||||||
const ParticipationDetailsForm: FC<Props> = ({ children, afterSubmit }): JSX.Element | null => {
|
const ParticipationDetailsForm: FC<Props> = ({ children, afterSubmit }): JSX.Element | null => {
|
||||||
const sizeRef = useRef<HTMLSelectElement | null>(null)
|
const sizeRef = useRef<HTMLSelectElement | null>(null)
|
||||||
const dietRef = useRef<HTMLTextAreaElement | null>(null)
|
|
||||||
const [tshirtCountState, setTshirtCount] = useState<number>(0)
|
|
||||||
const [adultState, setAdult] = useState<number>(0)
|
const [adultState, setAdult] = useState<number>(0)
|
||||||
|
|
||||||
const [participationDetails, saveParticipationDetails] = useUserParticipationDetails()
|
const [participationDetails, saveParticipationDetails] = useUserParticipationDetails()
|
||||||
|
|
||||||
const onSubmit = useCallback(() => {
|
const onSubmit = useCallback(() => {
|
||||||
const tshirtSize = get(sizeRef, "current.value", "")
|
const tshirtSize = get(sizeRef, "current.value", "")
|
||||||
const food = get(dietRef, "current.value", "")
|
saveParticipationDetails(tshirtSize, adultState)
|
||||||
saveParticipationDetails(tshirtSize, tshirtCountState, adultState, food)
|
|
||||||
if (afterSubmit) afterSubmit()
|
if (afterSubmit) afterSubmit()
|
||||||
}, [tshirtCountState, adultState, saveParticipationDetails, afterSubmit])
|
}, [adultState, saveParticipationDetails, afterSubmit])
|
||||||
|
|
||||||
const onTshirtCountChange = useCallback(
|
|
||||||
(value: number) => {
|
|
||||||
setTshirtCount(value)
|
|
||||||
},
|
|
||||||
[setTshirtCount]
|
|
||||||
)
|
|
||||||
|
|
||||||
const onAdultChange = useCallback(
|
const onAdultChange = useCallback(
|
||||||
(value: number) => {
|
(value: number) => {
|
||||||
@ -43,75 +33,19 @@ const ParticipationDetailsForm: FC<Props> = ({ children, afterSubmit }): JSX.Ele
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const tshirtSize = get(participationDetails, "tshirtSize", "")
|
const tshirtSize = get(participationDetails, "tshirtSize", "")
|
||||||
const tshirtCount = get(participationDetails, "tshirtCount", "")
|
|
||||||
const adult = get(participationDetails, "adult", "")
|
const adult = get(participationDetails, "adult", "")
|
||||||
const food = get(participationDetails, "food", "")
|
|
||||||
|
|
||||||
if (tshirtSize) set(sizeRef, "current.value", tshirtSize)
|
if (tshirtSize) set(sizeRef, "current.value", tshirtSize)
|
||||||
if (tshirtCount) setTshirtCount(tshirtCount)
|
|
||||||
if (adult) setAdult(adult)
|
if (adult) setAdult(adult)
|
||||||
if (food) set(dietRef, "current.value", food)
|
}, [setAdult, participationDetails])
|
||||||
}, [setTshirtCount, setAdult, participationDetails])
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<div className={styles.title}>Mes infos logistiques</div>
|
<div className={styles.title}>Mes infos logistiques</div>
|
||||||
<div className={styles.inputWrapper}>
|
|
||||||
<div className={styles.leftCol}>
|
|
||||||
<div className={styles.tshirtCountTitle}>Combien as-tu de t-shirts PeL ?</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.rightCol}>
|
|
||||||
<label className={styles.tshirtCountLabel}>
|
|
||||||
<input
|
|
||||||
type="radio"
|
|
||||||
name="tshirtCount"
|
|
||||||
onChange={() => onTshirtCountChange(0)}
|
|
||||||
checked={tshirtCountState === 0}
|
|
||||||
/>{" "}
|
|
||||||
Aucun
|
|
||||||
</label>
|
|
||||||
<label className={styles.tshirtCountLabel}>
|
|
||||||
<input
|
|
||||||
type="radio"
|
|
||||||
name="tshirtCount"
|
|
||||||
onChange={() => onTshirtCountChange(1)}
|
|
||||||
checked={tshirtCountState === 1}
|
|
||||||
/>{" "}
|
|
||||||
Un seul
|
|
||||||
</label>
|
|
||||||
<label className={styles.tshirtCountLabel}>
|
|
||||||
<input
|
|
||||||
type="radio"
|
|
||||||
name="tshirtCount"
|
|
||||||
onChange={() => onTshirtCountChange(2)}
|
|
||||||
checked={tshirtCountState === 2}
|
|
||||||
/>{" "}
|
|
||||||
Au moins deux
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className={styles.inputWrapper}>
|
|
||||||
<div className={styles.leftCol}>
|
|
||||||
<label htmlFor="tshirtSize" className={styles.tshirtSizesTitle}>
|
|
||||||
Quelle est ta taille de t-shirt ?
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
<div className={styles.rightCol}>
|
|
||||||
<label className={styles.tshirtSizeLabel}>
|
|
||||||
<select id="tshirtSize" ref={sizeRef} className={styles.tshirtCountSelect}>
|
|
||||||
{tshirtSizes.map((size) => (
|
|
||||||
<option key={size} value={size}>
|
|
||||||
{size}
|
|
||||||
</option>
|
|
||||||
))}
|
|
||||||
</select>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className={styles.inputWrapper}>
|
<div className={styles.inputWrapper}>
|
||||||
<div className={styles.leftCol}>
|
<div className={styles.leftCol}>
|
||||||
<div className={styles.adultTitle}>Seras-tu majeur·e au 2 juillet 2022 ?</div>
|
<div className={styles.adultTitle}>Seras-tu majeur·e au 1 juillet 2023 ?</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.rightCol}>
|
<div className={styles.rightCol}>
|
||||||
<label className={styles.adultLabel}>
|
<label className={styles.adultLabel}>
|
||||||
@ -134,10 +68,31 @@ const ParticipationDetailsForm: FC<Props> = ({ children, afterSubmit }): JSX.Ele
|
|||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.dietWrapper}>
|
|
||||||
<label htmlFor="diet">Préférence alimentaire ?</label>
|
<div>
|
||||||
<textarea id="diet" ref={dietRef} placeholder="végétarien ? halal ? ..." />
|
Cette année comme il y a de nouveaux tee-shirts avec un col en V, tous les bénévoles
|
||||||
|
peuvent en commander un !<br />
|
||||||
|
Autre nouveauté, il y a des tee-shirts taille enfant !
|
||||||
</div>
|
</div>
|
||||||
|
<div className={styles.inputWrapper}>
|
||||||
|
<div className={styles.leftCol}>
|
||||||
|
<label htmlFor="tshirtSize" className={styles.tshirtSizesTitle}>
|
||||||
|
Que veux-tu comme tee-shirt ?
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div className={styles.rightCol}>
|
||||||
|
<label className={styles.tshirtSizeLabel}>
|
||||||
|
<select id="tshirtSize" ref={sizeRef} className={styles.tshirtCountSelect}>
|
||||||
|
{tshirtSizes.map((size) => (
|
||||||
|
<option key={size} value={size}>
|
||||||
|
{size}
|
||||||
|
</option>
|
||||||
|
))}
|
||||||
|
</select>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div className={styles.buttonWrapper}>
|
<div className={styles.buttonWrapper}>
|
||||||
<FormButton onClick={onSubmit}>Enregistrer</FormButton>
|
<FormButton onClick={onSubmit}>Enregistrer</FormButton>
|
||||||
{children === undefined && (
|
{children === undefined && (
|
||||||
|
@ -71,8 +71,8 @@ const TeamWishesForm: FC<Props> = ({ children, afterSubmit }): JSX.Element | nul
|
|||||||
})}
|
})}
|
||||||
</ol>
|
</ol>
|
||||||
<div className={styles.commentWrapper}>
|
<div className={styles.commentWrapper}>
|
||||||
<label htmlFor="day-choice-comment">Un commentaire, une précision ?</label>
|
<label htmlFor="team-choice-comment">Un commentaire, une précision ?</label>
|
||||||
<textarea id="day-choice-comment" ref={commentRef} />
|
<textarea id="team-choice-comment" ref={commentRef} />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.rightCol}>
|
<div className={styles.rightCol}>
|
||||||
|
@ -7,10 +7,21 @@ import useAction from "../../utils/useAction"
|
|||||||
import { VolunteerHosting } from "../../services/volunteers"
|
import { VolunteerHosting } from "../../services/volunteers"
|
||||||
|
|
||||||
type SetFunction = (
|
type SetFunction = (
|
||||||
needsHosting: VolunteerHosting["needsHosting"],
|
hostingType: VolunteerHosting["hostingType"],
|
||||||
canHostCount: VolunteerHosting["canHostCount"],
|
canHostCount: VolunteerHosting["canHostCount"],
|
||||||
|
cohostVolunteer: VolunteerHosting["cohostVolunteer"],
|
||||||
|
backProblems: VolunteerHosting["backProblems"],
|
||||||
|
hostingNights: VolunteerHosting["hostingNights"],
|
||||||
|
bedType: VolunteerHosting["bedType"],
|
||||||
|
isolatedBed: VolunteerHosting["isolatedBed"],
|
||||||
|
bedConfiguration: VolunteerHosting["bedConfiguration"],
|
||||||
|
hostAddress: VolunteerHosting["hostAddress"],
|
||||||
|
petAllergies: VolunteerHosting["petAllergies"],
|
||||||
|
transportType: VolunteerHosting["transportType"],
|
||||||
|
festivalProximity: VolunteerHosting["festivalProximity"],
|
||||||
distanceToFestival: VolunteerHosting["distanceToFestival"],
|
distanceToFestival: VolunteerHosting["distanceToFestival"],
|
||||||
hostingComment: VolunteerHosting["hostingComment"]
|
hostingNeedReason: VolunteerHosting["hostingNeedReason"],
|
||||||
|
hostingAbsoluteNeed: VolunteerHosting["hostingAbsoluteNeed"]
|
||||||
) => void
|
) => void
|
||||||
|
|
||||||
export const useUserHosting = (): [VolunteerHosting | undefined, SetFunction] => {
|
export const useUserHosting = (): [VolunteerHosting | undefined, SetFunction] => {
|
||||||
@ -22,14 +33,41 @@ export const useUserHosting = (): [VolunteerHosting | undefined, SetFunction] =>
|
|||||||
)
|
)
|
||||||
|
|
||||||
const saveWishes: SetFunction = useCallback(
|
const saveWishes: SetFunction = useCallback(
|
||||||
(needsHosting, canHostCount, distanceToFestival, hostingComment) => {
|
(
|
||||||
|
hostingType,
|
||||||
|
canHostCount,
|
||||||
|
cohostVolunteer,
|
||||||
|
backProblems,
|
||||||
|
hostingNights,
|
||||||
|
bedType,
|
||||||
|
isolatedBed,
|
||||||
|
bedConfiguration,
|
||||||
|
hostAddress,
|
||||||
|
petAllergies,
|
||||||
|
transportType,
|
||||||
|
festivalProximity,
|
||||||
|
distanceToFestival,
|
||||||
|
hostingNeedReason,
|
||||||
|
hostingAbsoluteNeed
|
||||||
|
) => {
|
||||||
if (!userWishes) return
|
if (!userWishes) return
|
||||||
save(jwtToken, 0, {
|
save(jwtToken, 0, {
|
||||||
id: userWishes.id,
|
id: userWishes.id,
|
||||||
needsHosting,
|
hostingType,
|
||||||
canHostCount,
|
canHostCount,
|
||||||
|
cohostVolunteer,
|
||||||
|
backProblems,
|
||||||
|
hostingNights,
|
||||||
|
bedType,
|
||||||
|
isolatedBed,
|
||||||
|
bedConfiguration,
|
||||||
|
hostAddress,
|
||||||
|
petAllergies,
|
||||||
|
transportType,
|
||||||
|
festivalProximity,
|
||||||
distanceToFestival,
|
distanceToFestival,
|
||||||
hostingComment,
|
hostingNeedReason,
|
||||||
|
hostingAbsoluteNeed,
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
[userWishes, save, jwtToken]
|
[userWishes, save, jwtToken]
|
||||||
@ -37,3 +75,57 @@ export const useUserHosting = (): [VolunteerHosting | undefined, SetFunction] =>
|
|||||||
|
|
||||||
return [userWishes, saveWishes]
|
return [userWishes, saveWishes]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const bedList: string[] = [
|
||||||
|
"un lit une place",
|
||||||
|
"un lit 2 places",
|
||||||
|
"un canapé ",
|
||||||
|
"un canapé-lit",
|
||||||
|
"un matelas au sol",
|
||||||
|
]
|
||||||
|
|
||||||
|
type HostLocation = "Paris" | "région parisienne" | "hors région parisienne" | ""
|
||||||
|
export const hostLocations: HostLocation[] = [
|
||||||
|
"Paris",
|
||||||
|
"région parisienne",
|
||||||
|
"hors région parisienne",
|
||||||
|
]
|
||||||
|
|
||||||
|
export type NightOption = { abbr: string; title: string }
|
||||||
|
|
||||||
|
export const nightList: NightOption[] = [
|
||||||
|
{
|
||||||
|
abbr: "M",
|
||||||
|
title: "Nuit du mercredi 28 au jeudi 29 juin",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
abbr: "J",
|
||||||
|
title: "Nuit du jeudi 29 au vendredi 30 juin",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
abbr: "V",
|
||||||
|
title: "Nuit du vendredi 30 juin au samedi 1er juillet",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
abbr: "S",
|
||||||
|
title: "Nuit du samedi 1er au dimanche 2 juillet",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
abbr: "D",
|
||||||
|
title: "Nuit du dimanche 2 au lundi 3 juillet",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
abbr: "L",
|
||||||
|
title: "Nuit du lundi 3 au mardi 4 juillet",
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
export interface NightChoices {
|
||||||
|
[key: string]: boolean
|
||||||
|
}
|
||||||
|
|
||||||
|
export const nightChoiceSelectionDefaultState = nightList.reduce((state, { abbr }) => {
|
||||||
|
state[abbr] = false
|
||||||
|
state[abbr.toLowerCase()] = false
|
||||||
|
return state
|
||||||
|
}, <NightChoices>{})
|
||||||
|
@ -16,18 +16,29 @@ export const mealDays: MealDay[] = [
|
|||||||
{
|
{
|
||||||
name: "Samedi midi",
|
name: "Samedi midi",
|
||||||
options: [
|
options: [
|
||||||
{ abbr: "V", title: "Sandwich végétarien" },
|
{ abbr: "V", title: "Taboulé" },
|
||||||
{ abbr: "F", title: "Sandwich fromage" },
|
{ abbr: "F", title: "Quinoa, courgettes, fromage" },
|
||||||
{ abbr: "P", title: "Sandwich poulet" },
|
{ abbr: "P", title: "Riz à la Niçoise (thon)" },
|
||||||
|
{ abbr: "", title: "Pas de repas" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Samedi soir",
|
||||||
|
options: [
|
||||||
|
{
|
||||||
|
abbr: "V",
|
||||||
|
title: "Aubergines fondantes avec égrené végétal",
|
||||||
|
},
|
||||||
|
{ abbr: "P", title: "Risotto poulet" },
|
||||||
{ abbr: "", title: "Pas de repas" },
|
{ abbr: "", title: "Pas de repas" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "Dimanche midi",
|
name: "Dimanche midi",
|
||||||
options: [
|
options: [
|
||||||
{ abbr: "V", title: "Sandwich végétarien" },
|
{ abbr: "V", title: "Sandwich aux légumes" },
|
||||||
{ abbr: "F", title: "Sandwich fromage" },
|
{ abbr: "F", title: "Sandwich au fromage" },
|
||||||
{ abbr: "P", title: "Sandwich poulet" },
|
{ abbr: "P", title: "Sandwich au poulet" },
|
||||||
{ abbr: "", title: "Pas de repas" },
|
{ abbr: "", title: "Pas de repas" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
@ -36,15 +47,15 @@ export const mealDays: MealDay[] = [
|
|||||||
options: [
|
options: [
|
||||||
{
|
{
|
||||||
abbr: "V",
|
abbr: "V",
|
||||||
title: "Lasagnes végétariennes accompagnées de ratatouille et haricots verts",
|
title: "Risotto végétarien",
|
||||||
},
|
},
|
||||||
{ abbr: "P", title: "Aiguillettes de poulet accompagnées de riz thaï" },
|
{ abbr: "P", title: "Parmentier de canard" },
|
||||||
{ abbr: "", title: "Pas de repas" },
|
{ abbr: "", title: "Pas de repas" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
type SetFunction = (meals: VolunteerMeals["meals"]) => void
|
type SetFunction = (meals: VolunteerMeals["meals"], food: VolunteerMeals["food"]) => void
|
||||||
|
|
||||||
export const useUserMeals = (): [VolunteerMeals | undefined, SetFunction] => {
|
export const useUserMeals = (): [VolunteerMeals | undefined, SetFunction] => {
|
||||||
const save = useAction(fetchVolunteerMealsSet)
|
const save = useAction(fetchVolunteerMealsSet)
|
||||||
@ -55,11 +66,12 @@ export const useUserMeals = (): [VolunteerMeals | undefined, SetFunction] => {
|
|||||||
)
|
)
|
||||||
|
|
||||||
const saveWishes: SetFunction = useCallback(
|
const saveWishes: SetFunction = useCallback(
|
||||||
(meals) => {
|
(meals, food) => {
|
||||||
if (!userWishes) return
|
if (!userWishes) return
|
||||||
save(jwtToken, 0, {
|
save(jwtToken, 0, {
|
||||||
id: userWishes.id,
|
id: userWishes.id,
|
||||||
meals,
|
meals,
|
||||||
|
food,
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
[userWishes, save, jwtToken]
|
[userWishes, save, jwtToken]
|
||||||
|
@ -7,30 +7,57 @@ import { fetchVolunteerParticipationDetailsSet } from "../../store/volunteerPart
|
|||||||
import { VolunteerParticipationDetails } from "../../services/volunteers"
|
import { VolunteerParticipationDetails } from "../../services/volunteers"
|
||||||
|
|
||||||
export const tshirtSizes = [
|
export const tshirtSizes = [
|
||||||
"XXS",
|
"Aucun",
|
||||||
"XS",
|
"Enfant col rond 2 ans",
|
||||||
"S",
|
"Enfant col rond 3 ans",
|
||||||
"M",
|
"Enfant col rond 4 ans",
|
||||||
"L",
|
"Enfant col rond 5 ans",
|
||||||
"XL",
|
"Enfant col rond 6 ans",
|
||||||
"XXL",
|
"Enfant col rond 7 ans",
|
||||||
"3XL",
|
"Enfant col rond 8 ans",
|
||||||
"4XL",
|
"Enfant col rond 9 ans",
|
||||||
"Femme S",
|
"Enfant col rond 10 ans",
|
||||||
"Femme M",
|
"Enfant col rond 11 ans",
|
||||||
"Femme L",
|
"Enfant col rond 12 ans",
|
||||||
"Femme XL",
|
"Femme col V S",
|
||||||
"Femme XXL",
|
"Femme col V M",
|
||||||
"Femme 3XL",
|
"Femme col V L",
|
||||||
|
"Femme col V XL",
|
||||||
|
"Femme col V XXL",
|
||||||
|
"Femme col V 3XL",
|
||||||
|
"Femme col rond XXS",
|
||||||
|
"Femme col rond XS",
|
||||||
|
"Femme col rond S",
|
||||||
|
"Femme col rond M",
|
||||||
|
"Femme col rond L",
|
||||||
|
"Femme col rond XL",
|
||||||
|
"Femme col rond XXL",
|
||||||
|
"Femme col rond 3XL",
|
||||||
|
"Femme col rond 4XL",
|
||||||
|
"Femme col rond 5XL",
|
||||||
|
"Homme col V S",
|
||||||
|
"Homme col V M",
|
||||||
|
"Homme col V L",
|
||||||
|
"Homme col V XL",
|
||||||
|
"Homme col V XXL",
|
||||||
|
"Homme col V 3XL",
|
||||||
|
"Homme col rond XXS",
|
||||||
|
"Homme col rond XS",
|
||||||
|
"Homme col rond S",
|
||||||
|
"Homme col rond M",
|
||||||
|
"Homme col rond L",
|
||||||
|
"Homme col rond XL",
|
||||||
|
"Homme col rond XXL",
|
||||||
|
"Homme col rond 3XL",
|
||||||
|
"Homme col rond 4XL",
|
||||||
|
"Homme col rond 5XL",
|
||||||
]
|
]
|
||||||
|
|
||||||
export const foodDefaultValue = "Aucune"
|
export const foodDefaultValue = "Aucune"
|
||||||
|
|
||||||
type SetFunction = (
|
type SetFunction = (
|
||||||
tshirtSize: VolunteerParticipationDetails["tshirtSize"],
|
tshirtSize: VolunteerParticipationDetails["tshirtSize"],
|
||||||
tshirtCount: VolunteerParticipationDetails["tshirtCount"],
|
adult: VolunteerParticipationDetails["adult"]
|
||||||
adult: VolunteerParticipationDetails["adult"],
|
|
||||||
food: VolunteerParticipationDetails["food"]
|
|
||||||
) => void
|
) => void
|
||||||
|
|
||||||
export const useUserParticipationDetails = (): [
|
export const useUserParticipationDetails = (): [
|
||||||
@ -45,14 +72,12 @@ export const useUserParticipationDetails = (): [
|
|||||||
)
|
)
|
||||||
|
|
||||||
const saveParticipationDetails: SetFunction = useCallback(
|
const saveParticipationDetails: SetFunction = useCallback(
|
||||||
(tshirtSize, tshirtCount, adult, food) => {
|
(tshirtSize, adult) => {
|
||||||
if (!userParticipationDetails) return
|
if (!userParticipationDetails) return
|
||||||
save(jwtToken, 0, {
|
save(jwtToken, 0, {
|
||||||
id: userParticipationDetails.id,
|
id: userParticipationDetails.id,
|
||||||
tshirtSize,
|
tshirtSize,
|
||||||
tshirtCount,
|
|
||||||
adult,
|
adult,
|
||||||
food,
|
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
[userParticipationDetails, save, jwtToken]
|
[userParticipationDetails, save, jwtToken]
|
||||||
|
@ -361,27 +361,71 @@ export const volunteerHostingSet = expressAccessor.set(async (list, body, id) =>
|
|||||||
}
|
}
|
||||||
const newVolunteer: Volunteer = cloneDeep(volunteer)
|
const newVolunteer: Volunteer = cloneDeep(volunteer)
|
||||||
|
|
||||||
if (wishes.needsHosting !== undefined) {
|
if (wishes.hostingType !== undefined) {
|
||||||
newVolunteer.needsHosting = wishes.needsHosting
|
newVolunteer.hostingType = wishes.hostingType
|
||||||
}
|
}
|
||||||
if (wishes.canHostCount !== undefined) {
|
if (wishes.canHostCount !== undefined) {
|
||||||
newVolunteer.canHostCount = wishes.canHostCount
|
newVolunteer.canHostCount = wishes.canHostCount
|
||||||
}
|
}
|
||||||
|
if (wishes.cohostVolunteer !== undefined) {
|
||||||
|
newVolunteer.cohostVolunteer = wishes.cohostVolunteer
|
||||||
|
}
|
||||||
|
if (wishes.backProblems !== undefined) {
|
||||||
|
newVolunteer.backProblems = wishes.backProblems
|
||||||
|
}
|
||||||
|
if (wishes.hostingNights !== undefined) {
|
||||||
|
newVolunteer.hostingNights = wishes.hostingNights
|
||||||
|
}
|
||||||
|
if (wishes.bedType !== undefined) {
|
||||||
|
newVolunteer.bedType = wishes.bedType
|
||||||
|
}
|
||||||
|
if (wishes.isolatedBed !== undefined) {
|
||||||
|
newVolunteer.isolatedBed = wishes.isolatedBed
|
||||||
|
}
|
||||||
|
if (wishes.bedConfiguration !== undefined) {
|
||||||
|
newVolunteer.bedConfiguration = wishes.bedConfiguration
|
||||||
|
}
|
||||||
|
if (wishes.hostAddress !== undefined) {
|
||||||
|
newVolunteer.hostAddress = wishes.hostAddress
|
||||||
|
}
|
||||||
|
if (wishes.petAllergies !== undefined) {
|
||||||
|
newVolunteer.petAllergies = wishes.petAllergies
|
||||||
|
}
|
||||||
|
if (wishes.transportType !== undefined) {
|
||||||
|
newVolunteer.transportType = wishes.transportType
|
||||||
|
}
|
||||||
|
if (wishes.festivalProximity !== undefined) {
|
||||||
|
newVolunteer.festivalProximity = wishes.festivalProximity
|
||||||
|
}
|
||||||
if (wishes.distanceToFestival !== undefined) {
|
if (wishes.distanceToFestival !== undefined) {
|
||||||
newVolunteer.distanceToFestival = wishes.distanceToFestival
|
newVolunteer.distanceToFestival = wishes.distanceToFestival
|
||||||
}
|
}
|
||||||
if (wishes.hostingComment !== undefined) {
|
if (wishes.hostingNeedReason !== undefined) {
|
||||||
newVolunteer.hostingComment = wishes.hostingComment
|
newVolunteer.hostingNeedReason = wishes.hostingNeedReason
|
||||||
|
}
|
||||||
|
if (wishes.hostingAbsoluteNeed !== undefined) {
|
||||||
|
newVolunteer.hostingAbsoluteNeed = wishes.hostingAbsoluteNeed
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
toDatabase: newVolunteer,
|
toDatabase: newVolunteer,
|
||||||
toCaller: {
|
toCaller: {
|
||||||
id: newVolunteer.id,
|
id: newVolunteer.id,
|
||||||
needsHosting: newVolunteer.needsHosting,
|
hostingType: newVolunteer.hostingType,
|
||||||
canHostCount: newVolunteer.canHostCount,
|
canHostCount: newVolunteer.canHostCount,
|
||||||
|
cohostVolunteer: newVolunteer.cohostVolunteer,
|
||||||
|
backProblems: newVolunteer.backProblems,
|
||||||
|
hostingNights: newVolunteer.hostingNights,
|
||||||
|
bedType: newVolunteer.bedType,
|
||||||
|
isolatedBed: newVolunteer.isolatedBed,
|
||||||
|
bedConfiguration: newVolunteer.bedConfiguration,
|
||||||
|
hostAddress: newVolunteer.hostAddress,
|
||||||
|
petAllergies: newVolunteer.petAllergies,
|
||||||
|
transportType: newVolunteer.transportType,
|
||||||
|
festivalProximity: newVolunteer.festivalProximity,
|
||||||
distanceToFestival: newVolunteer.distanceToFestival,
|
distanceToFestival: newVolunteer.distanceToFestival,
|
||||||
hostingComment: newVolunteer.hostingComment,
|
hostingNeedReason: newVolunteer.hostingNeedReason,
|
||||||
|
hostingAbsoluteNeed: newVolunteer.hostingAbsoluteNeed,
|
||||||
} as VolunteerHosting,
|
} as VolunteerHosting,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@ -458,20 +502,23 @@ export const volunteerMealsSet = expressAccessor.set(async (list, body, id) => {
|
|||||||
newVolunteer.meals = wishes.meals
|
newVolunteer.meals = wishes.meals
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (wishes.food !== undefined) {
|
||||||
|
newVolunteer.food = wishes.food
|
||||||
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
toDatabase: newVolunteer,
|
toDatabase: newVolunteer,
|
||||||
toCaller: {
|
toCaller: {
|
||||||
id: newVolunteer.id,
|
id: newVolunteer.id,
|
||||||
meals: newVolunteer.meals,
|
meals: newVolunteer.meals,
|
||||||
|
food: newVolunteer.food,
|
||||||
} as VolunteerMeals,
|
} as VolunteerMeals,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
export const volunteerParticipationDetailsSet = expressAccessor.set(async (list, body, id) => {
|
export const volunteerParticipationDetailsSet = expressAccessor.set(async (list, body, id) => {
|
||||||
const requestedId = +body[0] || id
|
const requestedId = +body[0] || id
|
||||||
if (requestedId !== id && requestedId !== 0) {
|
if (requestedId !== id && requestedId !== 0) {
|
||||||
throw Error(
|
throw Error(`On ne peut acceder qu'à ses propres infos de t-shirt et de majorité`)
|
||||||
`On ne peut acceder qu'à ses propres infos de t-shirt, de majorité et d'alimentation`
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
const wishes = body[1] as VolunteerParticipationDetails
|
const wishes = body[1] as VolunteerParticipationDetails
|
||||||
const volunteer: Volunteer | undefined = list.find((v) => v.id === requestedId)
|
const volunteer: Volunteer | undefined = list.find((v) => v.id === requestedId)
|
||||||
@ -483,24 +530,16 @@ export const volunteerParticipationDetailsSet = expressAccessor.set(async (list,
|
|||||||
if (wishes.tshirtSize !== undefined) {
|
if (wishes.tshirtSize !== undefined) {
|
||||||
newVolunteer.tshirtSize = wishes.tshirtSize
|
newVolunteer.tshirtSize = wishes.tshirtSize
|
||||||
}
|
}
|
||||||
if (wishes.tshirtCount !== undefined) {
|
|
||||||
newVolunteer.tshirtCount = wishes.tshirtCount
|
|
||||||
}
|
|
||||||
if (wishes.adult !== undefined) {
|
if (wishes.adult !== undefined) {
|
||||||
newVolunteer.adult = wishes.adult
|
newVolunteer.adult = wishes.adult
|
||||||
}
|
}
|
||||||
if (wishes.food !== undefined) {
|
|
||||||
newVolunteer.food = wishes.food
|
|
||||||
}
|
|
||||||
|
|
||||||
return {
|
return {
|
||||||
toDatabase: newVolunteer,
|
toDatabase: newVolunteer,
|
||||||
toCaller: {
|
toCaller: {
|
||||||
id: newVolunteer.id,
|
id: newVolunteer.id,
|
||||||
tshirtSize: newVolunteer.tshirtSize,
|
tshirtSize: newVolunteer.tshirtSize,
|
||||||
tshirtCount: newVolunteer.tshirtCount,
|
|
||||||
adult: newVolunteer.adult,
|
adult: newVolunteer.adult,
|
||||||
food: newVolunteer.food,
|
|
||||||
} as VolunteerParticipationDetails,
|
} as VolunteerParticipationDetails,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
@ -107,10 +107,12 @@ export default class ServiceAccessors<
|
|||||||
try {
|
try {
|
||||||
const auth = { headers: { Authorization: `Bearer ${jwt}` } }
|
const auth = { headers: { Authorization: `Bearer ${jwt}` } }
|
||||||
const fullAxiosConfig = _.defaultsDeep(auth, axiosConfig)
|
const fullAxiosConfig = _.defaultsDeep(auth, axiosConfig)
|
||||||
const { data } = await axios.get(
|
const rawData = await axios.get(`${config.API_URL}/${this.elementName}${apiName}`, {
|
||||||
`${config.API_URL}/${this.elementName}${apiName}`,
|
...fullAxiosConfig,
|
||||||
{ ...fullAxiosConfig, params }
|
params,
|
||||||
)
|
})
|
||||||
|
console.log("rawData", rawData)
|
||||||
|
const { data } = rawData
|
||||||
if (data.error) {
|
if (data.error) {
|
||||||
throw Error(data.error)
|
throw Error(data.error)
|
||||||
}
|
}
|
||||||
|
@ -68,13 +68,35 @@ export class Volunteer implements VolunteerPartial {
|
|||||||
|
|
||||||
noOpinion: number[] = []
|
noOpinion: number[] = []
|
||||||
|
|
||||||
needsHosting = false
|
hostingType = ""
|
||||||
|
|
||||||
canHostCount = 0
|
canHostCount = 0
|
||||||
|
|
||||||
distanceToFestival = 0
|
cohostVolunteer = ""
|
||||||
|
|
||||||
hostingComment = ""
|
backProblems = false
|
||||||
|
|
||||||
|
hostingNights = ""
|
||||||
|
|
||||||
|
bedType: string[] = []
|
||||||
|
|
||||||
|
isolatedBed = false
|
||||||
|
|
||||||
|
bedConfiguration = ""
|
||||||
|
|
||||||
|
hostAddress = ""
|
||||||
|
|
||||||
|
petAllergies = ""
|
||||||
|
|
||||||
|
transportType = ""
|
||||||
|
|
||||||
|
festivalProximity = ""
|
||||||
|
|
||||||
|
distanceToFestival = ""
|
||||||
|
|
||||||
|
hostingNeedReason = ""
|
||||||
|
|
||||||
|
hostingAbsoluteNeed = true
|
||||||
|
|
||||||
meals: string[] = []
|
meals: string[] = []
|
||||||
|
|
||||||
@ -116,10 +138,21 @@ export const translationVolunteer: { [k in keyof Volunteer]: string } = {
|
|||||||
playable: "jouable",
|
playable: "jouable",
|
||||||
giftable: "offrable",
|
giftable: "offrable",
|
||||||
noOpinion: "sansAvis",
|
noOpinion: "sansAvis",
|
||||||
needsHosting: "besoinHébergement",
|
hostingType: "typeHébergement",
|
||||||
canHostCount: "nombreHébergés",
|
canHostCount: "nombreHébergés",
|
||||||
|
cohostVolunteer: "colocBénévole",
|
||||||
|
backProblems: "malDeDos",
|
||||||
|
hostingNights: "nuitsHébergé",
|
||||||
|
bedType: "typeDeLit",
|
||||||
|
isolatedBed: "litIsolé",
|
||||||
|
bedConfiguration: "configurationLits",
|
||||||
|
hostAddress: "adresseHebergement",
|
||||||
|
petAllergies: "allergiesAnimaux",
|
||||||
|
transportType: "typeTransport",
|
||||||
|
festivalProximity: "proximitéAuFestival",
|
||||||
distanceToFestival: "distanceAuFestival",
|
distanceToFestival: "distanceAuFestival",
|
||||||
hostingComment: "commentaireHébergement",
|
hostingNeedReason: "reasonDêtreHebergé",
|
||||||
|
hostingAbsoluteNeed: "besoinDhébergement",
|
||||||
meals: "repas",
|
meals: "repas",
|
||||||
charter: "charte",
|
charter: "charte",
|
||||||
}
|
}
|
||||||
@ -171,10 +204,21 @@ export const volunteerExample: Volunteer = {
|
|||||||
playable: [34, 35, 36],
|
playable: [34, 35, 36],
|
||||||
giftable: [13, 67],
|
giftable: [13, 67],
|
||||||
noOpinion: [3, 4],
|
noOpinion: [3, 4],
|
||||||
needsHosting: false,
|
hostingType: "neither",
|
||||||
canHostCount: 0,
|
canHostCount: 0,
|
||||||
distanceToFestival: 0,
|
cohostVolunteer: "",
|
||||||
hostingComment: "",
|
backProblems: false,
|
||||||
|
hostingNights: "",
|
||||||
|
bedType: [],
|
||||||
|
isolatedBed: false,
|
||||||
|
bedConfiguration: "",
|
||||||
|
hostAddress: "",
|
||||||
|
petAllergies: "",
|
||||||
|
transportType: "",
|
||||||
|
festivalProximity: "",
|
||||||
|
distanceToFestival: "",
|
||||||
|
hostingNeedReason: "",
|
||||||
|
hostingAbsoluteNeed: true,
|
||||||
meals: [],
|
meals: [],
|
||||||
charter: false,
|
charter: false,
|
||||||
}
|
}
|
||||||
@ -224,23 +268,33 @@ export interface VolunteerDayWishes {
|
|||||||
|
|
||||||
export interface VolunteerHosting {
|
export interface VolunteerHosting {
|
||||||
id: Volunteer["id"]
|
id: Volunteer["id"]
|
||||||
needsHosting: Volunteer["needsHosting"]
|
hostingType: Volunteer["hostingType"]
|
||||||
canHostCount: Volunteer["canHostCount"]
|
canHostCount: Volunteer["canHostCount"]
|
||||||
|
cohostVolunteer: Volunteer["cohostVolunteer"]
|
||||||
|
backProblems: Volunteer["backProblems"]
|
||||||
|
hostingNights: Volunteer["hostingNights"]
|
||||||
|
bedType: Volunteer["bedType"]
|
||||||
|
isolatedBed: Volunteer["isolatedBed"]
|
||||||
|
bedConfiguration: Volunteer["bedConfiguration"]
|
||||||
|
hostAddress: Volunteer["hostAddress"]
|
||||||
|
petAllergies: Volunteer["petAllergies"]
|
||||||
|
transportType: Volunteer["transportType"]
|
||||||
|
festivalProximity: Volunteer["festivalProximity"]
|
||||||
distanceToFestival: Volunteer["distanceToFestival"]
|
distanceToFestival: Volunteer["distanceToFestival"]
|
||||||
hostingComment: Volunteer["hostingComment"]
|
hostingNeedReason: Volunteer["hostingNeedReason"]
|
||||||
|
hostingAbsoluteNeed: Volunteer["hostingAbsoluteNeed"]
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface VolunteerMeals {
|
export interface VolunteerMeals {
|
||||||
id: Volunteer["id"]
|
id: Volunteer["id"]
|
||||||
meals: Volunteer["meals"]
|
meals: Volunteer["meals"]
|
||||||
|
food: Volunteer["food"]
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface VolunteerParticipationDetails {
|
export interface VolunteerParticipationDetails {
|
||||||
id: Volunteer["id"]
|
id: Volunteer["id"]
|
||||||
tshirtSize: Volunteer["tshirtSize"]
|
tshirtSize: Volunteer["tshirtSize"]
|
||||||
tshirtCount: Volunteer["tshirtCount"]
|
|
||||||
adult: Volunteer["adult"]
|
adult: Volunteer["adult"]
|
||||||
food: Volunteer["food"]
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface VolunteerPersonalInfo {
|
export interface VolunteerPersonalInfo {
|
||||||
|
@ -37,8 +37,7 @@ export const fetchVolunteerMealsSet = elementFetch(
|
|||||||
getRequesting,
|
getRequesting,
|
||||||
getSuccess,
|
getSuccess,
|
||||||
getFailure,
|
getFailure,
|
||||||
(error: Error) =>
|
(error: Error) => toastError(`Erreur lors du chargement des choix des repas: ${error.message}`)
|
||||||
toastError(`Erreur lors du chargement des choix de jours de présence: ${error.message}`)
|
|
||||||
)
|
)
|
||||||
|
|
||||||
const shouldFetchVolunteerMealsSet = (state: AppState, id: number) =>
|
const shouldFetchVolunteerMealsSet = (state: AppState, id: number) =>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user