dataFieldBoundary to fn, remove dataFieldArea prop

api.planx.uk/modules/flows/downloadSchema/service.ts

@@ -17,10 +17,7 @@ export const getFlowSchema = async (flowId: string) => {
       type: nodeData?.type?.toString() || "_root",
       text: nodeData.data?.text,
       planx_variable:
-        nodeData.data?.fn ||
-        nodeData.data?.val ||
-        nodeData.data?.output ||
-        nodeData.data?.dataFieldBoundary,
+        nodeData.data?.fn || nodeData.data?.val || nodeData.data?.output,
     }),
   );
 

e2e/tests/api-driven/src/invite-to-pay/mocks/flow.json

@@ -157048,9 +157048,8 @@
         "policyRef": "<p><a target=\"_blank\" rel=\"noopener noreferrer nofollow\" href=\"https://www.legislation.gov.uk/uksi/2015/595/article/7\">The Town and Country Planning (Development Management Procedure) (England) Order 2015</a>,</p><p><a target=\"_blank\" rel=\"noopener noreferrer nofollow\" href=\"https://www.gov.uk/government/collections/planning-practice-guidance\">Planning Practice Guidance (PPG)</a></p>",
         "description": "<p>The red line shown below should include:</p><ul><li><p>the outline of your property boundary</p></li><li><p>any works outside the property boundary</p></li><li><p>areas that will be closed off or you&apos;ll need access to during the works</p></li></ul><p>If the red line already includes all these, select continue. If not, select More information for guidance on how to amend or redraw the outline.</p>",
         "howMeasured": "<p>We have pre-populated the map with a red outline that includes the entire property using information from the Land Registry.</p><p>In some cases, this outline might not include all the works or the areas that will be closed off. This might be because you&apos;re proposing works to a public highway (such as a dropped kerb), doing works that involve multiple properties, or works to a building that is part of a larger estate.</p><p>In these cases, you should amend the red outline by dragging the edges, or erase it by clicking the 🗑-icon on the map and draw a new outline.</p><p></p><h1>How to draw and amend the outline</h1><ol><li><p>Move the cursor to the corner you want to start with and click or tap once.</p></li><li><p>Move the cursor to the next corner and click or tap.</p></li><li><p>Repeat until you have the shape you need.</p></li><li><p>Click or tap the last corner again to stop drawing.</p></li><li><p>To amend the outline, click or tap on a line and drag it into a new position.</p></li></ol><img src=\"https://api.editor.planx.uk/file/public/dni98ojg/Draw_Outline_2.gif\">",
-        "dataFieldArea": "property.boundary.area",
         "hideFileUpload": false,
-        "dataFieldBoundary": "property.boundary.site",
+        "fn": "property.boundary.site",
         "titleForUploading": "Upload a location plan",
         "descriptionForUploading": "<p>Your location plan must:</p><ul><li><p>be based on an accurate, recognisable map</p></li><li><p>be drawn to a scale, labelled, and/or marked with a scale bar</p></li><li><p>show the site outline in red</p></li><li><p>include a<strong> </strong>north point</p></li></ul>"
       },

editor.planx.uk/src/@planx/components/DrawBoundary/Editor.tsx

