Antoine/lhoist-stay-safe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

hadnling translations

Browse Source
This commit is contained in:
Antoine M 2024-02-21 11:03:47 +01:00
parent e3f309dd73
commit 119348acfb
1 changed files with 20 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/game/GameAnswerExplanation.jsx
View File

@ -3,16 +3,23 @@ import { useGame } from "../../hooks/useGame";
import sucessIcon from "../../assets/img/icons/behaviour-type-success.svg"; import sucessIcon from "../../assets/img/icons/behaviour-type-success.svg";
import errorIcon from "../../assets/img/icons/behaviour-type-error.svg"; import errorIcon from "../../assets/img/icons/behaviour-type-error.svg";
import { useUser } from "../../hooks/useUser";
import Loading from "../animations/Loading";
export default function GameAnwerExplanation({ questionId }) { export default function GameAnwerExplanation({ questionId }) {
const { answers, contextGameDatas, setCurrentGameModal, checkIfGameIsComplete } = useGame(); const { answers, contextGameDatas, setCurrentGameModal, checkIfGameIsComplete } = useGame();
const { screensTranslations } = useUser();
if (!screensTranslations || !screensTranslations.tutorial) return <Loading />;
const currentScreenTranslations = screensTranslations.game;
const answer = answers[questionId]; const answer = answers[questionId];
const answerExplanation = const answerExplanation =
contextGameDatas.gameObjects[questionId].attrs.objectBehaviourDescription ?? contextGameDatas.gameObjects[questionId].attrs.objectBehaviourDescription ??
"Pas d'explication pour cette question"; "Pas d'explication pour cette question";
const objectPictureUrl = contextGameDatas.gameObjects[questionId].attrs.objectPictureUrl; const objectPictureUrl = contextGameDatas.gameObjects[questionId].attrs.objectPictureUrl;
console.log(answer);
return ( return (
<div className='modal-content-container answer-explanation-container'> <div className='modal-content-container answer-explanation-container'>
<div className='modal-content-container__content'> <div className='modal-content-container__content'>
@ -20,7 +27,7 @@ export default function GameAnwerExplanation({ questionId }) {
<> <>
<div></div> <div></div>
<h3 className='answer-explanation__type answer-explanation__type--success '> <h3 className='answer-explanation__type answer-explanation__type--success '>
Bonne réponse ! {currentScreenTranslations.right_answer}
<img <img
className='success-icon success-icon--success' className='success-icon success-icon--success'
src={sucessIcon} src={sucessIcon}
@ -32,7 +39,7 @@ export default function GameAnwerExplanation({ questionId }) {
{answer.userAnsweredCorrectly === false && ( {answer.userAnsweredCorrectly === false && (
<> <>
<h3 className='answer-explanation__type answer-explanation__type--error'> <h3 className='answer-explanation__type answer-explanation__type--error'>
Mauvaise réponse {currentScreenTranslations.wrong_answer}
<img <img
className='success-icon success-icon--error' className='success-icon success-icon--error'
src={errorIcon} src={errorIcon}
@ -41,7 +48,16 @@ export default function GameAnwerExplanation({ questionId }) {
</h3> </h3>
</> </>
)} )}
<h2 className='answer-explanation__title'>C'est un risque</h2> {answer.correctAnswer === "safe" && (
<h2 className='answer-explanation__title'>
{currentScreenTranslations.it_is_not_risk}
</h2>
)}
{answer.correctAnswer === "unsafe" && (
<h2 className='answer-explanation__title'>
{currentScreenTranslations.it_is_risk}
</h2>
)}
<p>{answerExplanation}</p> <p>{answerExplanation}</p>
<button <button
onClick={() => { onClick={() => {