Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

GameOverPage-Ayan #175

Merged
merged 6 commits into from
Oct 19, 2024
Merged

GameOverPage-Ayan #175

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
4a1c3db
GameOverPage-Ayan
Ayansaha20 Oct 18, 2024
e951b8d
new-changes-game-over
Ayansaha20 Oct 18, 2024
f4e57aa
new-game-over
Ayansaha20 Oct 18, 2024
629e4d5
new-changes
Ayansaha20 Oct 18, 2024
65d10c2
new-changes-game-error
Ayansaha20 Oct 18, 2024
ec8202f
changes
Ayansaha20 Oct 19, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46,023 changes: 26,265 additions & 19,758 deletions package-lock.json
View file
Open in desktop

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"ajv": "^8.17.1",
"axios": "^1.6.5",
"canvas-confetti": "^1.9.2",
"character-error-rate": "^1.1.4",
Expand Down
4 changes: 4 additions & 0 deletions src/assets/images/correct.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
80 changes: 80 additions & 0 deletions src/assets/images/turtle.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions src/assets/images/wrong.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
275 changes: 234 additions & 41 deletions src/components/Layouts.jsx/MainLayout.jsx
View file
Open in desktop

Large diffs are not rendered by default.

30 changes: 29 additions & 1 deletion src/components/Mechanism/WordsOrImage.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { Box, CardContent, Typography, CircularProgress } from "@mui/material";
import { createRef, useState } from "react";
import { createRef, useState, useEffect } from "react";
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Remove unused import setOtpVerified.

The setOtpVerified function is imported from the user slice but is not used within this component. To maintain clean code and avoid potential confusion, it's recommended to remove unused imports.

Apply this change:

-import { setOtpVerified } from "../../store/slices/user.slice";

Also applies to: 8-8

