(PC-34320)[PRO] fix: Do not reset applied filters when offerer or ven…

…ue loads (since it has already been reseted) to fix flaky test.

pro/cypress/e2e/searchCollectiveOffer.cy.ts

@@ -58,10 +58,7 @@ describe('Search collective offers', () => {
       message: 'I search with the name "' + offerPublished.name + '"',
     })
 
-    cy.findByRole('searchbox', { name: /Nom de l’offre/ }).type(
-      offerPublished.name
-    )
-
+    cy.findByLabelText(/Nom de l’offre/).type(offerPublished.name)
     cy.stepLog({ message: 'I validate my filters' })
     cy.findByText('Rechercher').click()
     cy.wait('@collectiveOffers').its('response.statusCode').should('eq', 200)
@@ -292,7 +289,7 @@ describe('Search collective offers', () => {
     cy.findByLabelText('Format').select('Représentation')
 
     cy.stepLog({ message: 'I search with the name "brouillon"' })
-    cy.findByRole('searchbox', { name: /Nom de l’offre/ }).type('brouillon')
+    cy.findByLabelText(/Nom de l’offre/).type('brouillon', { delay: 0 })
 
     cy.stepLog({ message: 'I search with status "Brouillon"' })
     cy.get('#search-status').click()

pro/src/commons/core/Offers/utils/__specs__/hasSearchFilters.spec.ts

@@ -0,0 +1,60 @@
+import { EacFormat } from 'apiClient/adage'
+import { CollectiveOfferDisplayedStatus } from 'apiClient/v1'
+
+import {
+  CollectiveOfferTypeEnum,
+  CollectiveSearchFiltersParams,
+} from '../../types'
+import { hasCollectiveSearchFilters } from '../hasSearchFilters'
+
+describe('hasSearchFilters', () => {
+  const defaultCollectiveFilters: CollectiveSearchFiltersParams = {
+    collectiveOfferType: CollectiveOfferTypeEnum.ALL,
+    format: 'all',
+    nameOrIsbn: '',
+    offererId: '333',
+    page: 1,
+    periodBeginningDate: '',
+    periodEndingDate: '',
+    status: [],
+    venueId: '',
+  }
+
+  it('should confirm whether collective filters are applied or not', () => {
+    expect(
+      hasCollectiveSearchFilters(defaultCollectiveFilters, {
+        ...defaultCollectiveFilters,
+      })
+    ).toBeFalsy()
+
+    expect(
+      hasCollectiveSearchFilters(defaultCollectiveFilters, {
+        ...defaultCollectiveFilters,
+        format: EacFormat.ATELIER_DE_PRATIQUE,
+      })
+    ).toBeTruthy()
+
+    expect(
+      hasCollectiveSearchFilters(defaultCollectiveFilters, {
+        ...defaultCollectiveFilters,
+        status: [CollectiveOfferDisplayedStatus.ACTIVE],
+      })
+    ).toBeTruthy()
+  })
+
+  it('should ignore the page number and offerer id', () => {
+    expect(
+      hasCollectiveSearchFilters(defaultCollectiveFilters, {
+        ...defaultCollectiveFilters,
+        page: 10,
+      })
+    ).toBeFalsy()
+
+    expect(
+      hasCollectiveSearchFilters(defaultCollectiveFilters, {
+        ...defaultCollectiveFilters,
+        offererId: '816',
+      })
+    ).toBeFalsy()
+  })
+})

pro/src/commons/core/Offers/utils/hasSearchFilters.ts

@@ -28,6 +28,14 @@ export const hasCollectiveSearchFilters = (
       searchFilters[filterName] &&
       filterName !== 'offererId' &&
       filterName !== 'page' &&
-      searchFilters[filterName] !== { ...defaultFilters }[filterName]
+      ((['string', 'number'].includes(typeof searchFilters[filterName]) &&
+        searchFilters[filterName] !== { ...defaultFilters }[filterName]) ||
+        (Array.isArray(searchFilters[filterName]) &&
+          Array.isArray(defaultFilters[filterName]) &&
+          !isSameArray(searchFilters[filterName], defaultFilters[filterName])))
   )
 }
+
+function isSameArray(arr1: unknown[], arr2: unknown[]) {
+  return arr1.length === arr2.length && arr1.every((el) => arr2.includes(el))
+}

pro/src/components/OffersTable/OffersTableSearch/OffersTableSearch.module.scss

@@ -29,18 +29,8 @@
     }
   }
 
-  &-reset {
-    &-wrapper {
-      flex-direction: column;
-      margin-top: rem.torem(8px);
-    }
-
-    &-button {
-      min-height: size.$input-min-height;
-      margin-top: 0;
-      display: block;
-      text-align: left;
-    }
+  &-reset-wrapper {
+    margin-top: rem.torem(8px);
   }
 
   &-separator {
@@ -60,4 +50,4 @@
 
 .visually-hidden {
   @include a11y.visually-hidden;
-}
+}

pro/src/pages/CollectiveOffers/CollectiveOffers.tsx

@@ -61,7 +61,11 @@ export const CollectiveOffers = (): JSX.Element => {
   )
   const offerer = offererQuery.data
 
-  const { data } = useSWR(
+  const {
+    data,
+    isLoading: isVenuesLoading,
+    isValidating: isVenuesValidating,
+  } = useSWR(
     [GET_VENUES_QUERY_KEY, offerer?.id],
     ([, offererIdParam]) => api.getVenues(null, null, offererIdParam),
     { fallbackData: { venues: [] } }
@@ -138,7 +142,10 @@ export const CollectiveOffers = (): JSX.Element => {
     <Layout mainHeading="Offres collectives">
       {/* When the venues are cached for a given offerer, we still need to reset the Screen component.
       SWR isLoading is only true when the data is not cached, while isValidating is always set to true when the key is updated */}
-      {offererQuery.isLoading || offererQuery.isValidating ? (
+      {offererQuery.isLoading ||
+      offererQuery.isValidating ||
+      isVenuesLoading ||
+      isVenuesValidating ? (
         <Spinner />
       ) : (
         <CollectiveOffersScreen

pro/src/pages/CollectiveOffers/components/CollectiveOffersScreen/CollectiveOffersScreen.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react'
+import { useState } from 'react'
 
 import {
   CollectiveOfferResponseModel,
@@ -68,10 +68,6 @@ export const CollectiveOffersScreen = ({
   >([])
   const [selectedFilters, setSelectedFilters] = useState(initialSearchFilters)
 
-  useEffect(() => {
-    setSelectedFilters(initialSearchFilters)
-  }, [initialSearchFilters])
-
   const defaultCollectiveFilters = useDefaultCollectiveSearchFilters()
 
   const currentPageOffersSubset = offers.slice(
@@ -85,6 +81,7 @@ export const CollectiveOffersScreen = ({
     initialSearchFilters,
     defaultCollectiveFilters
   )
+
   const userHasNoOffers = !isLoading && !hasOffers && !hasFilters
 
   const areAllOffersSelected =
@@ -134,6 +131,7 @@ export const CollectiveOffersScreen = ({
   const resetFilters = () => {
     onResetFilters()
     applyUrlFiltersAndRedirect(defaultCollectiveFilters)
+    setSelectedFilters(defaultCollectiveFilters)
   }
 
   function onSetSelectedOffer(offer: CollectiveOfferResponseModel) {