From 933f1d7a965dd361c76e0197b44da5b159e8a6da Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20Jean?= <cedric.jean@momentum-tech.ca>
Date: Mon, 21 Dec 2020 09:51:52 -0500
Subject: [PATCH 1/2] fix

---
 cypress/integration/udt-test.spec.js                        | 6 +-----
 .../test/create-and-visit-collaborative-session.spec.js     | 2 +-
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/cypress/integration/udt-test.spec.js b/cypress/integration/udt-test.spec.js
index 8d1938f4..992f8ea9 100644
--- a/cypress/integration/udt-test.spec.js
+++ b/cypress/integration/udt-test.spec.js
@@ -9,7 +9,7 @@ import pasteImageUrls from "../utils/test/paste-image-urls.spec"
 import textEntityClassification from "../utils/test/text-entity-classification.spec"
 Cypress.config("defaultCommandTimeout", 3000)
 describe("Udt test", () => {
-  before("Prepare test", () => {
+  beforeEach("Prepare test", () => {
     cy.visit(`http://localhost:6001`)
     cy.get('input[id="react-select-2-input"]')
       .focus()
@@ -25,8 +25,4 @@ describe("Udt test", () => {
   pasteImageUrlsWithCSV()
   pasteImageUrls()
   textEntityClassification()
-
-  afterEach("Return home page", () => {
-    cy.get("button[title='Exit to Welcome Page']").click()
-  })
 })
diff --git a/cypress/utils/test/create-and-visit-collaborative-session.spec.js b/cypress/utils/test/create-and-visit-collaborative-session.spec.js
index 1add0412..7c58324b 100644
--- a/cypress/utils/test/create-and-visit-collaborative-session.spec.js
+++ b/cypress/utils/test/create-and-visit-collaborative-session.spec.js
@@ -9,7 +9,7 @@ const createAndVisitCollaborativeSession = () => {
 
     cy.log("should be able to create new session")
     cy.get("div[title='collaborate-icon']").click()
-    cy.contains("Create New Session").click()
+    cy.contains("Create New Session", { timeout: 5000 }).click()
     cy.contains("Leave Session", { timeout: 10000 })
     cy.get("div[title='collaborate-icon']").trigger("mouseleave")
 

From c8bb196ee795b70e8bd5eaae0a7263f3eb6fb43f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20Jean?= <cedric.jean@momentum-tech.ca>
Date: Fri, 4 Dec 2020 16:31:50 -0500
Subject: [PATCH 2/2] import assets

---
 .../integration/collaborative-session.spec.js |   4 +-
 .../integration/function-verification.spec.js |   4 +
 cypress/integration/udt-test.spec.js          |  19 +-
 .../function-test/get-data-url-type.spec.js   |  28 ++
 ...samples-in-a-collaborative-session.spec.js |   0
 ...te-and-visit-collaborative-session.spec.js |   0
 .../create-new-file.spec.js                   |   0
 .../image-classification.spec.js              |   0
 .../image-segmentation.spec.js                |   0
 .../keyboard-shortcuts.spec.js                |   0
 .../label-help.spec.js                        |   0
 .../named-entity-recognition.spec.js          |   0
 .../paste-image-urls-with-csv.spec.js         |   0
 .../paste-image-urls.spec.js                  |   0
 .../text-entity-classification.spec.js        |   0
 package.json                                  |   1 +
 public/legal.html                             |  12 +-
 .../check-interface-and-sample-type.js        |  21 +-
 .../ImportFromCognitoS3Dialog/index.js        | 298 ++++++++++++++++--
 .../init-config-import.js                     |  32 +-
 .../set-type-of-file-to-load-and-disable.js   |  34 +-
 .../ImportFromCognitoS3Dialog/set-url.js      |  43 +++
 src/components/ImportPage/index.js            | 137 ++++----
 src/utils/RecognizeFileExtension.js           |  24 --
 .../dataset-helper/get-files-differences.js   | 107 +++----
 src/utils/get-data-url-type.js                |  17 +
 yarn.lock                                     |   6 +-
 27 files changed, 561 insertions(+), 226 deletions(-)
 create mode 100644 cypress/integration/function-verification.spec.js
 create mode 100644 cypress/utils/function-test/get-data-url-type.spec.js
 rename cypress/utils/{test => interface-test}/click-on-100-samples-in-a-collaborative-session.spec.js (100%)
 rename cypress/utils/{test => interface-test}/create-and-visit-collaborative-session.spec.js (100%)
 rename cypress/utils/{test => interface-test}/create-new-file.spec.js (100%)
 rename cypress/utils/{test => interface-test}/image-classification.spec.js (100%)
 rename cypress/utils/{test => interface-test}/image-segmentation.spec.js (100%)
 rename cypress/utils/{test => interface-test}/keyboard-shortcuts.spec.js (100%)
 rename cypress/utils/{test => interface-test}/label-help.spec.js (100%)
 rename cypress/utils/{test => interface-test}/named-entity-recognition.spec.js (100%)
 rename cypress/utils/{test => interface-test}/paste-image-urls-with-csv.spec.js (100%)
 rename cypress/utils/{test => interface-test}/paste-image-urls.spec.js (100%)
 rename cypress/utils/{test => interface-test}/text-entity-classification.spec.js (100%)
 create mode 100644 src/components/ImportFromCognitoS3Dialog/set-url.js
 delete mode 100644 src/utils/RecognizeFileExtension.js
 create mode 100644 src/utils/get-data-url-type.js

diff --git a/cypress/integration/collaborative-session.spec.js b/cypress/integration/collaborative-session.spec.js
index 3543e5b6..f098b6cb 100644
--- a/cypress/integration/collaborative-session.spec.js
+++ b/cypress/integration/collaborative-session.spec.js
@@ -1,5 +1,5 @@
-import clickOn100SamplesInACollaborativeSession from "../utils/test/click-on-100-samples-in-a-collaborative-session.spec"
-import createAndVisitCollaborativeSession from "../utils/test/create-and-visit-collaborative-session.spec"
+import clickOn100SamplesInACollaborativeSession from "../utils/interface-test/click-on-100-samples-in-a-collaborative-session.spec"
+import createAndVisitCollaborativeSession from "../utils/interface-test/create-and-visit-collaborative-session.spec"
 Cypress.config("defaultCommandTimeout", 3000)
 describe("Create and Visit Collaborative Session", () => {
   beforeEach("Prepare test", () => {
diff --git a/cypress/integration/function-verification.spec.js b/cypress/integration/function-verification.spec.js
new file mode 100644
index 00000000..e12e88ba
--- /dev/null
+++ b/cypress/integration/function-verification.spec.js
@@ -0,0 +1,4 @@
+import getDataUrlTypeTest from "../utils/function-test/get-data-url-type.spec"
+describe("Function verification", () => {
+  getDataUrlTypeTest()
+})
diff --git a/cypress/integration/udt-test.spec.js b/cypress/integration/udt-test.spec.js
index 992f8ea9..1e0e8394 100644
--- a/cypress/integration/udt-test.spec.js
+++ b/cypress/integration/udt-test.spec.js
@@ -1,12 +1,13 @@
-import createNewFile from "../utils/test/create-new-file.spec"
-import imageClassification from "../utils/test/image-classification.spec"
-import imageSegmentation from "../utils/test/image-segmentation.spec"
-import keyboardShortcuts from "../utils/test/keyboard-shortcuts.spec"
-import labelHelp from "../utils/test/label-help.spec"
-import namedEntityRecognition from "../utils/test/named-entity-recognition.spec"
-import pasteImageUrlsWithCSV from "../utils/test/paste-image-urls-with-csv.spec"
-import pasteImageUrls from "../utils/test/paste-image-urls.spec"
-import textEntityClassification from "../utils/test/text-entity-classification.spec"
+import createNewFile from "../utils/interface-test/create-new-file.spec"
+import imageClassification from "../utils/interface-test/image-classification.spec"
+import imageSegmentation from "../utils/interface-test/image-segmentation.spec"
+import keyboardShortcuts from "../utils/interface-test/keyboard-shortcuts.spec"
+import labelHelp from "../utils/interface-test/label-help.spec"
+import namedEntityRecognition from "../utils/interface-test/named-entity-recognition.spec"
+import pasteImageUrlsWithCSV from "../utils/interface-test/paste-image-urls-with-csv.spec"
+import pasteImageUrls from "../utils/interface-test/paste-image-urls.spec"
+import textEntityClassification from "../utils/interface-test/text-entity-classification.spec"
+
 Cypress.config("defaultCommandTimeout", 3000)
 describe("Udt test", () => {
   beforeEach("Prepare test", () => {
diff --git a/cypress/utils/function-test/get-data-url-type.spec.js b/cypress/utils/function-test/get-data-url-type.spec.js
new file mode 100644
index 00000000..8569dfeb
--- /dev/null
+++ b/cypress/utils/function-test/get-data-url-type.spec.js
@@ -0,0 +1,28 @@
+import getDataUrlType from "../../../src/utils/get-data-url-type"
+const getDataUrlTypeTest = () => {
+  it("Check getDataUrlType", () => {
+    expect(
+      getDataUrlType(
+        "https://s3.amazonaws.com/asset.workaround.online/example-jobs/sticky-notes/image2.jpg"
+      )
+    ).to.equal("Image")
+    expect(
+      getDataUrlType(
+        "https://s3.amazonaws.com/asset.workaround.online/SampleVideo_1280x720_1mb.mp4"
+      )
+    ).to.equal("Video")
+    expect(
+      getDataUrlType("https://html5tutorial.info/media/vincent.mp3")
+    ).to.equal("Audio")
+    expect(getDataUrlType("https://arxiv.org/pdf/1908.07069.pdf")).to.equal(
+      "PDF"
+    )
+    expect(getDataUrlType("https://arxiv.org/pdf/1908.07069.txt")).to.equal(
+      "Texte"
+    )
+    expect(getDataUrlType("https://arxiv.org/pdf/1908.07069.js")).to.equal(
+      "File"
+    )
+  })
+}
+export default getDataUrlTypeTest
diff --git a/cypress/utils/test/click-on-100-samples-in-a-collaborative-session.spec.js b/cypress/utils/interface-test/click-on-100-samples-in-a-collaborative-session.spec.js
similarity index 100%
rename from cypress/utils/test/click-on-100-samples-in-a-collaborative-session.spec.js
rename to cypress/utils/interface-test/click-on-100-samples-in-a-collaborative-session.spec.js
diff --git a/cypress/utils/test/create-and-visit-collaborative-session.spec.js b/cypress/utils/interface-test/create-and-visit-collaborative-session.spec.js
similarity index 100%
rename from cypress/utils/test/create-and-visit-collaborative-session.spec.js
rename to cypress/utils/interface-test/create-and-visit-collaborative-session.spec.js
diff --git a/cypress/utils/test/create-new-file.spec.js b/cypress/utils/interface-test/create-new-file.spec.js
similarity index 100%
rename from cypress/utils/test/create-new-file.spec.js
rename to cypress/utils/interface-test/create-new-file.spec.js
diff --git a/cypress/utils/test/image-classification.spec.js b/cypress/utils/interface-test/image-classification.spec.js
similarity index 100%
rename from cypress/utils/test/image-classification.spec.js
rename to cypress/utils/interface-test/image-classification.spec.js
diff --git a/cypress/utils/test/image-segmentation.spec.js b/cypress/utils/interface-test/image-segmentation.spec.js
similarity index 100%
rename from cypress/utils/test/image-segmentation.spec.js
rename to cypress/utils/interface-test/image-segmentation.spec.js
diff --git a/cypress/utils/test/keyboard-shortcuts.spec.js b/cypress/utils/interface-test/keyboard-shortcuts.spec.js
similarity index 100%
rename from cypress/utils/test/keyboard-shortcuts.spec.js
rename to cypress/utils/interface-test/keyboard-shortcuts.spec.js
diff --git a/cypress/utils/test/label-help.spec.js b/cypress/utils/interface-test/label-help.spec.js
similarity index 100%
rename from cypress/utils/test/label-help.spec.js
rename to cypress/utils/interface-test/label-help.spec.js
diff --git a/cypress/utils/test/named-entity-recognition.spec.js b/cypress/utils/interface-test/named-entity-recognition.spec.js
similarity index 100%
rename from cypress/utils/test/named-entity-recognition.spec.js
rename to cypress/utils/interface-test/named-entity-recognition.spec.js
diff --git a/cypress/utils/test/paste-image-urls-with-csv.spec.js b/cypress/utils/interface-test/paste-image-urls-with-csv.spec.js
similarity index 100%
rename from cypress/utils/test/paste-image-urls-with-csv.spec.js
rename to cypress/utils/interface-test/paste-image-urls-with-csv.spec.js
diff --git a/cypress/utils/test/paste-image-urls.spec.js b/cypress/utils/interface-test/paste-image-urls.spec.js
similarity index 100%
rename from cypress/utils/test/paste-image-urls.spec.js
rename to cypress/utils/interface-test/paste-image-urls.spec.js
diff --git a/cypress/utils/test/text-entity-classification.spec.js b/cypress/utils/interface-test/text-entity-classification.spec.js
similarity index 100%
rename from cypress/utils/test/text-entity-classification.spec.js
rename to cypress/utils/interface-test/text-entity-classification.spec.js
diff --git a/package.json b/package.json
index 399460a6..e4272612 100644
--- a/package.json
+++ b/package.json
@@ -102,6 +102,7 @@
     "in-browser-download": "^2.0.0",
     "jac-format": "^1.1.3",
     "js-md5": "^0.7.3",
+    "mime-types": "^2.1.27",
     "moment": "^2.24.0",
     "nan": "^2.14.1",
     "posthog-js": "^1.0.4",
diff --git a/public/legal.html b/public/legal.html
index e4837981..4ba47044 100644
--- a/public/legal.html
+++ b/public/legal.html
@@ -10,19 +10,19 @@
   <body>
     <div
       id="header"
-      style="display: inline-flex; justify-content: space-between; width: 100%"
+      style="display: inline-flex; justify-content: space-between; width: 100%;"
     >
-      <img src="./favicon.ico" style="height: 100%" />
-      <div style="display: flex; width: 100%">
-        <a style="margin: auto" href="https://universaldatatool.com">
+      <img src="./favicon.ico" style="height: 100%;" />
+      <div style="display: flex; width: 100%;">
+        <a style="margin: auto;" href="https://universaldatatool.com">
           <h1>Universal Data Tool</h1>
         </a>
       </div>
-      <img src="./favicon.ico" style="height: 100%" />
+      <img src="./favicon.ico" style="height: 100%;" />
     </div>
     <div
       id="terms-and-conditions-wrapper"
-      style="padding-right: 5vw; padding-left: 5vw; padding-top: 2vh"
+      style="padding-right: 5vw; padding-left: 5vw; padding-top: 2vh;"
     >
       <h1>Terms and Conditions of Use</h1>
       <h3>1. Terms</h3>
diff --git a/src/components/ImportFromCognitoS3Dialog/check-interface-and-sample-type.js b/src/components/ImportFromCognitoS3Dialog/check-interface-and-sample-type.js
index 379f1e01..b34bf734 100644
--- a/src/components/ImportFromCognitoS3Dialog/check-interface-and-sample-type.js
+++ b/src/components/ImportFromCognitoS3Dialog/check-interface-and-sample-type.js
@@ -1,6 +1,6 @@
 import isEmpty from "lodash/isEmpty"
 export default (typeAuthorize, file) => {
-  function interfaceFileType(type) {
+  const interfaceFileType = (type) => {
     if (
       type === "image_classification" ||
       type === "image_segmentation" ||
@@ -16,19 +16,20 @@ export default (typeAuthorize, file) => {
     return "File"
   }
 
-  function typesamplesSample(samples) {
-    if (isEmpty(samples) || isEmpty(samples[0])) return "Empty"
-    if (!isEmpty(samples[0].imageUrl)) return "Image"
-    if (!isEmpty(samples[0].videoUrl)) return "Video"
-    if (!isEmpty(samples[0].audioUrl)) return "Audio"
-    if (!isEmpty(samples[0].pdfUrl)) return "PDF"
-    if (!isEmpty(samples[0].document)) return "Texte"
+  const typeAssetsFromSample = (assets) => {
+    if (isEmpty(assets) || isEmpty(assets[0])) return "Empty"
+    if (!isEmpty(assets[0].imageUrl)) return "Image"
+    if (!isEmpty(assets[0].videoUrl)) return "Video"
+    if (!isEmpty(assets[0].audioUrl)) return "Audio"
+    if (!isEmpty(assets[0].pdfUrl)) return "PDF"
+    if (!isEmpty(assets[0].document)) return "Texte"
     return "File"
   }
+
   var result = [null, null]
   if (isEmpty(file)) return false
-  result[0] = interfaceFileType(file.content.interface.type)
-  result[1] = typesamplesSample(file.content.samples)
+  result[0] = interfaceFileType(file.interface.type)
+  result[1] = typeAssetsFromSample(file.samples)
   if (typeAuthorize.includes(result[0]) && typeAuthorize.includes(result[1]))
     return true
   return false
diff --git a/src/components/ImportFromCognitoS3Dialog/index.js b/src/components/ImportFromCognitoS3Dialog/index.js
index af8674b6..7117038c 100644
--- a/src/components/ImportFromCognitoS3Dialog/index.js
+++ b/src/components/ImportFromCognitoS3Dialog/index.js
@@ -1,10 +1,36 @@
-import React, { useEffect, useState } from "react"
+import React, { useEffect, useRef, useState, useCallback } from "react"
 import SimpleDialog from "../SimpleDialog"
 import DataTable from "react-data-table-component"
-import Radio from "@material-ui/core/Radio"
+import useDataset from "../../hooks/use-dataset"
 import isEmpty from "lodash/isEmpty"
 import datasetManagerCognito from "udt-dataset-managers/dist/CognitoDatasetManager"
 import useAuth from "../../utils/auth-handlers/use-auth"
+import setTypeOfFileToLoadAndDisable from "./set-type-of-file-to-load-and-disable"
+import initConfigImport from "./init-config-import"
+import datasetHasChanged from "../../utils//dataset-helper/get-files-differences"
+import setUrl from "./set-url"
+import { setIn } from "seamless-immutable"
+import {
+  Settings as SettingsIcon,
+  Storage as StorageIcon,
+} from "@material-ui/icons/"
+import {
+  Radio,
+  RadioGroup,
+  FormControl,
+  FormControlLabel,
+  Button,
+  FormLabel,
+  IconButton,
+  Grid,
+} from "@material-ui/core/"
+
+const selectedStyle = { color: "DodgerBlue" }
+
+const expandedAssetsColumns = [
+  { name: "Assets", selector: "assets", sortable: true },
+  { name: "Last Modified", selector: "lastModified", sortable: true },
+]
 
 const expandedAnnotationsColumns = [
   { name: "Annotations", selector: "annotation" },
@@ -28,7 +54,7 @@ const customStyles = {
 }
 
 const ExpandedRow = ({ data }) => {
-  const { rowAnnotations } = data
+  const { rowAssets, rowAnnotations } = data
   return (
     <>
       <DataTable
@@ -48,17 +74,66 @@ const ExpandedRow = ({ data }) => {
         paginationRowsPerPageOptions={[10, 20, 25, 50, 100, 200]}
         customStyles={customStyles}
       />
+      <DataTable
+        style={{
+          boxSizing: "border-box",
+          paddingLeft: "50px",
+          paddingRight: "10px",
+        }}
+        dense
+        striped
+        noHeader
+        columns={expandedAssetsColumns}
+        data={rowAssets}
+        noDataComponent={'Make sure the project has "data" folder'}
+        pagination={rowAssets.length > 10}
+        paginationPerPage={10}
+        paginationRowsPerPageOptions={[10, 20, 25, 50, 100, 200]}
+        customStyles={customStyles}
+      />
     </>
   )
 }
 
 export default ({ open, onClose, onAddSamples }) => {
   const [dm, setDm] = useState(null)
+  const [oldData] = useDataset()
   const { authConfig } = useAuth()
   const [projects, setProjects] = useState()
   const [projectToFetch, setProjectToFetch] = useState()
+  const [configImport, setConfigImport] = useState(initConfigImport(oldData))
+  const lastObjectRef = useRef({})
+
+  const hasProjectStarted = useCallback(() => {
+    if (!open) return
+    if (
+      isEmpty(oldData) ||
+      (isEmpty(oldData.interface) && isEmpty(oldData.samples))
+    )
+      return false
+    return true
+  }, [oldData, open])
+
+  useEffect(() => {
+    if (!open) return
+    if (oldData === lastObjectRef.current) return
+
+    var configToSet = configImport
+    const changes = datasetHasChanged(lastObjectRef.current, oldData)
+    if (changes.interface.type || changes.samples) {
+      configToSet = setTypeOfFileToLoadAndDisable(configToSet, oldData)
+    }
+    setConfigImport({
+      ...configToSet,
+      projectStarted: hasProjectStarted(),
+    })
+    console.log("changes")
+    console.log(configImport)
+    lastObjectRef.current = oldData
+  }, [oldData, configImport, setConfigImport, hasProjectStarted, open])
 
   const handleRowSelected = (whatsChanging) => {
+    if (!open) return
     if (!isEmpty(whatsChanging.selectedRows[0])) {
       setProjectToFetch(whatsChanging.selectedRows[0])
       setProjects((prevState) =>
@@ -76,6 +151,19 @@ export default ({ open, onClose, onAddSamples }) => {
     }
   }
 
+  const loadAssetsOrAnnotations = () => {
+    setConfigImport({
+      ...configImport,
+      loadAssetsIsSelected: !configImport.loadAssetsIsSelected,
+    })
+  }
+
+  useEffect(() => {
+    if (!open) return
+    if (!authConfig) return
+    if (!dm) setDm(new datasetManagerCognito({ authConfig }))
+  }, [open, authConfig, dm])
+
   const getProjects = async () => {
     if (!open) return
     if (!dm) return
@@ -89,6 +177,9 @@ export default ({ open, onClose, onAddSamples }) => {
         const rowAnnotationsContent = await dm.getListSamples({
           projectName: obj,
         })
+        const rowAssetsContent = await dm.getListAssets({
+          projectName: obj,
+        })
         if (projectToFetch && projectToFetch.folder === folder)
           isSelected = true
         return {
@@ -99,7 +190,13 @@ export default ({ open, onClose, onAddSamples }) => {
               annotation: obj.split("/samples/")[1],
             }
           }),
+          rowAssets: rowAssetsContent.map((obj) => {
+            return {
+              assets: obj.split("/assets/")[1],
+            }
+          }),
           rowAnnotationsUrl: rowAnnotationsContent,
+          rowAssetsUrl: rowAssetsContent,
           isSelected: isSelected,
         }
       })
@@ -130,13 +227,32 @@ export default ({ open, onClose, onAddSamples }) => {
     setProject()
     // eslint-disable-next-line
   }, [projectToFetch, open])
+  const createJsonFromAsset = async () => {
+    var jsons = await Promise.all(
+      projectToFetch.rowAssetsUrl.map(async (obj) => {
+        var url = await dm.getDataUrl(obj.split("/assets/")[1])
+        var json = setUrl(url, configImport)
+        if (json) json = setIn(json, ["_id"], obj.split("/assets/")[1])
+        return json
+      })
+    )
+    onAddSamples(jsons)
+  }
 
-  const handleAddSample = async () => {
-    if (!projectToFetch) return
+  const createJsonFromAnnotation = async () => {
     var jsons = await dm.readJSONAllSample(projectToFetch.rowAnnotationsUrl)
     onAddSamples(jsons)
   }
 
+  const handleAddSample = async () => {
+    if (!projectToFetch) return
+    if (configImport.loadAssetsIsSelected) {
+      createJsonFromAsset()
+    } else {
+      createJsonFromAnnotation()
+    }
+  }
+
   return (
     <SimpleDialog
       title="Select Project"
@@ -144,33 +260,163 @@ export default ({ open, onClose, onAddSamples }) => {
       onClose={onClose}
       actions={[
         {
-          text: "Take sample from project",
+          text: "Take samples from project",
           onClick: () => {
             handleAddSample()
           },
         },
       ]}
     >
-      {!isEmpty(projects) && (
-        <DataTable
-          expandableRows
-          expandableRowsComponent={<ExpandedRow />}
-          selectableRows
-          selectableRowsHighlight
-          selectableRowsNoSelectAll
-          selectableRowsComponent={Radio}
-          dense
-          noHeader
-          noTableHead
-          columns={columns}
-          onSelectedRowsChange={handleRowSelected}
-          selectableRowSelected={(row) => row.isSelected}
-          data={projects}
-          pagination={projects.length > 10}
-          paginationPerPage={10}
-          paginationRowsPerPageOptions={[10, 20, 25, 50, 100, 200]}
-        />
-      )}
+      <Grid container spacing={0}>
+        <Grid container item xs={12} spacing={0} justify="center">
+          {configImport.loadAssetsIsSelected ? (
+            <Button
+              style={selectedStyle}
+              onClick={loadAssetsOrAnnotations}
+              disabled
+            >
+              Load Assets
+            </Button>
+          ) : (
+            <Button onClick={loadAssetsOrAnnotations}>Load Assets</Button>
+          )}
+          {configImport.loadAssetsIsSelected ? (
+            <Button onClick={loadAssetsOrAnnotations}>Load Annotations</Button>
+          ) : (
+            <Button
+              style={selectedStyle}
+              onClick={loadAssetsOrAnnotations}
+              disabled
+            >
+              Load Annotations
+            </Button>
+          )}
+          <IconButton
+            onClick={() => {
+              setConfigImport({
+                ...configImport,
+                contentDialogBoxIsSetting: !configImport.contentDialogBoxIsSetting,
+              })
+            }}
+          >
+            {configImport.contentDialogBoxIsSetting ? (
+              <StorageIcon></StorageIcon>
+            ) : (
+              <SettingsIcon></SettingsIcon>
+            )}
+          </IconButton>
+        </Grid>
+
+        {!configImport.contentDialogBoxIsSetting ? (
+          !isEmpty(projects) && (
+            <Grid container item xs={12} spacing={0} justify="center">
+              <DataTable
+                expandableRows
+                expandableRowsComponent={<ExpandedRow />}
+                selectableRows
+                selectableRowsHighlight
+                selectableRowsNoSelectAll
+                selectableRowsComponent={Radio}
+                dense
+                noHeader
+                noTableHead
+                columns={columns}
+                onSelectedRowsChange={handleRowSelected}
+                selectableRowSelected={(row) => row.isSelected}
+                data={projects}
+                pagination={projects.length > 10}
+                paginationPerPage={10}
+                paginationRowsPerPageOptions={[10, 20, 25, 50, 100, 200]}
+              />
+            </Grid>
+          )
+        ) : (
+          <Grid container item xs={12} spacing={0} justify="center">
+            {!configImport.loadAssetsIsSelected ? (
+              <FormControl component="fieldset">
+                <FormLabel component="legend">Annotation processing</FormLabel>
+                <RadioGroup
+                  aria-label="option1"
+                  onChange={(event) => {
+                    setConfigImport({
+                      ...configImport,
+                      annotationToKeep: event.target.value,
+                    })
+                  }}
+                >
+                  <FormControlLabel
+                    value="both"
+                    control={<Radio />}
+                    label="Keep both annotations"
+                    checked={configImport.annotationToKeep === "both"}
+                  />
+                  <FormControlLabel
+                    value="incoming"
+                    control={<Radio />}
+                    label="Keep incoming annotations"
+                    checked={configImport.annotationToKeep === "incoming"}
+                  />
+                  <FormControlLabel
+                    value="current"
+                    control={<Radio />}
+                    label="Keep current annotations"
+                    checked={configImport.annotationToKeep === "current"}
+                  />
+                </RadioGroup>
+              </FormControl>
+            ) : (
+              <FormControl component="fieldset">
+                <FormLabel component="legend">Choose file type</FormLabel>
+                <RadioGroup
+                  aria-label="option2"
+                  onChange={(event) => {
+                    setConfigImport({
+                      ...configImport,
+                      typeOfFileToLoad: event.target.value,
+                    })
+                  }}
+                >
+                  <FormControlLabel
+                    value="Image"
+                    control={<Radio />}
+                    label="Load image file"
+                    disabled={configImport.typeOfFileToDisable.Image}
+                    checked={configImport.typeOfFileToLoad === "Image"}
+                  />
+                  <FormControlLabel
+                    value="Video"
+                    control={<Radio />}
+                    label="Load video file"
+                    disabled={configImport.typeOfFileToDisable.Video}
+                    checked={configImport.typeOfFileToLoad === "Video"}
+                  />
+                  <FormControlLabel
+                    value="Audio"
+                    control={<Radio />}
+                    label="Load audio file"
+                    disabled={configImport.typeOfFileToDisable.Audio}
+                    checked={configImport.typeOfFileToLoad === "Audio"}
+                  />
+                  <FormControlLabel
+                    value="PDF"
+                    control={<Radio />}
+                    label="Load PDF file"
+                    disabled={configImport.typeOfFileToDisable.PDF}
+                    checked={configImport.typeOfFileToLoad === "PDF"}
+                  />
+                  <FormControlLabel
+                    value="Texte"
+                    control={<Radio />}
+                    label="Load texte file"
+                    disabled={configImport.typeOfFileToDisable.Texte}
+                    checked={configImport.typeOfFileToLoad === "Texte"}
+                  />
+                </RadioGroup>
+              </FormControl>
+            )}
+          </Grid>
+        )}
+      </Grid>
     </SimpleDialog>
   )
 }
diff --git a/src/components/ImportFromCognitoS3Dialog/init-config-import.js b/src/components/ImportFromCognitoS3Dialog/init-config-import.js
index a7259207..904f744a 100644
--- a/src/components/ImportFromCognitoS3Dialog/init-config-import.js
+++ b/src/components/ImportFromCognitoS3Dialog/init-config-import.js
@@ -1,26 +1,34 @@
 import checkInterfaceAndsamples from "./check-interface-and-sample-type"
-export default (file) => {
+export default (dataset) => {
   return {
     annotationToKeep: "both",
-    typeOfFileToLoad: checkInterfaceAndsamples(["Image", "Empty"], file)
+    typeOfFileToLoad: checkInterfaceAndsamples(["Image", "Empty"], dataset)
       ? "Image"
-      : checkInterfaceAndsamples(["Video", "Empty"], file)
+      : checkInterfaceAndsamples(["Video", "Empty"], dataset)
       ? "Video"
-      : checkInterfaceAndsamples(["Audio", "Empty"], file)
+      : checkInterfaceAndsamples(["Audio", "Empty"], dataset)
       ? "Audio"
-      : checkInterfaceAndsamples(["PDF", "Empty"], file)
+      : checkInterfaceAndsamples(["PDF", "Empty"], dataset)
       ? "PDF"
-      : checkInterfaceAndsamples(["Texte", "Empty"], file)
+      : checkInterfaceAndsamples(["Texte", "Empty"], dataset)
       ? "Texte"
       : "None",
     typeOfFileToDisable: {
-      Image: checkInterfaceAndsamples(["Image", "Empty"], file) ? false : true,
-      Video: checkInterfaceAndsamples(["Video", "Empty"], file) ? false : true,
-      Audio: checkInterfaceAndsamples(["Audio", "Empty"], file) ? false : true,
-      PDF: checkInterfaceAndsamples(["PDF", "Empty"], file) ? false : true,
-      Texte: checkInterfaceAndsamples(["Texte", "Empty"], file) ? false : true,
+      Image: checkInterfaceAndsamples(["Image", "Empty"], dataset)
+        ? false
+        : true,
+      Video: checkInterfaceAndsamples(["Video", "Empty"], dataset)
+        ? false
+        : true,
+      Audio: checkInterfaceAndsamples(["Audio", "Empty"], dataset)
+        ? false
+        : true,
+      PDF: checkInterfaceAndsamples(["PDF", "Empty"], dataset) ? false : true,
+      Texte: checkInterfaceAndsamples(["Texte", "Empty"], dataset)
+        ? false
+        : true,
     },
-    loadProjectIsSelected: true,
+    loadAssetsIsSelected: true,
     contentDialogBoxIsSetting: false,
     projectStarted: false,
   }
diff --git a/src/components/ImportFromCognitoS3Dialog/set-type-of-file-to-load-and-disable.js b/src/components/ImportFromCognitoS3Dialog/set-type-of-file-to-load-and-disable.js
index d1c28dfa..c3d5da35 100644
--- a/src/components/ImportFromCognitoS3Dialog/set-type-of-file-to-load-and-disable.js
+++ b/src/components/ImportFromCognitoS3Dialog/set-type-of-file-to-load-and-disable.js
@@ -1,30 +1,38 @@
 import isEmpty from "lodash/isEmpty"
-import checkInterfaceAndsamples from "./check-interface-and-sample-type"
-export default (configImport, file) => {
+import checkInterfaceAndAssets from "./check-interface-and-sample-type"
+export default (configImport, dataset) => {
   return {
     ...configImport,
     typeOfFileToLoad:
       !isEmpty(configImport) &&
       !isEmpty(configImport.typeOfFileToLoad) &&
-      checkInterfaceAndsamples([configImport.typeOfFileToLoad, "Empty"], file)
+      checkInterfaceAndAssets([configImport.typeOfFileToLoad, "Empty"], dataset)
         ? configImport.typeOfFileToLoad
-        : checkInterfaceAndsamples(["Image", "Empty"], file)
+        : checkInterfaceAndAssets(["Image", "Empty"], dataset)
         ? "Image"
-        : checkInterfaceAndsamples(["Video", "Empty"], file)
+        : checkInterfaceAndAssets(["Video", "Empty"], dataset)
         ? "Video"
-        : checkInterfaceAndsamples(["Audio", "Empty"], file)
+        : checkInterfaceAndAssets(["Audio", "Empty"], dataset)
         ? "Audio"
-        : checkInterfaceAndsamples(["PDF", "Empty"], file)
+        : checkInterfaceAndAssets(["PDF", "Empty"], dataset)
         ? "PDF"
-        : checkInterfaceAndsamples(["Texte", "Empty"], file)
+        : checkInterfaceAndAssets(["Texte", "Empty"], dataset)
         ? "Texte"
         : "None",
     typeOfFileToDisable: {
-      Image: checkInterfaceAndsamples(["Image", "Empty"], file) ? false : true,
-      Video: checkInterfaceAndsamples(["Video", "Empty"], file) ? false : true,
-      Audio: checkInterfaceAndsamples(["Audio", "Empty"], file) ? false : true,
-      PDF: checkInterfaceAndsamples(["PDF", "Empty"], file) ? false : true,
-      Texte: checkInterfaceAndsamples(["Texte", "Empty"], file) ? false : true,
+      Image: checkInterfaceAndAssets(["Image", "Empty"], dataset)
+        ? false
+        : true,
+      Video: checkInterfaceAndAssets(["Video", "Empty"], dataset)
+        ? false
+        : true,
+      Audio: checkInterfaceAndAssets(["Audio", "Empty"], dataset)
+        ? false
+        : true,
+      PDF: checkInterfaceAndAssets(["PDF", "Empty"], dataset) ? false : true,
+      Texte: checkInterfaceAndAssets(["Texte", "Empty"], dataset)
+        ? false
+        : true,
     },
   }
 }
diff --git a/src/components/ImportFromCognitoS3Dialog/set-url.js b/src/components/ImportFromCognitoS3Dialog/set-url.js
new file mode 100644
index 00000000..6e66d52e
--- /dev/null
+++ b/src/components/ImportFromCognitoS3Dialog/set-url.js
@@ -0,0 +1,43 @@
+import RecognizeFileExtension from "../../utils/get-data-url-type"
+const setUrl = (result, configImport) => {
+  if (configImport.loadProjectIsSelected) {
+    if (RecognizeFileExtension(result) === "Image") {
+      return { imageUrl: `${result}` }
+    } else if (RecognizeFileExtension(result) === "Video") {
+      return { videoUrl: `${result}` }
+    } else if (RecognizeFileExtension(result) === "Audio") {
+      return { audioUrl: `${result}` }
+    } else if (RecognizeFileExtension(result) === "PDF") {
+      return { pdfUrl: `${result}` }
+    }
+  } else {
+    if (
+      RecognizeFileExtension(result) === configImport.typeOfFileToLoad &&
+      configImport.typeOfFileToLoad === "Image"
+    ) {
+      return { imageUrl: `${result}` }
+    } else if (
+      RecognizeFileExtension(result) === configImport.typeOfFileToLoad &&
+      configImport.typeOfFileToLoad === "Video"
+    ) {
+      return { videoUrl: `${result}` }
+    } else if (
+      RecognizeFileExtension(result) === configImport.typeOfFileToLoad &&
+      configImport.typeOfFileToLoad === "Audio"
+    ) {
+      return { audioUrl: `${result}` }
+    } else if (
+      RecognizeFileExtension(result) === configImport.typeOfFileToLoad &&
+      configImport.typeOfFileToLoad === "PDF"
+    ) {
+      return { pdfUrl: `${result}` }
+    } else if (
+      RecognizeFileExtension(result) === configImport.typeOfFileToLoad &&
+      configImport.typeOfFileToLoad === "Texte"
+    ) {
+      //var texte = await fetchTextInFile(result)
+      return { document: `Is not supported` /*${texte}`*/ }
+    }
+  }
+}
+export default setUrl
diff --git a/src/components/ImportPage/index.js b/src/components/ImportPage/index.js
index f9265b41..1f578c44 100644
--- a/src/components/ImportPage/index.js
+++ b/src/components/ImportPage/index.js
@@ -289,69 +289,80 @@ export default ({ isDesktop, authConfig, user }) => {
         >
           {t("import-from-coco")}
         </Button>
-
-        <ImportFromCOCODialog
-          open={selectedDialog === "import-from-coco"}
-          onClose={closeDialog}
-          // dataset={dataset}
-          // onChangeDataset={onChangeDataset}
-        />
-        <ImportTextSnippetsDialog
-          open={selectedDialog === "import-text-snippets"}
-          onClose={closeDialog}
-          onAddSamples={onAddSamples}
-        />
-        <PasteUrlsDialog
-          open={selectedDialog === "paste-image-urls"}
-          onClose={closeDialog}
-          onAddSamples={onAddSamples}
-        />
-        <ImportFromS3Dialog
-          open={selectedDialog === "import-from-s3"}
-          // onChangeFile={onChangeFile}
-          onClose={closeDialog}
-          user={user}
-          onAddSamples={onAddSamples}
-        />
-        <UploadToS3Dialog
-          open={selectedDialog === "upload-to-s3"}
-          // onChangeFile={onChangeFile}
-          onClose={closeDialog}
-          user={user}
-          onAddSamples={onAddSamples}
-        />
-
-        <ExportToCognitoS3Dialog
-          open={selectedDialog === "export-to-cognito-s3"}
-          onClose={closeDialog}
-          onAddSamples={onAddSamples}
-        />
-
-        <ImportFromCognitoS3Dialog
-          open={selectedDialog === "import-from-cognito-s3"}
-          onClose={closeDialog}
-          onAddSamples={onAddSamples}
-        />
-        <ImportFromGoogleDriveDialog
-          open={selectedDialog === "google-drive-file-picker"}
-          onClose={closeDialog}
-          onAddSamples={onAddSamples}
-        />
-        <ImportToyDataset
-          open={selectedDialog === "import-toy-dataset"}
-          onClose={closeDialog}
-          onAddSamples={onAddSamplesAsToyDataset}
-        />
-        <ImportFromYoutubeUrls
-          open={selectedDialog === "youtube-urls"}
-          onClose={closeDialog}
-          onAddSamples={onAddSamples}
-        />
-        <ImportUDTFileDialog
-          open={selectedDialog === "import-csv-json"}
-          onClose={closeDialog}
-          onAddSamples={onAddSamples}
-        />
+        {selectedDialog === "import-from-coco" ? (
+          <ImportFromCOCODialog
+            open={selectedDialog === "import-from-coco"}
+            onClose={closeDialog}
+            // dataset={dataset}
+            // onChangeDataset={onChangeDataset}
+          />
+        ) : selectedDialog === "import-text-snippets" ? (
+          <ImportTextSnippetsDialog
+            open={selectedDialog === "import-text-snippets"}
+            onClose={closeDialog}
+            onAddSamples={onAddSamples}
+          />
+        ) : selectedDialog === "paste-image-urls" ? (
+          <PasteUrlsDialog
+            open={selectedDialog === "paste-image-urls"}
+            onClose={closeDialog}
+            onAddSamples={onAddSamples}
+          />
+        ) : selectedDialog === "import-from-s3" ? (
+          <ImportFromS3Dialog
+            open={selectedDialog === "import-from-s3"}
+            // onChangeFile={onChangeFile}
+            onClose={closeDialog}
+            user={user}
+            onAddSamples={onAddSamples}
+          />
+        ) : selectedDialog === "upload-to-s3" ? (
+          <UploadToS3Dialog
+            open={selectedDialog === "upload-to-s3"}
+            // onChangeFile={onChangeFile}
+            onClose={closeDialog}
+            user={user}
+            onAddSamples={onAddSamples}
+          />
+        ) : selectedDialog === "export-to-cognito-s3" ? (
+          <ExportToCognitoS3Dialog
+            open={selectedDialog === "export-to-cognito-s3"}
+            onClose={closeDialog}
+            onAddSamples={onAddSamples}
+          />
+        ) : selectedDialog === "import-from-cognito-s3" ? (
+          <ImportFromCognitoS3Dialog
+            open={selectedDialog === "import-from-cognito-s3"}
+            onClose={closeDialog}
+            onAddSamples={onAddSamples}
+          />
+        ) : selectedDialog === "google-drive-file-picker" ? (
+          <ImportFromGoogleDriveDialog
+            open={selectedDialog === "google-drive-file-picker"}
+            onClose={closeDialog}
+            onAddSamples={onAddSamples}
+          />
+        ) : selectedDialog === "import-toy-dataset" ? (
+          <ImportToyDataset
+            open={selectedDialog === "import-toy-dataset"}
+            onClose={closeDialog}
+            onAddSamples={onAddSamplesAsToyDataset}
+          />
+        ) : selectedDialog === "youtube-urls" ? (
+          <ImportFromYoutubeUrls
+            open={selectedDialog === "youtube-urls"}
+            onClose={closeDialog}
+            onAddSamples={onAddSamples}
+          />
+        ) : selectedDialog === "import-csv-json" ? (
+          <ImportUDTFileDialog
+            open={selectedDialog === "import-csv-json"}
+            onClose={closeDialog}
+            onAddSamples={onAddSamples}
+          />
+        ) : (
+          <p></p>
+        )}
       </div>
     </SelectDialogContext.Provider>
   )
diff --git a/src/utils/RecognizeFileExtension.js b/src/utils/RecognizeFileExtension.js
deleted file mode 100644
index 91026c5a..00000000
--- a/src/utils/RecognizeFileExtension.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import isEmpty from "lodash/isEmpty"
-export default (UrlOfAFile) => {
-  var typeOfFile = "File"
-  var fileExtension = UrlOfAFile.match(
-    `\\/?([^\\/\\\\&\\?]*\\.([a-zA-Z0-9]*))(\\?|$)`
-  )
-  if (!isEmpty(fileExtension)) {
-    fileExtension = fileExtension[2].toLowerCase()
-  }
-  if (
-    fileExtension === "jpg" ||
-    fileExtension === "jpeg" ||
-    fileExtension === "png" ||
-    fileExtension === "ico" ||
-    fileExtension === "jpe" ||
-    fileExtension === "gif"
-  )
-    typeOfFile = "Image"
-  if (fileExtension === "mp4" || fileExtension === "mkv") typeOfFile = "Video"
-  if (fileExtension === "mp3") typeOfFile = "Audio"
-  if (fileExtension === "pdf") typeOfFile = "PDF"
-  if (fileExtension === "txt") typeOfFile = "Texte"
-  return typeOfFile
-}
diff --git a/src/utils/dataset-helper/get-files-differences.js b/src/utils/dataset-helper/get-files-differences.js
index 744245de..f534ead2 100644
--- a/src/utils/dataset-helper/get-files-differences.js
+++ b/src/utils/dataset-helper/get-files-differences.js
@@ -2,15 +2,13 @@ import isEmpty from "lodash/isEmpty"
 
 export default (objectOfRef, objectToCheck) => {
   var resultSet = {
-    fileName: false,
-    content: {
-      interface: {
-        type: false,
-        labels: false,
-        regionTypesAllowed: false,
-      },
-      samples: false,
+    name: false,
+    interface: {
+      type: false,
+      labels: false,
+      regionTypesAllowed: false,
     },
+    samples: false,
     id: false,
     mode: false,
     any: false,
@@ -20,11 +18,11 @@ export default (objectOfRef, objectToCheck) => {
 
   // Check if the object of reference exist if not return true
   if (isEmpty(objectOfRef)) {
-    resultSet.fileName = true
-    resultSet.content.interface.type = true
-    resultSet.content.interface.labels = true
-    resultSet.content.interface.regionTypesAllowed = true
-    resultSet.content.samples = true
+    resultSet.name = true
+    resultSet.interface.type = true
+    resultSet.interface.labels = true
+    resultSet.interface.regionTypesAllowed = true
+    resultSet.samples = true
     resultSet.id = true
     resultSet.mode = true
     resultSet.any = true
@@ -44,65 +42,59 @@ export default (objectOfRef, objectToCheck) => {
   }
 
   // Check if the content doesn't exist or have change
-  if (!isEmpty(objectToCheck.content)) {
-    if (isEmpty(objectOfRef.content)) {
-      resultSet.content.interface.type = true
-      resultSet.content.interface.labels = true
-      resultSet.content.interface.regionTypesAllowed = true
-      resultSet.content.samples = true
-    } else if (objectToCheck.content !== objectOfRef.content) {
+  if (!isEmpty(objectToCheck)) {
+    if (isEmpty(objectOfRef)) {
+      resultSet.interface.type = true
+      resultSet.interface.labels = true
+      resultSet.interface.regionTypesAllowed = true
+      resultSet.samples = true
+    } else if (objectToCheck !== objectOfRef) {
       //Check if the interface doesn't exist or have change
-      if (!isEmpty(objectToCheck.content.interface)) {
-        if (isEmpty(objectOfRef.content.interface)) {
-          resultSet.content.interface.type = true
-          resultSet.content.interface.labels = true
-          resultSet.content.interface.regionTypesAllowed = true
-        } else if (
-          objectToCheck.content.interface !== objectOfRef.content.interface
-        ) {
+      if (!isEmpty(objectToCheck.interface)) {
+        if (isEmpty(objectOfRef.interface)) {
+          resultSet.interface.type = true
+          resultSet.interface.labels = true
+          resultSet.interface.regionTypesAllowed = true
+        } else if (objectToCheck.interface !== objectOfRef.interface) {
           //Check if the type doesn't exist or have change
-          if (!isEmpty(objectToCheck.content.interface.type)) {
-            if (isEmpty(objectOfRef.content.interface.type)) {
-              resultSet.content.interface.type = true
+          if (!isEmpty(objectToCheck.interface.type)) {
+            if (isEmpty(objectOfRef.interface.type)) {
+              resultSet.interface.type = true
             } else if (
-              objectToCheck.content.interface.type !==
-              objectOfRef.content.interface.type
+              objectToCheck.interface.type !== objectOfRef.interface.type
             ) {
-              resultSet.content.interface.type = true
+              resultSet.interface.type = true
             }
           }
           //Check if the labels doesn't exist or have change
-          if (!isEmpty(objectToCheck.content.interface.labels)) {
-            if (isEmpty(objectOfRef.content.interface.labels)) {
-              resultSet.content.interface.labels = true
+          if (!isEmpty(objectToCheck.interface.labels)) {
+            if (isEmpty(objectOfRef.interface.labels)) {
+              resultSet.interface.labels = true
             } else if (
-              objectToCheck.content.interface.labels !==
-              objectOfRef.content.interface.labels
+              objectToCheck.interface.labels !== objectOfRef.interface.labels
             ) {
-              resultSet.content.interface.labels = true
+              resultSet.interface.labels = true
             }
           }
           //Check if the regionsTypesAllowed doesn't exist or have change
-          if (!isEmpty(objectToCheck.content.interface.regionTypesAllowed)) {
-            if (isEmpty(objectOfRef.content.interface.regionTypesAllowed)) {
-              resultSet.content.interface.regionTypesAllowed = true
+          if (!isEmpty(objectToCheck.interface.regionTypesAllowed)) {
+            if (isEmpty(objectOfRef.interface.regionTypesAllowed)) {
+              resultSet.interface.regionTypesAllowed = true
             } else if (
-              objectToCheck.content.interface.regionTypesAllowed !==
-              objectOfRef.content.interface.regionTypesAllowed
+              objectToCheck.interface.regionTypesAllowed !==
+              objectOfRef.interface.regionTypesAllowed
             ) {
-              resultSet.content.interface.regionTypesAllowed = true
+              resultSet.interface.regionTypesAllowed = true
             }
           }
         }
       }
       //Check if the samples doesn't exist or have change
-      if (!isEmpty(objectToCheck.content.samples)) {
-        if (isEmpty(objectOfRef.content.samples)) {
-          resultSet.content.samples = true
-        } else if (
-          objectToCheck.content.samples !== objectOfRef.content.samples
-        ) {
-          resultSet.content.samples = true
+      if (!isEmpty(objectToCheck.samples)) {
+        if (isEmpty(objectOfRef.samples)) {
+          resultSet.samples = true
+        } else if (objectToCheck.samples !== objectOfRef.samples) {
+          resultSet.samples = true
         }
       }
     }
@@ -114,11 +106,10 @@ export default (objectOfRef, objectToCheck) => {
     else if (objectToCheck.mode !== objectOfRef.mode) resultSet.mode = true
   }
 
-  // Check if the fileName doesn't exist or have change
-  if (!isEmpty(objectToCheck.fileName)) {
-    if (isEmpty(objectOfRef.fileName)) resultSet.fileName = true
-    else if (objectToCheck.fileName !== objectOfRef.fileName)
-      resultSet.fileName = true
+  // Check if the name doesn't exist or have change
+  if (!isEmpty(objectToCheck.name)) {
+    if (isEmpty(objectOfRef.name)) resultSet.name = true
+    else if (objectToCheck.name !== objectOfRef.name) resultSet.name = true
   }
   //Default behavior return false
   return resultSet
diff --git a/src/utils/get-data-url-type.js b/src/utils/get-data-url-type.js
new file mode 100644
index 00000000..01000182
--- /dev/null
+++ b/src/utils/get-data-url-type.js
@@ -0,0 +1,17 @@
+import isEmpty from "lodash/isEmpty"
+import mime from "mime-types"
+export default (UrlOfAFile) => {
+  var typeOfFile = "File"
+  var fileExtension = UrlOfAFile.match(
+    `\\/?([^\\/\\\\&\\?]*\\.([a-zA-Z0-9]*))(\\?|$)`
+  )
+  if (!isEmpty(fileExtension)) {
+    fileExtension = fileExtension[2].toLowerCase()
+  }
+  if (mime.lookup(fileExtension).match("image\\/.*")) typeOfFile = "Image"
+  if (mime.lookup(fileExtension).match("video\\/.*")) typeOfFile = "Video"
+  if (mime.lookup(fileExtension).match("audio\\/.*")) typeOfFile = "Audio"
+  if (mime.lookup(fileExtension).match("application\\/pdf")) typeOfFile = "PDF"
+  if (mime.lookup(fileExtension).match("text\\/.*")) typeOfFile = "Texte"
+  return typeOfFile
+}
diff --git a/yarn.lock b/yarn.lock
index 2804db35..ce72713d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2198,7 +2198,7 @@
     "@aws-sdk/types" "1.0.0-rc.3"
     tslib "^1.8.0"
 
-"@aws-sdk/types@1.0.0-gamma.3", "@aws-sdk/types@^1.0.0-alpha.0":
+"@aws-sdk/types@1.0.0-gamma.3":
   version "1.0.0-gamma.3"
   resolved "https://registry.yarnpkg.com/@aws-sdk/types/-/types-1.0.0-gamma.3.tgz#44d274f874d90b9c658d8cbbcf139d401cbd9dc3"
   integrity sha512-6Zu64X/6I8Y0gO/+J2CGXjYUmYkiI89MX3BEgRcQRh3jUNpKnOm1j4r40w4qsu1QAYxwWJL1M/rjLJPOQPV7zw==
@@ -2208,7 +2208,7 @@
   resolved "https://registry.yarnpkg.com/@aws-sdk/types/-/types-1.0.0-rc.3.tgz#98466080e07244d8f7406cc61ae7918d02b339a2"
   integrity sha512-pKKR2SXG8IHbWcmVgFwLUrHqqqFOEuf5JiQmP7dEBjUXqavzDnqFUY7g9PGuM8928IQqL7IXrRsK7R+VbLgodQ==
 
-"@aws-sdk/types@^1.0.0-rc.1":
+"@aws-sdk/types@^1.0.0-alpha.0", "@aws-sdk/types@^1.0.0-rc.1":
   version "1.0.0-rc.10"
   resolved "https://registry.yarnpkg.com/@aws-sdk/types/-/types-1.0.0-rc.10.tgz#729127fbfac5da1a3368ffe6ec2e90acc9ad69c3"
   integrity sha512-9gwhYnkTNuYZ+etCtM4T8gjpZ0SWSXbzQxY34UjSS+dt3C/UnbX0J22tMahp/9Z1yCa9pihtXrkD+nO2xn7nVQ==
@@ -15028,7 +15028,7 @@ mime-types@2.1.18:
   dependencies:
     mime-db "~1.33.0"
 
-mime-types@^2.1.12, mime-types@~2.1.17, mime-types@~2.1.19, mime-types@~2.1.24:
+mime-types@^2.1.12, mime-types@^2.1.27, mime-types@~2.1.17, mime-types@~2.1.19, mime-types@~2.1.24:
   version "2.1.27"
   resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.27.tgz#47949f98e279ea53119f5722e0f34e529bec009f"
   integrity sha512-JIhqnCasI9yD+SsmkquHBxTSEuZdQX5BuQnS2Vc7puQQQ+8yiP5AY5uWhpdv4YL4VM5c6iliiYWPgJ/nJQLp7w==