feat(admin): display the list of all accounts on the head agency sett…

…ings page
SocialGouv · Sep 5, 2024 · fed6cc8 · fed6cc8
1 parent 7848c5f
commit fed6cc8
Show file tree

Hide file tree

Showing 6 changed files with 128 additions and 25 deletions.
diff --git a/packages/reva-admin-react/cypress/e2e/settings/head-agency.cy.ts b/packages/reva-admin-react/cypress/e2e/settings/head-agency.cy.ts
@@ -74,4 +74,26 @@ context("Head agency settings page", () => {
     cy.get('[data-test="on-site-agencies"]').should("exist");
     cy.get('[data-test="on-site-agency"]').should("not.exist");
   });
+
+  context("on the account list section", () => {
+    it("display all accounts with info details", function () {
+      visitSettings({ informationsJuridiques: "A_JOUR" });
+      cy.wait("@getHeadAgencySettingsInfo");
+      cy.get('[data-test="account-list"] li').should("have.length", 4);
+      cy.get(
+        '[data-test="account-list"] [data-test="account-1"] [data-test="on-site-badge"]',
+      ).should("exist");
+      cy.get(
+        '[data-test="account-list"] [data-test="account-2"] [data-test="remote-badge"]',
+      ).should("exist");
+      cy.get('[data-test="account-list"] [data-test="account-3"]').should(
+        "contain",
+        "Catherine Doe",
+      );
+      cy.get('[data-test="account-list"] [data-test="account-4"]').should(
+        "contain",
+        "[email protected]",
+      );
+    });
+  });
 });
diff --git a/packages/reva-admin-react/cypress/fixtures/account/head-agency-settings.json b/packages/reva-admin-react/cypress/fixtures/account/head-agency-settings.json
@@ -10,23 +10,11 @@
           "FRANCE_METROPOLITAINE"
         ],
         "accounts": [
-          {
-            "id": "e45b3b63-6bf4-4181-801d-51b19c722580",
-            "firstname": "John",
-            "lastname": "Doe",
-            "email": "[email protected]"
-          },
           {
             "id": "8f5fcf2d-ef76-4560-90d0-b151186b1c46",
             "firstname": "Alice",
             "lastname": "Doe",
             "email": "[email protected]"
-          },
-          {
-            "id": "6d1ffe00-a8b5-4f4f-a5ea-d1fe71282ec5",
-            "firstname": "Bob",
-            "lastname": "Joe",
-            "email": "[email protected]"
           }
         ],
         "maisonMereAAP": {
@@ -35,28 +23,63 @@
             {
               "id": "2be04b85-ed75-41fb-9248-97fc178ba664",
               "isRemote": false,
+              "isOnSite": true,
               "isVisibleInCandidateSearchResults": false,
-              "remoteZones": []
+              "remoteZones": [],
+              "accounts": [
+                {
+                  "id": "account-1",
+                  "firstname": "John",
+                  "lastname": "Doe",
+                  "email": "[email protected]"
+                }
+              ]
             },
             {
               "id": "29994a9a-f166-48b9-974f-f3b3dbccda19",
               "isRemote": true,
+              "isOnSite": false,
               "isVisibleInCandidateSearchResults": false,
               "remoteZones": [
                 "FRANCE_METROPOLITAINE"
+              ],
+              "accounts": [
+                {
+                  "id": "account-2",
+                  "firstname": "Alice",
+                  "lastname": "Doe",
+                  "email": "[email protected]"
+                },
+                {
+                  "id": "account-3",
+                  "firstname": "Catherine",
+                  "lastname": "Doe",
+                  "email": "[email protected]"
+                }
               ]
             },
             {
               "id": "fb10a5d2-c081-418b-ab92-5a11314ada84",
               "isRemote": false,
+              "isOnSite": true,
               "isVisibleInCandidateSearchResults": false,
-              "remoteZones": []
+              "remoteZones": [],
+              "accounts": [
+                {
+                  "id": "account-4",
+                  "firstname": "Bob",
+                  "lastname": "Doe",
+                  "email": "[email protected]"
+                }
+              ]
             },
             {
               "id": "513be886-4f99-44d3-8edd-6ba2987dccd0",
               "isRemote": false,
+              "isOnSite": true,
               "isVisibleInCandidateSearchResults": true,
-              "remoteZones": []
+              "remoteZones": [],
+              "accounts": []
             }
           ]
         }

