Skip to content

Commit

Permalink
IssueId #215552 Profile setting - If user change the language and clo…
Browse files Browse the repository at this point in the history 
…se the sidebar and reopen again, it shows the language is selected but the content is not getting updated.
  • Loading branch information
@ajinkyapandetekdi
ajinkyapandetekdi committed Mar 18, 2024
1 parent c089e46 commit d832d60
Show file tree
Hide file tree
Showing 3 changed files with 117 additions and 88 deletions.
186 changes: 102 additions & 84 deletions src/components/AppDrawer/AppDrawer.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,65 +72,49 @@ function AppDrawer({ forceRerender, setForceRerender }) {
}
}, []);

React.useEffect(() => {
const handleLocalStorageValue = ()=>{
localStorage.setItem('apphomelang', value);
localStorage.setItem('validateLimit', validateLimit);
localStorage.setItem('discoveryLimit', discoveryLimit);
localStorage.setItem('contentPracticeLimit', contentPracticeLimit);
localStorage.setItem('contentTargetLimit', contentTargetLimit);
localStorage.setItem('isAudioPreprocessing', isAudioPreprocessingEnabled ? true : false);
localStorage.setItem('discoveryStatus', isDiscoveryEnabled ? 'enabled' : 'disabled');
}, [isDiscoveryEnabled]);
localStorage.setItem('userCurrentLevel', level)
localStorage.setItem('validationSession', validationSession);
localStorage.setItem('practiceSession', practiceSession);
fetchDataFromApi(value);
}

React.useEffect(() => {
localStorage.setItem('isAudioPreprocessing', isAudioPreprocessingEnabled ? true : false);
}, [isAudioPreprocessingEnabled]);
const handleModalCloseWithoutSave = ()=>{
setValue(localStorage.getItem('apphomelang'))
setValidateLimit(localStorage.getItem('validateLimit'))
setDiscoveryLimit(localStorage.getItem('discoveryLimit'));
setContentPracticeLimit(localStorage.getItem('contentPracticeLimit'));
setContentTargetLimit(localStorage.getItem('contentTargetLimit'));
setAudioPreprocessingStatus(localStorage.getItem('isAudioPreprocessing') === 'true'?true:false);
setDiscoveryStatus(localStorage.getItem('discoveryStatus') === 'enabled'? true : false);
setLevel(localStorage.getItem('userCurrentLevel'));
setPracticeSession(localStorage.getItem('practiceSession'))
setValidationSession(localStorage.getItem('validationSession'));
fetchDataFromApi(value);
}

React.useEffect(() => {
if (value) {
localStorage.setItem('apphomelang', value);
handleGetLesson();
fetchDataFromApi(value);
}
}, [value]);

React.useEffect(() => {
if (validateLimit) {
localStorage.setItem('validateLimit', validateLimit);
}
}, [validateLimit]);

React.useEffect(() => {
if (discoveryLimit) {
localStorage.setItem('discoveryLimit', discoveryLimit);
}
}, [discoveryLimit]);

React.useEffect(() => {
if (contentPracticeLimit) {
localStorage.setItem('contentPracticeLimit', contentPracticeLimit);
}
}, [contentPracticeLimit]);

React.useEffect(() => {
if (contentTargetLimit) {
localStorage.setItem('contentTargetLimit', contentTargetLimit);
}
}, [contentTargetLimit]);

React.useEffect(() => {
if (validationSession) {
localStorage.setItem('validationSession', validationSession);
}
}, [validationSession]);

React.useEffect(() => {
if (practiceSession) {
localStorage.setItem('practiceSession', practiceSession);
}
}, [practiceSession]);

React.useEffect(() => {
fetchApi();
}, []);

