Merge pull request #1556 from SocialGouv/feat/us-3079-pilotage-action…

…s-tri-realisation

Feat/us 3079 pilotage actions tri realisation

components/pilotage/OngletActionsPilotage.tsx

@@ -46,7 +46,9 @@ export default function OngletActionsPilotage({
     useState<MetadonneesPagination>(metadonneesInitiales)
 
   const [page, setPage] = useState<number>(1)
-  const [tri, setTri] = useState<TriActionsAQualifier>()
+  const [tri, setTri] = useState<TriActionsAQualifier>(
+    'REALISATION_CHRONOLOGIQUE'
+  )
   const [filtres, setFiltres] = useState<string[]>([])
   const [erreurQualification, setErreurQualification] = useState<
     string | undefined

components/pilotage/TableauActionsAQualifier.tsx

@@ -24,7 +24,7 @@ import { TriActionsAQualifier } from 'services/actions.service'
 type TableauActionsConseillerProps = {
   categories: SituationNonProfessionnelle[]
   actionsFiltrees: ActionPilotage[]
-  tri: TriActionsAQualifier | undefined
+  tri: TriActionsAQualifier
   onTri: (tri: TriActionsAQualifier) => void
   onFiltres: (categories: string[]) => void
   onLienExterne: (label: string) => void
@@ -69,7 +69,19 @@ export default function TableauActionsAQualifier({
     plusieursBeneficiairesSelectionnes
 
   function inverserTriBeneficiaires() {
-    const nouvelOrdre = tri === 'ALPHABETIQUE' ? 'INVERSE' : 'ALPHABETIQUE'
+    const nouvelOrdre =
+      tri === 'BENEFICIAIRE_ALPHABETIQUE'
+        ? 'BENEFICIAIRE_INVERSE'
+        : 'BENEFICIAIRE_ALPHABETIQUE'
+    onTri(nouvelOrdre)
+    setActionsSelectionnees([])
+  }
+
+  function inverserTriDateRealisation() {
+    const nouvelOrdre =
+      tri === 'REALISATION_CHRONOLOGIQUE'
+        ? 'REALISATION_ANTICHRONOLOGIQUE'
+        : 'REALISATION_CHRONOLOGIQUE'
     onTri(nouvelOrdre)
     setActionsSelectionnees([])
   }
@@ -246,18 +258,21 @@ export default function TableauActionsAQualifier({
                 <button
                   className='flex border-none items-center w-full h-full p-4'
                   onClick={inverserTriBeneficiaires}
-                  aria-label={`Afficher la liste des bénéficiaires triée par noms de famille par ordre alphabétique ${
-                    tri === 'ALPHABETIQUE' ? 'inversé' : ''
+                  aria-label={`Afficher la liste des actions triées par bénéficiaire par ordre alphabétique${
+                    tri === 'BENEFICIAIRE_ALPHABETIQUE' ? ' inversé' : ''
                   }`}
-                  title={`Afficher la liste des bénéficiaires triée par noms de famille par ordre alphabétique ${
-                    tri === 'ALPHABETIQUE' ? 'inversé' : ''
+                  title={`Afficher la liste des actions triées par bénéficiaire par ordre alphabétique${
+                    tri === 'BENEFICIAIRE_ALPHABETIQUE' ? ' inversé' : ''
                   }`}
                   type='button'
                 >
                   Bénéficiaire
                   <SortIcon
-                    isSorted={tri !== undefined}
-                    isDesc={tri === 'INVERSE'}
+                    isSorted={
+                      tri === 'BENEFICIAIRE_ALPHABETIQUE' ||
+                      tri === 'BENEFICIAIRE_INVERSE'
+                    }
+                    isDesc={tri === 'BENEFICIAIRE_INVERSE'}
                   />
                 </button>
               </TH>
@@ -271,7 +286,32 @@ export default function TableauActionsAQualifier({
                   onFiltres={filtrerActionsParCategorie}
                 />
               </TH>
-              <TH>Date de réalisation</TH>
+              <TH estCliquable={true}>
+                <button
+                  className='flex border-none items-center w-full h-full p-4'
+                  onClick={inverserTriDateRealisation}
+                  aria-label={`Afficher la liste des actions triées par date de réalisation ${
+                    tri === 'REALISATION_ANTICHRONOLOGIQUE'
+                      ? 'croissante'
+                      : 'décroissante'
+                  }`}
+                  title={`Afficher la liste des actions triées par date de réalisation ${
+                    tri === 'REALISATION_ANTICHRONOLOGIQUE'
+                      ? 'croissante'
+                      : 'décroissante'
+                  }`}
+                  type='button'
+                >
+                  Date de réalisation
+                  <SortIcon
+                    isSorted={
+                      tri === 'REALISATION_CHRONOLOGIQUE' ||
+                      tri === 'REALISATION_ANTICHRONOLOGIQUE'
+                    }
+                    isDesc={tri === 'REALISATION_ANTICHRONOLOGIQUE'}
+                  />
+                </button>
+              </TH>
               <TH>Voir le détail</TH>
             </TR>
           </thead>

services/actions.service.ts

@@ -130,7 +130,11 @@ export async function getActionsAQualifierServerSide(
   actions: ActionPilotage[]
   metadonnees: MetadonneesPagination
 }> {
-  return getActionsAQualifier(idConseiller, { page: 1 }, accessToken)
+  return getActionsAQualifier(
+    idConseiller,
+    { page: 1, tri: 'REALISATION_CHRONOLOGIQUE' },
+    accessToken
+  )
 }
 
 export async function creerAction(
@@ -280,7 +284,12 @@ async function getActionsBeneficiaire(
   }
 }
 
-export type TriActionsAQualifier = 'ALPHABETIQUE' | 'INVERSE'
+export type TriActionsAQualifier =
+  | 'BENEFICIAIRE_ALPHABETIQUE'
+  | 'BENEFICIAIRE_INVERSE'
+  | 'REALISATION_CHRONOLOGIQUE'
+  | 'REALISATION_ANTICHRONOLOGIQUE'
+
 async function getActionsAQualifier(
   idConseiller: string,
   {
@@ -302,18 +311,10 @@ async function getActionsAQualifier(
     aQualifier: 'true',
   })
 
-  if (tri) {
-    queryParams.append(
-      'tri',
-      tri === 'ALPHABETIQUE'
-        ? 'BENEFICIAIRE_ALPHABETIQUE'
-        : 'BENEFICIAIRE_INVERSE'
-    )
-  }
+  if (tri) queryParams.append('tri', tri)
 
-  if (filtres) {
+  if (filtres)
     filtres.forEach((filtre) => queryParams.append('codesCategories', filtre))
-  }
 
   const {
     content: { pagination, resultats },

tests/pages/pilotage/PilotagePage.actions.test.tsx

@@ -171,43 +171,72 @@ describe('PilotagePage client side - Actions', () => {
       //When
       await userEvent.click(
         screen.getByRole('button', {
-          name: 'Afficher la liste des bénéficiaires triée par noms de famille par ordre alphabétique',
+          name: 'Afficher la liste des actions triées par bénéficiaire par ordre alphabétique',
         })
       )
 
       // Then
       expect(getActionsAQualifierClientSide).toHaveBeenCalledWith('1', {
         page: 1,
-        tri: 'ALPHABETIQUE',
+        tri: 'BENEFICIAIRE_ALPHABETIQUE',
         filtres: [],
       })
       expect(
-        screen.getByText('Action page 1 ALPHABETIQUE 0filtres')
+        screen.getByText('Action page 1 BENEFICIAIRE_ALPHABETIQUE 0filtres')
       ).toBeInTheDocument()
     })
 
     it('permet de trier les actions par nom du bénéficiaire par ordre alphabétique inversé', async () => {
       //When
       await userEvent.click(
         screen.getByRole('button', {
-          name: 'Afficher la liste des bénéficiaires triée par noms de famille par ordre alphabétique',
+          name: 'Afficher la liste des actions triées par bénéficiaire par ordre alphabétique',
         })
       )
 
       await userEvent.click(
         screen.getByRole('button', {
-          name: 'Afficher la liste des bénéficiaires triée par noms de famille par ordre alphabétique inversé',
+          name: 'Afficher la liste des actions triées par bénéficiaire par ordre alphabétique inversé',
         })
       )
 
       // Then
       expect(getActionsAQualifierClientSide).toHaveBeenCalledWith('1', {
         page: 1,
-        tri: 'INVERSE',
+        tri: 'BENEFICIAIRE_INVERSE',
         filtres: [],
       })
       expect(
-        screen.getByText('Action page 1 INVERSE 0filtres')
+        screen.getByText('Action page 1 BENEFICIAIRE_INVERSE 0filtres')
+      ).toBeInTheDocument()
+    })
+    it('permet de trier les actions par date de réalisation', async () => {
+      await userEvent.click(
+        screen.getByRole('button', {
+          name: 'Afficher la liste des actions triées par date de réalisation décroissante',
+        })
+      )
+      expect(getActionsAQualifierClientSide).toHaveBeenCalledWith('1', {
+        page: 1,
+        tri: 'REALISATION_ANTICHRONOLOGIQUE',
+        filtres: [],
+      })
+      expect(
+        screen.getByText('Action page 1 REALISATION_ANTICHRONOLOGIQUE 0filtres')
+      ).toBeInTheDocument()
+
+      await userEvent.click(
+        screen.getByRole('button', {
+          name: 'Afficher la liste des actions triées par date de réalisation croissante',
+        })
+      )
+      expect(getActionsAQualifierClientSide).toHaveBeenCalledWith('1', {
+        page: 1,
+        tri: 'REALISATION_CHRONOLOGIQUE',
+        filtres: [],
+      })
+      expect(
+        screen.getByText('Action page 1 REALISATION_CHRONOLOGIQUE 0filtres')
       ).toBeInTheDocument()
     })
 
@@ -216,7 +245,7 @@ describe('PilotagePage client side - Actions', () => {
         // Given
         await userEvent.click(
           screen.getByRole('button', {
-            name: 'Afficher la liste des bénéficiaires triée par noms de famille par ordre alphabétique',
+            name: 'Afficher la liste des actions triées par bénéficiaire par ordre alphabétique',
           })
         )
         await userEvent.click(screen.getByLabelText('Page 2'))
@@ -246,11 +275,11 @@ describe('PilotagePage client side - Actions', () => {
         // Then
         expect(getActionsAQualifierClientSide).toHaveBeenCalledWith('1', {
           page: 1,
-          tri: 'ALPHABETIQUE',
+          tri: 'BENEFICIAIRE_ALPHABETIQUE',
           filtres: ['SNP_1', 'SNP_2'],
         })
         expect(
-          screen.getByText('Action page 1 ALPHABETIQUE 2filtres')
+          screen.getByText('Action page 1 BENEFICIAIRE_ALPHABETIQUE 2filtres')
         ).toBeInTheDocument()
       })
 
@@ -261,11 +290,11 @@ describe('PilotagePage client side - Actions', () => {
         // Then
         expect(getActionsAQualifierClientSide).toHaveBeenCalledWith('1', {
           page: 2,
-          tri: 'ALPHABETIQUE',
+          tri: 'BENEFICIAIRE_ALPHABETIQUE',
           filtres: ['SNP_1', 'SNP_2'],
         })
         expect(
-          screen.getByText('Action page 2 ALPHABETIQUE 2filtres')
+          screen.getByText('Action page 2 BENEFICIAIRE_ALPHABETIQUE 2filtres')
         ).toBeInTheDocument()
       })
     })
@@ -274,7 +303,7 @@ describe('PilotagePage client side - Actions', () => {
       // When
       await userEvent.click(
         screen.getByRole('button', {
-          name: 'Afficher la liste des bénéficiaires triée par noms de famille par ordre alphabétique',
+          name: 'Afficher la liste des actions triées par bénéficiaire par ordre alphabétique',
         })
       )
       await userEvent.click(screen.getByText('Catégorie'))
@@ -289,11 +318,11 @@ describe('PilotagePage client side - Actions', () => {
       // Then
       expect(getActionsAQualifierClientSide).toHaveBeenCalledWith('1', {
         page: 2,
-        tri: 'ALPHABETIQUE',
+        tri: 'BENEFICIAIRE_ALPHABETIQUE',
         filtres: ['SNP_1'],
       })
       expect(
-        screen.getByText('Action page 2 ALPHABETIQUE 1filtres')
+        screen.getByText('Action page 2 BENEFICIAIRE_ALPHABETIQUE 1filtres')
       ).toBeInTheDocument()
     })
 

tests/services/actions.service.test.ts

@@ -451,7 +451,7 @@ describe('ActionsApiService', () => {
   })
 
   describe('.getActionsAQualifierClientSide', () => {
-    it('renvoie les actions du conseiller à qualifier', async () => {
+    it('renvoie les actions du conseiller à qualifier triées par bénéficiaire', async () => {
       // GIVEN
       ;(apiGet as jest.Mock).mockResolvedValue({
         content: {
@@ -463,7 +463,7 @@ describe('ActionsApiService', () => {
       // WHEN
       const actual = await getActionsAQualifierClientSide('whatever', {
         page: 1,
-        tri: 'ALPHABETIQUE',
+        tri: 'BENEFICIAIRE_ALPHABETIQUE',
         filtres: ['SANTE', 'EMPLOI'],
       })
 
@@ -477,6 +477,33 @@ describe('ActionsApiService', () => {
         metadonnees: { nombrePages: 1, nombreTotal: 5 },
       })
     })
+
+    it('renvoie les actions du conseiller à qualifier triées par date de réalisation', async () => {
+      // GIVEN
+      ;(apiGet as jest.Mock).mockResolvedValue({
+        content: {
+          resultats: uneListeDActionsAQualifierJson(),
+          pagination: { total: 5, limit: 10 },
+        },
+      })
+
+      // WHEN
+      const actual = await getActionsAQualifierClientSide('whatever', {
+        page: 1,
+        tri: 'REALISATION_ANTICHRONOLOGIQUE',
+        filtres: ['SANTE', 'EMPLOI'],
+      })
+
+      // THEN
+      expect(apiGet).toHaveBeenCalledWith(
+        '/v2/conseillers/whatever/actions?page=1&aQualifier=true&tri=REALISATION_ANTICHRONOLOGIQUE&codesCategories=SANTE&codesCategories=EMPLOI',
+        'accessToken'
+      )
+      expect(actual).toStrictEqual({
+        actions: uneListeDActionsAQualifier(),
+        metadonnees: { nombrePages: 1, nombreTotal: 5 },
+      })
+    })
   })
 
   describe('.getActionsAQualifierServerSide', () => {
@@ -497,7 +524,7 @@ describe('ActionsApiService', () => {
 
       // THEN
       expect(apiGet).toHaveBeenCalledWith(
-        '/v2/conseillers/whatever/actions?page=1&aQualifier=true',
+        '/v2/conseillers/whatever/actions?page=1&aQualifier=true&tri=REALISATION_CHRONOLOGIQUE',
         'accessToken'
       )
       expect(actual).toStrictEqual({