chore: Create model file for FileUpload (#3723)

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

@@ -2,7 +2,7 @@ import Box from "@mui/material/Box";
 import Link from "@mui/material/Link";
 import Typography from "@mui/material/Typography";
 import { visuallyHidden } from "@mui/utils";
-import { FileUploadSlot } from "@planx/components/FileUpload/Public";
+import { FileUploadSlot } from "@planx/components/FileUpload/model";
 import { PASSPORT_REQUESTED_FILES_KEY } from "@planx/components/FileUploadAndLabel/model";
 import Card from "@planx/components/shared/Preview/Card";
 import CardHeader from "@planx/components/shared/Preview/CardHeader";

editor.planx.uk/src/@planx/components/FileUpload/Public.tsx

@@ -1,59 +1,13 @@
-import { MoreInformation } from "@planx/components/shared";
 import Card from "@planx/components/shared/Preview/Card";
 import CardHeader from "@planx/components/shared/Preview/CardHeader";
-import { Store, useStore } from "pages/FlowEditor/lib/store";
-import type { HandleSubmit } from "pages/Preview/Node";
+import { useStore } from "pages/FlowEditor/lib/store";
 import React, { useEffect, useRef, useState } from "react";
-import { FileWithPath } from "react-dropzone";
 import ErrorWrapper from "ui/shared/ErrorWrapper";
-import { array } from "yup";
 
 import { PASSPORT_REQUESTED_FILES_KEY } from "../FileUploadAndLabel/model";
 import { PrivateFileUpload } from "../shared/PrivateFileUpload/PrivateFileUpload";
 import { getPreviouslySubmittedData, makeData } from "../shared/utils";
-
-interface Props extends MoreInformation {
-  id?: string;
-  title?: string;
-  fn: string;
-  description?: string;
-  handleSubmit: HandleSubmit;
-  previouslySubmittedData?: Store.UserData;
-}
-
-export interface FileUploadSlot {
-  file: FileWithPath;
-  status: "success" | "error" | "uploading";
-  progress: number;
-  id: string;
-  url?: string;
-  cachedSlot?: Omit<FileUploadSlot, "cachedSlot">;
-}
-
-const slotsSchema = array()
-  .required()
-  .test({
-    name: "nonUploading",
-    message: "Upload at least one file",
-    test: (slots?: Array<FileUploadSlot>) => {
-      return Boolean(
-        slots &&
-          slots.length > 0 &&
-          !slots.some((slot) => slot.status === "uploading"),
-      );
-    },
-  })
-  .test({
-    name: "errorStatus",
-    message: "Remove files which failed to upload",
-    test: (slots?: Array<FileUploadSlot>) => {
-      return Boolean(
-        slots &&
-          slots.length > 0 &&
-          !slots.some((slot) => slot.status === "error"),
-      );
-    },
-  });
+import { FileUploadSlot, Props, slotsSchema } from "./model";
 
 const FileUpload: React.FC<Props> = (props) => {
   const recoveredSlots = getPreviouslySubmittedData(props)?.map(

editor.planx.uk/src/@planx/components/FileUpload/model.tsx

@@ -0,0 +1,48 @@
+import { MoreInformation } from "@planx/components/shared";
+import { Store } from "pages/FlowEditor/lib/store";
+import type { HandleSubmit } from "pages/Preview/Node";
+import { FileWithPath } from "react-dropzone";
+import { array } from "yup";
+
+export interface Props extends MoreInformation {
+  id?: string;
+  title?: string;
+  fn: string;
+  description?: string;
+  handleSubmit: HandleSubmit;
+  previouslySubmittedData?: Store.UserData;
+}
+
+export interface FileUploadSlot {
+  file: FileWithPath;
+  status: "success" | "error" | "uploading";
+  progress: number;
+  id: string;
+  url?: string;
+  cachedSlot?: Omit<FileUploadSlot, "cachedSlot">;
+}
+
+export const slotsSchema = array()
+  .required()
+  .test({
+    name: "nonUploading",
+    message: "Upload at least one file",
+    test: (slots?: Array<FileUploadSlot>) => {
+      return Boolean(
+        slots &&
+          slots.length > 0 &&
+          !slots.some((slot) => slot.status === "uploading"),
+      );
+    },
+  })
+  .test({
+    name: "errorStatus",
+    message: "Remove files which failed to upload",
+    test: (slots?: Array<FileUploadSlot>) => {
+      return Boolean(
+        slots &&
+          slots.length > 0 &&
+          !slots.some((slot) => slot.status === "error"),
+      );
+    },
+  });

editor.planx.uk/src/@planx/components/FileUploadAndLabel/Modal.tsx

@@ -8,7 +8,7 @@ import React, { useState } from "react";
 import ErrorWrapper from "ui/shared/ErrorWrapper";
 import { ValidationError } from "yup";
 
-import { FileUploadSlot } from "../FileUpload/Public";
+import { FileUploadSlot } from "../FileUpload/model";
 import { UploadedFileCard } from "../shared/PrivateFileUpload/UploadedFileCard";
 import { FileList } from "./model";
 import { fileLabelSchema, formatFileLabelSchemaErrors } from "./schema";

editor.planx.uk/src/@planx/components/FileUploadAndLabel/Public.tsx

@@ -18,7 +18,7 @@ import FullWidthWrapper from "ui/public/FullWidthWrapper";
 import ErrorWrapper from "ui/shared/ErrorWrapper";
 import ReactMarkdownOrHtml from "ui/shared/ReactMarkdownOrHtml";
 
-import { FileUploadSlot } from "../FileUpload/Public";
+import { FileUploadSlot } from "../FileUpload/model";
 import { MoreInformation } from "../shared";
 import Card from "../shared/Preview/Card";
 import CardHeader, { Image } from "../shared/Preview/CardHeader";

editor.planx.uk/src/@planx/components/FileUploadAndLabel/SelectMultiple.tsx

@@ -18,7 +18,7 @@ import capitalize from "lodash/capitalize";
 import React, { forwardRef, PropsWithChildren, useMemo } from "react";
 import { borderedFocusStyle } from "theme";
 
-import { FileUploadSlot } from "../FileUpload/Public";
+import { FileUploadSlot } from "../FileUpload/model";
 import {
   addOrAppendSlots,
   FileList,

editor.planx.uk/src/@planx/components/FileUploadAndLabel/mocks.ts

@@ -1,4 +1,4 @@
-import { FileUploadSlot } from "../FileUpload/Public";
+import { FileUploadSlot } from "../FileUpload/model";
 import { Condition, FileList, FileType, Operator, Rule } from "./model";
 
 const mockAlwaysRequiredRule: Rule = {

editor.planx.uk/src/@planx/components/FileUploadAndLabel/model.test.ts

@@ -1,7 +1,7 @@
 import { Store } from "pages/FlowEditor/lib/store";
 import { FileWithPath } from "react-dropzone";
 
-import { FileUploadSlot } from "../FileUpload/Public";
+import { FileUploadSlot } from "../FileUpload/model";
 import {
   mockFileList,
   mockFileListManyTagsOneSlot,

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

@@ -4,7 +4,7 @@ import uniqBy from "lodash/uniqBy";
 import { Store, useStore } from "pages/FlowEditor/lib/store";
 import { FileWithPath } from "react-dropzone";
 
-import { FileUploadSlot } from "../FileUpload/Public";
+import { FileUploadSlot } from "../FileUpload/model";
 import { MoreInformation, parseMoreInformation } from "../shared";
 
 export const PASSPORT_REQUESTED_FILES_KEY = "_requestedFiles" as const;

editor.planx.uk/src/@planx/components/FileUploadAndLabel/schema.test.ts

@@ -1,4 +1,4 @@
-import { FileUploadSlot } from "../FileUpload/Public";
+import { FileUploadSlot } from "../FileUpload/model";
 import { mockFileList, mockFileTypes, mockRules } from "./mocks";
 import { Condition, FileType, Operator } from "./model";
 import {

editor.planx.uk/src/@planx/components/FileUploadAndLabel/schema.ts

@@ -9,7 +9,7 @@ import {
   ValidationError,
 } from "yup";
 
-import { FileUploadSlot } from "../FileUpload/Public";
+import { FileUploadSlot } from "../FileUpload/model";
 import { MoreInformation } from "../shared";
 import {
   checkIfConditionalRule,

editor.planx.uk/src/@planx/components/shared/PrivateFileUpload/Dropzone.tsx

@@ -3,7 +3,7 @@ import Box from "@mui/material/Box";
 import ButtonBase, { ButtonBaseProps } from "@mui/material/ButtonBase";
 import { styled } from "@mui/material/styles";
 import Typography from "@mui/material/Typography";
-import { FileUploadSlot } from "@planx/components/FileUpload/Public";
+import { FileUploadSlot } from "@planx/components/FileUpload/model";
 import handleRejectedUpload from "@planx/components/shared/handleRejectedUpload";
 import { uploadPrivateFile } from "api/upload";
 import { nanoid } from "nanoid";

editor.planx.uk/src/@planx/components/shared/PrivateFileUpload/PrivateFileUpload.tsx

@@ -1,4 +1,4 @@
-import { FileUploadSlot } from "@planx/components/FileUpload/Public";
+import { FileUploadSlot } from "@planx/components/FileUpload/model";
 import { Dropzone } from "@planx/components/shared/PrivateFileUpload/Dropzone";
 import { UploadedFileCard } from "@planx/components/shared/PrivateFileUpload/UploadedFileCard";
 import React, { useState } from "react";

editor.planx.uk/src/@planx/components/shared/PrivateFileUpload/UploadedFileCard.tsx

@@ -8,7 +8,7 @@ import ListItem from "@mui/material/ListItem";
 import { styled } from "@mui/material/styles";
 import Typography from "@mui/material/Typography";
 import { visuallyHidden } from "@mui/utils";
-import { FileUploadSlot } from "@planx/components/FileUpload/Public";
+import { FileUploadSlot } from "@planx/components/FileUpload/model";
 import ImagePreview from "components/ImagePreview";
 import React from "react";
 import ErrorWrapper from "ui/shared/ErrorWrapper";