const fetchApi = async () => {
try {
const response = await fetch(
`${process.env.REACT_APP_LEARNER_AI_APP_HOST}/lais/scores/getMilestone/user/${localStorage.getItem('virtualID')}?language=${localStorage.getItem('apphomelang')}`
`${process.env.REACT_APP_LEARNER_AI_APP_HOST}/lais/scores/getMilestone/user/${localStorage.getItem('virtualID')}?language=${value}`
)
.then(res => {
return res.json();
Expand Down Expand Up @@ -158,10 +142,9 @@ function AppDrawer({ forceRerender, setForceRerender }) {
}
};

const fetchDataFromApi = async () => {
const fetchDataFromApi = async (lang) => {
try {
const result = await fetchPointerApi();

const result = await fetchPointerApi(lang);
if (result && result.result) {
localStorage.setItem(
'totalSessionPoints',
Expand Down Expand Up @@ -204,7 +187,7 @@ function AppDrawer({ forceRerender, setForceRerender }) {
process.env.REACT_APP_LEARNER_AI_APP_HOST
}/lp-tracker/api/lesson/getLessonProgressByUserId/${localStorage.getItem(
'virtualID'
)}?language=${localStorage.getItem('apphomelang')}`
)}?language=${value}`
)
.then(res => {
return res.json();
Expand All @@ -228,8 +211,8 @@ function AppDrawer({ forceRerender, setForceRerender }) {
const handleSave = () => {
onClose();
handleNavigate();
setForceRerender(!forceRerender);
fetchDataFromApi();
setForceRerender(!forceRerender);
handleLocalStorageValue()
};
return (
<>
Expand All @@ -249,7 +232,10 @@ function AppDrawer({ forceRerender, setForceRerender }) {
<Drawer
isOpen={isOpen}
placement="right"
onClose={onClose}
onClose={() => {
onClose();
handleModalCloseWithoutSave();
}}
size={'md'}
finalFocusRef={btnRef}
>
Expand Down Expand Up @@ -328,75 +314,101 @@ function AppDrawer({ forceRerender, setForceRerender }) {
/>
</HStack>
<RadioGroup onChange={setDiscoveryLimit} value={discoveryLimit}>
<HStack spacing='4'>
<HStack spacing="4">
<span>Limit:</span>
<Radio value='5'>5</Radio>
<Radio value='10'>10</Radio>
<Radio value='15'>15</Radio>
<Radio value="5">5</Radio>
<Radio value="10">10</Radio>
<Radio value="15">15</Radio>
</HStack>
</RadioGroup>
</FormControl>
<Divider />
<FormControl>
<FormLabel><Text as={'b'} >Validation </Text></FormLabel>
<FormLabel>
<Text as={'b'}>Validation </Text>
</FormLabel>
<RadioGroup onChange={setValidateLimit} value={validateLimit}>
<HStack spacing='4'>
<HStack spacing="4">
<span>Limit:</span>
<Radio value='5'>5</Radio>
<Radio value='10'>10</Radio>
<Radio value='15'>15</Radio>
<Radio value='0'>ALL</Radio>
<Radio value="5">5</Radio>
<Radio value="10">10</Radio>
<Radio value="15">15</Radio>
<Radio value="0">ALL</Radio>
</HStack>
</RadioGroup>
</FormControl>
<FormControl>
<HStack>
<div>Session ID:</div>
<div>
<Select placeholder='Select option' value={validationSession} onChange={(event) => setValidationSession(event.target.value)}>
{PreviousUserSessions?.map((session, ind) =>
<option key={ind} value={session}>{session}</option>
)}
<Select
placeholder="Select option"
value={validationSession}
onChange={event =>
setValidationSession(event.target.value)
}
>
{PreviousUserSessions?.map((session, ind) => (
<option key={ind} value={session}>
{session}
</option>
))}
</Select>
</div>
</HStack>
</FormControl>
<Divider />
<FormControl>
<FormLabel><Text as={'b'} > Practice </Text></FormLabel>
<RadioGroup onChange={setContentPracticeLimit} value={contentPracticeLimit}>
<HStack spacing='4'>
<FormLabel>
<Text as={'b'}> Practice </Text>
</FormLabel>
<RadioGroup
onChange={setContentPracticeLimit}
value={contentPracticeLimit}
>
<HStack spacing="4">
<span>Content Limit:</span>
<Radio value='5'>5</Radio>
<Radio value='10'>10</Radio>
<Radio value='15'>15</Radio>
<Radio value="5">5</Radio>
<Radio value="10">10</Radio>
<Radio value="15">15</Radio>
</HStack>
</RadioGroup>
</FormControl>

<FormControl>
<RadioGroup onChange={setContentTargetLimit} value={contentTargetLimit}>
<HStack spacing='4'>
<RadioGroup
onChange={setContentTargetLimit}
value={contentTargetLimit}
>
<HStack spacing="4">
<span>Target Limit:</span>
<Radio value='5'>5</Radio>
<Radio value='10'>10</Radio>
<Radio value='15'>15</Radio>
<Radio value="5">5</Radio>
<Radio value="10">10</Radio>
<Radio value="15">15</Radio>
</HStack>
</RadioGroup>
</FormControl>
<HStack>
<div>Session ID:</div>
<div><Select placeholder='Select option' value={practiceSession} onChange={(event) => setPracticeSession(event.target.value)}>
{PreviousUserSessions?.map((session, ind) =>
<option key={ind} value={session}>{session}</option>
)}
</Select></div>
<div>
<Select
placeholder="Select option"
value={practiceSession}
onChange={event => setPracticeSession(event.target.value)}
>
{PreviousUserSessions?.map((session, ind) => (
<option key={ind} value={session}>
{session}
</option>
))}
</Select>
</div>
</HStack>
<Accordion allowMultiple>
<AccordionItem>
<h2>
<AccordionButton>
<Box as="span" flex='1' textAlign='left'>
<Box as="span" flex="1" textAlign="left">
<Text as={'b'}>Practice Config </Text>
</Box>
<AccordionIcon />
Expand All @@ -406,13 +418,19 @@ function AppDrawer({ forceRerender, setForceRerender }) {
<ConfigForm />
</AccordionPanel>
</AccordionItem>

</Accordion>
</Stack>
</DrawerBody>

<DrawerFooter borderTopWidth="1px">
<Button variant="outline" mr={3} onClick={onClose}>
<Button
variant="outline"
mr={3}
onClick={() => {
onClose();
handleModalCloseWithoutSave();
}}
>
Cancel
</Button>
<Button onClick={() => handleSave()} colorScheme="blue">
Expand All @@ -422,7 +440,7 @@ function AppDrawer({ forceRerender, setForceRerender }) {
</DrawerContent>
</Drawer>
</>
)
);
}

export default AppDrawer;
2 changes: 1 addition & 1 deletion src/components/AppTimer/AppTimer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ const AppTimer = ({ isLoggedIn, setIsLoggedIn }) => {
useEffect(() => {
const fetchDataFromApi = async () => {
try {
const result = await fetchPointerApi();
const result = await fetchPointerApi(localStorage.getItem('apphomelang'));

if (result && result.result) {
localStorage.setItem(
Expand Down
17 changes: 14 additions & 3 deletions src/utils/api/PointerApi.js
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,8 @@

const baseURL = `${process.env.REACT_APP_LEARNER_AI_APP_HOST}/lp-tracker/api/pointer`;

export const fetchPointerApi = () => {
const url = `${baseURL}/getPointers/${localStorage.getItem('virtualID')}/${localStorage.getItem('virtualStorySessionID')}?language=${localStorage.getItem('apphomelang')}`;

export const fetchPointerApi = (lang) => {
const url = `${baseURL}/getPointers/${localStorage.getItem('virtualID')}/${localStorage.getItem('virtualStorySessionID')}?language=${lang}`;
return fetch(url)
.then((res) => {
if (!res.ok) {
Expand All @@ -12,6 +11,18 @@ export const fetchPointerApi = () => {
return res.json();
})
.then((data) => {
localStorage.setItem(
'totalSessionPoints',
data.result.totalSessionPoints
);
localStorage.setItem(
'totalUserPoints',
data.result.totalUserPoints
);
localStorage.setItem(
'totalLanguagePoints',
data.result.totalLanguagePoints
);
return data;
})
.catch((error) => {
Expand Down

0 comments on commit d832d60

Please sign in to comment.