From 72ee71dbe888d94f645ad551d56cf9e5b64ebf13 Mon Sep 17 00:00:00 2001 From: Ajinkya Pande Date: Thu, 22 Aug 2024 16:02:37 +0530 Subject: [PATCH 1/9] Issueid #225129 fix: Blob Destroy from Memory in Firefox --- package.json | 17 ++-- src/utils/AudioCompare.js | 189 +++++++++++++++++++++++--------------- 2 files changed, 123 insertions(+), 83 deletions(-) diff --git a/package.json b/package.json index 7948ced6..95b5bdbf 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,9 @@ "canvas-confetti": "^1.9.2", "character-error-rate": "^1.1.4", "classnames": "^2.3.1", + "eslint-plugin-import": "^2.28.0", + "eslint-plugin-jsx-a11y": "^6.7.1", + "eslint-plugin-react": "^7.33.1", "faker": "^5.5.3", "homophones": "^1.0.1", "jwt-decode": "^4.0.0", @@ -38,15 +41,13 @@ "react-virtualized": "^9.22.3", "react-virtualized-auto-sizer": "^1.0.6", "react-window": "^1.8.6", + "recordrtc": "^5.6.2", "redux": "^4.1.2", "redux-saga": "^1.1.3", "sass": "^1.44.0", "split-graphemes": "^0.5.0", "use-sound": "^4.0.1", - "web-vitals": "^2.1.4", - "eslint-plugin-import": "^2.28.0", - "eslint-plugin-jsx-a11y": "^6.7.1", - "eslint-plugin-react": "^7.33.1" + "web-vitals": "^2.1.4" }, "scripts": { "start": "react-scripts start", @@ -87,16 +88,16 @@ ] }, "devDependencies": { + "@mui/styles": "^5.15.10", "eslint": "^7.32.0", - "prettier": "^2.3.2", "eslint-config-prettier": "^8.3.0", "eslint-plugin-prettier": "^3.4.0", "husky": "^9.0.11", "lint-staged": "^11.0.0", - "react": "^18.2.0", - "@mui/styles": "^5.15.10" + "prettier": "^2.3.2", + "react": "^18.2.0" }, - "lint-staged": { + "lint-staged": { "src/**/*.{js,jsx}": [ "npx eslint --fix", "npx prettier --write" diff --git a/src/utils/AudioCompare.js b/src/utils/AudioCompare.js index 90f38655..164f0b29 100644 --- a/src/utils/AudioCompare.js +++ b/src/utils/AudioCompare.js @@ -1,87 +1,113 @@ -import React, { useState } from "react"; -import AudioAnalyser from "react-audio-analyser"; +import React, { useState, useEffect, useRef } from "react"; +import RecordRTC from "recordrtc"; import { Box } from "@mui/material"; import { ListenButton, RetryIcon, SpeakButton, StopButton } from "./constants"; import RecordVoiceVisualizer from "./RecordVoiceVisualizer"; -import useAudioDetection from "./useAudioDetection"; -const AudioRecorderCompair = (props) => { - const { startDetection, stopDetection, isSilent, isRunning, audioDetected } = useAudioDetection(); +const AudioRecorder = (props) => { + const [isRecording, setIsRecording] = useState(false); const [status, setStatus] = useState(""); - const [audioSrc, setAudioSrc] = useState(""); - const [recordingInitialized, setRecordingInitialized] = useState(false); - const audioType = "audio/wav"; + const [audioBlob, setAudioBlob] = useState(null); + const recorderRef = useRef(null); + const mediaStreamRef = useRef(null); - const controlAudio = async (status) => { - if (status === "recording") { - await startDetection(); - } else { - stopDetection(); - } - setStatus(status); - }; - - const resetRecording = () => { - setAudioSrc(""); - setRecordingInitialized(false); - }; + useEffect(() => { + // Cleanup when component unmounts + return () => { + if (recorderRef.current) { + recorderRef.current.destroy(); + } + if (mediaStreamRef.current) { + mediaStreamRef.current.getTracks().forEach((track) => track.stop()); + } + }; + }, []); - const handleMic = async () => { + const startRecording = async () => { + setStatus("recording"); if (props.setEnableNext) { props.setEnableNext(false); } - document.getElementById("startaudio_compair").click(); - resetRecording(); + try { + const stream = await navigator.mediaDevices.getUserMedia({ audio: true }); + mediaStreamRef.current = stream; + + recorderRef.current = new RecordRTC(stream, { type: "audio" }); + recorderRef.current.startRecording(); + + setIsRecording(true); + } catch (err) { + console.error("Failed to start recording:", err); + } }; - const handleStop = () => { + const stopRecording = () => { + setStatus("inactive"); + if (recorderRef.current) { + recorderRef.current.stopRecording(() => { + const blob = recorderRef.current.getBlob(); + + if (blob) { + setAudioBlob(blob); + saveBlob(blob); // Persist the blob + } else { + console.error("Failed to retrieve audio blob."); + } + + // Stop the media stream + if (mediaStreamRef.current) { + mediaStreamRef.current.getTracks().forEach((track) => track.stop()); + } + + setIsRecording(false); + }); + } if (props.setEnableNext) { props.setEnableNext(true); } - document.getElementById("stopaudio_compair").click(); }; - const audioProps = { - audioType, - status, - audioSrc, - timeslice: 1000, - startCallback: (e) => { - setAudioSrc(""); - setRecordingInitialized(true); - props.setRecordedAudio(""); - }, - pauseCallback: (e) => {}, - stopCallback: (e) => { - const temp_audioSrc = window.URL.createObjectURL(e); - setAudioSrc(temp_audioSrc); - if (!audioDetected) { - props?.setOpenMessageDialog({ - message: "Please Speak Louder and Clear", - isError: true, + const saveBlob = (blob) => { + const reader = new FileReader(); + reader.onloadend = () => { + const base64Data = reader.result; + playRecording(base64Data); + }; + reader.readAsDataURL(blob); + }; + + const playRecording = (base64Data) => { + if (base64Data) { + fetch(base64Data) + .then((res) => res.blob()) + .then((blob) => { + const url = URL.createObjectURL(blob); + props?.setRecordedAudio(url); }); - if (props.setEnableNext) { - props.setEnableNext(false); - } - } else { - props.setRecordedAudio(temp_audioSrc); - } - setRecordingInitialized(false); - }, - onRecordCallback: (e) => {}, - errorCallback: (err) => {}, - backgroundColor: "hsla(0, 100%, 0%, 0)", - strokeColor: "#73DD24", + } else { + console.error("No saved audio found."); + } }; return (
{(() => { - if (status === "recording" && recordingInitialized) { + if (status === "recording") { return ( -
- +
+ @@ -91,17 +117,33 @@ const AudioRecorderCompair = (props) => { ); } else { return ( -
+
{(!props.dontShowListen || props.recordedAudio) && ( <> {!props.pauseAudio ? ( -
{ props.playAudio(true); }} aria-label="Play audio"> +
{ + props.playAudio(true); + }} + >
) : ( - { props.playAudio(false); }}> + { + props.playAudio(false); + }} + > )} @@ -110,7 +152,15 @@ const AudioRecorderCompair = (props) => {
{!props.showOnlyListen && ( - + {!props.recordedAudio ? : } )} @@ -119,20 +169,9 @@ const AudioRecorderCompair = (props) => { ); } })()} - -
-
- - -
-
); }; -export default AudioRecorderCompair; +export default AudioRecorder; From d409cee836f5da45b7d03068c032a59be536cd25 Mon Sep 17 00:00:00 2001 From: Ajinkya Pande Date: Thu, 22 Aug 2024 17:17:33 +0530 Subject: [PATCH 2/9] Issueid #225129 fix: Blob Destroy from Memory in Firefox --- src/utils/AudioCompare.js | 31 +++++++++++-------------------- 1 file changed, 11 insertions(+), 20 deletions(-) diff --git a/src/utils/AudioCompare.js b/src/utils/AudioCompare.js index 164f0b29..8caacbca 100644 --- a/src/utils/AudioCompare.js +++ b/src/utils/AudioCompare.js @@ -32,7 +32,15 @@ const AudioRecorder = (props) => { const stream = await navigator.mediaDevices.getUserMedia({ audio: true }); mediaStreamRef.current = stream; - recorderRef.current = new RecordRTC(stream, { type: "audio" }); + // Use RecordRTC with specific configurations to match the blob structure + recorderRef.current = new RecordRTC(stream, { + type: "audio", + mimeType: "audio/wav", // Ensuring the same MIME type as AudioRecorderCompair + recorderType: RecordRTC.StereoAudioRecorder, // Use StereoAudioRecorder for better compatibility + numberOfAudioChannels: 1, // Match the same number of audio channels + desiredSampRate: 16000, // Adjust the sample rate if necessary to match + }); + recorderRef.current.startRecording(); setIsRecording(true); @@ -68,25 +76,8 @@ const AudioRecorder = (props) => { }; const saveBlob = (blob) => { - const reader = new FileReader(); - reader.onloadend = () => { - const base64Data = reader.result; - playRecording(base64Data); - }; - reader.readAsDataURL(blob); - }; - - const playRecording = (base64Data) => { - if (base64Data) { - fetch(base64Data) - .then((res) => res.blob()) - .then((blob) => { - const url = URL.createObjectURL(blob); - props?.setRecordedAudio(url); - }); - } else { - console.error("No saved audio found."); - } + const url = window.URL.createObjectURL(blob); + props?.setRecordedAudio(url); }; return ( From 6f708cab166d78d2a4c18f4f3c0add7e184992cb Mon Sep 17 00:00:00 2001 From: Ajinkya Pande Date: Mon, 26 Aug 2024 14:59:47 +0530 Subject: [PATCH 3/9] Issueid #219476 fix: Next button is not visible in level 9 below screen resolution 1300 --- src/components/Mechanism/WordsOrImage.jsx | 26 ++--- src/views/Practice/Practice.jsx | 120 +++++++++++----------- 2 files changed, 75 insertions(+), 71 deletions(-) diff --git a/src/components/Mechanism/WordsOrImage.jsx b/src/components/Mechanism/WordsOrImage.jsx index f8f4018f..c6ea0bc1 100644 --- a/src/components/Mechanism/WordsOrImage.jsx +++ b/src/components/Mechanism/WordsOrImage.jsx @@ -46,7 +46,7 @@ const WordsOrImage = ({ loading, setOpenMessageDialog, isNextButtonCalled, - setIsNextButtonCalled + setIsNextButtonCalled, }) => { const audioRef = createRef(null); const [duration, setDuration] = useState(0); @@ -90,7 +90,7 @@ const WordsOrImage = ({ livesData, gameOverData, loading, - setIsNextButtonCalled + setIsNextButtonCalled, }} > + display={"flex"} + mb={4} + sx={{ + width: "100%", + justifyContent: "center", + flexWrap: "wrap", + }} + > {highlightWords(words, matchedChar)} )} - + )} diff --git a/src/views/Practice/Practice.jsx b/src/views/Practice/Practice.jsx index ddb5ac52..aa4e7838 100644 --- a/src/views/Practice/Practice.jsx +++ b/src/views/Practice/Practice.jsx @@ -3,9 +3,7 @@ import Mechanics2 from "../../components/Practice/Mechanics2"; import Mechanics3 from "../../components/Practice/Mechanics3"; import Mechanics4 from "../../components/Practice/Mechanics4"; import Mechanics5 from "../../components/Practice/Mechanics5"; -import { - useNavigate, -} from "../../../node_modules/react-router-dom/dist/index"; +import { useNavigate } from "../../../node_modules/react-router-dom/dist/index"; import { callConfetti, getLocalData, @@ -53,19 +51,22 @@ const Practice = () => { const TARGETS_PERCENTAGE = 0.3; const [openMessageDialog, setOpenMessageDialog] = useState(""); const lang = getLocalData("lang"); - const [totalSyllableCount, setTotalSyllableCount] = useState(''); - const [percentage, setPercentage] = useState(''); + const [totalSyllableCount, setTotalSyllableCount] = useState(""); + const [percentage, setPercentage] = useState(""); const [fluency, setFluency] = useState(false); const [isNextButtonCalled, setIsNextButtonCalled] = useState(false); const gameOver = (data, isUserPass) => { let userWon = isUserPass ? true : false; const meetsFluencyCriteria = livesData.meetsFluencyCriteria ? true : false; - setGameOverData({ gameOver: true, userWon, ...data, meetsFluencyCriteria}); + setGameOverData({ gameOver: true, userWon, ...data, meetsFluencyCriteria }); }; const isFirefox = () => { - return typeof navigator !== 'undefined' && navigator.userAgent.toLowerCase().includes('firefox'); + return ( + typeof navigator !== "undefined" && + navigator.userAgent.toLowerCase().includes("firefox") + ); }; useEffect(() => { @@ -128,7 +129,7 @@ const Practice = () => { }, [voiceText]); const send = (score) => { - if (process.env.REACT_APP_IS_APP_IFRAME === 'true') { + if (process.env.REACT_APP_IS_APP_IFRAME === "true") { window.parent.postMessage({ score: score, message: "all-test-rig-score", @@ -137,23 +138,23 @@ const Practice = () => { }; const checkFluency = (contentType, fluencyScore) => { - switch (contentType.toLowerCase()) { - case 'word': - setFluency(fluencyScore < 2); - break; - case 'sentence': - setFluency(fluencyScore < 6); - break; - case 'paragraph': - setFluency(fluencyScore < 10); - break; - default: - setFluency(true); - } - } + switch (contentType.toLowerCase()) { + case "word": + setFluency(fluencyScore < 2); + break; + case "sentence": + setFluency(fluencyScore < 6); + break; + case "paragraph": + setFluency(fluencyScore < 10); + break; + default: + setFluency(true); + } + }; const handleNext = async (isGameOver) => { - setIsNextButtonCalled(true) + setIsNextButtonCalled(true); setEnableNext(false); try { @@ -192,7 +193,7 @@ const Practice = () => { currentPracticeProgress = Math.round( ((currentQuestion + 1 + currentPracticeStep * limit) / (practiceSteps.length * limit)) * - 100 + 100 ); } @@ -244,22 +245,22 @@ const Practice = () => { Log(data, "practice", "ET"); setPercentage(getSetData?.data?.percentage); checkFluency(currentContentType, getSetData?.data?.fluency); - if(process.env.REACT_APP_POST_LEARNER_PROGRESS === "true"){ - await axios.post( - `${process.env.REACT_APP_LEARNER_AI_ORCHESTRATION_HOST}/${config.URLS.CREATE_LEARNER_PROGRESS}`, - { - userId: virtualId, - sessionId: sessionId, - subSessionId: sub_session_id, - milestoneLevel: getSetData?.data?.currentLevel, - totalSyllableCount: totalSyllableCount, - language: localStorage.getItem("lang"), - } - ); - } + if (process.env.REACT_APP_POST_LEARNER_PROGRESS === "true") { + await axios.post( + `${process.env.REACT_APP_LEARNER_AI_ORCHESTRATION_HOST}/${config.URLS.CREATE_LEARNER_PROGRESS}`, + { + userId: virtualId, + sessionId: sessionId, + subSessionId: sub_session_id, + milestoneLevel: getSetData?.data?.currentLevel, + totalSyllableCount: totalSyllableCount, + language: localStorage.getItem("lang"), + } + ); + } setLocalData("previous_level", getSetData.data.previous_level); if (getSetData.data.sessionResult === "pass") { - try{ + try { await axios.post( `${process.env.REACT_APP_LEARNER_AI_ORCHESTRATION_HOST}/${config.URLS.ADD_LESSON}`, { @@ -274,8 +275,7 @@ const Practice = () => { ); gameOver({ link: "/assesment-end" }, true); return; - } - catch(e){ + } catch (e) { // catch error } } @@ -316,14 +316,15 @@ const Practice = () => { `${process.env.REACT_APP_LEARNER_AI_APP_HOST}/${config.URLS.GET_CONTENT}/${currentGetContent.criteria}/${virtualId}?language=${lang}&contentlimit=${limit}&gettargetlimit=${limit}` ); - setTotalSyllableCount(resGetContent?.data?.totalSyllableCount) + setTotalSyllableCount(resGetContent?.data?.totalSyllableCount); setLivesData({ ...livesData, totalTargets: resGetContent?.data?.totalSyllableCount, targetsForLives: resGetContent?.data?.subsessionTargetsCount * TARGETS_PERCENTAGE, targetPerLive: - (resGetContent?.data?.subsessionTargetsCount * TARGETS_PERCENTAGE) / LIVES, + (resGetContent?.data?.subsessionTargetsCount * TARGETS_PERCENTAGE) / + LIVES, }); let showcaseLevel = @@ -405,9 +406,9 @@ const Practice = () => { const virtualId = getLocalData("virtualId"); let sessionId = getLocalData("sessionId"); - if (!sessionId){ + if (!sessionId) { sessionId = uniqueId(); - localStorage.setItem("sessionId", sessionId) + localStorage.setItem("sessionId", sessionId); } const getMilestoneDetails = await axios.get( @@ -455,11 +456,12 @@ const Practice = () => { const resWord = await axios.get( `${process.env.REACT_APP_LEARNER_AI_APP_HOST}/${config.URLS.GET_CONTENT}/${currentGetContent.criteria}/${virtualId}?language=${lang}&contentlimit=${limit}&gettargetlimit=${limit}` ); - setTotalSyllableCount(resWord?.data?.totalSyllableCount) + setTotalSyllableCount(resWord?.data?.totalSyllableCount); setLivesData({ ...livesData, totalTargets: resWord?.data?.totalSyllableCount, - targetsForLives: resWord?.data?.subsessionTargetsCount * TARGETS_PERCENTAGE, + targetsForLives: + resWord?.data?.subsessionTargetsCount * TARGETS_PERCENTAGE, targetPerLive: (resWord?.data?.subsessionTargetsCount * TARGETS_PERCENTAGE) / LIVES, }); @@ -544,11 +546,12 @@ const Practice = () => { const resWord = await axios.get( `${process.env.REACT_APP_LEARNER_AI_APP_HOST}/${config.URLS.GET_CONTENT}/${currentGetContent.criteria}/${virtualId}?language=${lang}&contentlimit=${limit}&gettargetlimit=${limit}` ); - setTotalSyllableCount(resWord?.data?.totalSyllableCount) + setTotalSyllableCount(resWord?.data?.totalSyllableCount); setLivesData({ ...livesData, totalTargets: resWord?.data?.totalSyllableCount, - targetsForLives: resWord?.data?.subsessionTargetsCount * TARGETS_PERCENTAGE, + targetsForLives: + resWord?.data?.subsessionTargetsCount * TARGETS_PERCENTAGE, targetPerLive: (resWord?.data?.subsessionTargetsCount * TARGETS_PERCENTAGE) / LIVES, }); @@ -565,10 +568,10 @@ const Practice = () => { setCurrentQuestion(practiceProgress[virtualId]?.currentQuestion || 0); setLocalData("practiceProgress", JSON.stringify(practiceProgress)); } else { - if (process.env.REACT_APP_IS_APP_IFRAME === 'true') { + if (process.env.REACT_APP_IS_APP_IFRAME === "true") { navigate("/"); - }else { - navigate("/discover-start") + } else { + navigate("/discover-start"); } } }; @@ -611,7 +614,7 @@ const Practice = () => { variant="h5" component="h4" sx={{ - fontSize: `${fontSize}px`, + fontSize: "clamp(1.6rem, 2.5vw, 3.8rem)", fontWeight: 700, fontFamily: "Quicksand", lineHeight: "50px", @@ -635,7 +638,7 @@ const Practice = () => { component="h4" sx={{ color: "#333F61", - fontSize: `${fontSize}px`, + fontSize: "clamp(1.6rem, 2.5vw, 3.8rem)", fontWeight: 700, fontFamily: "Quicksand", lineHeight: "50px", @@ -698,11 +701,12 @@ const Practice = () => { useEffect(() => { if (questions[currentQuestion]?.contentSourceData) { - if (process.env.REACT_APP_IS_APP_IFRAME === 'true') { - const contentSourceData = questions[currentQuestion]?.contentSourceData || []; - const stringLengths = contentSourceData.map(item => item.text.length); + if (process.env.REACT_APP_IS_APP_IFRAME === "true") { + const contentSourceData = + questions[currentQuestion]?.contentSourceData || []; + const stringLengths = contentSourceData.map((item) => item.text.length); const length = stringLengths[0]; - window.parent.postMessage({ type: 'stringLengths', length }); + window.parent.postMessage({ type: "stringLengths", length }); } } }, [questions[currentQuestion]]); @@ -755,7 +759,7 @@ const Practice = () => { setOpenMessageDialog, setEnableNext, isNextButtonCalled, - setIsNextButtonCalled + setIsNextButtonCalled, }} /> ); From f3ac787e5bfd1bc6b17514739c541a664f7f4fd7 Mon Sep 17 00:00:00 2001 From: Ajinkya Pande Date: Mon, 26 Aug 2024 17:17:41 +0530 Subject: [PATCH 4/9] Issue id #225754 fix: When the sound icon is clicked, the Tamil sentence is being played. --- src/utils/AudioCompare.js | 50 ++++----- src/utils/VoiceAnalyser.js | 205 +++++++++++++++++++------------------ 2 files changed, 134 insertions(+), 121 deletions(-) diff --git a/src/utils/AudioCompare.js b/src/utils/AudioCompare.js index 8caacbca..c4545242 100644 --- a/src/utils/AudioCompare.js +++ b/src/utils/AudioCompare.js @@ -39,6 +39,7 @@ const AudioRecorder = (props) => { recorderType: RecordRTC.StereoAudioRecorder, // Use StereoAudioRecorder for better compatibility numberOfAudioChannels: 1, // Match the same number of audio channels desiredSampRate: 16000, // Adjust the sample rate if necessary to match + disableLogs: true, }); recorderRef.current.startRecording(); @@ -116,33 +117,34 @@ const AudioRecorder = (props) => { }} className="game-action-button" > - {(!props.dontShowListen || props.recordedAudio) && ( - <> - {!props.pauseAudio ? ( -
{ - props.playAudio(true); - }} - > - - + {props?.originalText && + (!props.dontShowListen || props.recordedAudio) && ( + <> + {!props.pauseAudio ? ( +
{ + props.playAudio(true); + }} + > + + + +
+ ) : ( + { + props.playAudio(false); + }} + > + -
- ) : ( - { - props.playAudio(false); - }} - > - - - )} - - )} + )} + + )}
- {!props.showOnlyListen && ( + {props?.originalText && !props.showOnlyListen && ( { - if(props.isNextButtonCalled){ + useEffect(() => { + if (props.isNextButtonCalled) { if (recordedAudioBase64 !== "") { const lang = getLocalData("lang") || "ta"; fetchASROutput(lang, recordedAudioBase64); - setLoader(true) + setLoader(true); } } - },[props.isNextButtonCalled]) + }, [props.isNextButtonCalled]); useEffect(() => { if (recordedAudioBase64 !== "") { - if( props.setIsNextButtonCalled){ + if (props.setIsNextButtonCalled) { props.setIsNextButtonCalled(false); } } @@ -258,7 +258,7 @@ function VoiceAnalyser(props) { const { originalText, contentType, contentId, currentLine } = props; const responseStartTime = new Date().getTime(); let responseText = ""; - let profanityWord = "" + let profanityWord = ""; let newThresholdPercentage = 0; let data = {}; @@ -279,16 +279,21 @@ function VoiceAnalyser(props) { ); data = updateLearnerData; responseText = data.responseText; - profanityWord = await filterBadWords(data.responseText); + profanityWord = await filterBadWords(data.responseText); if (profanityWord !== data.responseText) { props?.setOpenMessageDialog({ message: "Please avoid using inappropriate language.", isError: true, }); - } + } newThresholdPercentage = data?.subsessionTargetsCount || 0; - if (contentType.toLowerCase() !== 'word') { - handlePercentageForLife(newThresholdPercentage, contentType, data?.subsessionFluency, lang); + if (contentType.toLowerCase() !== "word") { + handlePercentageForLife( + newThresholdPercentage, + contentType, + data?.subsessionFluency, + lang + ); } } @@ -360,8 +365,9 @@ function VoiceAnalyser(props) { var audioFileName = ""; if (process.env.REACT_APP_CAPTURE_AUDIO === "true" && false) { let getContentId = currentLine; - audioFileName = `${process.env.REACT_APP_CHANNEL - }/${sessionId}-${Date.now()}-${getContentId}.wav`; + audioFileName = `${ + process.env.REACT_APP_CHANNEL + }/${sessionId}-${Date.now()}-${getContentId}.wav`; const command = new PutObjectCommand({ Bucket: process.env.REACT_APP_AWS_S3_BUCKET_NAME, @@ -373,7 +379,7 @@ function VoiceAnalyser(props) { }); try { const response = await S3Client.send(command); - } catch (err) { } + } catch (err) {} } response( @@ -400,23 +406,23 @@ function VoiceAnalyser(props) { ); setApiResponse(callUpdateLearner ? data.status : "success"); - if(props.handleNext){ + if (props.handleNext) { props.handleNext(); - if(temp_audio !== null){ + if (temp_audio !== null) { temp_audio.pause(); setPauseAudio(false); } } setLoader(false); - if( props.setIsNextButtonCalled){ + if (props.setIsNextButtonCalled) { props.setIsNextButtonCalled(false); } } catch (error) { setLoader(false); - if(props.handleNext){ + if (props.handleNext) { props.handleNext(); } - if( props.setIsNextButtonCalled){ + if (props.setIsNextButtonCalled) { props.setIsNextButtonCalled(false); } setRecordedAudioBase64(""); @@ -425,92 +431,95 @@ function VoiceAnalyser(props) { } }; - const handlePercentageForLife = (percentage, contentType, fluencyScore, language) => { + const handlePercentageForLife = ( + percentage, + contentType, + fluencyScore, + language + ) => { try { - if (livesData) { - let totalSyllables = livesData.totalTargets; - if (language === "en") { - if (totalSyllables > 50) { - totalSyllables = 50; - } + if (livesData) { + let totalSyllables = livesData.totalTargets; + if (language === "en") { + if (totalSyllables > 50) { + totalSyllables = 50; } - // Calculate the current percentage based on total targets. - percentage = Math.round((percentage / totalSyllables) * 100); - - // Define the total number of lives and adjust the threshold based on syllables. - const totalLives = 5; - let threshold = 30; // Default threshold - - // Adjust the threshold based on total syllables. - if (totalSyllables <= 100) threshold = 30; - else if (totalSyllables > 100 && totalSyllables <= 150) threshold = 25; - else if (totalSyllables > 150 && totalSyllables <= 175) threshold = 20; - else if (totalSyllables > 175 && totalSyllables <= 250) threshold = 15; - else if (totalSyllables > 250 && totalSyllables <= 500) threshold = 10; - else if (totalSyllables > 500) threshold = 5; - - // Calculate lives lost based on percentage. - let livesLost = Math.floor(percentage / (threshold / totalLives)); - - // Check fluency criteria and adjust lives lost accordingly. - let meetsFluencyCriteria; - switch (contentType.toLowerCase()) { - case 'word': - meetsFluencyCriteria = fluencyScore < 2; - break; - case 'sentence': - meetsFluencyCriteria = fluencyScore < 6; - break; - case 'paragraph': - meetsFluencyCriteria = fluencyScore < 10; - break; - default: - meetsFluencyCriteria = true; // Assume criteria met if not specified. - } + } + // Calculate the current percentage based on total targets. + percentage = Math.round((percentage / totalSyllables) * 100); + + // Define the total number of lives and adjust the threshold based on syllables. + const totalLives = 5; + let threshold = 30; // Default threshold + + // Adjust the threshold based on total syllables. + if (totalSyllables <= 100) threshold = 30; + else if (totalSyllables > 100 && totalSyllables <= 150) threshold = 25; + else if (totalSyllables > 150 && totalSyllables <= 175) threshold = 20; + else if (totalSyllables > 175 && totalSyllables <= 250) threshold = 15; + else if (totalSyllables > 250 && totalSyllables <= 500) threshold = 10; + else if (totalSyllables > 500) threshold = 5; + + // Calculate lives lost based on percentage. + let livesLost = Math.floor(percentage / (threshold / totalLives)); + + // Check fluency criteria and adjust lives lost accordingly. + let meetsFluencyCriteria; + switch (contentType.toLowerCase()) { + case "word": + meetsFluencyCriteria = fluencyScore < 2; + break; + case "sentence": + meetsFluencyCriteria = fluencyScore < 6; + break; + case "paragraph": + meetsFluencyCriteria = fluencyScore < 10; + break; + default: + meetsFluencyCriteria = true; // Assume criteria met if not specified. + } - // If fluency criteria are not met, reduce an additional life, but ensure it doesn't exceed the total lives. - if (!meetsFluencyCriteria && livesLost < totalLives) { - livesLost = Math.min(livesLost + 1, totalLives); - } + // If fluency criteria are not met, reduce an additional life, but ensure it doesn't exceed the total lives. + if (!meetsFluencyCriteria && livesLost < totalLives) { + livesLost = Math.min(livesLost + 1, totalLives); + } - // Determine the number of red and black lives to show. - const redLivesToShow = totalLives - livesLost; - let blackLivesToShow = 5; - if(livesLost <= 5){ - blackLivesToShow = livesLost; - } + // Determine the number of red and black lives to show. + const redLivesToShow = totalLives - livesLost; + let blackLivesToShow = 5; + if (livesLost <= 5) { + blackLivesToShow = livesLost; + } - // Prepare the new lives data. - let newLivesData = { - ...livesData, - blackLivesToShow, - redLivesToShow, - meetsFluencyCriteria: meetsFluencyCriteria, - }; - - // Play audio based on the change in lives. - const HeartGaain = - livesData.redLivesToShow === undefined - ? 5 - newLivesData.redLivesToShow - : livesData.redLivesToShow - newLivesData.redLivesToShow; - let isLiveLost; - if (HeartGaain > 0) { - isLiveLost = true; - } else { - isLiveLost = false; - } - const audio = new Audio(isLiveLost ? livesCut : livesAdd); - audio.play(); + // Prepare the new lives data. + let newLivesData = { + ...livesData, + blackLivesToShow, + redLivesToShow, + meetsFluencyCriteria: meetsFluencyCriteria, + }; - // Update the state or data structure with the new lives data. - setLivesData(newLivesData); + // Play audio based on the change in lives. + const HeartGaain = + livesData.redLivesToShow === undefined + ? 5 - newLivesData.redLivesToShow + : livesData.redLivesToShow - newLivesData.redLivesToShow; + let isLiveLost; + if (HeartGaain > 0) { + isLiveLost = true; + } else { + isLiveLost = false; } + const audio = new Audio(isLiveLost ? livesCut : livesAdd); + audio.play(); + + // Update the state or data structure with the new lives data. + setLivesData(newLivesData); + } } catch (e) { - console.log("error", e); + console.log("error", e); } -}; - - + }; // const getpermision = () => { // navigator.getUserMedia = @@ -543,6 +552,7 @@ function VoiceAnalyser(props) { //alert("Microphone Permission Denied"); }); }; + return (
{loader ? ( @@ -557,6 +567,7 @@ function VoiceAnalyser(props) { <> Date: Tue, 27 Aug 2024 14:48:11 +0530 Subject: [PATCH 5/9] Issueid #225829 fix: Spaces got hide between Sentence and Paragraph --- src/views/Practice/Practice.jsx | 119 ++++++++++++++++++++++---------- 1 file changed, 82 insertions(+), 37 deletions(-) diff --git a/src/views/Practice/Practice.jsx b/src/views/Practice/Practice.jsx index 63c0ad99..f7486cbd 100644 --- a/src/views/Practice/Practice.jsx +++ b/src/views/Practice/Practice.jsx @@ -567,40 +567,15 @@ const Practice = () => { function highlightWords(sentence, matchedChar) { const words = sentence.split(" "); - matchedChar.sort((str1, str2) => str2.length - str1.length); + matchedChar.sort(function (str1, str2) { + return str2.length - str1.length; + }); - const fontSize = + let fontSize = questions[currentQuestion]?.contentType?.toLowerCase() === "paragraph" ? 30 : 40; - const type = currentContentType?.toLowerCase(); - const commonTypographyProps = { - variant: "h5", - component: "h4", - sx: { - fontSize: "clamp(1.6rem, 2.5vw, 3.8rem)", - fontWeight: 700, - fontFamily: "Quicksand", - lineHeight: "50px", - }, - }; - - const renderTypography = (key, content, background = null) => ( - - - {content} - - - ); - + let type = currentContentType?.toLowerCase(); if (type === "char" || type === "word") { const word = splitGraphemes(words[0].toLowerCase()).filter( (item) => item !== "‌" && item !== "" && item !== " " @@ -608,30 +583,100 @@ const Practice = () => { let highlightedString = []; for (let i = 0; i < word.length; i++) { let matchFound = false; - for (const match of matchedChar) { - const length = splitGraphemes(match).filter( + for (let j = 0; j < matchedChar.length; j++) { + let length = splitGraphemes(matchedChar[j]).filter( (item) => item !== "‌" && item !== "" && item !== " " ).length; const substr = word.slice(i, i + length).join(""); - if (substr.includes(match)) { - highlightedString.push(renderTypography(i, substr, true)); + if (substr.includes(matchedChar[j])) { + highlightedString.push( + + + {substr} + + + ); i += length - 1; matchFound = true; break; } } if (!matchFound) { - highlightedString.push(renderTypography(i, word[i])); + highlightedString.push( + + + {word[i]} + + + ); } } return highlightedString; } else { - return words.map((word, index) => { + const highlightedSentence = words.map((word, index) => { const isMatched = matchedChar.some((char) => word.toLowerCase().includes(char) ); - return renderTypography(index, word + " ", isMatched); + if (isMatched) { + return ( + + + {word} + {" "} + + ); + } else { + return ( + + {word + " "} + + ); + } }); + return highlightedSentence; } } From 455ca24cdf0619a424ab4f73b6464417eeab77b0 Mon Sep 17 00:00:00 2001 From: Ajinkya Pande Date: Tue, 27 Aug 2024 16:23:46 +0530 Subject: [PATCH 6/9] comment resolved --- src/views/Practice/Practice.jsx | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/src/views/Practice/Practice.jsx b/src/views/Practice/Practice.jsx index f7486cbd..3fe6ac43 100644 --- a/src/views/Practice/Practice.jsx +++ b/src/views/Practice/Practice.jsx @@ -571,10 +571,6 @@ const Practice = () => { return str2.length - str1.length; }); - let fontSize = - questions[currentQuestion]?.contentType?.toLowerCase() === "paragraph" - ? 30 - : 40; let type = currentContentType?.toLowerCase(); if (type === "char" || type === "word") { const word = splitGraphemes(words[0].toLowerCase()).filter( @@ -595,7 +591,7 @@ const Practice = () => { variant="h5" component="h4" sx={{ - fontSize: `${fontSize}px`, + fontSize: "clamp(1.6rem, 2.5vw, 3.8rem)", fontWeight: 700, fontFamily: "Quicksand", lineHeight: "50px", @@ -619,7 +615,7 @@ const Practice = () => { component="h4" sx={{ color: "#333F61", - fontSize: `${fontSize}px`, + fontSize: "clamp(1.6rem, 2.5vw, 3.8rem)", fontWeight: 700, fontFamily: "Quicksand", lineHeight: "50px", @@ -645,7 +641,7 @@ const Practice = () => { component="h4" ml={1} sx={{ - fontSize: `${fontSize}px`, + fontSize: "clamp(1.6rem, 2.5vw, 3.8rem)", fontWeight: 700, fontFamily: "Quicksand", lineHeight: "50px", @@ -664,7 +660,7 @@ const Practice = () => { ml={1} sx={{ color: "#333F61", - fontSize: `${fontSize}px`, + fontSize: "clamp(1.6rem, 2.5vw, 3.8rem)", fontWeight: 700, fontFamily: "Quicksand", lineHeight: "50px", From d2c5152ede80e073b702266ed62dfd4ad393da99 Mon Sep 17 00:00:00 2001 From: Ajinkya Pande Date: Wed, 28 Aug 2024 17:55:47 +0530 Subject: [PATCH 7/9] Issueid #225896 feat: Enable Audio Upload on Test-Rig --- src/config/awsS3.js | 16 ++++++++-------- src/utils/VoiceAnalyser.js | 5 +++-- 2 files changed, 11 insertions(+), 10 deletions(-) diff --git a/src/config/awsS3.js b/src/config/awsS3.js index 34d950f4..6fa0f244 100644 --- a/src/config/awsS3.js +++ b/src/config/awsS3.js @@ -1,9 +1,9 @@ -// import { S3Client } from '@aws-sdk/client-s3'; +import { S3Client } from "@aws-sdk/client-s3"; -// export default new S3Client({ -// region: process.env.REACT_APP_AWS_S3_REGION, -// credentials: { -// accessKeyId: process.env.REACT_APP_AWS_ACCESS_KEY_ID, -// secretAccessKey: process.env.REACT_APP_AWS_SECRET_ACCESS_KEY, -// }, -// }); +export default new S3Client({ + region: process.env.REACT_APP_AWS_S3_REGION, + credentials: { + accessKeyId: process.env.REACT_APP_AWS_ACCESS_KEY_ID, + secretAccessKey: process.env.REACT_APP_AWS_SECRET_ACCESS_KEY, + }, +}); diff --git a/src/utils/VoiceAnalyser.js b/src/utils/VoiceAnalyser.js index a0883824..2e8e2694 100644 --- a/src/utils/VoiceAnalyser.js +++ b/src/utils/VoiceAnalyser.js @@ -30,7 +30,8 @@ import { } from "./constants"; import config from "./urlConstants.json"; import { filterBadWords } from "./Badwords"; -// import S3Client from '../config/awsS3'; +import S3Client from "../config/awsS3"; +import { PutObjectCommand } from "@aws-sdk/client-s3"; /* eslint-disable */ const AudioPath = { @@ -363,7 +364,7 @@ function VoiceAnalyser(props) { // TODO: Remove false when REACT_APP_AWS_S3_BUCKET_NAME and keys added var audioFileName = ""; - if (process.env.REACT_APP_CAPTURE_AUDIO === "true" && false) { + if (process.env.REACT_APP_CAPTURE_AUDIO === "true") { let getContentId = currentLine; audioFileName = `${ process.env.REACT_APP_CHANNEL From 3ab58c9f6aaed12878e17ce9b77ebef4029038f5 Mon Sep 17 00:00:00 2001 From: Ajinkya Pande Date: Mon, 9 Sep 2024 18:48:29 +0530 Subject: [PATCH 8/9] updated yml file --- .github/workflows/all-app-sandbox.yml | 8 +++++--- .github/workflows/all-dev-rig.yml | 8 +++++--- .github/workflows/all-dev-tn.yml | 8 +++++--- .github/workflows/all-prod-rig.yml | 8 +++++--- .github/workflows/all-staging-tn.yml | 8 +++++--- 5 files changed, 25 insertions(+), 15 deletions(-) diff --git a/.github/workflows/all-app-sandbox.yml b/.github/workflows/all-app-sandbox.yml index b3e750a4..919833d0 100644 --- a/.github/workflows/all-app-sandbox.yml +++ b/.github/workflows/all-app-sandbox.yml @@ -17,7 +17,7 @@ jobs: - name: Setup Node.js uses: actions/setup-node@v3 with: - node-version: '18' + node-version: "18" - name: Install AWS CLI run: | @@ -75,7 +75,9 @@ jobs: REACT_APP_IS_APP_IFRAME: ${{ vars.REACT_APP_IS_APP_IFRAME }} REACT_APP_IS_IN_APP_AUTHORISATION: ${{ vars.REACT_APP_IS_IN_APP_AUTHORISATION }} REACT_APP_LANGUAGES: ${{ vars.REACT_APP_LANGUAGES }} - CI: false # Disabling CI to not treat warnings as errors + REACT_APP_AWS_ACCESS_KEY_ID: ${{ secrets.REACT_APP_AWS_ACCESS_KEY_ID }} + REACT_APP_AWS_SECRET_ACCESS_KEY: ${{ secrets.REACT_APP_AWS_SECRET_ACCESS_KEY }} + CI: false # Disabling CI to not treat warnings as errors run: npm run build - name: Deploy to S3 Bucket @@ -91,7 +93,7 @@ jobs: uses: chetan/invalidate-cloudfront-action@master env: DISTRIBUTION: ${{ secrets.AWS_DISTRIBUTION }} - PATHS: '/*' + PATHS: "/*" AWS_REGION: ${{ secrets.AWS_REGION }} AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} diff --git a/.github/workflows/all-dev-rig.yml b/.github/workflows/all-dev-rig.yml index fff0cb2f..8a84a57a 100644 --- a/.github/workflows/all-dev-rig.yml +++ b/.github/workflows/all-dev-rig.yml @@ -17,7 +17,7 @@ jobs: - name: Setup Node.js uses: actions/setup-node@v3 with: - node-version: '18' + node-version: "18" - name: Install AWS CLI run: | @@ -75,7 +75,9 @@ jobs: REACT_APP_IS_APP_IFRAME: ${{ vars.REACT_APP_IS_APP_IFRAME }} REACT_APP_IS_IN_APP_AUTHORISATION: ${{ vars.REACT_APP_IS_IN_APP_AUTHORISATION }} REACT_APP_LANGUAGES: ${{ vars.REACT_APP_LANGUAGES }} - CI: false # Disabling CI to not treat warnings as errors + REACT_APP_AWS_ACCESS_KEY_ID: ${{ secrets.REACT_APP_AWS_ACCESS_KEY_ID }} + REACT_APP_AWS_SECRET_ACCESS_KEY: ${{ secrets.REACT_APP_AWS_SECRET_ACCESS_KEY }} + CI: false # Disabling CI to not treat warnings as errors run: npm run build - name: Deploy to S3 Bucket @@ -91,7 +93,7 @@ jobs: uses: chetan/invalidate-cloudfront-action@master env: DISTRIBUTION: ${{ secrets.AWS_DISTRIBUTION }} - PATHS: '/*' + PATHS: "/*" AWS_REGION: ${{ secrets.AWS_REGION }} AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} diff --git a/.github/workflows/all-dev-tn.yml b/.github/workflows/all-dev-tn.yml index eba10455..1c89b3f0 100644 --- a/.github/workflows/all-dev-tn.yml +++ b/.github/workflows/all-dev-tn.yml @@ -17,7 +17,7 @@ jobs: - name: Setup Node.js uses: actions/setup-node@v3 with: - node-version: '18' + node-version: "18" - name: Install AWS CLI run: | @@ -75,7 +75,9 @@ jobs: REACT_APP_IS_APP_IFRAME: ${{ vars.REACT_APP_IS_APP_IFRAME }} REACT_APP_IS_IN_APP_AUTHORISATION: ${{ vars.REACT_APP_IS_IN_APP_AUTHORISATION }} REACT_APP_LANGUAGES: ${{ vars.REACT_APP_LANGUAGES }} - CI: false # Disabling CI to not treat warnings as errors + REACT_APP_AWS_ACCESS_KEY_ID: ${{ secrets.REACT_APP_AWS_ACCESS_KEY_ID }} + REACT_APP_AWS_SECRET_ACCESS_KEY: ${{ secrets.REACT_APP_AWS_SECRET_ACCESS_KEY }} + CI: false # Disabling CI to not treat warnings as errors run: npm run build - name: Deploy to S3 Bucket @@ -91,7 +93,7 @@ jobs: uses: chetan/invalidate-cloudfront-action@master env: DISTRIBUTION: ${{ secrets.AWS_DISTRIBUTION }} - PATHS: '/*' + PATHS: "/*" AWS_REGION: ${{ secrets.AWS_REGION }} AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} diff --git a/.github/workflows/all-prod-rig.yml b/.github/workflows/all-prod-rig.yml index 98b6d296..5dcf0dfb 100644 --- a/.github/workflows/all-prod-rig.yml +++ b/.github/workflows/all-prod-rig.yml @@ -17,7 +17,7 @@ jobs: - name: Setup Node.js uses: actions/setup-node@v3 with: - node-version: '18' + node-version: "18" - name: Install AWS CLI run: | @@ -75,7 +75,9 @@ jobs: REACT_APP_IS_APP_IFRAME: ${{ vars.REACT_APP_IS_APP_IFRAME }} REACT_APP_IS_IN_APP_AUTHORISATION: ${{ vars.REACT_APP_IS_IN_APP_AUTHORISATION }} REACT_APP_LANGUAGES: ${{ vars.REACT_APP_LANGUAGES }} - CI: false # Disabling CI to not treat warnings as errors + REACT_APP_AWS_ACCESS_KEY_ID: ${{ secrets.REACT_APP_AWS_ACCESS_KEY_ID }} + REACT_APP_AWS_SECRET_ACCESS_KEY: ${{ secrets.REACT_APP_AWS_SECRET_ACCESS_KEY }} + CI: false # Disabling CI to not treat warnings as errors run: npm run build - name: Deploy to S3 Bucket @@ -91,7 +93,7 @@ jobs: uses: chetan/invalidate-cloudfront-action@master env: DISTRIBUTION: ${{ secrets.AWS_DISTRIBUTION }} - PATHS: '/*' + PATHS: "/*" AWS_REGION: ${{ secrets.AWS_REGION }} AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} diff --git a/.github/workflows/all-staging-tn.yml b/.github/workflows/all-staging-tn.yml index 5abd8faf..ff516169 100644 --- a/.github/workflows/all-staging-tn.yml +++ b/.github/workflows/all-staging-tn.yml @@ -17,7 +17,7 @@ jobs: - name: Setup Node.js uses: actions/setup-node@v3 with: - node-version: '18' + node-version: "18" - name: Install AWS CLI run: | @@ -75,7 +75,9 @@ jobs: REACT_APP_IS_APP_IFRAME: ${{ vars.REACT_APP_IS_APP_IFRAME }} REACT_APP_IS_IN_APP_AUTHORISATION: ${{ vars.REACT_APP_IS_IN_APP_AUTHORISATION }} REACT_APP_LANGUAGES: ${{ vars.REACT_APP_LANGUAGES }} - CI: false # Disabling CI to not treat warnings as errors + REACT_APP_AWS_ACCESS_KEY_ID: ${{ secrets.REACT_APP_AWS_ACCESS_KEY_ID }} + REACT_APP_AWS_SECRET_ACCESS_KEY: ${{ secrets.REACT_APP_AWS_SECRET_ACCESS_KEY }} + CI: false # Disabling CI to not treat warnings as errors run: npm run build - name: Deploy to S3 Bucket @@ -91,7 +93,7 @@ jobs: uses: chetan/invalidate-cloudfront-action@master env: DISTRIBUTION: ${{ secrets.AWS_DISTRIBUTION }} - PATHS: '/*' + PATHS: "/*" AWS_REGION: ${{ secrets.AWS_REGION }} AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }} AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }} From 8e9f04d76661696668cdbca18da71b17365ed4f3 Mon Sep 17 00:00:00 2001 From: Ajinkya Pande Date: Thu, 12 Sep 2024 15:35:30 +0530 Subject: [PATCH 9/9] Issueid #226738 fix: Score not updating for speak with me section if we load the assets from cloudfront --- src/components/Assesment/Assesment.jsx | 2 +- .../DiscoverSentance/DiscoverSentance.jsx | 49 ++++++++++--------- src/views/Practice/Practice.jsx | 13 +++-- 3 files changed, 36 insertions(+), 28 deletions(-) diff --git a/src/components/Assesment/Assesment.jsx b/src/components/Assesment/Assesment.jsx index 3a6385bb..4bdd6ab0 100644 --- a/src/components/Assesment/Assesment.jsx +++ b/src/components/Assesment/Assesment.jsx @@ -344,7 +344,7 @@ export const ProfileHeader = ({ const handleProfileBack = () => { try { if (process.env.REACT_APP_IS_APP_IFRAME === "true") { - window.parent.postMessage({ type: "restore-iframe-content" }); + window.parent.postMessage({ type: "restore-iframe-content" }, "*"); navigate("/"); } else { navigate("/discover-start"); diff --git a/src/components/DiscoverSentance/DiscoverSentance.jsx b/src/components/DiscoverSentance/DiscoverSentance.jsx index c64ebe3f..742981cb 100644 --- a/src/components/DiscoverSentance/DiscoverSentance.jsx +++ b/src/components/DiscoverSentance/DiscoverSentance.jsx @@ -34,10 +34,9 @@ const SpeakSentenceComponent = () => { const [disableScreen, setDisableScreen] = useState(false); const [play] = useSound(LevelCompleteAudio); const [openMessageDialog, setOpenMessageDialog] = useState(""); - const [totalSyllableCount, setTotalSyllableCount] = useState(''); + const [totalSyllableCount, setTotalSyllableCount] = useState(""); const [isNextButtonCalled, setIsNextButtonCalled] = useState(false); - const callConfettiAndPlay = () => { play(); callConfetti(); @@ -100,16 +99,19 @@ const SpeakSentenceComponent = () => { }, [voiceText]); const send = (score) => { - if (process.env.REACT_APP_IS_APP_IFRAME === 'true') { - window.parent.postMessage({ - score: score, - message: "all-test-rig-score", - }); + if (process.env.REACT_APP_IS_APP_IFRAME === "true") { + window.parent.postMessage( + { + score: score, + message: "all-test-rig-score", + }, + "*" + ); } }; const handleNext = async () => { - setIsNextButtonCalled(true) + setIsNextButtonCalled(true); setEnableNext(false); try { @@ -165,17 +167,17 @@ const SpeakSentenceComponent = () => { const { data: getSetData } = getSetResultRes; const data = JSON.stringify(getSetData?.data); Log(data, "discovery", "ET"); - if(process.env.REACT_APP_POST_LEARNER_PROGRESS === "true"){ - await axios.post( - `${process.env.REACT_APP_LEARNER_AI_ORCHESTRATION_HOST}/${config.URLS.CREATE_LEARNER_PROGRESS}`, - { - userId: localStorage.getItem("virtualId"), - sessionId: localStorage.getItem("sessionId"), - subSessionId: sub_session_id, - milestoneLevel: getSetData?.data?.currentLevel, - language: localStorage.getItem("lang"), - } - ); + if (process.env.REACT_APP_POST_LEARNER_PROGRESS === "true") { + await axios.post( + `${process.env.REACT_APP_LEARNER_AI_ORCHESTRATION_HOST}/${config.URLS.CREATE_LEARNER_PROGRESS}`, + { + userId: localStorage.getItem("virtualId"), + sessionId: localStorage.getItem("sessionId"), + subSessionId: sub_session_id, + milestoneLevel: getSetData?.data?.currentLevel, + language: localStorage.getItem("lang"), + } + ); } if ( getSetData.data.sessionResult === "pass" && @@ -193,7 +195,9 @@ const SpeakSentenceComponent = () => { `${process.env.REACT_APP_CONTENT_SERVICE_APP_HOST}/${config.URLS.GET_PAGINATION}?page=1&limit=5&collectionId=${sentences?.[newSentencePassedCounter]?.collectionId}` ); setCurrentContentType("Sentence"); - setTotalSyllableCount(resSentencesPagination?.data?.totalSyllableCount); + setTotalSyllableCount( + resSentencesPagination?.data?.totalSyllableCount + ); setCurrentCollectionId( sentences?.[newSentencePassedCounter]?.collectionId ); @@ -274,7 +278,7 @@ const SpeakSentenceComponent = () => { `${process.env.REACT_APP_CONTENT_SERVICE_APP_HOST}/${config.URLS.GET_PAGINATION}?page=1&limit=5&collectionId=${sentences?.collectionId}` ); setCurrentContentType("Sentence"); - setTotalSyllableCount(resPagination?.data?.totalSyllableCount) + setTotalSyllableCount(resPagination?.data?.totalSyllableCount); setCurrentCollectionId(sentences?.collectionId); setAssessmentResponse(resAssessment); localStorage.setItem("storyTitle", sentences?.name); @@ -289,7 +293,8 @@ const SpeakSentenceComponent = () => { })(); }, []); const handleBack = () => { - const destination = process.env.REACT_APP_IS_APP_IFRAME === 'true' ? "/" : "/discover-start"; + const destination = + process.env.REACT_APP_IS_APP_IFRAME === "true" ? "/" : "/discover-start"; navigate(destination); // if (process.env.REACT_APP_IS_APP_IFRAME === 'true') { // navigate("/"); diff --git a/src/views/Practice/Practice.jsx b/src/views/Practice/Practice.jsx index 3fe6ac43..39c18dad 100644 --- a/src/views/Practice/Practice.jsx +++ b/src/views/Practice/Practice.jsx @@ -119,10 +119,13 @@ const Practice = () => { const send = (score) => { if (process.env.REACT_APP_IS_APP_IFRAME === "true") { - window.parent.postMessage({ - score: score, - message: "all-test-rig-score", - }); + window.parent.postMessage( + { + score: score, + message: "all-test-rig-score", + }, + "*" + ); } }; @@ -683,7 +686,7 @@ const Practice = () => { questions[currentQuestion]?.contentSourceData || []; const stringLengths = contentSourceData.map((item) => item.text.length); const length = stringLengths[0]; - window.parent.postMessage({ type: "stringLengths", length }); + window.parent.postMessage({ type: "stringLengths", length }, "*"); } } }, [questions[currentQuestion]]);