feat: import/export de configuration (work in progress) (#1837)

SocialGouv · Jan 25, 2024 · b87e2d4 · b87e2d4
1 parent 7b77d37
commit b87e2d4
Show file tree

Hide file tree

Showing 8 changed files with 631 additions and 25 deletions.
diff --git a/dashboard/src/scenes/data-import-export/ImportConfig.tsx b/dashboard/src/scenes/data-import-export/ImportConfig.tsx
diff --git a/dashboard/src/scenes/organisation/view.js b/dashboard/src/scenes/organisation/view.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { FormGroup, Input, Label, Row, Col } from 'reactstrap';
 import { Formik } from 'formik';
 import { toast } from 'react-toastify';
@@ -17,6 +17,7 @@ import { organisationState, userState } from '../../recoil/auth';
 import API, { encryptItem } from '../../services/api';
 import ExportData from '../data-import-export/ExportData';
 import ImportData from '../data-import-export/ImportData';
+import ImportConfig from '../data-import-export/ImportConfig';
 import DownloadExample from '../data-import-export/DownloadExample';
 import useTitle from '../../services/useTitle';
 import DeleteButtonAndConfirmModal from '../../components/DeleteButtonAndConfirmModal';
@@ -47,6 +48,10 @@ const getSettingTitle = (tabId) => {
   return '';
 };
 
+function TabTitle({ children }) {
+  return <h3 className="tw-my-10 tw-flex tw-justify-between tw-text-xl tw-font-extrabold">{children}</h3>;
+}
+
 const View = () => {
   const [organisation, setOrganisation] = useRecoilState(organisationState);
   const user = useRecoilValue(userState);
@@ -158,15 +163,22 @@ const View = () => {
             Passages/rencontres
           </button>
           <hr />
-          <button
-            className={['tw-my-0.5 tw-p-0 tw-text-sm tw-font-semibold', tab === 'export' ? 'tw-text-main' : 'tw-text-zinc-600'].join(' ')}
-            onClick={() => setTab('export')}>
-            Export
-          </button>
           <button
             className={['tw-my-0.5 tw-p-0 tw-text-sm tw-font-semibold', tab === 'import' ? 'tw-text-main' : 'tw-text-zinc-600'].join(' ')}
             onClick={() => setTab('import')}>
-            Import
+            Import de personnes suivies
+          </button>
+          <button
+            className={['tw-my-0.5 tw-p-0 tw-text-sm tw-font-semibold', tab === 'import-configuration' ? 'tw-text-main' : 'tw-text-zinc-600'].join(
+              ' '
+            )}
+            onClick={() => setTab('import-configuration')}>
+            Import de configuration
+          </button>
+          <button
+            className={['tw-my-0.5 tw-p-0 tw-text-sm tw-font-semibold', tab === 'export' ? 'tw-text-main' : 'tw-text-zinc-600'].join(' ')}
+            onClick={() => setTab('export')}>
+            Export des données
           </button>
         </nav>
         <div ref={scrollContainer} className="tw-basis-full tw-overflow-auto tw-py-4 tw-px-6">
@@ -197,7 +209,7 @@ const View = () => {
                 case 'infos':
                   return (
                     <>
-                      <h3 className="tw-my-10 tw-flex tw-justify-between tw-text-xl tw-font-extrabold">Informations générales</h3>
+                      <TabTitle>Informations générales</TabTitle>
                       <Row>
                         <Col md={6}>
                           <FormGroup>
@@ -237,7 +249,7 @@ const View = () => {
                 case 'encryption':
                   return (
                     <>
-                      <h3 className="tw-my-10 tw-flex tw-justify-between tw-text-xl tw-font-extrabold">Chiffrement</h3>
+                      <TabTitle>Chiffrement</TabTitle>
                       <div className="tw-mb-10 tw-flex tw-justify-around">
                         <EncryptionKey isMain />
                       </div>
@@ -254,7 +266,7 @@ const View = () => {
                 case 'reception':
                   return (
                     <>
-                      <h3 className="tw-my-10 tw-flex tw-justify-between tw-text-xl tw-font-extrabold">Accueil de jour</h3>
+                      <TabTitle>Accueil de jour</TabTitle>
                       <div className="tw-flex tw-flex-col">
                         <h4 className="tw-my-8">Activer l'accueil de jour</h4>
                         <FormGroup>
@@ -289,7 +301,7 @@ const View = () => {
                 case 'territories':
                   return (
                     <>
-                      <h3 className="tw-my-10 tw-flex tw-justify-between tw-text-xl tw-font-extrabold">Territoires</h3>
+                      <TabTitle>Territoires</TabTitle>
                       <h4 className="tw-my-8">Activer les territoires</h4>
                       <FormGroup>
                         <div className="tw-ml-5 tw-flex tw-w-4/5 tw-items-baseline">
@@ -322,7 +334,7 @@ const View = () => {
                 case 'rencontres-passages':
                   return (
                     <>
-                      <h3 className="tw-my-10 tw-flex tw-justify-between tw-text-xl tw-font-extrabold">Passages / rencontres</h3>
+                      <TabTitle>Passages / rencontres</TabTitle>
                       <h4 className="tw-my-8">Activer les passages</h4>
                       <FormGroup>
                         <div className="tw-ml-5 tw-flex tw-w-4/5 tw-items-baseline">
@@ -371,7 +383,7 @@ const View = () => {
                 case 'persons':
                   return (
                     <>
-                      <h3 className="tw-my-10 tw-flex tw-justify-between tw-text-xl tw-font-extrabold">Personnes suivies</h3>
+                      <TabTitle>Personnes suivies</TabTitle>
                       {organisation.encryptionEnabled ? (
                         <>
                           <h4 className="tw-my-8">Activer la fonctionnalité Liens familiaux</h4>
@@ -432,7 +444,7 @@ const View = () => {
                 case 'export':
                   return (
                     <>
-                      <h3 className="tw-my-10 tw-flex tw-justify-between tw-text-xl tw-font-extrabold">Exporter des données</h3>
+                      <TabTitle>Exporter des données</TabTitle>
                       <Row>
                         <Col md={10}>
                           <p>Vous pouvez exporter l'ensemble de vos données dans un fichier Excel.</p>
@@ -443,17 +455,26 @@ const View = () => {
                       </div>
                     </>
                   );
+                case 'import-configuration':
+                  return (
+                    <>
+                      <TabTitle>Importer une configuration</TabTitle>
+                      <div>
+                        <ImportConfig scrollContainer={scrollContainer} />
+                      </div>
+                    </>
+                  );
                 case 'import':
                   return (
                     <>
-                      <h3 className="tw-my-10 tw-flex tw-justify-between tw-text-xl tw-font-extrabold">Importer des personnes suivies</h3>
+                      <TabTitle>Importer des personnes suivies</TabTitle>
                       <Row>
                         <Col md={10}>
                           <p>
                             Vous pouvez importer une liste de personnes suivies depuis un fichier Excel. Ce fichier doit avoir quelques
                             caractéristiques:
                           </p>
-                          <ul>
+                          <ul className="tw-mt-4 tw-list-inside tw-list-disc">
                             <li>
                               avoir un onglet dont le nom contient <code>personne</code>
                             </li>

diff --git a/e2e/custom-fields_edit-choice.spec.ts b/e2e/custom-fields_edit-choice.spec.ts
@@ -24,7 +24,7 @@ test("test", async ({ page }) => {
   await test.step("create fields", async () => {
     await page.getByRole("link", { name: "Organisation" }).click();
 
-    await page.getByRole("button", { name: "Personnes suivies" }).click();
+    await page.getByRole("button", { name: "Personnes suivies", exact: true }).click();
     /* personnes infos sociales */
     await page.getByRole("button", { name: "Ajouter un champ" }).nth(0).click();
     await addCustomField(page, "Contrat de travail", "Choix dans une liste", ["CDI merde je me suis trompé", "CDD", "Interim"]);
@@ -142,7 +142,7 @@ test("test", async ({ page }) => {
   await test.step("change choices value", async () => {
     await page.getByRole("link", { name: "Organisation" }).click();
 
-    await page.getByRole("button", { name: "Personnes suivies" }).click();
+    await page.getByRole("button", { name: "Personnes suivies", exact: true }).click();
 
     await page.locator('[data-test-id="Motif\\(s\\) de sortie de file active"]').getByRole("button", { name: "Modifier le champ" }).click();
     await page.getByRole("button", { name: "Modifier le choix Relai vers autre structure" }).click();

diff --git a/e2e/custom-fields_edit.spec.ts b/e2e/custom-fields_edit.spec.ts
@@ -13,7 +13,7 @@ test("test", async ({ page }) => {
   await loginWith(page, "[email protected]");
 
   await page.getByRole("link", { name: "Organisation" }).click();
-  await page.getByRole("button", { name: "Personnes suivies" }).click();
+  await page.getByRole("button", { name: "Personnes suivies", exact: true }).click();
   await page.getByRole("button", { name: "Ajouter un champ" }).nth(1).click();
   await page.getByLabel("Nom").fill("Champ non utilisé");
   await page.getByRole("button", { name: "Enregistrer" }).click();
@@ -48,7 +48,7 @@ test("test", async ({ page }) => {
   await page.getByRole("link", { name: "Organisation" }).click();
   await expect(page).toHaveURL(/http:\/\/localhost:8090\/organisation\/[a-f0-9]{8}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{12}/);
 
-  await page.getByRole("button", { name: "Personnes suivies" }).click();
+  await page.getByRole("button", { name: "Personnes suivies", exact: true }).click();
 
   await page.hover('[data-test-id="Champ utilisé"]');
   await page

diff --git a/e2e/custom-fields_toggle-by-team.spec.ts b/e2e/custom-fields_toggle-by-team.spec.ts
@@ -44,7 +44,7 @@ test("Create custom fields filtered by team", async ({ page }) => {
 
   await page.getByRole("link", { name: "Organisation" }).click();
 
-  await page.getByRole("button", { name: "Personnes suivies" }).click();
+  await page.getByRole("button", { name: "Personnes suivies", exact: true }).click();
 
   await page.getByRole("button", { name: "Ajouter un champ" }).first().click();
   await page.getByRole("dialog").getByLabel("Nom").fill(testPersonSocialField);
@@ -136,7 +136,7 @@ test("Create custom fields filtered by team", async ({ page }) => {
   */
 
   await page.getByRole("link", { name: "Organisation" }).click();
-  await page.getByRole("button", { name: "Personnes suivies" }).click();
+  await page.getByRole("button", { name: "Personnes suivies", exact: true }).click();
 
   await page.hover(`[data-test-id='${testPersonSocialField}']`);
   await page

diff --git a/e2e/documents_organizer.spec.ts b/e2e/documents_organizer.spec.ts
@@ -24,7 +24,7 @@ test("Documents organizer", async ({ page }) => {
   await loginWith(page, "[email protected]");
 
   await page.getByRole("link", { name: "Organisation" }).click();
-  await page.getByRole("button", { name: "Personnes suivies" }).click();
+  await page.getByRole("button", { name: "Personnes suivies", exact: true }).click();
   await page
     .getByLabel(
       /Activer\s+la\s+possibilité\s+d'ajouter\s+des\s+liens\s+familiaux\s+entre\s+personnes\.\s+Un\s+onglet\s+"Famille"\s+sera\s+rajouté\s+dans\s+les\s+personnes,\s+et\s+vous\s+pourrez\s+créer\s+des\s+actions,\s+des\s+commentaires\s+et\s+des\s+documents\s+visibles\s+pour\s+toute\s+la\s+famille\./

diff --git a/e2e/global_encryption-check-all-data-type.spec.ts b/e2e/global_encryption-check-all-data-type.spec.ts
@@ -30,7 +30,7 @@ test("test", async ({ page }) => {
   await page.getByRole("button", { name: "Sauvegarder" }).click();
   await page.getByText("Création réussie !").click();
   await page.getByRole("link", { name: "Organisation" }).click();
-  await page.getByRole("button", { name: "Personnes suivies" }).click();
+  await page.getByRole("button", { name: "Personnes suivies", exact: true }).click();
   await page
     .getByLabel(
       'Activer la possibilité d\'ajouter des liens familiaux entre personnes. Un onglet "Famille" sera rajouté dans les personnes, et vous pourrez créer des actions, des commentaires et des documents visibles pour toute la famille.'

diff --git a/e2e/persons_familles.spec.ts b/e2e/persons_familles.spec.ts
@@ -27,7 +27,7 @@ test("Familles", async ({ page }) => {
 
   await test.step("Enable familles", async () => {
     await page.getByRole("link", { name: "Organisation" }).click();
-    await page.getByRole("button", { name: "Personnes suivies" }).click();
+    await page.getByRole("button", { name: "Personnes suivies", exact: true }).click();
     await page
       .getByLabel(
         /Activer\s+la\s+possibilité\s+d'ajouter\s+des\s+liens\s+familiaux\s+entre\s+personnes\.\s+Un\s+onglet\s+"Famille"\s+sera\s+rajouté\s+dans\s+les\s+personnes,\s+et\s+vous\s+pourrez\s+créer\s+des\s+actions,\s+des\s+commentaires\s+et\s+des\s+documents\s+visibles\s+pour\s+toute\s+la\s+famille\./