diff --git a/eslint.config.mjs b/eslint.config.mjs index dc35830c..a7f32879 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -23,6 +23,7 @@ const eslintConfig = [ '@typescript-eslint': tseslint, }, rules: { + 'react/no-unescaped-entities': 'off', // Enforce file names 'check-file/filename-naming-convention': [ 'error', diff --git a/src/_components/dashboard-component/toolbox/toolbox.tsx b/src/_components/dashboard-component/toolbox/toolbox.tsx index 61ba0f42..19d8782a 100644 --- a/src/_components/dashboard-component/toolbox/toolbox.tsx +++ b/src/_components/dashboard-component/toolbox/toolbox.tsx @@ -8,6 +8,7 @@ import FhsaCalculatorComponent from '@/_components/calculator-component/fhsa/fhs import AllocationCalculatorComponent from '@/_components/calculator-component/allocation/allocation-calculator-component'; import links from '@/_lib/_data/constants/links.json'; import { QuizLink } from '@/_lib/_data/types/types'; +import { toolboxShow } from '@/_lib/_services/tools-functions'; type ToolboxProps = { historyArray: number[]; }; @@ -33,10 +34,11 @@ export default function Toolbox({ historyArray }: ToolboxProps) { const currentNodeId = historyArray[historyArray.length - 1]; const Links = links.links as QuizLink[]; + const toolboxShowList = toolboxShow(currentNodeId); const currentActions = []; - if (currentNodeId == 4 || currentNodeId == 23) { + if (toolboxShowList.showTfsaCalculator) { currentActions.push({ icon: , name: 'TFSA Calculator', @@ -44,7 +46,7 @@ export default function Toolbox({ historyArray }: ToolboxProps) { }); } - if (currentNodeId == 14 || currentNodeId == 31) { + if (toolboxShowList.showFhsaCalculator) { currentActions.push({ icon: , name: 'FHSA Calculator', @@ -52,6 +54,14 @@ export default function Toolbox({ historyArray }: ToolboxProps) { }); } + if (toolboxShowList.showAllocationCalculator) { + currentActions.push({ + icon: , + name: 'Allocation Calculator', + onClickModal: 'Allocation_modal', + }); + } + for (let i = 0; i < Links.length; i++) { if (Links[i].id == currentNodeId) { currentActions.push({ @@ -81,13 +91,8 @@ export default function Toolbox({ historyArray }: ToolboxProps) { }, { icon: , - name: 'https://www.wealthsimple.com/en-ca/spend', - onClickLink: 'https://www.wealthsimple.com/en-ca/spend', - }, - { - icon: , - name: 'https://www.wealthsimple.com/en-ca/self-directed-investing', - onClickLink: 'https://www.wealthsimple.com/en-ca/self-directed-investing', + name: 'https://www.wealthsimple.com/en-ca/learn', + onClickLink: 'https://www.wealthsimple.com/en-ca/learn', }, ]; diff --git a/src/_lib/_services/tools-functions.ts b/src/_lib/_services/tools-functions.ts new file mode 100644 index 00000000..5439fe6f --- /dev/null +++ b/src/_lib/_services/tools-functions.ts @@ -0,0 +1,67 @@ +type ToolboxShowListType = { + showTfsaCalculator: boolean; + showFhsaCalculator: boolean; + showAllocationCalculator: boolean; + showLink: boolean; +}; + +function toolboxShow( + currentNodeId?: number, + currentNodeLink?: string +): ToolboxShowListType { + if (currentNodeId === undefined) currentNodeId = 0; + + const toolboxShowList: ToolboxShowListType = { + showTfsaCalculator: false, + showFhsaCalculator: false, + showAllocationCalculator: false, + showLink: false, + }; + + switch (currentNodeId) { + case 4: + toolboxShowList.showTfsaCalculator = true; + toolboxShowList.showAllocationCalculator = true; + break; + case 23: + toolboxShowList.showTfsaCalculator = true; + toolboxShowList.showAllocationCalculator = true; + break; + case 14: + toolboxShowList.showFhsaCalculator = true; + toolboxShowList.showAllocationCalculator = true; + break; + case 31: + toolboxShowList.showFhsaCalculator = true; + toolboxShowList.showAllocationCalculator = true; + break; + case 8: + toolboxShowList.showAllocationCalculator = true; + break; + case 17: + toolboxShowList.showAllocationCalculator = true; + break; + case 9: + toolboxShowList.showAllocationCalculator = true; + break; + case 28: + toolboxShowList.showAllocationCalculator = true; + break; + case 7: + toolboxShowList.showAllocationCalculator = true; + break; + default: + toolboxShowList.showAllocationCalculator = false; + toolboxShowList.showTfsaCalculator = false; + toolboxShowList.showFhsaCalculator = false; + break; + } + + if (currentNodeLink !== undefined) { + toolboxShowList.showLink = true; + } + + return toolboxShowList; +} + +export { toolboxShow }; diff --git a/src/app/quiz/_components/quiz.tsx b/src/app/quiz/_components/quiz.tsx index 018de645..01a30dbc 100644 --- a/src/app/quiz/_components/quiz.tsx +++ b/src/app/quiz/_components/quiz.tsx @@ -30,6 +30,8 @@ import AllocationCalculatorButton from '@/_components/calculator-component/alloc import LinkButton from '@/_components/link-component/link-component'; import NavToDashboard from '@/_components/nav-to-dashboard-button-component/nav-to-dashboard-button'; import MoreInfoButtons from '@/_components/more-info-component/more-info-buttons'; +import { toolboxShow } from '@/_lib/_services/tools-functions'; +import { Tooltip } from 'react-tooltip'; export default function QuizPage({ data }) { const router = useRouter(); @@ -153,48 +155,12 @@ export default function QuizPage({ data }) { setShowNextText(isNextAvailable(currentNode, currentTextIndex)); setShowPrevText(isPrevAvailable(currentNode, currentTextIndex)); - switch (currentNode.id) { - case 4: - setshowTfsaCalculator(true); - setShowAllocationCalculator(true); - break; - case 23: - setshowTfsaCalculator(true); - setShowAllocationCalculator(true); - break; - case 14: - setshowFhsaCalculator(true); - setShowAllocationCalculator(true); - break; - case 31: - setshowFhsaCalculator(true); - setShowAllocationCalculator(true); - break; - case 8: - setShowAllocationCalculator(true); - break; - case 17: - setShowAllocationCalculator(true); - break; - case 9: - setShowAllocationCalculator(true); - break; - case 28: - setShowAllocationCalculator(true); - break; - case 7: - setShowAllocationCalculator(true); - break; - default: - setShowAllocationCalculator(false); - setshowTfsaCalculator(false); - setshowFhsaCalculator(false); - break; - } + const toolboxShowList = toolboxShow(currentNode.id, currentNode.link); - if (currentNode.link) { - setShowLink(true); - } else setShowLink(false); + setShowAllocationCalculator(toolboxShowList.showAllocationCalculator); + setshowTfsaCalculator(toolboxShowList.showTfsaCalculator); + setshowFhsaCalculator(toolboxShowList.showFhsaCalculator); + setShowLink(toolboxShowList.showLink); if (historyState.loading) { setHistoryAsync(); @@ -255,7 +221,11 @@ export default function QuizPage({ data }) { + + {`Back`} + {/* Calculator Buttons */}