@abcagency/hc-ui-components 1.3.94 → 1.3.96

package/src/components/containers/accordions/filter-item-container.js

@@ -1,83 +1,83 @@
-import React, { memo } from 'react';
-import AccordionFilterItem from '~/components/modules/accordions/filterItem';
-import FilterItem from '~/components/containers/filter/filter-item-container';
-import ItemsPill from '~/components/modules/buttons/items-pill';
-
-const FilterItemContainer = ({
-	filter,
-	setDefaultValue,
-	setSelectedFilters,
-	selectedFilters,
-	subcategoryRequireCategory = false,
-	externalLinksInFilters
-}) => {
-	const externalLinks = externalLinksInFilters?.filter(x => x.fieldName == filter.id);
-	const fieldKey = filter.id;
-	const activeItemsCount = selectedFilters != null && selectedFilters[fieldKey]
-		? Object.keys(selectedFilters[fieldKey]).length
-		: 0;
-
-	const handleClearFilters = event => {
-		event.stopPropagation();
-		setSelectedFilters(prevFilters => {
-			const updatedFilters = { ...prevFilters };
-			if(subcategoryRequireCategory && fieldKey == 'categoryClass'){
-				delete updatedFilters['category'];
-			}
-			if(fieldKey == 'state' || fieldKey == 'city' || fieldKey == 'cityState'){
-				delete updatedFilters.entityId;
-				delete updatedFilters['entityName'];
-			}
-			delete updatedFilters[fieldKey];
-			return updatedFilters;
-		});
-	};
-
-	const header = (
-		<>
-			{filter.title}
-			{activeItemsCount > 0 && (
-				<ItemsPill
-					activeItemsCount={activeItemsCount}
-					onClick={handleClearFilters}
-				/>
-			)}
-		</>
-	);
-
-	const body = (
-		<>
-			{filter.items.sort().map(item => (
-				<FilterItem
-					key={item.name}
-					item={item}
-					field={filter.id}
-					selectedFilters={selectedFilters}
-					setSelectedFilters={setSelectedFilters}
-					subcategoryRequireCategory={subcategoryRequireCategory}
-				/>
-			))}
-			{externalLinks && externalLinks.map(link => (
-				<FilterItem
-					key={link.externalLink}
-					item={<a href={link.externalLinkUrl}>{link.externalLink}</a>}
-					isExternalLink={true}
-					externalLinkUrl={link.externalLinkUrl}
-					field={filter.id}
-					subcategoryRequireCategory={subcategoryRequireCategory}
-				/>
-			))}
-		</>
-	);
-
-	return (
-		<AccordionFilterItem
-			id={filter.id}
-			setDefaultValue={setDefaultValue}
-			header={header}
-			body={body}
-		/>
-	);
-};
-
-export default memo(FilterItemContainer);
+import React, { memo } from 'react';
+import AccordionFilterItem from '~/components/modules/accordions/filterItem';
+import FilterItem from '~/components/containers/filter/filter-item-container';
+import ItemsPill from '~/components/modules/buttons/items-pill';
+
+const FilterItemContainer = ({
+	filter,
+	setDefaultValue,
+	setSelectedFilters,
+	selectedFilters,
+	subcategoryRequireCategory = false,
+	externalLinksInFilters
+}) => {
+	const externalLinks = externalLinksInFilters?.filter(x => x.fieldName == filter.id);
+	const fieldKey = filter.id;
+	const activeItemsCount = selectedFilters != null && selectedFilters[fieldKey]
+		? Object.keys(selectedFilters[fieldKey]).length
+		: 0;
+
+	const handleClearFilters = event => {
+		event.stopPropagation();
+		setSelectedFilters(prevFilters => {
+			const updatedFilters = { ...prevFilters };
+			if(subcategoryRequireCategory && fieldKey == 'categoryClass'){
+				delete updatedFilters['category'];
+			}
+			if(fieldKey == 'state' || fieldKey == 'city' || fieldKey == 'cityState'){
+				delete updatedFilters.entityId;
+				delete updatedFilters['entityName'];
+			}
+			delete updatedFilters[fieldKey];
+			return updatedFilters;
+		});
+	};
+
+	const header = (
+		<>
+			{filter.title}
+			{activeItemsCount > 0 && (
+				<ItemsPill
+					activeItemsCount={activeItemsCount}
+					onClick={handleClearFilters}
+				/>
+			)}
+		</>
+	);
+
+	const body = (
+		<>
+			{filter.items.sort().map(item => (
+				<FilterItem
+					key={item.name}
+					item={item}
+					field={filter.id}
+					selectedFilters={selectedFilters}
+					setSelectedFilters={setSelectedFilters}
+					subcategoryRequireCategory={subcategoryRequireCategory}
+				/>
+			))}
+			{externalLinks && externalLinks.map(link => (
+				<FilterItem
+					key={link.externalLink}
+					item={<a href={link.externalLinkUrl}>{link.externalLink}</a>}
+					isExternalLink={true}
+					externalLinkUrl={link.externalLinkUrl}
+					field={filter.id}
+					subcategoryRequireCategory={subcategoryRequireCategory}
+				/>
+			))}
+		</>
+	);
+
+	return (
+		<AccordionFilterItem
+			id={filter.id}
+			setDefaultValue={setDefaultValue}
+			header={header}
+			body={body}
+		/>
+	);
+};
+
+export default memo(FilterItemContainer);

