diff --git a/.maestro/tests/subFolder/cloud/commands/SetLocalizationToEverywhere.yml b/.maestro/tests/subFolder/cloud/commands/SetLocalizationToEverywhere.yml
index 0cabb58a05c..d8016d20a2d 100644
--- 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
index efcec652012..bef416739d0 100644
--- 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
index bb217578f1e..58ca611012d 100644
--- 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
index cf36a7eaa64..3762be78ab0 100644
--- 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
diff --git a/__snapshots__/features/location/components/SearchLocationModal.native.test.tsx.native-snap b/__snapshots__/features/location/components/SearchLocationModal.native.test.tsx.native-snap
index 6ca6f1dd77d..249f34b4842 100644
--- 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
diff --git a/__snapshots__/features/search/pages/Search/ThematicSearch/ThematicSearch.native.test.tsx.native-snap b/__snapshots__/features/search/pages/Search/ThematicSearch/ThematicSearch.native.test.tsx.native-snap
index 09601b21064..17cddfc5cd2 100644
--- a/__snapshots__/features/search/pages/Search/ThematicSearch/ThematicSearch.native.test.tsx.native-snap
+++ b/__snapshots__/features/search/pages/Search/ThematicSearch/ThematicSearch.native.test.tsx.native-snap
@@ -468,7 +468,7 @@ exports[` book offerCategory should render 1
]
}
>
- Me localiser
+ France entière
book offerCategory should render 1
]
}
>
- Me localiser
+ France entière
{
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
index ecb003df55d..37f5dbe9a97 100644
--- a/src/features/internal/marketingAndCommunication/atoms/LocationFilterChoice.native.test.tsx
+++ b/src/features/internal/marketingAndCommunication/atoms/LocationFilterChoice.native.test.tsx
@@ -1,7 +1,7 @@
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('', () => {
@@ -9,7 +9,7 @@ describe('', () => {
const onChange = jest.fn()
render()
- 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
index f728a590d3d..61ce0b9eefc 100644
--- 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) => {
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 (
-
-
-
- }
- fixedModalBottom={
-
- }>
-
-
-
-
-
-
-
- {isCurrentLocationMode(LocationMode.AROUND_PLACE) ? (
-
- ) : null}
-
-
-
-
-
-
+ 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%',
-})
diff --git a/src/features/location/components/LocationModal.tsx b/src/features/location/components/LocationModal.tsx
new file mode 100644
index 00000000000..a5e7c7f825d
--- /dev/null
+++ b/src/features/location/components/LocationModal.tsx
@@ -0,0 +1,197 @@
+import React from 'react'
+import styled, { useTheme } 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 { LocationState } from 'features/location/types'
+import { LocationLabel, LocationMode } from 'libs/location/types'
+import { SuggestedPlace } from 'libs/place/types'
+import { LocationSearchFilters } from 'shared/location/LocationSearchFilters'
+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'
+
+type LocationModalProps = {
+ visible: boolean
+ onSubmit: () => void
+ onClose: () => void
+ onModalHideRef: LocationState['onModalHideRef']
+ selectLocationMode: (mode: LocationMode) => () => void
+ tempLocationMode: LocationState['tempLocationMode']
+ hasGeolocPosition: LocationState['hasGeolocPosition']
+ selectedPlace: LocationState['selectedPlace']
+ setSelectedPlace: LocationState['setSelectedPlace']
+ placeQuery: LocationState['placeQuery']
+ setPlaceQuery: LocationState['setPlaceQuery']
+ onSetSelectedPlace: (place: SuggestedPlace) => void
+ onResetPlace: LocationState['onResetPlace']
+ shouldDisplayEverywhereSection: boolean
+ isSubmitDisabled: boolean
+ shouldShowRadiusSlider: boolean
+ buttonWording?: string
+ tempAroundMeRadius?: LocationState['tempAroundMeRadius']
+ onTempAroundMeRadiusValueChange?: (newValues: number[]) => void
+ tempAroundPlaceRadius?: LocationState['tempAroundPlaceRadius']
+ onTempAroundPlaceRadiusValueChange?: (newValues: number[]) => void
+}
+
+export const LocationModal = ({
+ visible,
+ onSubmit,
+ hasGeolocPosition,
+ tempLocationMode,
+ onClose,
+ selectLocationMode,
+ onModalHideRef,
+ selectedPlace,
+ tempAroundMeRadius,
+ onTempAroundMeRadiusValueChange,
+ setSelectedPlace,
+ placeQuery,
+ setPlaceQuery,
+ onSetSelectedPlace,
+ onResetPlace,
+ tempAroundPlaceRadius,
+ onTempAroundPlaceRadiusValueChange,
+ shouldShowRadiusSlider,
+ buttonWording,
+ isSubmitDisabled,
+ shouldDisplayEverywhereSection,
+}: LocationModalProps) => {
+ 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
+
+ const shouldShowAroundPlaceRadiusSlider =
+ shouldShowRadiusSlider &&
+ tempAroundPlaceRadius &&
+ onTempAroundPlaceRadiusValueChange &&
+ selectedPlace
+
+ const shouldShowAroundMeRadiusSlider =
+ shouldShowRadiusSlider &&
+ tempAroundMeRadius &&
+ onTempAroundMeRadiusValueChange &&
+ isCurrentLocationMode(LocationMode.AROUND_ME)
+
+ return (
+
+
+
+ }
+ fixedModalBottom={
+ onSubmit()}
+ isSubmitDisabled={isSubmitDisabled}
+ buttonWording={buttonWording}
+ />
+ }>
+
+
+
+ {shouldShowAroundMeRadiusSlider ? (
+
+
+
+
+ ) : null}
+
+
+
+
+ {isCurrentLocationMode(LocationMode.AROUND_PLACE) ? (
+
+
+ {shouldShowAroundPlaceRadiusSlider ? (
+
+
+
+
+ ) : null}
+
+ ) : null}
+ {shouldDisplayEverywhereSection ? (
+
+
+
+
+
+
+ ) : null}
+
+
+ )
+}
+
+const StyledScrollView = styled.ScrollView({
+ paddingHorizontal: getSpacing(6),
+})
+
+const HeaderContainer = styled.View({
+ padding: getSpacing(4),
+ width: '100%',
+})
diff --git a/src/features/location/components/LocationSearchWidget.native.test.tsx b/src/features/location/components/LocationSearchWidget.native.test.tsx
index dc80365c520..a6e8eba5754 100644
--- a/src/features/location/components/LocationSearchWidget.native.test.tsx
+++ b/src/features/location/components/LocationSearchWidget.native.test.tsx
@@ -3,7 +3,7 @@ import React from 'react'
import { LocationSearchWidget } from 'features/location/components/LocationSearchWidget'
import { useLocation } from 'libs/location'
-import { LocationMode } from 'libs/location/types'
+import { LocationLabel, LocationMode } from 'libs/location/types'
import { act, fireEvent, render, screen } from 'tests/utils'
const mockShowModal = jest.fn()
@@ -44,7 +44,7 @@ describe('LocationSearchWidget', () => {
${true} | ${null}
${true} | ${undefined}
`(
- "should render a filled location pointer and the text 'Ma position' if the user is geolocated",
+ `should render a filled location pointer and the text ${LocationLabel.aroundMeLabel} if the user is geolocated`,
async ({ hasGeolocPosition, place }) => {
mockUseLocation.mockReturnValueOnce({
hasGeolocPosition,
@@ -55,7 +55,7 @@ describe('LocationSearchWidget', () => {
render()
expect(screen.getByTestId('location pointer filled')).toBeOnTheScreen()
- expect(screen.getByText('Ma position')).toBeOnTheScreen()
+ expect(screen.getByText(LocationLabel.aroundMeLabel)).toBeOnTheScreen()
}
)
@@ -64,7 +64,7 @@ describe('LocationSearchWidget', () => {
${false} | ${null}
${false} | ${undefined}
`(
- "should render a location pointer(not filled ) and the text 'Me localiser' if the user is not geolocated and has not selected a custom position",
+ `should render a location pointer(not filled ) and the text ${LocationLabel.everywhereLabel} if the user is not geolocated and has not selected a custom position`,
async ({ hasGeolocPosition, place }) => {
mockUseLocation.mockReturnValueOnce({
hasGeolocPosition,
@@ -76,7 +76,7 @@ describe('LocationSearchWidget', () => {
render()
expect(screen.getByTestId('location pointer not filled')).toBeOnTheScreen()
- expect(screen.getByText('Me localiser')).toBeOnTheScreen()
+ expect(screen.getByText(LocationLabel.everywhereLabel)).toBeOnTheScreen()
}
)
diff --git a/src/features/location/components/LocationWidgetDesktop.native.test.tsx b/src/features/location/components/LocationWidgetDesktop.native.test.tsx
index 63b6eb276bf..6f265bed9ff 100644
--- a/src/features/location/components/LocationWidgetDesktop.native.test.tsx
+++ b/src/features/location/components/LocationWidgetDesktop.native.test.tsx
@@ -4,7 +4,7 @@ import React from 'react'
import { LocationWidgetDesktop } from 'features/location/components/LocationWidgetDesktop'
import * as useFeatureFlag from 'libs/firebase/firestore/featureFlags/useFeatureFlag'
import { useLocation } from 'libs/location'
-import { LocationMode } from 'libs/location/types'
+import { LocationLabel, LocationMode } from 'libs/location/types'
import { storage } from 'libs/storage'
import { act, fireEvent, render, screen } from 'tests/utils'
@@ -46,7 +46,7 @@ describe('LocationWidgetDesktop', () => {
${true} | ${null}
${true} | ${undefined}
`(
- "should render a filled location pointer and the text 'Ma position' if the user is geolocated",
+ `should render a filled location pointer and the text ${LocationLabel.aroundMeLabel} if the user is geolocated`,
async ({ hasGeolocPosition, place }) => {
mockUseLocation.mockReturnValueOnce({
hasGeolocPosition,
@@ -58,7 +58,7 @@ describe('LocationWidgetDesktop', () => {
renderLocationWidgetDesktop()
expect(screen.getByTestId('location pointer filled')).toBeOnTheScreen()
- expect(screen.getByText('Ma position')).toBeOnTheScreen()
+ expect(screen.getByText(LocationLabel.aroundMeLabel)).toBeOnTheScreen()
}
)
@@ -67,7 +67,7 @@ describe('LocationWidgetDesktop', () => {
${false} | ${null}
${false} | ${undefined}
`(
- "should render a location pointer(not filled ) and the text 'Me localiser' if the user is not geolocated and has not selected a custom position",
+ 'should render a location pointer(not filled ) and the text LocationLabel.everywhereLabel if the user is not geolocated and has not selected a custom position',
async ({ hasGeolocPosition, place }) => {
mockUseLocation.mockReturnValueOnce({
hasGeolocPosition,
@@ -80,7 +80,7 @@ describe('LocationWidgetDesktop', () => {
renderLocationWidgetDesktop()
expect(screen.getByTestId('location pointer not filled')).toBeOnTheScreen()
- expect(screen.getByText('Me localiser')).toBeOnTheScreen()
+ expect(screen.getByText(LocationLabel.everywhereLabel)).toBeOnTheScreen()
}
)
@@ -167,7 +167,7 @@ describe('LocationWidgetDesktop', () => {
).not.toBeOnTheScreen()
})
- it('should hide tooltip when taping “Me localiser”', async () => {
+ it(`should hide tooltip when taping ${LocationLabel.everywhereLabel}`, async () => {
jest.useFakeTimers()
renderLocationWidgetDesktop()
@@ -179,7 +179,7 @@ describe('LocationWidgetDesktop', () => {
'Configure ta position et découvre les offres dans la zone géographique de ton choix.'
)
- const locationButton = screen.getByText('Me localiser')
+ const locationButton = screen.getByText(LocationLabel.everywhereLabel)
fireEvent.press(locationButton)
expect(
diff --git a/src/features/location/components/SearchLocationModal.tsx b/src/features/location/components/SearchLocationModal.tsx
index 5f698363875..cd1d532bec9 100644
--- a/src/features/location/components/SearchLocationModal.tsx
+++ b/src/features/location/components/SearchLocationModal.tsx
@@ -1,9 +1,6 @@
import React from 'react'
-import styled, { useTheme } 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 { useLocationSubmit } from 'features/location/helpers/useLocationSubmit'
@@ -11,17 +8,6 @@ import { usePlaceSelection } from 'features/location/helpers/usePlaceSelection'
import { useRadiusChange } from 'features/location/helpers/useRadiusChange'
import { useSearch } from 'features/search/context/SearchWrapper'
import { LocationMode } from 'libs/location/types'
-import { LocationSearchFilters } from 'shared/location/LocationSearchFilters'
-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 {
visible: boolean
@@ -45,132 +31,51 @@ export const SearchLocationModal = ({ visible, dismissModal }: LocationModalProp
tempAroundPlaceRadius,
tempAroundMeRadius,
} = locationStateProps
- const locationSubmitProps = useLocationSubmit({
+
+ const { onSubmit, onClose } = useLocationSubmit({
dismissModal,
from: 'search',
dispatch,
...locationStateProps,
})
- const { onSubmit, onClose } = locationSubmitProps
- const { onTempAroundRadiusPlaceValueChange, onTempAroundMeRadiusValueChange } = useRadiusChange({
+ const {
+ onTempAroundRadiusPlaceValueChange: onTempAroundPlaceRadiusValueChange,
+ onTempAroundMeRadiusValueChange,
+ } = useRadiusChange({
visible,
...locationStateProps,
})
- const { onPlaceSelection } = usePlaceSelection({
+ const { onPlaceSelection: onSetSelectedPlace } = usePlaceSelection({
...locationStateProps,
})
const { selectLocationMode } = useLocationMode({
dismissModal,
...locationStateProps,
- ...locationSubmitProps,
+ onSubmit,
+ onClose,
})
- 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 (
-
-
-
- }
- fixedModalBottom={
- onSubmit()}
- isSubmitDisabled={!selectedPlace && tempLocationMode !== LocationMode.AROUND_ME}
- />
- }>
-
-
-
- {isCurrentLocationMode(LocationMode.AROUND_ME) ? (
-
-
-
-
- ) : null}
-
-
-
-
- {isCurrentLocationMode(LocationMode.AROUND_PLACE) ? (
-
-
-
- {selectedPlace ? (
-
- ) : null}
-
- ) : null}
-
-
-
-
-
-
+ 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
+ tempAroundPlaceRadius={tempAroundPlaceRadius}
+ onTempAroundMeRadiusValueChange={onTempAroundMeRadiusValueChange}
+ onTempAroundPlaceRadiusValueChange={onTempAroundPlaceRadiusValueChange}
+ tempAroundMeRadius={tempAroundMeRadius}
+ isSubmitDisabled={!selectedPlace && tempLocationMode !== LocationMode.AROUND_ME}
+ shouldDisplayEverywhereSection
+ />
)
}
-
-const StyledScrollView = styled.ScrollView({
- paddingHorizontal: getSpacing(6),
-})
-
-const HeaderContainer = styled.View({
- padding: getSpacing(4),
- width: '100%',
-})
diff --git a/src/features/location/components/VenueMapLocationModal.tsx b/src/features/location/components/VenueMapLocationModal.tsx
index b12b41a4caa..7cb1ca70f7a 100644
--- a/src/features/location/components/VenueMapLocationModal.tsx
+++ b/src/features/location/components/VenueMapLocationModal.tsx
@@ -1,10 +1,7 @@
import { useNavigation } from '@react-navigation/native'
import React, { useEffect } from 'react'
-import styled, { useTheme } 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 { useLocationSubmit } from 'features/location/helpers/useLocationSubmit'
@@ -15,16 +12,6 @@ import { useInitialVenuesActions } from 'features/venueMap/store/initialVenuesSt
import { useSelectedVenueActions } from 'features/venueMap/store/selectedVenueStore'
import { analytics } from 'libs/analytics'
import { LocationMode } from 'libs/location/types'
-import { LocationSearchFilters } from 'shared/location/LocationSearchFilters'
-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 { getSpacing } from 'ui/theme'
interface LocationModalProps {
visible: boolean
@@ -57,17 +44,22 @@ export const VenueMapLocationModal = ({
tempAroundPlaceRadius,
tempAroundMeRadius,
} = locationStateProps
+
const locationSubmitProps = useLocationSubmit({
dismissModal,
from: 'venueMap',
...locationStateProps,
})
const { onSubmit, onClose } = locationSubmitProps
- const { onTempAroundRadiusPlaceValueChange, onTempAroundMeRadiusValueChange } = useRadiusChange({
+
+ const {
+ onTempAroundRadiusPlaceValueChange: onTempAroundPlaceRadiusValueChange,
+ onTempAroundMeRadiusValueChange,
+ } = useRadiusChange({
visible,
...locationStateProps,
})
- const { onPlaceSelection } = usePlaceSelection({
+ const { onPlaceSelection: onSetSelectedPlace } = usePlaceSelection({
...locationStateProps,
})
const { selectLocationMode } = useLocationMode({
@@ -76,18 +68,9 @@ export const VenueMapLocationModal = ({
...locationStateProps,
...locationSubmitProps,
})
+
const { removeSelectedVenue } = useSelectedVenueActions()
const { setInitialVenues } = useInitialVenuesActions()
- 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
useEffect(() => {
setInitialVenues([])
@@ -104,88 +87,28 @@ export const VenueMapLocationModal = ({
}
return (
-
-
-
- }
- fixedModalBottom={
-
- }>
-
-
-
- {isCurrentLocationMode(LocationMode.AROUND_ME) ? (
-
-
-
-
- ) : null}
-
-
-
-
- {isCurrentLocationMode(LocationMode.AROUND_PLACE) ? (
-
-
-
- {selectedPlace ? (
-
- ) : null}
-
- ) : null}
-
-
+ onSubmit={handleSubmit}
+ hasGeolocPosition={hasGeolocPosition}
+ tempLocationMode={tempLocationMode}
+ onClose={onClose}
+ selectLocationMode={selectLocationMode}
+ onModalHideRef={onModalHideRef}
+ selectedPlace={selectedPlace}
+ setSelectedPlace={setSelectedPlace}
+ placeQuery={placeQuery}
+ setPlaceQuery={setPlaceQuery}
+ onSetSelectedPlace={onSetSelectedPlace}
+ onResetPlace={onResetPlace}
+ shouldShowRadiusSlider
+ isSubmitDisabled={!selectedPlace && tempLocationMode !== LocationMode.AROUND_ME}
+ tempAroundPlaceRadius={tempAroundPlaceRadius}
+ onTempAroundMeRadiusValueChange={onTempAroundMeRadiusValueChange}
+ onTempAroundPlaceRadiusValueChange={onTempAroundPlaceRadiusValueChange}
+ tempAroundMeRadius={tempAroundMeRadius}
+ buttonWording="Valider et voir sur la carte"
+ shouldDisplayEverywhereSection={false}
+ />
)
}
-
-const StyledScrollView = styled.ScrollView({
- paddingHorizontal: getSpacing(6),
-})
-
-const HeaderContainer = styled.View({
- padding: getSpacing(4),
- width: '100%',
-})
diff --git a/src/features/location/helpers/getLocationTitle.ts b/src/features/location/helpers/getLocationTitle.ts
index 6dca69befae..0ffb77b591b 100644
--- a/src/features/location/helpers/getLocationTitle.ts
+++ b/src/features/location/helpers/getLocationTitle.ts
@@ -1,4 +1,4 @@
-import { LocationMode } from 'libs/location/types'
+import { LocationLabel, LocationMode } from 'libs/location/types'
import { SuggestedPlace } from 'libs/place/types'
export const getLocationTitle = (place: SuggestedPlace | null, locationMode: LocationMode) => {
@@ -6,11 +6,11 @@ export const getLocationTitle = (place: SuggestedPlace | null, locationMode: Loc
case LocationMode.AROUND_PLACE:
return place?.label ?? ''
case LocationMode.EVERYWHERE:
- return 'Me localiser'
+ return LocationLabel.everywhereLabel
case LocationMode.AROUND_ME:
- return 'Ma position'
+ return LocationLabel.aroundMeLabel
default:
- return 'Me localiser'
+ return LocationLabel.everywhereLabel
}
}
diff --git a/src/features/search/components/SearchBox/SearchBox.native.test.tsx b/src/features/search/components/SearchBox/SearchBox.native.test.tsx
index 443f522c5ec..4588581620a 100644
--- a/src/features/search/components/SearchBox/SearchBox.native.test.tsx
+++ b/src/features/search/components/SearchBox/SearchBox.native.test.tsx
@@ -10,7 +10,7 @@ import * as useFilterCountAPI from 'features/search/helpers/useFilterCount/useFi
import { BooksNativeCategoriesEnum, SearchState, SearchView } from 'features/search/types'
import * as useFeatureFlagAPI from 'libs/firebase/firestore/featureFlags/useFeatureFlag'
import { GeoCoordinates, Position } from 'libs/location'
-import { LocationMode } from 'libs/location/types'
+import { LocationLabel, LocationMode } from 'libs/location/types'
import { mockedSuggestedVenue } from 'libs/venue/fixtures/mockedSuggestedVenues'
import { act, fireEvent, render, screen } from 'tests/utils'
@@ -553,7 +553,7 @@ describe('SearchBox component', () => {
await act(async () => {})
- expect(screen.getByText('Me localiser')).toBeOnTheScreen()
+ expect(screen.getByText(LocationLabel.everywhereLabel)).toBeOnTheScreen()
})
})
diff --git a/src/features/search/components/SearchHeader/SearchHeader.native.test.tsx b/src/features/search/components/SearchHeader/SearchHeader.native.test.tsx
index 879d3b49063..4a7cd0a2c5e 100644
--- a/src/features/search/components/SearchHeader/SearchHeader.native.test.tsx
+++ b/src/features/search/components/SearchHeader/SearchHeader.native.test.tsx
@@ -5,6 +5,7 @@ import { SearchHeader } from 'features/search/components/SearchHeader/SearchHead
import { initialSearchState } from 'features/search/context/reducer'
import * as useFilterCountAPI from 'features/search/helpers/useFilterCount/useFilterCount'
import * as useFeatureFlag from 'libs/firebase/firestore/featureFlags/useFeatureFlag'
+import { LocationLabel } from 'libs/location/types'
import { render, screen, waitFor, within } from 'tests/utils'
jest.spyOn(useFeatureFlag, 'useFeatureFlag').mockReturnValue(false)
@@ -68,7 +69,7 @@ describe('SearchHeader component', () => {
await waitFor(() => {
const insideLocationWidget = within(screen.getByTestId('InsideLocationWidget'))
- expect(insideLocationWidget.getByText('Me localiser')).toBeOnTheScreen()
+ expect(insideLocationWidget.getByText(LocationLabel.everywhereLabel)).toBeOnTheScreen()
})
})
@@ -78,7 +79,7 @@ describe('SearchHeader component', () => {
await waitFor(() => {
const insideLocationWidget = within(screen.getByTestId('InsideLocationWidget'))
- expect(insideLocationWidget.queryByText('Me localiser')).not.toBeOnTheScreen()
+ expect(insideLocationWidget.queryByText(LocationLabel.everywhereLabel)).not.toBeOnTheScreen()
})
})
@@ -88,7 +89,9 @@ describe('SearchHeader component', () => {
await waitFor(() => {
const searchHeaderTitleContainer = within(screen.getByTestId('SearchHeaderTitleContainer'))
- expect(searchHeaderTitleContainer.queryByText('Me localiser')).not.toBeOnTheScreen()
+ expect(
+ searchHeaderTitleContainer.queryByText(LocationLabel.everywhereLabel)
+ ).not.toBeOnTheScreen()
})
})
@@ -98,7 +101,7 @@ describe('SearchHeader component', () => {
await waitFor(() => {
const insideLocationWidget = within(screen.getByTestId('InsideLocationWidget'))
- expect(insideLocationWidget.queryByText('Me localiser')).not.toBeOnTheScreen()
+ expect(insideLocationWidget.queryByText(LocationLabel.everywhereLabel)).not.toBeOnTheScreen()
})
})
@@ -108,7 +111,7 @@ describe('SearchHeader component', () => {
await waitFor(() => {
const searchHeaderTitleContainer = within(screen.getByTestId('SearchHeaderTitleContainer'))
- expect(searchHeaderTitleContainer.getByText('Me localiser')).toBeOnTheScreen()
+ expect(searchHeaderTitleContainer.getByText(LocationLabel.everywhereLabel)).toBeOnTheScreen()
})
})
})
diff --git a/src/features/search/context/SearchWrapper.native.test.tsx b/src/features/search/context/SearchWrapper.native.test.tsx
index 374a6e1188b..36ecc63ebd6 100644
--- a/src/features/search/context/SearchWrapper.native.test.tsx
+++ b/src/features/search/context/SearchWrapper.native.test.tsx
@@ -9,7 +9,7 @@ import {
useLocation,
} from 'libs/location'
import { getGeolocPosition } from 'libs/location/geolocation/getGeolocPosition/getGeolocPosition'
-import { LocationMode } from 'libs/location/types'
+import { LocationLabel, LocationMode } from 'libs/location/types'
import { SuggestedPlace } from 'libs/place/types'
import { act, fireEvent, render, screen } from 'tests/utils'
@@ -61,7 +61,7 @@ describe('SearchWrapper', () => {
expect(screen.getByText(LocationMode.AROUND_ME)).toBeOnTheScreen()
})
- it('should update locationType with type Everywhere when Location Context is switched to "Partout"', async () => {
+ it(`should update locationType with type Everywhere when Location Context is switched to ${LocationLabel.everywhereLabel}`, async () => {
renderDummyComponent()
await act(async () => {
diff --git a/src/libs/location/types.ts b/src/libs/location/types.ts
index a93357e21e5..0e3e3247e99 100644
--- a/src/libs/location/types.ts
+++ b/src/libs/location/types.ts
@@ -10,6 +10,11 @@ export enum LocationMode {
EVERYWHERE = 'EVERYWHERE',
}
+export const enum LocationLabel {
+ everywhereLabel = 'France entière',
+ aroundMeLabel = 'Ma position',
+}
+
export type GeolocationError = {
type: GeolocPositionError
message: string