From 1c3e77f07276276c765842ff8326ca09c8fe3ac1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Dafydd=20Ll=C5=B7r=20Pearson?= Date: Mon, 30 Sep 2024 09:18:33 +0100 Subject: [PATCH] refactor: Add presentational component to `Result` (#3725) --- api.planx.uk/package.json | 2 +- api.planx.uk/pnpm-lock.yaml | 9 +- e2e/tests/api-driven/package.json | 2 +- e2e/tests/api-driven/pnpm-lock.yaml | 8 +- e2e/tests/ui-driven/package.json | 2 +- e2e/tests/ui-driven/pnpm-lock.yaml | 8 +- editor.planx.uk/package.json | 2 +- editor.planx.uk/pnpm-lock.yaml | 20 +- .../src/@planx/components/Result/Editor.tsx | 26 +-- .../@planx/components/Result/Public.test.tsx | 44 ++--- .../@planx/components/Result/Public/index.tsx | 58 ++++-- .../components/Result/Result.stories.tsx | 179 +++++++++--------- .../src/@planx/components/Result/model.ts | 31 ++- .../src/pages/FlowEditor/lib/store/preview.ts | 4 +- editor.planx.uk/src/pages/Preview/Node.tsx | 31 +-- 15 files changed, 216 insertions(+), 210 deletions(-) diff --git a/api.planx.uk/package.json b/api.planx.uk/package.json index 74f5e72817..d4e90e9d04 100644 --- a/api.planx.uk/package.json +++ b/api.planx.uk/package.json @@ -11,7 +11,7 @@ }, "dependencies": { "@airbrake/node": "^2.1.8", - "@opensystemslab/planx-core": "git+https://github.com/theopensystemslab/planx-core#c4a725f", + "@opensystemslab/planx-core": "git+https://github.com/theopensystemslab/planx-core#79b6409", "@types/isomorphic-fetch": "^0.0.36", "adm-zip": "^0.5.10", "aws-sdk": "^2.1467.0", diff --git a/api.planx.uk/pnpm-lock.yaml b/api.planx.uk/pnpm-lock.yaml index 790ea57519..afabc105a2 100644 --- a/api.planx.uk/pnpm-lock.yaml +++ b/api.planx.uk/pnpm-lock.yaml @@ -14,8 +14,8 @@ dependencies: specifier: ^2.1.8 version: 2.1.8 '@opensystemslab/planx-core': - specifier: git+https://github.com/theopensystemslab/planx-core#c4a725f - version: github.com/theopensystemslab/planx-core/c4a725f + specifier: git+https://github.com/theopensystemslab/planx-core#79b6409 + version: github.com/theopensystemslab/planx-core/79b6409 '@types/isomorphic-fetch': specifier: ^0.0.36 version: 0.0.36 @@ -4063,6 +4063,7 @@ packages: chalk: 3.0.0 diff-match-patch: 1.0.5 dev: false + bundledDependencies: [] /jsonwebtoken@9.0.2: resolution: {integrity: sha512-PRp66vJ865SSqOlgqS8hujT5U4AOgMfhrwYIuIhfKaoSCZcirrmASQr8CX7cUg+RMih+hgznrjp99o+W4pJLHQ==} @@ -6165,8 +6166,8 @@ packages: resolution: {integrity: sha512-XBx9AXhXktjUqnepgTiE5flcKIYWi/rme0Eaj+5Y0lftuGBq+jyRu/md4WnuxqgP1ubdpNCsYEYPxrzVHD8d6g==} dev: false - github.com/theopensystemslab/planx-core/c4a725f: - resolution: {tarball: https://codeload.github.com/theopensystemslab/planx-core/tar.gz/c4a725f} + github.com/theopensystemslab/planx-core/79b6409: + resolution: {tarball: https://codeload.github.com/theopensystemslab/planx-core/tar.gz/79b6409} name: '@opensystemslab/planx-core' version: 1.0.0 prepare: true diff --git a/e2e/tests/api-driven/package.json b/e2e/tests/api-driven/package.json index 5749835145..057faa6624 100644 --- a/e2e/tests/api-driven/package.json +++ b/e2e/tests/api-driven/package.json @@ -7,7 +7,7 @@ "packageManager": "pnpm@8.6.6", "dependencies": { "@cucumber/cucumber": "^9.3.0", - "@opensystemslab/planx-core": "git+https://github.com/theopensystemslab/planx-core#c4a725f", + "@opensystemslab/planx-core": "git+https://github.com/theopensystemslab/planx-core#79b6409", "axios": "^1.7.4", "dotenv": "^16.3.1", "dotenv-expand": "^10.0.0", diff --git a/e2e/tests/api-driven/pnpm-lock.yaml b/e2e/tests/api-driven/pnpm-lock.yaml index 29e079a319..86b9eeb52b 100644 --- a/e2e/tests/api-driven/pnpm-lock.yaml +++ b/e2e/tests/api-driven/pnpm-lock.yaml @@ -9,8 +9,8 @@ dependencies: specifier: ^9.3.0 version: 9.3.0 '@opensystemslab/planx-core': - specifier: git+https://github.com/theopensystemslab/planx-core#c4a725f - version: github.com/theopensystemslab/planx-core/c4a725f + specifier: git+https://github.com/theopensystemslab/planx-core#79b6409 + version: github.com/theopensystemslab/planx-core/79b6409 axios: specifier: ^1.7.4 version: 1.7.4 @@ -2932,8 +2932,8 @@ packages: resolution: {integrity: sha512-XBx9AXhXktjUqnepgTiE5flcKIYWi/rme0Eaj+5Y0lftuGBq+jyRu/md4WnuxqgP1ubdpNCsYEYPxrzVHD8d6g==} dev: false - github.com/theopensystemslab/planx-core/c4a725f: - resolution: {tarball: https://codeload.github.com/theopensystemslab/planx-core/tar.gz/c4a725f} + github.com/theopensystemslab/planx-core/79b6409: + resolution: {tarball: https://codeload.github.com/theopensystemslab/planx-core/tar.gz/79b6409} name: '@opensystemslab/planx-core' version: 1.0.0 prepare: true diff --git a/e2e/tests/ui-driven/package.json b/e2e/tests/ui-driven/package.json index 61dbc79a08..e3f811c106 100644 --- a/e2e/tests/ui-driven/package.json +++ b/e2e/tests/ui-driven/package.json @@ -8,7 +8,7 @@ "postinstall": "./install-dependencies.sh" }, "dependencies": { - "@opensystemslab/planx-core": "git+https://github.com/theopensystemslab/planx-core#c4a725f", + "@opensystemslab/planx-core": "git+https://github.com/theopensystemslab/planx-core#79b6409", "axios": "^1.7.4", "dotenv": "^16.3.1", "eslint": "^8.56.0", diff --git a/e2e/tests/ui-driven/pnpm-lock.yaml b/e2e/tests/ui-driven/pnpm-lock.yaml index 35a6b0923b..e1fe484ccc 100644 --- a/e2e/tests/ui-driven/pnpm-lock.yaml +++ b/e2e/tests/ui-driven/pnpm-lock.yaml @@ -6,8 +6,8 @@ settings: dependencies: '@opensystemslab/planx-core': - specifier: git+https://github.com/theopensystemslab/planx-core#c4a725f - version: github.com/theopensystemslab/planx-core/c4a725f + specifier: git+https://github.com/theopensystemslab/planx-core#79b6409 + version: github.com/theopensystemslab/planx-core/79b6409 axios: specifier: ^1.7.4 version: 1.7.4 @@ -2674,8 +2674,8 @@ packages: resolution: {integrity: sha512-XBx9AXhXktjUqnepgTiE5flcKIYWi/rme0Eaj+5Y0lftuGBq+jyRu/md4WnuxqgP1ubdpNCsYEYPxrzVHD8d6g==} dev: false - github.com/theopensystemslab/planx-core/c4a725f: - resolution: {tarball: https://codeload.github.com/theopensystemslab/planx-core/tar.gz/c4a725f} + github.com/theopensystemslab/planx-core/79b6409: + resolution: {tarball: https://codeload.github.com/theopensystemslab/planx-core/tar.gz/79b6409} name: '@opensystemslab/planx-core' version: 1.0.0 prepare: true diff --git a/editor.planx.uk/package.json b/editor.planx.uk/package.json index a2af9c9100..6c10779a00 100644 --- a/editor.planx.uk/package.json +++ b/editor.planx.uk/package.json @@ -15,7 +15,7 @@ "@mui/material": "^5.15.10", "@mui/utils": "^5.15.11", "@opensystemslab/map": "1.0.0-alpha.3", - "@opensystemslab/planx-core": "git+https://github.com/theopensystemslab/planx-core#c4a725f", + "@opensystemslab/planx-core": "git+https://github.com/theopensystemslab/planx-core#79b6409", "@tiptap/core": "^2.4.0", "@tiptap/extension-bold": "^2.0.3", "@tiptap/extension-bubble-menu": "^2.1.13", diff --git a/editor.planx.uk/pnpm-lock.yaml b/editor.planx.uk/pnpm-lock.yaml index f166824005..b61091b3c4 100644 --- a/editor.planx.uk/pnpm-lock.yaml +++ b/editor.planx.uk/pnpm-lock.yaml @@ -47,8 +47,8 @@ dependencies: specifier: 1.0.0-alpha.3 version: 1.0.0-alpha.3 '@opensystemslab/planx-core': - specifier: git+https://github.com/theopensystemslab/planx-core#c4a725f - version: github.com/theopensystemslab/planx-core/c4a725f(@types/react@18.2.45) + specifier: git+https://github.com/theopensystemslab/planx-core#79b6409 + version: github.com/theopensystemslab/planx-core/79b6409(@types/react@18.2.45) '@tiptap/core': specifier: ^2.4.0 version: 2.4.0(@tiptap/pm@2.0.3) @@ -4337,7 +4337,7 @@ packages: '@storybook/csf': 0.1.11 '@storybook/global': 5.0.0 '@storybook/icons': 1.2.12(react-dom@18.2.0)(react@18.2.0) - '@types/lodash': 4.14.202 + '@types/lodash': 4.17.9 color-convert: 2.0.1 dequal: 2.0.3 lodash: 4.17.21 @@ -4397,7 +4397,7 @@ packages: /@storybook/client-logger@6.5.16: resolution: {integrity: sha512-pxcNaCj3ItDdicPTXTtmYJE3YC1SjxFrBmHcyrN+nffeNyiMuViJdOOZzzzucTUG0wcOOX8jaSyak+nnHg5H1Q==} dependencies: - core-js: 3.31.0 + core-js: 3.38.1 global: 4.4.0 dev: true @@ -5538,7 +5538,6 @@ packages: /@types/lodash@4.17.9: resolution: {integrity: sha512-w9iWudx1XWOHW5lQRS9iKpK/XuRhnN+0T7HvdCCd802FYkT1AMTnxndJHGrNJwRoRHkslGr4S29tjm1cT7x/7w==} - dev: false /@types/markdown-it@14.1.2: resolution: {integrity: sha512-promo4eFwuiW+TfGxhi+0x3czqTYJkG8qB17ZUJiVF10Xm7NLVRSLUsfRTU/6h1e24VvRnXCx+hG7li58lkzog==} @@ -6999,7 +6998,7 @@ packages: dependencies: '@babel/runtime': 7.25.6 '@types/raf': 3.4.3 - core-js: 3.31.0 + core-js: 3.38.1 raf: 3.4.1 regenerator-runtime: 0.13.11 rgbcolor: 1.0.1 @@ -7434,7 +7433,6 @@ packages: /core-js@3.38.1: resolution: {integrity: sha512-OP35aUorbU3Zvlx7pjsFdu1rGNnD4pgw/CWoYzRY3t2EzoVT7shKHY1dlAy3f41cGIO7ZDPQimhGFTlEYkG/Hw==} requiresBuild: true - dev: true /core-util-is@1.0.3: resolution: {integrity: sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==} @@ -10631,7 +10629,7 @@ packages: fflate: 0.8.2 optionalDependencies: canvg: 3.0.10 - core-js: 3.31.0 + core-js: 3.38.1 dompurify: 2.5.7 html2canvas: 1.4.1 dev: false @@ -15340,9 +15338,9 @@ packages: use-sync-external-store: 1.2.0(react@18.2.0) dev: false - github.com/theopensystemslab/planx-core/c4a725f(@types/react@18.2.45): - resolution: {tarball: https://codeload.github.com/theopensystemslab/planx-core/tar.gz/c4a725f} - id: github.com/theopensystemslab/planx-core/c4a725f + github.com/theopensystemslab/planx-core/79b6409(@types/react@18.2.45): + resolution: {tarball: https://codeload.github.com/theopensystemslab/planx-core/tar.gz/79b6409} + id: github.com/theopensystemslab/planx-core/79b6409 name: '@opensystemslab/planx-core' version: 1.0.0 prepare: true diff --git a/editor.planx.uk/src/@planx/components/Result/Editor.tsx b/editor.planx.uk/src/@planx/components/Result/Editor.tsx index da1006eb2a..2caa01f7d0 100644 --- a/editor.planx.uk/src/@planx/components/Result/Editor.tsx +++ b/editor.planx.uk/src/@planx/components/Result/Editor.tsx @@ -1,7 +1,7 @@ import Box from "@mui/material/Box"; import Collapse from "@mui/material/Collapse"; import Typography from "@mui/material/Typography"; -import { Flag, FlagSet, flatFlags } from "@opensystemslab/planx-core/types"; +import { Flag, flatFlags } from "@opensystemslab/planx-core/types"; import { ComponentType as TYPES } from "@opensystemslab/planx-core/types"; import { useFormik } from "formik"; import groupBy from "lodash/groupBy"; @@ -11,8 +11,8 @@ import ModalSectionContent from "ui/editor/ModalSectionContent"; import Input from "ui/shared/Input"; import InputRow from "ui/shared/InputRow"; -import { ICONS } from "../ui"; -import type { Result } from "./model"; +import { EditorProps, ICONS } from "../ui"; +import { FlagDisplayText, Result } from "./model"; type FlagWithValue = Flag & { value: NonNullable }; @@ -21,16 +21,6 @@ const flagsWithValues = flatFlags.filter((flag): flag is FlagWithValue => ); const flags = groupBy(flagsWithValues, (f) => f.category); -interface FormData { - flagSet: FlagSet; - overrides?: { [flagId: string]: FlagDisplayText }; -} - -interface FlagDisplayText { - heading?: string; - description?: string; -} - const FlagEditor: React.FC<{ flag: Flag; existingOverrides?: FlagDisplayText; @@ -82,8 +72,10 @@ const FlagEditor: React.FC<{ ); }; -const ResultComponent: React.FC = (props) => { - const formik = useFormik({ +type Props = EditorProps; + +const ResultComponent: React.FC = (props) => { + const formik = useFormik({ initialValues: { flagSet: props.node?.data?.flagSet || Object.keys(flags)[0], overrides: props.node?.data?.overrides || {}, @@ -93,7 +85,7 @@ const ResultComponent: React.FC = (props) => { props.handleSubmit({ type: TYPES.Result, data: newValues }); } }, - validate: () => {}, + validate: () => { }, }); const allFlagsForSet = flags[formik.values.flagSet]; @@ -157,4 +149,4 @@ const ResultComponent: React.FC = (props) => { ); }; -export default ResultComponent; +export default ResultComponent; \ No newline at end of file diff --git a/editor.planx.uk/src/@planx/components/Result/Public.test.tsx b/editor.planx.uk/src/@planx/components/Result/Public.test.tsx index f17da489c8..095fbc8088 100644 --- a/editor.planx.uk/src/@planx/components/Result/Public.test.tsx +++ b/editor.planx.uk/src/@planx/components/Result/Public.test.tsx @@ -5,7 +5,7 @@ import { vi } from "vitest"; import { axe } from "vitest-axe"; import { useStore } from "../../../pages/FlowEditor/lib/store"; -import Result from "./Public"; +import { Presentational } from "./Public"; const { getState, setState } = useStore; @@ -17,7 +17,7 @@ test("renders correctly", async () => { const handleSubmit = vi.fn(); const { user } = setup( - { it("should not have any accessibility violations", async () => { const { container } = setup( - { describe("showing and hiding change capabilities", () => { it("hides the change button by default", () => { setup( - { selections: [], }, ]} - handleSubmit={() => {}} + handleSubmit={() => { }} headingColor={{ text: "pink", background: "white" }} />, ); @@ -154,23 +154,21 @@ describe("showing and hiding change capabilities", () => { ]; scenarios.forEach(({ allowChanges, autoAnswered, shouldBeChangeable }) => { - it(`${ - shouldBeChangeable ? "shows" : "hides" - } the change button when allowChanges is ${allowChanges} and question ${ - autoAnswered ? "was" : "wasn't" - } auto-answered`, () => { - setup( - {}} - headingColor={{ text: "pink", background: "white" }} - />, - ); - - expect(Boolean(screen.queryByText("Change"))).toEqual( - shouldBeChangeable, - ); - }); + it(`${shouldBeChangeable ? "shows" : "hides" + } the change button when allowChanges is ${allowChanges} and question ${autoAnswered ? "was" : "wasn't" + } auto-answered`, () => { + setup( + { }} + headingColor={{ text: "pink", background: "white" }} + />, + ); + + expect(Boolean(screen.queryByText("Change"))).toEqual( + shouldBeChangeable, + ); + }); }); }); -}); +}); \ No newline at end of file diff --git a/editor.planx.uk/src/@planx/components/Result/Public/index.tsx b/editor.planx.uk/src/@planx/components/Result/Public/index.tsx index 4822e28520..81bdce60c7 100644 --- a/editor.planx.uk/src/@planx/components/Result/Public/index.tsx +++ b/editor.planx.uk/src/@planx/components/Result/Public/index.tsx @@ -2,34 +2,20 @@ import ErrorOutline from "@mui/icons-material/ErrorOutline"; import Box from "@mui/material/Box"; import { styled } from "@mui/material/styles"; import Typography from "@mui/material/Typography"; +import { DEFAULT_FLAG_CATEGORY } from "@opensystemslab/planx-core/types"; import Card from "@planx/components/shared/Preview/Card"; import SimpleExpand from "@planx/components/shared/Preview/SimpleExpand"; import { WarningContainer } from "@planx/components/shared/Preview/WarningContainer"; -import { Store, useStore } from "pages/FlowEditor/lib/store"; +import { PublicProps } from "@planx/components/ui"; +import { useStore } from "pages/FlowEditor/lib/store"; import { Response } from "pages/FlowEditor/lib/store/preview"; -import type { HandleSubmit } from "pages/Preview/Node"; import React from "react"; import { FONT_WEIGHT_SEMI_BOLD } from "theme"; -import type { TextContent } from "types"; +import { PresentationalProps, Result } from "../model"; import ResultReason from "./ResultReason"; import ResultSummary from "./ResultSummary"; -export interface Props { - allowChanges?: boolean; - handleSubmit?: HandleSubmit; - headingColor: { - text: string; - background: string; - }; - headingTitle?: string; - description?: string; - reasonsTitle?: string; - responses: Array; - disclaimer?: TextContent; - previouslySubmittedData?: Store.UserData; -} - const DisclaimerContent = styled(Typography)(({ theme }) => ({ marginTop: theme.spacing(1), })); @@ -88,7 +74,7 @@ const Responses = ({ ); }; -const Result: React.FC = ({ +export const Presentational: React.FC = ({ allowChanges = false, handleSubmit, headingColor, @@ -159,4 +145,36 @@ const Result: React.FC = ({ ); }; -export default Result; + +type Props = PublicProps; + +const ResultComponent: React.FC = (props) => { + const [hasPaid, flowSettings, resultData] = useStore((state) => [ + state.hasPaid(), + state.flowSettings, + state.resultData, + ]); + + const flagSet = props.flagSet || DEFAULT_FLAG_CATEGORY; + const data = resultData(flagSet, props.overrides); + + const { flag, responses, displayText } = data[flagSet]; + + return ( + + ); +}; + +export default ResultComponent; \ No newline at end of file diff --git a/editor.planx.uk/src/@planx/components/Result/Result.stories.tsx b/editor.planx.uk/src/@planx/components/Result/Result.stories.tsx index 75808c10d0..d34099483d 100644 --- a/editor.planx.uk/src/@planx/components/Result/Result.stories.tsx +++ b/editor.planx.uk/src/@planx/components/Result/Result.stories.tsx @@ -3,7 +3,8 @@ import React from "react"; import Wrapper from "../fixtures/Wrapper"; import Editor from "./Editor"; -import Public from "./Public"; +import { PresentationalProps } from "./model"; +import { Presentational as Public } from "./Public"; const meta = { title: "PlanX Components/Result", @@ -17,110 +18,112 @@ export default meta; type Story = StoryObj; -export const Basic = { - args: { - headingColor: { - background: "#ADFF00", - text: "#000", - }, - headingTitle: "Heading", - description: "Description", - reasonsTitle: "Reasons", - allowChanges: true, - responses: [ - { - question: { - id: "1234", +const props: PresentationalProps = { + headingColor: { + background: "#ADFF00", + text: "#000", + }, + headingTitle: "Heading", + description: "Description", + reasonsTitle: "Reasons", + allowChanges: true, + responses: [ + { + question: { + id: "1234", + data: { + text: "A question with no further information", + }, + }, + selections: [ + { + id: "5678", data: { - text: "A question with no further information", + text: "answer", }, }, - selections: [ - { - id: "5678", - data: { - text: "answer", - }, - }, - ], - hidden: false, + ], + hidden: false, + }, + { + question: { + id: "9999", + data: { + text: "A question with more information", + info: "some more information", + }, }, - { - question: { - id: "9999", + selections: [ + { + id: "8888", data: { - text: "A question with more information", - info: "some more information", + text: "answer", }, }, - selections: [ - { - id: "8888", - data: { - text: "answer", - }, - }, - ], - hidden: false, + ], + hidden: false, + }, + { + question: { + id: "7777", + data: { + text: "A question with a policy reference", + policyRef: "https://beta.planx.uk/southwark", + }, }, - { - question: { - id: "7777", + selections: [ + { + id: "6666", data: { - text: "A question with a policy reference", - policyRef: "https://beta.planx.uk/southwark", + text: "answer", }, }, - selections: [ - { - id: "6666", - data: { - text: "answer", - }, - }, - ], - hidden: false, + ], + hidden: false, + }, + { + question: { + id: "5555", + data: { + text: "A question with more information and a policy reference", + info: "Some more information", + policyRef: "https://beta.planx.uk/southwark", + }, }, - { - question: { - id: "5555", + selections: [ + { + id: "4444", data: { - text: "A question with more information and a policy reference", - info: "Some more information", - policyRef: "https://beta.planx.uk/southwark", + text: "answer", }, }, - selections: [ - { - id: "4444", - data: { - text: "answer", - }, - }, - ], - hidden: false, + ], + hidden: false, + }, + { + question: { + id: "3333", + data: { + text: "A question with more information and a policy reference and it's really long", + info: "Some more information", + policyRef: "https://beta.planx.uk/southwark", + }, }, - { - question: { - id: "3333", + selections: [ + { + id: "2222", data: { - text: "A question with more information and a policy reference and it's really long", - info: "Some more information", - policyRef: "https://beta.planx.uk/southwark", + text: "answer is also really, really long", }, }, - selections: [ - { - id: "2222", - data: { - text: "answer is also really, really long", - }, - }, - ], - hidden: false, - }, - ], - }, + ], + hidden: false, + }, + ], +}; + +export const Basic = { + args: props, } satisfies Story; export const WithDisclaimer = { @@ -157,5 +160,5 @@ export const WithDisclaimer = { } satisfies Story; export const WithEditor = () => { - return ; -}; + return } />; +}; \ No newline at end of file diff --git a/editor.planx.uk/src/@planx/components/Result/model.ts b/editor.planx.uk/src/@planx/components/Result/model.ts index 3d29c978a1..94b37e16ce 100644 --- a/editor.planx.uk/src/@planx/components/Result/model.ts +++ b/editor.planx.uk/src/@planx/components/Result/model.ts @@ -1,5 +1,30 @@ +import { FlagSet } from "@opensystemslab/planx-core/types"; +import { Store } from "pages/FlowEditor/lib/store"; +import { Response } from "pages/FlowEditor/lib/store/preview"; +import type { HandleSubmit } from "pages/Preview/Node"; +import type { TextContent } from "types"; + +export interface FlagDisplayText { + heading?: string; + description?: string; +} + export interface Result { - id?: string; - handleSubmit?: (d: any) => void; - node?: any; + flagSet: FlagSet; + overrides?: { [flagId: string]: FlagDisplayText }; +} + +export interface PresentationalProps { + allowChanges?: boolean; + handleSubmit?: HandleSubmit; + headingColor: { + text: string; + background: string; + }; + headingTitle?: string; + description?: string; + reasonsTitle?: string; + responses: Array; + disclaimer?: TextContent; + previouslySubmittedData?: Store.UserData; } diff --git a/editor.planx.uk/src/pages/FlowEditor/lib/store/preview.ts b/editor.planx.uk/src/pages/FlowEditor/lib/store/preview.ts index 8713709bbd..6bdff0f25a 100644 --- a/editor.planx.uk/src/pages/FlowEditor/lib/store/preview.ts +++ b/editor.planx.uk/src/pages/FlowEditor/lib/store/preview.ts @@ -67,7 +67,7 @@ export interface PreviewStore extends Store.Store { ) => { [category: string]: { flag: Flag; - responses: Array; + responses: Array; displayText: { heading: string; description: string }; }; }; @@ -595,8 +595,6 @@ export const previewStore: StateCreator< // OSL Slack explanation: https://bit.ly/3x38IRY return false; - const { upcomingCardIds } = get(); - return upcomingCardIds().length === 1; }, restore: false, diff --git a/editor.planx.uk/src/pages/Preview/Node.tsx b/editor.planx.uk/src/pages/Preview/Node.tsx index 7538226e34..15456ce77b 100644 --- a/editor.planx.uk/src/pages/Preview/Node.tsx +++ b/editor.planx.uk/src/pages/Preview/Node.tsx @@ -1,6 +1,5 @@ import { ComponentType as TYPES, - DEFAULT_FLAG_CATEGORY, } from "@opensystemslab/planx-core/types"; import AddressInput from "@planx/components/AddressInput/Public"; import Calculate from "@planx/components/Calculate/Public"; @@ -48,20 +47,14 @@ interface Props { const Node: React.FC = (props) => { const [ childNodesOf, - resultData, - hasPaid, isFinalCard, resetPreview, cachedBreadcrumbs, - flowSettings, ] = useStore((state) => [ state.childNodesOf, - state.resultData, - state.hasPaid(), state.isFinalCard(), state.resetPreview, state.cachedBreadcrumbs, - state.flowSettings, ]); const handleSubmit = isFinalCard ? undefined : props.handleSubmit; @@ -151,28 +144,8 @@ const Node: React.FC = (props) => { case TYPES.Pay: return ; - case TYPES.Result: { - const flagSet = props.node?.data?.flagSet || DEFAULT_FLAG_CATEGORY; - const data = resultData(flagSet, props.node?.data?.overrides); - - const { flag, responses, displayText } = data[flagSet]; - - return ( - - ); - } + case TYPES.Result: + return ; case TYPES.Review: return ;