From 0ae16c762cfc86e73da1e044da6b609abc4a6309 Mon Sep 17 00:00:00 2001
From: Orka Arnest CRUZE <orka.cruze@ign.fr>
Date: Tue, 10 Oct 2023 12:25:45 +0200
Subject: [PATCH] =?UTF-8?q?feat:=20ajoute=20possibilit=C3=A9=20de=20repren?=
 =?UTF-8?q?dre=20l'int=C3=A9gration=20d'une=20livraison=20non=20termin?=
 =?UTF-8?q?=C3=A9e?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../DatasheetNewIntegration.tsx               | 10 ++++-
 .../DatasetListTab/DatasetListTab.tsx         | 23 ++++++++--
 .../DatasetListTab/UnfinishedUploadList.tsx   | 45 +++++++++++++++++++
 3 files changed, 73 insertions(+), 5 deletions(-)
 create mode 100644 assets/pages/datasheet/DatasheetView/DatasetListTab/UnfinishedUploadList.tsx

diff --git a/assets/pages/datasheet/DatasheetNew/DatasheetNewIntegration/DatasheetNewIntegration.tsx b/assets/pages/datasheet/DatasheetNew/DatasheetNewIntegration/DatasheetNewIntegration.tsx
index 9bad1cf8..f9ef0b64 100644
--- a/assets/pages/datasheet/DatasheetNew/DatasheetNewIntegration/DatasheetNewIntegration.tsx
+++ b/assets/pages/datasheet/DatasheetNew/DatasheetNewIntegration/DatasheetNewIntegration.tsx
@@ -1,3 +1,4 @@
+import { fr } from "@codegouvfr/react-dsfr";
 import { FC } from "react";
 
 import DatastoreLayout from "../../../../components/Layout/DatastoreLayout";
@@ -9,8 +10,13 @@ type DatasheetNewIntegrationProps = {
 };
 const DatasheetNewIntegration: FC<DatasheetNewIntegrationProps> = ({ datastoreId, uploadId }) => {
     return (
-        <DatastoreLayout datastoreId={datastoreId} documentTitle="Intégration de votre donnée en base">
-            <DatasheetNewIntegrationDialog datastoreId={datastoreId} uploadId={uploadId} />
+        <DatastoreLayout datastoreId={datastoreId} documentTitle="Intégration des données">
+            <div className={fr.cx("fr-grid-row")}>
+                <h1>Intégration des données</h1>
+            </div>
+            <div className={fr.cx("fr-grid-row", "fr-grid-row--middle", "fr-grid-row--center", "fr-mt-2v")}>
+                <DatasheetNewIntegrationDialog datastoreId={datastoreId} uploadId={uploadId} />
+            </div>
         </DatastoreLayout>
     );
 };
diff --git a/assets/pages/datasheet/DatasheetView/DatasetListTab/DatasetListTab.tsx b/assets/pages/datasheet/DatasheetView/DatasetListTab/DatasetListTab.tsx
index f17513dd..11840768 100644
--- a/assets/pages/datasheet/DatasheetView/DatasetListTab/DatasetListTab.tsx
+++ b/assets/pages/datasheet/DatasheetView/DatasetListTab/DatasetListTab.tsx
@@ -1,10 +1,12 @@
 import { fr } from "@codegouvfr/react-dsfr";
 import Button from "@codegouvfr/react-dsfr/Button";
-import { FC } from "react";
+import { FC, useMemo } from "react";
+import { symToStr } from "tsafe/symToStr";
 
 import { type DatasheetDetailed } from "../../../../types/app";
-import VectorDbList from "./VectorDbList";
 import PyramidList from "./PyramidList";
