Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions packages/visual-editor/locales/cs/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/da/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/de/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/en-GB/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/en/visual-editor.json
Original file line number Diff line number Diff line change
Expand Up @@ -316,6 +316,7 @@
"short": "Short",
"show": "Show",
"showAdditionalHoursText": "Show additional hours text",
"showDistanceOptions": "Include Distance Options",
"showFullText": "Show Full Text",
"small": "Small",
"small_text size": "Small",
Expand Down
1 change: 1 addition & 0 deletions packages/visual-editor/locales/es/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/et/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/fi/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/fr/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/hr/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/hu/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/it/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/ja/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/lt/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/lv/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/nb/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/nl/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/pl/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/pt/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/ro/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/sk/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/sv/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/tr/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/zh-TW/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions packages/visual-editor/locales/zh/visual-editor.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

46 changes: 38 additions & 8 deletions packages/visual-editor/src/components/Locator.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -449,6 +449,12 @@ export interface LocatorProps {
* @defaultValue false
*/
openNowButton: boolean;
/**
* If 'true', displays several distance options to filter searches to only locations within
* a certain radius.
* @defaultValue false
*/
showDistanceOptions: boolean;
/** Which fields are facetable in the search experience */
facetFields?: DynamicOptionsSelectorType<string>;
};
Expand Down Expand Up @@ -506,6 +512,16 @@ const locatorFields: Fields<LocatorProps> = {
],
}
),
showDistanceOptions: YextField(
msg("fields.options.showDistanceOptions", "Include Distance Options"),
{
type: "radio",
options: [
{ label: msg("fields.options.yes", "Yes"), value: true },
{ label: msg("fields.options.no", "No"), value: false },
],
}
),
facetFields: YextField(msg("fields.dynamicFilters", "Dynamic Filters"), {
type: "dynamicSelect",
dropdownLabel: msg("fields.field", "Field"),
Expand Down Expand Up @@ -544,6 +560,7 @@ export const LocatorComponent: ComponentConfig<{ props: LocatorProps }> = {
defaultProps: {
filters: {
openNowButton: false,
showDistanceOptions: false,
},
},
label: msg("components.locator", "Locator"),
Expand Down Expand Up @@ -590,7 +607,7 @@ type SearchState = "not started" | "loading" | "complete";

const LocatorInternal = ({
mapStyle,
filters: { openNowButton, facetFields },
filters: { openNowButton, showDistanceOptions, facetFields },
mapStartingLocation,
puck,
}: WithPuckProps<LocatorProps>) => {
Expand Down Expand Up @@ -688,6 +705,10 @@ const LocatorInternal = ({
const handleFilterSelect = (params: OnSelectParams) => {
const newDisplayName = params.newDisplayName;
const filterValue = params.newFilter.value as NearFilterValue;
// only overwrite radius from filter if display options are enabled
const radius = showDistanceOptions
? selectedDistanceMiles * MILES_TO_METERS
: filterValue.radius;
const locationFilter: SelectableStaticFilter = {
displayName: newDisplayName,
selected: true,
Expand All @@ -696,7 +717,7 @@ const LocatorInternal = ({
fieldId: params.newFilter.fieldId,
value: {
...filterValue,
radius: selectedDistanceMiles * MILES_TO_METERS,
radius,
},
matcher: Matcher.Near,
},
Expand Down Expand Up @@ -1005,6 +1026,9 @@ const LocatorInternal = ({
// just in case
const lat = mapCenter?.lat ?? previousValue?.lat ?? DEFAULT_MAP_CENTER[1];
const lng = mapCenter?.lng ?? previousValue?.lng ?? DEFAULT_MAP_CENTER[0];
const radius = showDistanceOptions
? DEFAULT_RADIUS_MILES * MILES_TO_METERS
: previousValue?.radius;
return {
...filter,
filter: {
Expand All @@ -1013,7 +1037,7 @@ const LocatorInternal = ({
...previousValue,
lat,
lng,
radius: DEFAULT_RADIUS_MILES * MILES_TO_METERS,
radius,
},
},
} as SelectableStaticFilter;
Expand Down Expand Up @@ -1050,7 +1074,8 @@ const LocatorInternal = ({
);
}, [searchFilters]);

const hasFilterModalToggle = openNowButton || selectedFacets.length > 0;
const hasFilterModalToggle =
openNowButton || showDistanceOptions || selectedFacets.length > 0;
const [showFilterModal, setShowFilterModal] = React.useState(false);

return (
Expand Down Expand Up @@ -1145,6 +1170,7 @@ const LocatorInternal = ({
showOpenNowOption={openNowButton}
isOpenNowSelected={isOpenNowSelected}
handleOpenNowClick={handleOpenNowClick}
showDistanceOptions={showDistanceOptions}
selectedDistanceMiles={selectedDistanceMiles}
handleDistanceClick={handleDistanceClick}
handleCloseModalClick={() => setShowFilterModal(false)}
Expand Down Expand Up @@ -1433,6 +1459,7 @@ interface FilterModalProps {
showFilterModal: boolean;
showOpenNowOption: boolean; // whether to show the Open Now filter option
isOpenNowSelected: boolean; // whether the Open Now filter is currently selected by the user
showDistanceOptions: boolean; // whether to show the Distance filter option
selectedDistanceMiles?: number;
handleCloseModalClick: () => void;
handleOpenNowClick: (selected: boolean) => void;
Expand All @@ -1445,6 +1472,7 @@ const FilterModal = (props: FilterModalProps) => {
showFilterModal,
showOpenNowOption,
isOpenNowSelected,
showDistanceOptions,
selectedDistanceMiles,
handleCloseModalClick,
handleOpenNowClick,
Expand Down Expand Up @@ -1488,10 +1516,12 @@ const FilterModal = (props: FilterModalProps) => {
onChange={handleOpenNowClick}
/>
)}
<DistanceFilter
onChange={handleDistanceClick}
selectedDistanceMiles={selectedDistanceMiles}
/>
{showDistanceOptions && (
<DistanceFilter
onChange={handleDistanceClick}
selectedDistanceMiles={selectedDistanceMiles}
/>
)}
<Facets
customCssClasses={{
divider: "bg-white",
Expand Down
10 changes: 5 additions & 5 deletions packages/visual-editor/src/docs/components.md
Original file line number Diff line number Diff line change
Expand Up @@ -428,11 +428,11 @@ Available on Locator templates.

Configuration for the filters available in the locator search experience.

| Prop | Type | Description | Default |
| :-------------------- | :------------------------------------------------------------------------------ | :---------------------------------------------------------------------------------- | :------------------------------------- |
| `filters` | `{ openNowButton: boolean; facetFields?: DynamicOptionsSelectorType<string>; }` | Configuration for the filters available in the locator search experience. | |
| `mapStartingLocation` | `{ latitude: string; longitude: string; }` | The starting location for the map. | |
| `mapStyle` | `string` | The visual theme for the map tiles, chosen from a predefined list of Mapbox styles. | `'mapbox://styles/mapbox/streets-v12'` |
| Prop | Type | Description | Default |
| :-------------------- | :------------------------------------------------------------------------------------------------------------ | :---------------------------------------------------------------------------------- | :------------------------------------- |
| `filters` | `{ openNowButton: boolean; showDistanceOptions: boolean; facetFields?: DynamicOptionsSelectorType<string>; }` | Configuration for the filters available in the locator search experience. | |
| `mapStartingLocation` | `{ latitude: string; longitude: string; }` | The starting location for the map. | |
| `mapStyle` | `string` | The visual theme for the map tiles, chosen from a predefined list of Mapbox styles. | `'mapbox://styles/mapbox/streets-v12'` |

---

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -1505,6 +1505,7 @@ const locatorDefaultLayout = {
mapStyle: "mapbox://styles/mapbox/streets-v12",
filters: {
openNowButton: false,
showDistanceOptions: false,
},
},
},
Expand Down