diff --git a/apps/frontend/src/pages/root/components/user-wheel/libs/components/scores-edit-modal/libs/constants/constants.ts b/apps/frontend/src/pages/root/components/user-wheel/libs/components/scores-edit-modal/libs/constants/constants.ts index 7c9d3db71..d4f77df03 100644 --- a/apps/frontend/src/pages/root/components/user-wheel/libs/components/scores-edit-modal/libs/constants/constants.ts +++ b/apps/frontend/src/pages/root/components/user-wheel/libs/components/scores-edit-modal/libs/constants/constants.ts @@ -1,3 +1,9 @@ const IS_DISCARD_BUTTON_DISABLED_INITIAL_VALUE = true; +const AFTER_DISCARD_CHANGES_DELAY = 100; +const IS_RESET_CHANGES_SCORES_INITIAL_VALUE = false; -export { IS_DISCARD_BUTTON_DISABLED_INITIAL_VALUE }; +export { + AFTER_DISCARD_CHANGES_DELAY, + IS_DISCARD_BUTTON_DISABLED_INITIAL_VALUE, + IS_RESET_CHANGES_SCORES_INITIAL_VALUE, +}; diff --git a/apps/frontend/src/pages/root/components/user-wheel/libs/components/scores-edit-modal/scores-edit-modal.tsx b/apps/frontend/src/pages/root/components/user-wheel/libs/components/scores-edit-modal/scores-edit-modal.tsx index 2330bf241..cce4d88dd 100644 --- a/apps/frontend/src/pages/root/components/user-wheel/libs/components/scores-edit-modal/scores-edit-modal.tsx +++ b/apps/frontend/src/pages/root/components/user-wheel/libs/components/scores-edit-modal/scores-edit-modal.tsx @@ -9,7 +9,11 @@ import { import { actions as quizActions } from "~/modules/quiz/quiz.js"; import { type QuizScoresGetAllItemResponseDto } from "~/modules/quiz/quiz.js"; -import { IS_DISCARD_BUTTON_DISABLED_INITIAL_VALUE } from "./libs/constants/constants.js"; +import { + AFTER_DISCARD_CHANGES_DELAY, + IS_DISCARD_BUTTON_DISABLED_INITIAL_VALUE, + IS_RESET_CHANGES_SCORES_INITIAL_VALUE, +} from "./libs/constants/constants.js"; import { type ModalData } from "./libs/types/types.js"; import styles from "./styles.module.css"; @@ -30,8 +34,9 @@ const ScoresEditModal: React.FC = ({ const [scores, setScores] = useState(data); const [isDiscardButtonDisabled, setIsDiscardButtonDisabled] = useState(IS_DISCARD_BUTTON_DISABLED_INITIAL_VALUE); - const [areChangesDiscarded, setAreChangesDiscarded] = - useState(false); + const [isResetChanges, setIsResetChanges] = useState( + IS_RESET_CHANGES_SCORES_INITIAL_VALUE, + ); const handleSaveChanges = useCallback(() => { if (!isDiscardButtonDisabled) { @@ -45,6 +50,19 @@ const ScoresEditModal: React.FC = ({ onSaveChanges(); }, [onSaveChanges, dispatch, scores, isDiscardButtonDisabled]); + const areChangesScores = useCallback(() => { + for (const [index, score] of scores.entries()) { + if ( + originalScores[index] && + originalScores[index].score !== score.score + ) { + return true; + } + } + + return false; + }, [originalScores, scores]); + const handleSliderChange = useCallback( (categoryId: number, value: number) => { setIsDiscardButtonDisabled(!IS_DISCARD_BUTTON_DISABLED_INITIAL_VALUE); @@ -73,17 +91,22 @@ const ScoresEditModal: React.FC = ({ const handleDiscardChanges = useCallback(() => { void dispatch(quizActions.getScores()); - setAreChangesDiscarded((previousValue) => !previousValue); - }, [setAreChangesDiscarded, dispatch]); + setIsResetChanges(!IS_RESET_CHANGES_SCORES_INITIAL_VALUE); + }, [setIsResetChanges, dispatch]); useEffect(() => { - setScores(originalScores); - - if (areChangesDiscarded) { - setAreChangesDiscarded((previousValue) => !previousValue); - setIsDiscardButtonDisabled(IS_DISCARD_BUTTON_DISABLED_INITIAL_VALUE); + if (areChangesScores()) { + setScores(originalScores); + setIsResetChanges(IS_RESET_CHANGES_SCORES_INITIAL_VALUE); + setTimeout(() => { + setIsDiscardButtonDisabled(IS_DISCARD_BUTTON_DISABLED_INITIAL_VALUE); + }, AFTER_DISCARD_CHANGES_DELAY); } - }, [areChangesDiscarded, setScores, originalScores]); + }, [isResetChanges, setScores, originalScores, scores, areChangesScores]); + + useEffect(() => { + return (): void => void dispatch(quizActions.getScores()); + }, [dispatch]); return (