lpa unseen docs and remove uploaded files

components/elements/index.js

@@ -1847,9 +1847,7 @@ const RenderFileUpload = (field) => {
                 return pdfFileNameDateStamp + "_-_Design_and_Access_Statement";
                 break;
             case "000008":
-                return (
-                    pdfFileNameDateStamp + "_-_Green_Infrastructure_Statement"
-                );
+                return pdfFileNameDateStamp + "_-_NSB_LPA_Additional_Documents";
                 break;
             case "000009":
                 return pdfFileNameDateStamp + "_-_LPA_Correspondence";
@@ -1908,6 +1906,12 @@ const RenderFileUpload = (field) => {
             });
     };
 
+    const removeFile = (file) => {
+        const newFilesArr = files.filter((user) => user.name != file.name);
+        files == newFilesArr;
+        field.input.onChange(newFilesArr);
+    };
+
     return (
         <>
             <Dropzone
@@ -1942,10 +1946,6 @@ const RenderFileUpload = (field) => {
             >
                 {({ getRootProps, getInputProps }) => (
                     <>
-                        {/* {field.hint != false && (
-                        <div className="govuk-hint">ss{t(field.hint)}</div>
-                    )}
-                    <div className="govuk-form-group"></div> */}
                         <section className="container">
                             <div {...getRootProps({ style })}>
                                 {" "}
@@ -1972,7 +1972,9 @@ const RenderFileUpload = (field) => {
                 <span className="error">{field.meta.error}</span>
             )}
             {files && Array.isArray(files) && (
-                <ul>
+                <>
+                    {files.length > 0 && <h4>New files</h4>}
+
                     {files.map(
                         (file, i) =>
                             typeof file.name != "undefined" && (
@@ -1982,20 +1984,26 @@ const RenderFileUpload = (field) => {
                                 >
                                     {" "}
                                     {}
+                                    <span
+                                        className="govuk-summary-list__actionLink watched_link govuk-!-margin-right-5 govuk-!-text-align-left"
+                                        onClick={() => removeFile(file)}
+                                    >
+                                        &minus;
+                                    </span>
                                     <img
                                         src={getThumbnailIcon(file, file.type)}
                                         alt={file.name}
                                         width="50"
                                     />
                                     <span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
-                                        {/* {file.name.slice(file.name.indexOf("_") + 1)} ( */}{" "}
                                         {file.name}( ({bytesToSize(file.size)})
                                     </span>
                                 </div>
                             )
                     )}
-                </ul>
+                </>
             )}
+            {blobList.length > 0 && <h4>Previously added files</h4>}
             {blobList.map(
                 (blob, i) =>
                     blob.documentType == field.documentTypeCode && (