(PC-33068) feat(Localization): Partout and Me localiser become France…

… entière (#7260) * (PC-33068) feat(Localisation): 'Partout' and 'Me localiser' become 'France entière' * (BSR): remove duplicated code * (PC-33608) refactor(LocationLabel): use Enum * (BSR): remove duplicated code
pass-culture · Nov 29, 2024 · 9e52b4c · 9e52b4c
1 parent 4a19556
commit 9e52b4c
Show file tree

Hide file tree

Showing 21 changed files with 349 additions and 398 deletions.
diff --git a/.maestro/tests/subFolder/cloud/commands/SetLocalizationToEverywhere.yml b/.maestro/tests/subFolder/cloud/commands/SetLocalizationToEverywhere.yml
@@ -2,10 +2,10 @@ appId: ${MAESTRO_APP_ID}
 ---
 - runFlow:
     when:
-      visible: "Paris"
+      visible: 'Paris'
     commands:
-      - tapOn: "Paris"
-      - tapOn: "Choisir une localisation"
-      - inputText: "Paris"
+      - tapOn: 'Paris'
+      - tapOn: 'Choisir une localisation'
+      - inputText: 'Paris'
       - hideKeyboard
-      - tapOn: "Partout"
+      - tapOn: 'France entière'
diff --git a/.maestro/tests/subFolder/search/SearchBookablePhysicalOffer.yml b/.maestro/tests/subFolder/search/SearchBookablePhysicalOffer.yml
@@ -3,14 +3,14 @@ appId: ${MAESTRO_APP_ID}
 - assertVisible: 'Rechercher'
 - tapOn: 'Livres'
 
-- tapOn: "Romans & littérature"
+- tapOn: 'Romans & littérature'
 
 - runFlow:
     when:
       visible: 'Ma position'
     commands:
       - tapOn: 'Ma position'
-      - tapOn: 'Partout'
+      - tapOn: 'France entière'
 
 - tapOn: 'Catégories'
 

diff --git a/.maestro/tests/subFolder/search/SearchOfferFromText.yml b/.maestro/tests/subFolder/search/SearchOfferFromText.yml
@@ -7,37 +7,36 @@ appId: ${MAESTRO_APP_ID}
       visible: 'Ma position'
     commands:
       - tapOn: 'Ma position'
-      - tapOn: 'Partout'
+      - tapOn: 'France entière'
 
-- tapOn: "Offre, artiste, lieu culturel..."
+- tapOn: 'Offre, artiste, lieu culturel...'
 
-- inputText: "Les coulisses du Stade de France"
+- inputText: 'Les coulisses du Stade de France'
 - pressKey: Enter
 
 - tapOn:
-    id: "Voir tous les filtres"
-- tapOn: "Prix"
-- tapOn: "300"
-- inputText: "50"
+    id: 'Voir tous les filtres'
+- tapOn: 'Prix'
+- tapOn: '300'
+- inputText: '50'
 - pressKey: Enter
-- tapOn: "Appliquer le filtre"
+- tapOn: 'Appliquer le filtre'
 
-- tapOn: "Accessibilité"
+- tapOn: 'Accessibilité'
 
-- tapOn: "Appliquer le filtre"
+- tapOn: 'Appliquer le filtre'
 
-- tapOn: "Rechercher"
+- tapOn: 'Rechercher'
 
 - runFlow:
     when:
-      notVisible: "Les coulisses du Stade de France"
+      notVisible: 'Les coulisses du Stade de France'
     commands:
-    - swipe: 
-        from:
-          text: Les offres
-        direction: UP
+      - swipe:
+          from:
+            text: Les offres
+          direction: UP
 
 - tapOn:
-    text: "Les coulisses du Stade de France"
+    text: 'Les coulisses du Stade de France'
     index: 1
-
diff --git a/__snapshots__/features/location/components/HomeLocationModal.native.test.tsx.native-snap b/__snapshots__/features/location/components/HomeLocationModal.native.test.tsx.native-snap
@@ -711,7 +711,7 @@ exports[`HomeLocationModal should render correctly if modal visible 1`] = `
                       ]
                     }
                   >
-                    Partout
+                    France entière
                   </Text>
                 </View>
               </View>

diff --git a/__snapshots__/features/location/components/SearchLocationModal.native.test.tsx.native-snap b/__snapshots__/features/location/components/SearchLocationModal.native.test.tsx.native-snap
@@ -712,7 +712,7 @@ exports[`SearchLocationModal should render correctly if modal visible 1`] = `
                       ]
                     }
                   >