package/src/components/containers/accordions/map-accordion-item-container.js

@@ -1,66 +1,66 @@
-import React from 'react';
-import { useMap } from '~/contexts/mapContext';
-import { useMapList } from '~/contexts/mapListContext';
-import { useTrackEvent } from '~/contexts/trackEventContext';
-import { setStorageObject } from '~/util/localStorageUtil';
-import MapAccordionItem from '~/components/modules/accordions/MapAccordionItem';
-import ListItemContainer from '~/components/containers/list/list-item/list-item-container';
-
-const MapAccordionItemContainer = ({
-	showMap,
-	item,
-	itemRefs,
-	fieldsShown,
-	itemExpandedContent,
-	specialFeatures,
-	isActive
-}) => {
-	const { mapItems, recruiters } = useMapList();
-	const { selectItem } = useMap();
-	const { trackEvent, eventTypes } = useTrackEvent();
-
-	const setSelectedItemAndZoomMap = (item, isActive) => {
-		if (isActive) {
-			localStorage.removeItem("selectedListItem");
-			selectItem(null, null, 9, { lat: 39.8283, lng: -98.5795 });
-		} else {
-			setStorageObject("selectedListItem", item);
-			const location = mapItems.find(x => Object.prototype.hasOwnProperty.call(x.items, item.id)) || null;
-			selectItem(item, location, 12, {
-				lat: location?.latitude,
-				lng: location?.longitude
-			});
-		}
-	};
-
-	const handleItemClick = item => {
-		trackEvent(eventTypes.JOB_LISTING_SELECTED, {
-			jobTitle: item.fields.position,
-			jobCategory: item.fields.category,
-			entityDisplayName: item?.mapDetails?.entityDisplayName
-		});
-
-		setSelectedItemAndZoomMap(item, isActive);
-	};
-
-	return (
-		<MapAccordionItem
-			item={item}
-			itemRefs={itemRefs}
-			itemExpandedContent={itemExpandedContent}
-			isActive={isActive}
-			recruiter={recruiters[item.recruiterId]}
-		>
-			<ListItemContainer
-				showMap={showMap}
-				item={item}
-				fieldsShown={fieldsShown}
-				specialFeatures={specialFeatures}
-				isActive={isActive}
-				onClick={() => handleItemClick(item)}
-			/>
-		</MapAccordionItem>
-	);
-};
-
-export default MapAccordionItemContainer;
+import React from 'react';
+import { useMap } from '~/contexts/mapContext';
+import { useMapList } from '~/contexts/mapListContext';
+import { useTrackEvent } from '~/contexts/trackEventContext';
+import { setStorageObject } from '~/util/localStorageUtil';
+import MapAccordionItem from '~/components/modules/accordions/MapAccordionItem';
+import ListItemContainer from '~/components/containers/list/list-item/list-item-container';
+
+const MapAccordionItemContainer = ({
+	showMap,
+	item,
+	itemRefs,
+	fieldsShown,
+	itemExpandedContent,
+	specialFeatures,
+	isActive
+}) => {
+	const { mapItems, recruiters } = useMapList();
+	const { selectItem } = useMap();
+	const { trackEvent, eventTypes } = useTrackEvent();
+
+	const setSelectedItemAndZoomMap = (item, isActive) => {
+		if (isActive) {
+			localStorage.removeItem("selectedListItem");
+			selectItem(null, null, 9, { lat: 39.8283, lng: -98.5795 });
+		} else {
+			setStorageObject("selectedListItem", item);
+			const location = mapItems.find(x => Object.prototype.hasOwnProperty.call(x.items, item.id)) || null;
+			selectItem(item, location, 12, {
+				lat: location?.latitude,
+				lng: location?.longitude
+			});
+		}
+	};
+
+	const handleItemClick = item => {
+		trackEvent(eventTypes.JOB_LISTING_SELECTED, {
+			jobTitle: item.fields.position,
+			jobCategory: item.fields.category,
+			entityDisplayName: item?.mapDetails?.entityDisplayName
+		});
+
+		setSelectedItemAndZoomMap(item, isActive);
+	};
+
+	return (
+		<MapAccordionItem
+			item={item}
+			itemRefs={itemRefs}
+			itemExpandedContent={itemExpandedContent}
+			isActive={isActive}
+			recruiter={recruiters[item.recruiterId]}
+		>
+			<ListItemContainer
+				showMap={showMap}
+				item={item}
+				fieldsShown={fieldsShown}
+				specialFeatures={specialFeatures}
+				isActive={isActive}
+				onClick={() => handleItemClick(item)}
+			/>
+		</MapAccordionItem>
+	);
+};
+
+export default MapAccordionItemContainer;

