diff --git a/src/components/GoalsComponents/GoalConfigModal/ConfigGoal.tsx b/src/components/GoalsComponents/GoalConfigModal/ConfigGoal.tsx index 91a27d0b1..f05a21b7a 100644 --- a/src/components/GoalsComponents/GoalConfigModal/ConfigGoal.tsx +++ b/src/components/GoalsComponents/GoalConfigModal/ConfigGoal.tsx @@ -17,7 +17,10 @@ import { useParentGoalContext } from "@src/contexts/parentGoal-context"; import useGoalActions from "@src/hooks/useGoalActions"; import useGoalStore from "@src/hooks/useGoalStore"; import { unarchiveUserGoal } from "@src/api/GoalsAPI"; +import { ILocationState } from "@src/Interfaces"; +import { useLocation, useNavigate } from "react-router-dom"; import { suggestedGoalState } from "@src/store/SuggestedGoalState"; +import { getHistoryUptoGoal } from "@src/helpers/GoalProcessor"; import { colorPalleteList, calDays, convertOnFilterToArray, getSelectedLanguage } from "../../../utils"; import "./ConfigGoal.scss"; @@ -41,6 +44,9 @@ const ConfigGoal = ({ type, goal, mode }: { type: TGoalCategory; mode: TGoalConf parentData: { parentGoal }, } = useParentGoalContext(); + const location = useLocation(); + const navigate = useNavigate(); + let defaultColorIndex = Math.floor(Math.random() * colorPalleteList.length - 1) + 1; let defaultAfterTime = isEditMode ? goal.afterTime || 9 : 9; let defaultBeforeTime = isEditMode ? goal.beforeTime || 18 : 18; @@ -153,7 +159,12 @@ const ConfigGoal = ({ type, goal, mode }: { type: TGoalCategory; mode: TGoalConf } if (suggestedGoal) { await unarchiveUserGoal(suggestedGoal); + navigate(`/goals/${suggestedGoal.parentGoalId === "root" ? "" : suggestedGoal.parentGoalId}`, { + state: { ...location.state }, + replace: true, + }); setSuggestedGoal(null); + return; } window.history.back(); }; @@ -217,15 +228,17 @@ const ConfigGoal = ({ type, goal, mode }: { type: TGoalCategory; mode: TGoalConf handleWeekSliderChange(perWeekHrs); }, [perDayHrs, setPerDayHrs, tags.on]); - // const modalStyle = { - // transform: `translate(0, ${isKeyboardOpen ? "-45%" : "0"})`, - // transition: "transform 0.3s ease-in-out", - // }; - const { openEditMode } = useGoalStore(); const onSuggestionClick = async (selectedGoal: GoalItem) => { - await openEditMode(selectedGoal); + const updatedGoalsHistory = await getHistoryUptoGoal(selectedGoal.parentGoalId); + + const newState: ILocationState = { + ...location.state, + goalsHistory: updatedGoalsHistory, + }; + + openEditMode(selectedGoal, newState); setSuggestedGoal(selectedGoal); setTitle(selectedGoal.title); setColorIndex(colorPalleteList.indexOf(selectedGoal.goalColor)); diff --git a/src/hooks/useGoalStore.tsx b/src/hooks/useGoalStore.tsx index bb89e762c..6393e7bbb 100644 --- a/src/hooks/useGoalStore.tsx +++ b/src/hooks/useGoalStore.tsx @@ -1,7 +1,8 @@ import { useLocation, useNavigate, useParams } from "react-router-dom"; import { useRecoilValue } from "recoil"; -import { GoalItem, TGoalCategory } from "@src/models/GoalItem"; +import { GoalItem } from "@src/models/GoalItem"; import { displayConfirmation } from "@src/store"; +import { ILocationState } from "@src/Interfaces"; const useGoalStore = () => { const { partnerId } = useParams(); @@ -9,13 +10,17 @@ const useGoalStore = () => { const location = useLocation(); const showConfirmation = useRecoilValue(displayConfirmation); - const openEditMode = (goal: GoalItem) => { + const openEditMode = (goal: GoalItem, customState?: ILocationState) => { const prefix = `${partnerId ? `/partners/${partnerId}/` : "/"}goals`; + + const newState = { + ...location.state, + goalType: goal.category === "Budget" ? "Budget" : "Goal", + ...customState, + }; + navigate(`${prefix}/${goal.parentGoalId}/${goal.id}?type=${goal.category}&mode=edit`, { - state: { - ...location.state, - goalType: goal.category === "Budget" ? "Budget" : "Goal", - }, + state: newState, replace: true, }); };