-                    Partout
+                    France entière
                   </Text>
                 </View>
               </View>

diff --git a/...__/features/search/pages/Search/ThematicSearch/ThematicSearch.native.test.tsx.native-snap b/...__/features/search/pages/Search/ThematicSearch/ThematicSearch.native.test.tsx.native-snap
@@ -468,7 +468,7 @@ exports[`<ThematicSearch/> book offerCategory should render <ThematicSearch /> 1
                         ]
                       }
                     >
-                      Me localiser
+                      France entière
                     </Text>
                   </View>
                   <Modal

diff --git a/...apshots__/features/search/pages/ThematicSearch/ThematicSearch.native.test.tsx.native-snap b/...apshots__/features/search/pages/ThematicSearch/ThematicSearch.native.test.tsx.native-snap
@@ -468,7 +468,7 @@ exports[`<ThematicSearch/> book offerCategory should render <ThematicSearch /> 1
                         ]
                       }
                     >
-                      Me localiser
+                      France entière
                     </Text>
                   </View>
                   <Modal

diff --git a/src/features/home/components/headers/HomeHeader.native.test.tsx b/src/features/home/components/headers/HomeHeader.native.test.tsx
@@ -12,6 +12,7 @@ import {
 import * as Auth from 'features/auth/context/AuthContext'
 import { nonBeneficiaryUser } from 'fixtures/user'
 import * as useFeatureFlagAPI from 'libs/firebase/firestore/featureFlags/useFeatureFlag'
+import { LocationLabel } from 'libs/location/types'
 import { Credit, useAvailableCredit } from 'shared/user/useAvailableCredit'
 import { mockServer } from 'tests/mswServer'
 import { reactQueryProviderHOC } from 'tests/reactQueryProviderHOC'
@@ -96,7 +97,7 @@ describe('HomeHeader', () => {
 
     await screen.findByTestId('Ouvrir la modale de localisation depuis le widget')
 
-    expect(screen.getByText('Me localiser')).toBeTruthy()
+    expect(screen.getByText(LocationLabel.everywhereLabel)).toBeTruthy()
   })
 
   it('should not show LocationWidget isDesktopViewport is true', async () => {

diff --git a/src/features/internal/marketingAndCommunication/atoms/LocationFilterChoice.native.test.tsx b/src/features/internal/marketingAndCommunication/atoms/LocationFilterChoice.native.test.tsx
@@ -1,15 +1,15 @@
 import React from 'react'
 
 import { LocationFilterChoice } from 'features/internal/marketingAndCommunication/atoms/LocationFilterChoice'
-import { LocationMode } from 'libs/location/types'
+import { LocationLabel, LocationMode } from 'libs/location/types'
 import { render, fireEvent, screen } from 'tests/utils'
 
 describe('<LocationFilterChoice />', () => {
   it('should call onChange with LocationMode.AROUND_ME or EVERYWHERE', () => {
     const onChange = jest.fn()
     render(<LocationFilterChoice onChange={onChange} />)
 
-    fireEvent.press(screen.getByText('Partout'))
+    fireEvent.press(screen.getByText(LocationLabel.everywhereLabel))
 
     expect(onChange).toHaveBeenNthCalledWith(1, {
       locationType: LocationMode.EVERYWHERE,

diff --git a/src/features/internal/marketingAndCommunication/atoms/LocationFilterChoice.tsx b/src/features/internal/marketingAndCommunication/atoms/LocationFilterChoice.tsx
@@ -2,7 +2,7 @@ import React, { useCallback, useState } from 'react'
 
 import { LocationChoice } from 'features/search/components/LocationChoice'
 import { LocationFilter } from 'features/search/types'
-import { LocationMode } from 'libs/location/types'
+import { LocationLabel, LocationMode } from 'libs/location/types'
 import { Li } from 'ui/components/Li'
 import { VerticalUl } from 'ui/components/Ul'
 import { BicolorEverywhere as Everywhere } from 'ui/svg/icons/BicolorEverywhere'
@@ -25,7 +25,7 @@ export const LocationFilterChoice = ({ onChange }: Props) => {
       <Li>
         <Spacer.Column numberOfSpaces={4} />
         <LocationChoice
-          label="Partout"
+          label={LocationLabel.everywhereLabel}
           Icon={Everywhere}
           onPress={onPressEverywhere}
           isSelected={LocationMode.EVERYWHERE === selected}

diff --git a/src/features/location/components/HomeLocationModal.tsx b/src/features/location/components/HomeLocationModal.tsx
@@ -1,36 +1,21 @@
 import React from 'react'
-import { useTheme } from 'styled-components'
-import styled from 'styled-components/native'
 
-import { LocationModalButton } from 'features/location/components/LocationModalButton'
-import { LocationModalFooter } from 'features/location/components/LocationModalFooter'
-import { LOCATION_PLACEHOLDER } from 'features/location/constants'
+import { LocationModal } from 'features/location/components/LocationModal'
 import { useLocationMode } from 'features/location/helpers/useLocationMode'
 import { useLocationState } from 'features/location/helpers/useLocationState'
 import { analytics } from 'libs/analytics'
-import { LocationMode } from 'libs/location/types'
-import { LocationSearchInput } from 'shared/location/LocationSearchInput'
-import { AppModal } from 'ui/components/modals/AppModal'
-import { ModalHeader } from 'ui/components/modals/ModalHeader'
-import { Separator } from 'ui/components/Separator'
-import { Spacer } from 'ui/components/spacer/Spacer'
-import { Close } from 'ui/svg/icons/Close'
-import { MagnifyingGlassFilled } from 'ui/svg/icons/MagnifyingGlassFilled'
-import { PositionFilled } from 'ui/svg/icons/PositionFilled'
-import { WorldPosition } from 'ui/svg/icons/WorldPosition'
-import { getSpacing } from 'ui/theme'
 
-interface LocationModalProps {
+interface HomeLocationModalProps {
   visible: boolean
   dismissModal: () => void
 }
 
-export const HomeLocationModal = ({ visible, dismissModal }: LocationModalProps) => {
+export const HomeLocationModal = ({ visible, dismissModal }: HomeLocationModalProps) => {
   const locationStateProps = useLocationState({
     visible,
   })
 
-  const onSubmitPlace = () => {
+  const onSubmit = () => {
     setPlaceGlobally(selectedPlace)
     setSelectedLocationMode(tempLocationMode)
     analytics.logUserSetLocation('home')
@@ -54,100 +39,33 @@ export const HomeLocationModal = ({ visible, dismissModal }: LocationModalProps)
     setSelectedLocationMode,
     onSetSelectedPlace,
   } = locationStateProps
+
   const { selectLocationMode } = useLocationMode({
     dismissModal,
-    onSubmit: onSubmitPlace,
+    onSubmit,
     onClose,
     shouldDirectlyValidate: true,
     ...locationStateProps,
   })
 
-  const isCurrentLocationMode = (target: LocationMode) => tempLocationMode === target
-
-  const theme = useTheme()
-
-  const geolocationModeColor = isCurrentLocationMode(LocationMode.AROUND_ME)
-    ? theme.colors.primary
-    : theme.colors.black
-
-  const customLocationModeColor = isCurrentLocationMode(LocationMode.AROUND_PLACE)
-    ? theme.colors.primary
-    : theme.colors.black
-
-  const everywhereLocationModeColor = isCurrentLocationMode(LocationMode.EVERYWHERE)
-    ? theme.colors.primary
-    : theme.colors.black
-
   return (
-    <AppModal
+    <LocationModal
       visible={visible}
-      title=""
-      noPadding
-      isUpToStatusBar
-      scrollEnabled={false}
-      onModalHide={onModalHideRef.current}
-      keyboardShouldPersistTaps="handled"
-      customModalHeader={
-        <HeaderContainer>
-          <ModalHeader
-            title="Localisation"
-            rightIconAccessibilityLabel="Fermer la modale"
-            rightIcon={Close}
-            onRightIconPress={onClose}
-          />
-        </HeaderContainer>
-      }
-      fixedModalBottom={
-        <LocationModalFooter onSubmit={onSubmitPlace} isSubmitDisabled={!selectedPlace} />
-      }>
-      <StyledScrollView>
-        <Spacer.Column numberOfSpaces={6} />
-        <LocationModalButton
-          onPress={selectLocationMode(LocationMode.AROUND_ME)}
-          icon={PositionFilled}
-          color={geolocationModeColor}
-          title="Utiliser ma position actuelle"
-          subtitle={hasGeolocPosition ? undefined : 'Géolocalisation désactivée'}
-        />
-        <Spacer.Column numberOfSpaces={6} />
-        <Separator.Horizontal />
-        <Spacer.Column numberOfSpaces={6} />
-        <LocationModalButton
-          onPress={selectLocationMode(LocationMode.AROUND_PLACE)}
-          icon={MagnifyingGlassFilled}
-          color={customLocationModeColor}
-          title="Choisir une localisation"
-          subtitle={LOCATION_PLACEHOLDER}
-        />
-        {isCurrentLocationMode(LocationMode.AROUND_PLACE) ? (
-          <LocationSearchInput
-            selectedPlace={selectedPlace}
-            setSelectedPlace={setSelectedPlace}
-            placeQuery={placeQuery}
-            setPlaceQuery={setPlaceQuery}
-            onResetPlace={onResetPlace}
-            onSetSelectedPlace={onSetSelectedPlace}
-          />
-        ) : null}
-        <Spacer.Column numberOfSpaces={6} />
-        <Separator.Horizontal />
-        <Spacer.Column numberOfSpaces={6} />
-        <LocationModalButton
-          onPress={selectLocationMode(LocationMode.EVERYWHERE)}
-          icon={WorldPosition}
-          color={everywhereLocationModeColor}
-          title="Partout"
-        />
-      </StyledScrollView>
-    </AppModal>
+      onSubmit={onSubmit}
+      hasGeolocPosition={hasGeolocPosition}
+      tempLocationMode={tempLocationMode}
+      onClose={onClose}
+      selectLocationMode={selectLocationMode}
+      onModalHideRef={onModalHideRef}
+      selectedPlace={selectedPlace}
+      setSelectedPlace={setSelectedPlace}
+      placeQuery={placeQuery}
+      setPlaceQuery={setPlaceQuery}
+      onSetSelectedPlace={onSetSelectedPlace}
+      onResetPlace={onResetPlace}
+      shouldShowRadiusSlider={false}
+      isSubmitDisabled={!selectedPlace}
+      shouldDisplayEverywhereSection
+    />
   )
 }
-
-const StyledScrollView = styled.ScrollView({
-  paddingHorizontal: getSpacing(6),
-})
-
-const HeaderContainer = styled.View({
-  padding: getSpacing(4),
-  width: '100%',
-})
-Original file line number
+Diff line change
@@ Expand Up @@
                           ]
                         }
                       >
-                        Partout
+                        France entière
                       </Text>
                     </View>
                   </View>
@@ Expand Down @@