import v11 from "../../assets/audio/V10.mp3";
import VoiceAnalyser from "../../utils/VoiceAnalyser";
import { PlayAudioButton, StopAudioButton } from "../../utils/constants";
Expand Down Expand Up @@ -53,6 +53,29 @@ const WordsOrImage = ({
const [isReady, setIsReady] = useState(false);

const [isPlaying, setIsPlaying] = useState(false);
const [storedData, setStoredData] = useState([]);

//console.log('wordsORimage', words, storedData);

const updateStoredData = (audio, isCorrect) => {
if (audio && words) {
const newEntry = {
selectedAnswer: words,
audioUrl: audio,
correctAnswer: isCorrect,
};

setStoredData((prevData) => [...prevData, newEntry]);
}
};

const resetStoredData = () => {
setStoredData([]);
};

useEffect(() => {
updateStoredData();
}, [handleNext]);
Comment on lines +60 to +78
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Optimize useEffect hook for updateStoredData.

The updateStoredData function is well-implemented for capturing audio-related data. However, the useEffect hook that calls this function lacks dependency array, which may cause unnecessary updates.

Consider modifying the useEffect hook as follows:

-useEffect(() => {
-  updateStoredData();
-}, [handleNext]);
+useEffect(() => {
+  if (handleNext) {
+    updateStoredData();
+  }
+}, [handleNext, updateStoredData]);

This change ensures that updateStoredData is only called when handleNext changes and the function is defined.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
const updateStoredData = (audio, isCorrect) => {
if (audio && words) {
const newEntry = {
selectedAnswer: words,
audioUrl: audio,
correctAnswer: isCorrect,
};
setStoredData((prevData) => [...prevData, newEntry]);
}
};
const resetStoredData = () => {
setStoredData([]);
};
useEffect(() => {
updateStoredData();
}, [handleNext]);
const updateStoredData = (audio, isCorrect) => {
if (audio && words) {
const newEntry = {
selectedAnswer: words,
audioUrl: audio,
correctAnswer: isCorrect,
};
setStoredData((prevData) => [...prevData, newEntry]);
}
};
const resetStoredData = () => {
setStoredData([]);
};
useEffect(() => {
if (handleNext) {
updateStoredData();
}
}, [handleNext, updateStoredData]);


const togglePlayPause = () => {
if (isPlaying) {
Expand All @@ -72,6 +95,9 @@ const WordsOrImage = ({
enableNext={enableNext}
showTimer={showTimer}
points={points}
storedData={storedData}
resetStoredData={resetStoredData}
pageName={"wordsorimage"}
{...{
steps,
currentStep,
Expand Down Expand Up @@ -237,7 +263,9 @@ const WordsOrImage = ({
)}
<Box sx={{ display: "flex", justifyContent: "center" }}>
<VoiceAnalyser
pageName={"wordsorimage"}
setVoiceText={setVoiceText}
updateStoredData={updateStoredData}
setRecordedAudio={setRecordedAudio}
setVoiceAnimate={setVoiceAnimate}
storyLine={storyLine}
Expand Down
4 changes: 4 additions & 0 deletions src/components/Practice/Mechanics3.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,8 @@ const Mechanics2 = ({
const lang = getLocalData("lang");
let wordToCheck = type === "audio" ? parentWords : wordToFill;

//console.log('Mechanics3', answer);

useEffect(() => {
const initializeFillInTheBlank = async () => {
if (type === "fillInTheBlank" && parentWords?.length) {
Expand Down Expand Up @@ -238,6 +240,7 @@ const Mechanics2 = ({
enableNext={getEnableButton()}
showTimer={showTimer}
points={points}
pageName={"m3"}
{...{
steps,
currentStep,
Expand Down Expand Up @@ -540,6 +543,7 @@ const Mechanics2 = ({
<Box sx={{ display: "flex", justifyContent: "center" }}>
<VoiceAnalyser
setVoiceText={setVoiceText}
pageName={"m3"}
setRecordedAudio={setRecordedAudio}
setVoiceAnimate={setVoiceAnimate}
storyLine={storyLine}
Expand Down
4 changes: 4 additions & 0 deletions src/components/Practice/Mechanics4.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,8 @@ const Mechanics4 = ({
return words;
}

//console.log('Mechanics4');

useEffect(() => {
let wordsArr = jumbleSentence(parentWords);
if (parentWords) {
Expand Down Expand Up @@ -154,6 +156,7 @@ const Mechanics4 = ({
enableNext={enableNext}
showTimer={showTimer}
points={points}
pageName={"m4"}
{...{
steps,
currentStep,
Expand Down Expand Up @@ -314,6 +317,7 @@ const Mechanics4 = ({
{
<Box sx={{ display: "flex", justifyContent: "center" }}>
<VoiceAnalyser
pageName={"m4"}
setVoiceText={setVoiceText}
setRecordedAudio={setRecordedAudio}
setVoiceAnimate={setVoiceAnimate}
Expand Down
29 changes: 29 additions & 0 deletions src/components/Practice/Mechanics5.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,28 @@ const Mechanics5 = ({
const [playingIndex, setPlayingIndex] = useState(null);
const [selectedOption, setSelectedOption] = useState(null); // Add state to track selected radio button

const [storedData, setStoredData] = useState([]);

const updateStoredData = (audios, isCorrect) => {
if (audios) {
const newEntry = {
selectedAnswer: options[selectedOption]?.text,
audioUrl: audios,
correctAnswer: isCorrect,
};
Comment on lines +66 to +69
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Potential undefined access when 'selectedOption' is null

In the updateStoredData function, you're accessing options[selectedOption]?.text. If selectedOption is null or undefined, options[selectedOption] will be undefined, which might lead to unexpected behavior.

Consider adding a check to ensure selectedOption is not null or undefined before accessing options[selectedOption]:

if (audios) {
+   if (selectedOption !== null && selectedOption !== undefined) {
      const newEntry = {
        selectedAnswer: options[selectedOption]?.text,
        audioUrl: audios,
        correctAnswer: isCorrect,
      };
      setStoredData((prevData) => [...prevData, newEntry]);
+   } else {
+     // Handle the case when no option is selected
+     // For example, provide a default value or skip updating storedData
+   }
}

Committable suggestion was skipped due to low confidence.


setStoredData((prevData) => [...prevData, newEntry]);
}
};

const resetStoredData = () => {
setStoredData([]);
};

useEffect(() => {
updateStoredData();
}, [handleNext]);
Comment on lines +79 to +81
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Missing arguments in 'updateStoredData' function call

The updateStoredData function expects audios and isCorrect as parameters, but it is being called without any arguments inside the useEffect hook. This could lead to unexpected behavior or errors.

To fix this issue, provide the necessary arguments when calling updateStoredData. If you intend to initialize or reset the stored data on handleNext, consider passing default values or adjusting the function accordingly.

useEffect(() => {
-   updateStoredData();
+   updateStoredData(null, false); // or provide appropriate arguments
}, [handleNext]);

Alternatively, if audios and isCorrect can be optional, you can set default values in the function definition:

- const updateStoredData = (audios, isCorrect) => {
+ const updateStoredData = (audios = null, isCorrect = false) => {

Committable suggestion was skipped due to low confidence.


useEffect(() => {
// Ensure that audio stops playing when options change
audiosRef.current.forEach((ref) => {
Expand Down Expand Up @@ -95,12 +117,17 @@ const Mechanics5 = ({
}
};

//console.log('Mechanics5' , storedData, options);

const handleOptionChange = (event, i) => {
setSelectedOption(i); // Set the selected option index
};

return (
<MainLayout
pageName={"m5"}
storedData={storedData}
resetStoredData={resetStoredData}
background={background}
handleNext={handleNext}
enableNext={enableNext}
Expand Down Expand Up @@ -244,6 +271,8 @@ const Mechanics5 = ({

<Box paddingTop={4} sx={{ display: "flex", justifyContent: "center" }}>
<VoiceAnalyser
pageName={"m5"}
updateStoredData={updateStoredData}
setVoiceText={setVoiceText}
setRecordedAudio={setRecordedAudio}
setVoiceAnimate={setVoiceAnimate}
Expand Down
4 changes: 4 additions & 0 deletions src/components/Practice/Mechanics6.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -94,6 +94,8 @@ const Mechanics2 = ({
initializeAudio();
}, [contentId, parentWords]);

//console.log('Mechanics6');

const getSimilarWords = async (wordForFindingHomophones) => {
const lang = getLocalData("lang");
// const isFillInTheBlanks = type === "fillInTheBlank";
Expand Down Expand Up @@ -194,6 +196,7 @@ const Mechanics2 = ({
};
return (
<MainLayout
pageName={"m6"}
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue

Update component name to match pageName

The pageName prop is set to "m6", but the component is still named Mechanics2. To maintain consistency, update the component name to Mechanics6.

Apply this change throughout the file:

- const Mechanics2 = ({ ... }) => {
+ const Mechanics6 = ({ ... }) => {

  // At the end of the file
- export default Mechanics2;
+ export default Mechanics6;

Committable suggestion was skipped due to low confidence.

background={background}
handleNext={handleNext}
enableNext={getEnableButton()}
Expand Down Expand Up @@ -478,6 +481,7 @@ const Mechanics2 = ({
{
<Box sx={{ display: "flex", justifyContent: "center" }}>
<VoiceAnalyser
pageName={"m6"}
setVoiceText={setVoiceText}
setRecordedAudio={setRecordedAudio}
setVoiceAnimate={setVoiceAnimate}
Expand Down
21 changes: 21 additions & 0 deletions src/utils/VoiceAnalyser.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -74,6 +74,9 @@ function VoiceAnalyser(props) {
const [isAudioPreprocessing, setIsAudioPreprocessing] = useState(
process.env.REACT_APP_IS_AUDIOPREPROCESSING === "true"
);
const [isMatching, setIsMatching] = useState(false);

//console.log('audio', recordedAudio, isMatching);

useEffect(() => {
if (!props.enableNext) {
Expand Down Expand Up @@ -348,6 +351,14 @@ function VoiceAnalyser(props) {
}
}

if (responseText.toLowerCase() === originalText.toLowerCase()) {
setIsMatching(true);
} else {
setIsMatching(false);
}

//console.log('textss', recordedAudio, isMatching, responseText, originalText);

const responseEndTime = new Date().getTime();
const responseDuration = Math.round(
(responseEndTime - responseStartTime) / 1000
Expand Down Expand Up @@ -602,6 +613,8 @@ function VoiceAnalyser(props) {
});
};

//console.log('textss', recordedAudio, isMatching);

return (
<div>
{loader ? (
Expand Down Expand Up @@ -663,6 +676,12 @@ function VoiceAnalyser(props) {
<Box
sx={{ cursor: "pointer" }}
onClick={() => {
if (
props.pageName === "wordsorimage" ||
props.pageName === "m5"
) {
props.updateStoredData(recordedAudio, isMatching);
}
if (props.setIsNextButtonCalled) {
props.setIsNextButtonCalled(true);
} else {
Expand Down Expand Up @@ -696,6 +715,8 @@ VoiceAnalyser.propTypes = {
setVoiceText: PropTypes.func.isRequired,
livesData: PropTypes.object,
contentId: PropTypes.string,
updateStoredData: PropTypes.func.isRequired,
pageName: PropTypes.string,
};

export default VoiceAnalyser;
Loading