package/src/components/containers/filter/commute-container.js

@@ -1,89 +1,89 @@
-import React, { useRef, useState, useEffect } from 'react';
-import usePlacesAutocomplete, { getGeocode, getLatLng } from 'use-places-autocomplete';
-
-import { useMapList } from '~/contexts/mapListContext';
-import { useTrackEvent } from '~/contexts/trackEventContext';
-import { getStorageItem } from '~/util/localStorageUtil';
-import FilterCommute from '~/components/modules/filter/commute';
-
-const FilterCommuteContainer = ({ className }) => {
-	const {
-		ready,
-		suggestions: { status, data },
-		setValue,
-		clearSuggestions
-	} = usePlacesAutocomplete();
-
-	const [selected, setSelected] = useState(getStorageItem('selectedCommute', ''));
-	const inputRef = useRef(null);
-	const { setCommuteLocation, commuteLocation } = useMapList();
-	const [isCurrentLocation, setIsCurrentLocation] = useState(getStorageItem('isCurrentLocation', false));
-	const { trackEvent, eventTypes } = useTrackEvent();
-
-	useEffect(() => {
-		if (commuteLocation !== null && commuteLocation !== '') return;
-		setIsCurrentLocation(false);
-		localStorage.removeItem('isCurrentLocation');
-		localStorage.removeItem('selectedCommute');
-		setSelected("");
-	}, [commuteLocation]);
-
-	const handleSelect = async (val, isCurrLocation = false) => {
-		setValue(val, false);
-		setSelected(val);
-		localStorage.setItem('selectedCommute', val);
-		clearSuggestions();
-		if (isCurrLocation) return;
-		try {
-			const results = await getGeocode({ address: val });
-			const { lat, lng } = await getLatLng(results[0]);
-			trackEvent(eventTypes.COMMUTE_ORIGIN_ADDED, { commuteLocation: { lat, lng }, isCurrentLocation: false });
-			setCommuteLocation({ lat, lng });
-		} catch (error) {
-			// no-op
-		}
-	};
-
-	const fetchLocation = () => {
-		if (!navigator.geolocation) {
-			console.error("Geolocation is not supported by this browser.");
-			return;
-		}
-		navigator.geolocation.getCurrentPosition(
-			position => {
-				const location = {
-					lat: position.coords.latitude,
-					lng: position.coords.longitude
-				};
-				setCommuteLocation(location);
-				trackEvent(eventTypes.COMMUTE_ORIGIN_ADDED, { commuteLocation: location, isCurrentLocation: true });
-				handleSelect("Current Location");
-			},
-			error => {
-				console.error("Error fetching location", error);
-			}
-		);
-	};
-
-	return (
-		<FilterCommute
-			className={className}
-			ready={ready}
-			status={status}
-			data={data}
-			selected={selected}
-			isCurrentLocation={isCurrentLocation}
-			inputRef={inputRef}
-			handleSelect={handleSelect}
-			setValue={setValue}
-			setSelected={setSelected}
-			clearSuggestions={clearSuggestions}
-			commuteLocation={commuteLocation}
-			setIsCurrentLocation={setIsCurrentLocation}
-			fetchLocation={fetchLocation}
-			setCommuteLocation={setCommuteLocation}
-		/>
-	);
-};
-
-export default FilterCommuteContainer;
+import React, { useRef, useState, useEffect } from 'react';
+import usePlacesAutocomplete, { getGeocode, getLatLng } from 'use-places-autocomplete';
+
+import { useMapList } from '~/contexts/mapListContext';
+import { useTrackEvent } from '~/contexts/trackEventContext';
+import { getStorageItem } from '~/util/localStorageUtil';
+import FilterCommute from '~/components/modules/filter/commute';
+
+const FilterCommuteContainer = ({ className }) => {
+	const {
+		ready,
+		suggestions: { status, data },
+		setValue,
+		clearSuggestions
+	} = usePlacesAutocomplete();
+
+	const [selected, setSelected] = useState(getStorageItem('selectedCommute', ''));
+	const inputRef = useRef(null);
+	const { setCommuteLocation, commuteLocation } = useMapList();
+	const [isCurrentLocation, setIsCurrentLocation] = useState(getStorageItem('isCurrentLocation', false));
+	const { trackEvent, eventTypes } = useTrackEvent();
+
+	useEffect(() => {
+		if (commuteLocation !== null && commuteLocation !== '') return;
+		setIsCurrentLocation(false);
+		localStorage.removeItem('isCurrentLocation');
+		localStorage.removeItem('selectedCommute');
+		setSelected("");
+	}, [commuteLocation]);
+
+	const handleSelect = async (val, isCurrLocation = false) => {
+		setValue(val, false);
+		setSelected(val);
+		localStorage.setItem('selectedCommute', val);
+		clearSuggestions();
+		if (isCurrLocation) return;
+		try {
+			const results = await getGeocode({ address: val });
+			const { lat, lng } = await getLatLng(results[0]);
+			trackEvent(eventTypes.COMMUTE_ORIGIN_ADDED, { commuteLocation: { lat, lng }, isCurrentLocation: false });
+			setCommuteLocation({ lat, lng });
+		} catch (error) {
+			// no-op
+		}
+	};
+
+	const fetchLocation = () => {
+		if (!navigator.geolocation) {
+			console.error("Geolocation is not supported by this browser.");
+			return;
+		}
+		navigator.geolocation.getCurrentPosition(
+			position => {
+				const location = {
+					lat: position.coords.latitude,
+					lng: position.coords.longitude
+				};
+				setCommuteLocation(location);
+				trackEvent(eventTypes.COMMUTE_ORIGIN_ADDED, { commuteLocation: location, isCurrentLocation: true });
+				handleSelect("Current Location");
+			},
+			error => {
+				console.error("Error fetching location", error);
+			}
+		);
+	};
+
+	return (
+		<FilterCommute
+			className={className}
+			ready={ready}
+			status={status}
+			data={data}
+			selected={selected}
+			isCurrentLocation={isCurrentLocation}
+			inputRef={inputRef}
+			handleSelect={handleSelect}
+			setValue={setValue}
+			setSelected={setSelected}
+			clearSuggestions={clearSuggestions}
+			commuteLocation={commuteLocation}
+			setIsCurrentLocation={setIsCurrentLocation}
+			fetchLocation={fetchLocation}
+			setCommuteLocation={setCommuteLocation}
+		/>
+	);
+};
+
+export default FilterCommuteContainer;