diff --git a/...ettings-v3/_components/agencies-settings-section/HeadAgencySettingsSectionAccountList.tsx b/...ettings-v3/_components/agencies-settings-section/HeadAgencySettingsSectionAccountList.tsx
@@ -0,0 +1,46 @@
+export const HeadAgencySettingsSectionAccountList = ({
+  organisms,
+}: {
+  organisms: {
+    accounts: {
+      id: string;
+      firstname?: string | null;
+      lastname?: string | null;
+      email: string;
+    }[];
+    isRemote: boolean;
+    isOnSite: boolean;
+  }[];
+}) => (
+  <ul data-test="account-list" className="ml-6 mb-8">
+    {organisms.map((organism) =>
+      organism.accounts.map((account) => (
+        <li
+          data-test={account.id}
+          key={account.id}
+          className="flex gap-x-6 py-3 border-neutral-300 border-t last:border-b"
+        >
+          {organism.isRemote && (
+            <i
+              data-test="remote-badge"
+              className="fr-icon-headphone-fill fr-icon--sm"
+            ></i>
+          )}
+          {organism.isOnSite && (
+            <i
+              data-test="on-site-badge"
+              className="fr-icon-home-4-fill fr-icon--sm"
+            ></i>
+          )}
+          <div>
+            <span className="font-bold">
+              {account.firstname} {account.lastname}
+            </span>
+            {" - "}
+            {account.email}
+          </div>
+        </li>
+      )),
+    )}
+  </ul>
+);
diff --git a/.../agencies-settings-v3/_components/agencies-settings-summary/HeadAgencySettingsSummary.tsx b/.../agencies-settings-v3/_components/agencies-settings-summary/HeadAgencySettingsSummary.tsx
@@ -3,15 +3,19 @@ import { AgenciesSettingsSectionOnSite } from "@/app/(aap)/agencies-settings-v3/
 import { SmallNotice } from "@/components/small-notice/SmallNotice";
 import { AgencySettingsSummarySectionRemote } from "@/app/(aap)/agencies-settings-v3/_components/AgencySettingsSummarySectionRemote";
 import { useHeadyAgencySettings } from "@/app/(aap)/agencies-settings-v3/_components/agencies-settings-summary/headAgencySettings.hook";
+import { HeadAgencySettingsSectionAccountList } from "@/app/(aap)/agencies-settings-v3/_components/agencies-settings-section/HeadAgencySettingsSectionAccountList";
 
 export const HeadAgencySettingsSummary = () => {
   const { maisonMereAAP, organism } = useHeadyAgencySettings();
 
-  const isGeneralInformationCompleted =
-    !!maisonMereAAP &&
-    ["A_JOUR", "EN_ATTENTE_DE_VERIFICATION"].includes(
-      maisonMereAAP.statutValidationInformationsJuridiquesMaisonMereAAP,
-    );
+  if (!maisonMereAAP) {
+    return null;
+  }
+
+  const isGeneralInformationCompleted = [
+    "A_JOUR",
+    "EN_ATTENTE_DE_VERIFICATION",
+  ].includes(maisonMereAAP.statutValidationInformationsJuridiquesMaisonMereAAP);
 
   const remoteOrganism = organism?.isRemote
     ? organism
@@ -45,11 +49,17 @@ export const HeadAgencySettingsSummary = () => {
           status="TO_COMPLETE"
           customButtonTitle="Ajouter"
         >
-          <p className="md:w-4/5">
-            Vous avez besoin de collaborer à plusieurs sur la plateforme ?
-            Ajoutez des comptes collaborateurs pour que vos collaborateurs
-            puissent avoir accès à leurs candidatures.
-          </p>
+          {maisonMereAAP.organisms.length > 0 ? (
+            <HeadAgencySettingsSectionAccountList
+              organisms={maisonMereAAP.organisms}
+            />
+          ) : (
+            <p className="ml-10 md:w-4/5">
+              Vous avez besoin de collaborer à plusieurs sur la plateforme ?
+              Ajoutez des comptes collaborateurs pour que vos collaborateurs
+              puissent avoir accès à leurs candidatures.
+            </p>
+          )}
           {!isGeneralInformationCompleted && (
             <SmallNotice>
               Vous pourrez ajouter des comptes collaborateurs une fois que vous

diff --git a/...ap)/agencies-settings-v3/_components/agencies-settings-summary/headAgencySettings.hook.ts b/...ap)/agencies-settings-v3/_components/agencies-settings-summary/headAgencySettings.hook.ts
@@ -27,6 +27,7 @@ const HeadAgencySettingsInfoQuery = graphql(`
             label
             id
             isRemote
+            isOnSite
             isVisibleInCandidateSearchResults
             remoteZones
             accounts {

diff --git a/packages/reva-admin-react/src/components/card/section-card/SectionCard.tsx b/packages/reva-admin-react/src/components/card/section-card/SectionCard.tsx
@@ -53,6 +53,7 @@ export const SectionCard = ({
             <div>{!disabled && badge}</div>
             {hasButton && (
               <Button
+                data-test="action-button"
                 onClick={buttonOnClick}
                 priority={buttonPriority}
                 disabled={disabled}