+import UnfinishedUploadList from "./UnfinishedUploadList";
+import VectorDbList from "./VectorDbList";
 
 type DataListTabProps = {
     datastoreId: string;
@@ -13,12 +15,25 @@ type DataListTabProps = {
 
 const DatasetListTab: FC<DataListTabProps> = ({ datastoreId, datasheet }) => {
     // TODO : il y en aura d'autres types de données aussi (pyramid vector, raster, etc)
+
+    // liste des uploads/livraisons dont l'intégration en base de données n'a pas réussi ou n'a pas terminé
+    const unfinishedUploads = useMemo(() => {
+        return datasheet?.upload_list?.filter((upload) => upload.tags.integration_current_step !== "3");
+    }, [datasheet?.upload_list]);
+
     return (
         <>
             <div className={fr.cx("fr-grid-row", "fr-grid-row--right", "fr-grid-row--middle")}>
                 <Button iconId="fr-icon-add-line">Ajouter un fichier de données</Button>
             </div>
-            <div className={fr.cx("fr-grid-row", "fr-grid-row--center", "fr-grid-row--middle")}>
+            {unfinishedUploads && unfinishedUploads.length > 0 && (
+                <div className={fr.cx("fr-grid-row", "fr-grid-row--center", "fr-grid-row--middle")}>
+                    <div className={fr.cx("fr-col")}>
+                        <UnfinishedUploadList datastoreId={datastoreId} uploadList={unfinishedUploads} title="Livraisons non terminées" />
+                    </div>
+                </div>
+            )}
+            <div className={fr.cx("fr-grid-row", "fr-grid-row--center", "fr-grid-row--middle", "fr-mt-4w")}>
                 <div className={fr.cx("fr-col")}>
                     <VectorDbList datastoreId={datastoreId} vectorDbList={datasheet?.vector_db_list} />
                 </div>
@@ -32,4 +47,6 @@ const DatasetListTab: FC<DataListTabProps> = ({ datastoreId, datasheet }) => {
     );
 };
 
+DatasetListTab.displayName = symToStr({ DatasetListTab });
+
 export default DatasetListTab;
diff --git a/assets/pages/datasheet/DatasheetView/DatasetListTab/UnfinishedUploadList.tsx b/assets/pages/datasheet/DatasheetView/DatasetListTab/UnfinishedUploadList.tsx
new file mode 100644
index 00000000..777a16b7
--- /dev/null
+++ b/assets/pages/datasheet/DatasheetView/DatasetListTab/UnfinishedUploadList.tsx
@@ -0,0 +1,45 @@
+import { fr } from "@codegouvfr/react-dsfr";
+import Button from "@codegouvfr/react-dsfr/Button";
+import { FC } from "react";
+import { symToStr } from "tsafe/symToStr";
+
+import { routes } from "../../../../router/router";
+import { Upload } from "../../../../types/app";
+
+type UnfinishedUploadListProps = {
+    datastoreId: string;
+    uploadList?: Upload[];
+    title?: string;
+};
+const UnfinishedUploadList: FC<UnfinishedUploadListProps> = ({ datastoreId, uploadList, title = "Livraisons" }) => {
+    return (
+        <>
+            <div className={fr.cx("fr-grid-row")}>
+                <h5>
+                    <i className={fr.cx("fr-icon-database-fill")} />
+                    &nbsp;{title} ({uploadList?.length ?? 0})
+                </h5>
+            </div>
+
+            {uploadList?.map((upload) => (
+                <div key={upload._id} className={fr.cx("fr-grid-row", "fr-grid-row--middle", "fr-mt-2v")}>
+                    <div className={fr.cx("fr-col")}>
+                        <div className={fr.cx("fr-grid-row", "fr-grid-row--middle")}>{upload.name}</div>
+                    </div>
+
+                    <div className={fr.cx("fr-col")}>
+                        <div className={fr.cx("fr-grid-row", "fr-grid-row--right", "fr-grid-row--middle")}>
+                            <Button linkProps={routes.datastore_datasheet_new_integration({ datastoreId, uploadId: upload._id }).link}>
+                                {"Reprendre l'intégration"}
+                            </Button>
+                        </div>
+                    </div>
+                </div>
+            ))}
+        </>
+    );
+};
+
+UnfinishedUploadList.displayName = symToStr({ UnfinishedUploadList });
+
+export default UnfinishedUploadList;