@@ -53,25 +53,13 @@ function DrawBoundaryComponent(props: Props) {
               onChange={formik.handleChange}
             />
           </InputRow>
-          <InputGroup label="Boundary data field">
+          <InputGroup label="Data field">
             <InputRow>
               <Input
-                name="dataFieldBoundary"
-                placeholder=""
+                name="fn"
                 format="data"
-                value={formik.values.dataFieldBoundary}
-                onChange={formik.handleChange}
-              />
-            </InputRow>
-          </InputGroup>
-          <InputGroup label="Area data field (square metres)">
-            <InputRow>
-              <Input
-                name="dataFieldArea"
-                placeholder="property.boundary.area"
-                format="data"
-                value={formik.values.dataFieldArea}
-                onChange={formik.handleChange}
+                value={formik.values.fn}
+                disabled
               />
             </InputRow>
           </InputGroup>

editor.planx.uk/src/@planx/components/DrawBoundary/Public/Public.test.tsx

@@ -42,8 +42,7 @@ test("recovers previously submitted files when clicking the back button", async
 
   const { user } = setup(
     <DrawBoundary
-      dataFieldBoundary="property.boundary.site"
-      dataFieldArea="property.area.site"
+      fn="property.boundary.site"
       description=""
       descriptionForUploading=""
       title="Draw a boundary"
@@ -85,8 +84,7 @@ test("recovers previously submitted drawing when clicking the back button", asyn
 
   const { user } = setup(
     <DrawBoundary
-      dataFieldBoundary="property.boundary.site"
-      dataFieldArea="property.area.site"
+      fn="property.boundary.site"
       description=""
       descriptionForUploading=""
       title="Draw a boundary"
@@ -108,8 +106,7 @@ test("recovers previously submitted drawing when clicking the back button", asyn
 it("should not have any accessibility violations", async () => {
   const { container } = setup(
     <DrawBoundary
-      dataFieldBoundary="property.boundary.site"
-      dataFieldArea="property.area.site"
+      fn="property.boundary.site"
       description="description1"
       descriptionForUploading="description1"
       title="Draw a boundary"
@@ -125,8 +122,7 @@ test("shows the file upload option by default and requires user data to continue
 
   const { user } = setup(
     <DrawBoundary
-      dataFieldBoundary="property.boundary.site"
-      dataFieldArea="property.area.site"
+      fn="property.boundary.site"
       description=""
       descriptionForUploading=""
       title="Draw a boundary"
@@ -161,8 +157,7 @@ test("hides the upload option and allows user to continue without drawing if edi
 
   const { user } = setup(
     <DrawBoundary
-      dataFieldBoundary="property.boundary.site"
-      dataFieldArea="property.area.site"
+      fn="property.boundary.site"
       description=""
       descriptionForUploading=""
       title="Draw a boundary"
@@ -197,8 +192,7 @@ test("captures output data in the correct format when uploading a file", async (
 
   const { user } = setup(
     <DrawBoundary
-      dataFieldBoundary="property.boundary.site"
-      dataFieldArea="property.area.site"
+      fn="property.boundary.site"
       description=""
       descriptionForUploading=""
       title="Draw a boundary"
@@ -334,8 +328,7 @@ test("appends to existing '_requestedFiles' value", async () => {
         titleForUploading: "Upload a location plan",
         descriptionForUploading: "",
         hideFileUpload: false,
-        dataFieldBoundary: "property.boundary.site",
-        dataFieldArea: "property.boundary.area",
+        fn: "property.boundary.site",
       },
     },
   };
@@ -344,8 +337,7 @@ test("appends to existing '_requestedFiles' value", async () => {
 
   const { user } = setup(
     <DrawBoundary
-      dataFieldBoundary="property.boundary.site"
-      dataFieldArea="property.area.site"
+      fn="property.boundary.site"
       description=""
       descriptionForUploading=""
       title="Draw a boundary"
@@ -427,8 +419,7 @@ test("submits data based on the page you continue onwards from", async () => {
 
   const { user } = setup(
     <DrawBoundary
-      dataFieldBoundary="property.boundary.site"
-      dataFieldArea="property.area.site"
+      fn="property.boundary.site"
       description=""
       descriptionForUploading=""
       title="Draw a boundary"

editor.planx.uk/src/@planx/components/DrawBoundary/Public/index.tsx

@@ -54,10 +54,10 @@ export default function Component(props: Props) {
   const passport = useStore((state) => state.computePassport());
 
   const previousBoundary =
-    props.previouslySubmittedData?.data?.[props.dataFieldBoundary] ||
+    props.previouslySubmittedData?.data?.[props.fn] ||
     passport.data?.["property.boundary.title"];
   const previousArea =
-    props.previouslySubmittedData?.data?.[props.dataFieldArea] ||
+    props.previouslySubmittedData?.data?.[props.fn] ||
     passport.data?.["property.boundary.title.area"];
   const [boundary, setBoundary] = useState<Boundary>(previousBoundary);
   const [area, setArea] = useState<number | undefined>(previousArea);
@@ -150,17 +150,17 @@ export default function Component(props: Props) {
         props.handleSubmit?.({ data: { ...newPassportData } });
       }
 
-      if (boundary && props.dataFieldBoundary) {
-        newPassportData[props.dataFieldBoundary] = boundary;
-        newPassportData[`${props.dataFieldBoundary}.buffered`] = buffer(
+      if (boundary && props.fn) {
+        newPassportData[props.fn] = boundary;
+        newPassportData[`${props.fn}.buffered`] = buffer(
           boundary,
           bufferInMeters,
           { units: "meters" },
         );
 
-        if (area && props.dataFieldArea) {
-          newPassportData[props.dataFieldArea] = area;
-          newPassportData[`${props.dataFieldArea}.hectares`] =
+        if (area && props.fn) {
+          newPassportData[`${props.fn}.area`] = area;
+          newPassportData[`${props.fn}.hectares`] =
             squareMetresToHectares(area);
         }
 

editor.planx.uk/src/@planx/components/DrawBoundary/model.ts

@@ -13,8 +13,7 @@ export interface DrawBoundary extends BaseNodeData {
   titleForUploading: string;
   descriptionForUploading: string;
   hideFileUpload?: boolean;
-  dataFieldBoundary: string;
-  dataFieldArea: string;
+  fn: string;
 }
 
 export const parseDrawBoundary = (
@@ -29,9 +28,7 @@ export const parseDrawBoundary = (
     data?.descriptionForUploading ||
     defaultContent?.["descriptionForUploading"],
   hideFileUpload: data?.hideFileUpload || defaultContent?.["hideFileUpload"],
-  dataFieldBoundary:
-    data?.dataFieldBoundary || defaultContent?.["dataFieldBoundary"],
-  dataFieldArea: data?.dataFieldArea || defaultContent?.["dataFieldArea"],
+  fn: data?.fn || defaultContent?.["fn"],
   info: data?.info || defaultContent?.["info"],
   policyRef: data?.policyRef || defaultContent?.["policyRef"],
   howMeasured: data?.howMeasured || defaultContent?.["howMeasured"],
@@ -54,8 +51,7 @@ const defaultContent: DrawBoundary = {
   howMeasured:
     '<p>We have pre-populated the map with a red outline that includes the entire property using information from Land Registry.</p><p>In some cases, this outline might not include all the works or the areas that will be closed off. This might be because you&apos;re proposing works to a public highway (such as a dropped kerb), doing works that involve multiple properties, or works to a building that is part of a larger estate.</p><p>In these cases, you should amend the red outline by dragging the edges, or erase it by clicking the :wastebasket:-icon on the map and draw a new outline.</p><p></p><h1>How to draw and amend the outline</h1><ol><li><p>Move the cursor to the corner you want to start with and click or tap once.</p></li><li><p>Move the cursor to the next corner and click or tap.</p></li><li><p>Repeat until you have the shape you need.</p></li><li><p>Click or tap the last corner again to stop drawing.</p></li><li><p>To amend the outline, click or tap on a line and drag it into a new position.</p></li></ol><img src="https://api.editor.planx.uk/file/public/dni98ojg/Draw_Outline_2.gif">',
   hideFileUpload: false,
-  dataFieldBoundary: "property.boundary.site",
-  dataFieldArea: "property.boundary.area",
+  fn: "property.boundary.site",
   titleForUploading: "Upload a location plan",
   descriptionForUploading:
     "<p>Your location plan must:</p><ul><li><p>be based on an accurate, recognisable map</p></li><li><p>be drawn to a scale, labelled, and/or marked with a scale bar</p></li><li><p>show the site outline in red</p></li><li><p>include a<strong> </strong>north point</p></li></ul>",

editor.planx.uk/src/@planx/components/Review/Public/mocks/fileUpload.tsx

@@ -156,9 +156,8 @@ export const drawBoundaryFlow = {
   EO6DzPso8o: {
     data: {
       title: "Draw the boundary of the property",
-      dataFieldArea: "property.boundary.area",
       hideFileUpload: false,
-      dataFieldBoundary: "property.boundary.site",
+      fn: "property.boundary.site",
       titleForUploading: "Upload a location plan",
     },
     type: 10,

editor.planx.uk/src/@planx/components/shared/Preview/SummaryList.tsx

@@ -480,7 +480,7 @@ function DateInput(props: ComponentProps) {
 
 function DrawBoundary(props: ComponentProps) {
   // check if the user drew a boundary, uploaded a file, or both (or neither if props.node.data?.hideFileUpload is triggered "on")
-  const geodata = props.userData?.data?.[props.node.data?.dataFieldBoundary];
+  const geodata = props.userData?.data?.[props.node.data?.fn];
   const locationPlan = props.userData?.data?.[PASSPORT_UPLOAD_KEY];
 
   const fileName = locationPlan ? locationPlan[0].url.split("/").pop() : "";

editor.planx.uk/src/pages/FlowEditor/components/Sidebar/Search/SearchResultCard/getDisplayDetailsForResult.tsx

@@ -44,12 +44,6 @@ const keyFormatters: KeyMap = {
   "data.fileTypes.fn": {
     getDisplayKey: () => "File type (data)",
   },
-  "data.dataFieldBoundary": {
-    getDisplayKey: () => "Boundary",
-  },
-  "data.dataFieldArea": {
-    getDisplayKey: () => "Area",
-  },
   "data.description": {
     getDisplayKey: ({ item }) =>
       item.type === ComponentType.Answer

editor.planx.uk/src/pages/FlowEditor/components/Sidebar/Search/facets.ts

@@ -21,18 +21,12 @@ const listData: SearchFacets = [
   "data.schema.fields.data.options.data.val",
 ];
 
-const drawBoundaryData: SearchFacets = [
-  "data.dataFieldBoundary",
-  "data.dataFieldArea",
-];
-
 /** Data fields used across PlanX components */
 export const DATA_FACETS: SearchFacets = [
   ...generalData,
   ...fileUploadAndLabelData,
   ...calculateData,
   ...listData,
-  ...drawBoundaryData,
 ];
 
 const stripHTMLTags = (html = "") =>

editor.planx.uk/src/pages/FlowEditor/components/Sidebar/Search/mocks/allFacetFlow.ts

@@ -170,9 +170,8 @@ export const mockFlow: FlowGraph = {
     data: {
       title: ".",
       description: "<p>.</p>",
-      dataFieldArea: "property.boundary.area",
       hideFileUpload: false,
-      dataFieldBoundary: "property.boundary.site",
+      fn: "property.boundary.site",
       titleForUploading: "Elephant",
       descriptionForUploading: "<p>Panda</p>",
     },
@@ -610,9 +609,8 @@ export const mockDrawBoundaryResult: SearchResult<IndexedNode> = {
     data: {
       title: ".",
       description: "<p>.</p>",
-      dataFieldArea: "property.boundary.area",
       hideFileUpload: false,
-      dataFieldBoundary: "property.boundary.site",
+      fn: "property.boundary.site",
       titleForUploading: "Elephant",
       descriptionForUploading: "<p>Panda</p>",
     },

editor.planx.uk/src/pages/FlowEditor/lib/__tests__/mocks/flowWithPassportComponents.json

@@ -32,7 +32,7 @@
   },
   "drawBoundary": {
     "data": {
-      "dataFieldBoundary": "property.boundary.site"
+      "fn": "property.boundary.site"
     },
     "type": 10
   },