package/src/components/containers/filter/filter-container.js

@@ -1,81 +1,81 @@
-import React, { useState } from 'react';
-import { useMap } from '~/contexts/mapContext';
-import { useMapList } from '~/contexts/mapListContext';
-import { useTrackEvent } from '~/contexts/trackEventContext';
-import Filter from '~/components/modules/filter/index';
-import FilterSearch from '~/components/containers/filter/search-container';
-import FiltersAccordion from '~/components/containers/accordions/filter-container';
-import FilterLocations from '~/components/containers/filter/location-container';
-
-const FilterContainer = ({
-	className,
-	showMap,
-	isDesktop = false
-}) => {
-	const { trackEvent, eventTypes } = useTrackEvent();
-	const [hasActiveFilters, setHasActiveFilters] = useState(false);
-
-	const { setSelectedListItem, setLocation, filterReset } = useMap();
-	const {
-		filteredListings,
-		selectedFilters,
-		setSelectedFilters,
-		setMobileTab,
-		handleSettingFavorites,
-		setQuery,
-		siteConfig,
-		containerStyle
-	} = useMapList();
-	const [defaultValue, setDefaultValue] = useState(siteConfig?.defaultFilterOpen ? siteConfig?.defaultFilterOpen : null);
-	const handleReset = () => {
-		trackEvent(eventTypes.FILTERS_RESET, { filtersRemoved: selectedFilters });
-		filterReset();
-		setSelectedFilters({});
-		setQuery(null);
-		handleSettingFavorites(null);
-	};
-
-	return (
-		<Filter
-			className={className}
-			showMap={showMap}
-			isDesktop={isDesktop}
-			hasActiveFilters={hasActiveFilters}
-			setHasActiveFilters={setHasActiveFilters}
-			defaultValue={defaultValue}
-			setDefaultValue={setDefaultValue}
-			setSelectedListItem={setSelectedListItem}
-			setLocation={setLocation}
-			filteredListings={filteredListings}
-			selectedFilters={selectedFilters}
-			setSelectedFilters={setSelectedFilters}
-			setMobileTab={setMobileTab}
-			handleReset={handleReset}
-			siteConfig={siteConfig}
-			style={containerStyle}
-
-		>
-			<FiltersAccordion
-				setHasActiveFilters={setHasActiveFilters}
-				defaultValue={defaultValue}
-				setDefaultValue={value => { setDefaultValue(value === defaultValue ? "" : value); }}
-				setLocation={setLocation}
-				setSelectedListItem={setSelectedListItem}
-				SubcategoryRequireCategory={siteConfig.subcategoryRequireCategory}
-			/>
-			<FilterSearch />
-			{siteConfig.hideLocations !== true &&
-			<FilterLocations
-				setHasActiveFilters={setHasActiveFilters}
-				defaultValue={defaultValue}
-				showMap={showMap}
-				setDefaultValue={value => { setDefaultValue(value === defaultValue ? "" : value); }}
-				setLocation={setLocation}
-				setSelectedListItem={setSelectedListItem}
-			/>
-			}
-		</Filter>
-	);
-};
-
-export default FilterContainer;
+import React, { useState } from 'react';
+import { useMap } from '~/contexts/mapContext';
+import { useMapList } from '~/contexts/mapListContext';
+import { useTrackEvent } from '~/contexts/trackEventContext';
+import Filter from '~/components/modules/filter/index';
+import FilterSearch from '~/components/containers/filter/search-container';
+import FiltersAccordion from '~/components/containers/accordions/filter-container';
+import FilterLocations from '~/components/containers/filter/location-container';
+
+const FilterContainer = ({
+	className,
+	showMap,
+	isDesktop = false
+}) => {
+	const { trackEvent, eventTypes } = useTrackEvent();
+	const [hasActiveFilters, setHasActiveFilters] = useState(false);
+
+	const { setSelectedListItem, setLocation, filterReset } = useMap();
+	const {
+		filteredListings,
+		selectedFilters,
+		setSelectedFilters,
+		setMobileTab,
+		handleSettingFavorites,
+		setQuery,
+		siteConfig,
+		containerStyle
+	} = useMapList();
+	const [defaultValue, setDefaultValue] = useState(siteConfig?.defaultFilterOpen ? siteConfig?.defaultFilterOpen : null);
+	const handleReset = () => {
+		trackEvent(eventTypes.FILTERS_RESET, { filtersRemoved: selectedFilters });
+		filterReset();
+		setSelectedFilters({});
+		setQuery(null);
+		handleSettingFavorites(null);
+	};
+
+	return (
+		<Filter
+			className={className}
+			showMap={showMap}
+			isDesktop={isDesktop}
+			hasActiveFilters={hasActiveFilters}
+			setHasActiveFilters={setHasActiveFilters}
+			defaultValue={defaultValue}
+			setDefaultValue={setDefaultValue}
+			setSelectedListItem={setSelectedListItem}
+			setLocation={setLocation}
+			filteredListings={filteredListings}
+			selectedFilters={selectedFilters}
+			setSelectedFilters={setSelectedFilters}
+			setMobileTab={setMobileTab}
+			handleReset={handleReset}
+			siteConfig={siteConfig}
+			style={containerStyle}
+
+		>
+			<FiltersAccordion
+				setHasActiveFilters={setHasActiveFilters}
+				defaultValue={defaultValue}
+				setDefaultValue={value => { setDefaultValue(value === defaultValue ? "" : value); }}
+				setLocation={setLocation}
+				setSelectedListItem={setSelectedListItem}
+				SubcategoryRequireCategory={siteConfig.subcategoryRequireCategory}
+			/>
+			<FilterSearch />
+			{siteConfig.hideLocations !== true &&
+			<FilterLocations
+				setHasActiveFilters={setHasActiveFilters}
+				defaultValue={defaultValue}
+				showMap={showMap}
+				setDefaultValue={value => { setDefaultValue(value === defaultValue ? "" : value); }}
+				setLocation={setLocation}
+				setSelectedListItem={setSelectedListItem}
+			/>
+			}
+		</Filter>
+	);
+};
+
+export default FilterContainer;