reps pdf upload directory restructure

components/case/representation/representationAgent.js

@@ -1,4 +1,5 @@
 import Link from "next/link";
+import { connect } from "react-redux";
 import { useRouter } from "next/router";
 import useTranslation from "next-translate/useTranslation";
 import { Field, reduxForm } from "redux-form";
@@ -12,9 +13,11 @@ import {
     FileUploadField,
 } from "./representationElements";
 import {
-    setRepresentationCapacity,
-    setRepresentationSubmit,
-} from "../../../store/currentView/action";
+    getFormCollectionByID,
+    getThumbnailIconByExtension,
+    bytesToSize,
+} from "../../utils";
+
 import { useDropzone } from "react-dropzone";
 
 const RepAgent = (props) => {
@@ -117,7 +120,6 @@ const RepAgent = (props) => {
                                     aria-describedby={props.name + "-hint"}
                                 />
                             </div>
-
                             <div className="govuk-form-group govuk-!-margin-bottom-9">
                                 <FileUploadField
                                     name={"representationDocuments"}
@@ -132,6 +134,37 @@ const RepAgent = (props) => {
                                     }
                                 />
                             </div>
+                            {props.currentView.caseReference.hasOwnProperty(
+                                "repDetails"
+                            ) &&
+                            props.currentView.caseReference.repDetails.filesList
+                                .length > 0 ? (
+                                <div className="govuk-form-group govuk-!-margin-bottom-9">
+                                    {props.currentView.caseReference.repDetails.filesList.map(
+                                        (blob, i) => (
+                                            <div
+                                                key={blob.name + "_" + i}
+                                                className="govuk-!-margin-bottom-5 fileThumb "
+                                            >
+                                                <img
+                                                    src={getThumbnailIconByExtension(
+                                                        blob.name
+                                                    )}
+                                                    alt={blob.name}
+                                                    width="50"
+                                                />
+
+                                                <span className="govuk-body govuk-!-font-size-14 govuk-!-padding-left-5">
+                                                    {blob.name} (
+                                                    {bytesToSize(blob.size)})
+                                                </span>
+                                            </div>
+                                        )
+                                    )}
+                                </div>
+                            ) : (
+                                ""
+                            )}
                         </fieldset>
                     </div>{" "}
                 </div>
@@ -146,13 +179,12 @@ const RepAgent = (props) => {
                         </button>
                         {/* <a
                             onClick={() => {
-                                setRepresentationSubmit(false);
+                                setRepresentationSubmit(true);
                             }}
                             className="govuk-button"
                         >
-                            Continue
+                            Continue ww
                         </a> */}
-
                         <a
                             onClick={() => {
                                 setRepresentationCapacity();