@abcagency/hc-ui-components 1.3.94 → 1.3.95

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

@@ -1,117 +1,117 @@
-import React, { useState, useEffect } from 'react';
-import { useTrackEvent } from '~/contexts/trackEventContext';
-import FilterItem from '~/components/modules/filter/item';
-import { useMapList } from '~/contexts/mapListContext';
-
-const FilterItemContainer = ({
-	className,
-	item,
-	type = 'checkbox',
-	itemKey = null,
-	hasCount = true,
-	field,
-	isExternalLink = false,
-	externalLinkUrl,
-	selectedFilters,
-	setSelectedFilters,
-	subcategoryRequireCategory = false,
-	...rest
-}) => {
-	const { trackEvent, eventTypes } = useTrackEvent();
-	const itemName = item.name ? item.name : item;
-	itemKey = itemKey === null ? itemName : itemKey;
-	const isActive = selectedFilters != undefined && !!selectedFilters[field]?.[itemKey];
-	const [activeItem, setActiveItem] = useState(isActive);
-
-	useEffect(() => {
-		if (!selectedFilters || isExternalLink) return;
-		setActiveItem(!!selectedFilters[field]?.[itemKey]);
-	}, [selectedFilters, field, itemKey]);
-
-	const { filteredListings } = useMapList();
-	const changeHandler = () => {
-		if (!isActive || isExternalLink) {
-			trackEvent(eventTypes.FILTER_APPLIED, { filterType: field, filterChecked: itemKey });
-		}
-
-		setSelectedFilters(prevFilters => {
-			const updatedFilters = { ...prevFilters };
-
-			if (field === 'city' || field === 'state' || field === 'cityState') {
-				delete updatedFilters['entityName'];
-			}
-
-			if (!isActive) {
-				if (!updatedFilters[field]) {
-					updatedFilters[field] = {};
-				}
-				updatedFilters[field][itemKey] = true;
-				return updatedFilters;
-			}
-
-			delete updatedFilters[field][itemKey];
-
-			if (updatedFilters[field] && Object.keys(updatedFilters[field]).length === 0) {
-				delete updatedFilters[field];
-			}
-
-			if (field === 'categoryClass' && subcategoryRequireCategory) {
-				const activeCategoryClass = itemKey;
-				const categoriesToConsiderForRemoval = new Set(
-					filteredListings
-						.filter(listing => listing.fields.categoryClass === activeCategoryClass)
-						.flatMap(listing => listing.fields.category || [])
-				);
-
-				const categoriesToRetain = new Set(
-					filteredListings
-						.filter(listing => listing.fields.categoryClass !== activeCategoryClass)
-						.flatMap(listing => listing.fields.category || [])
-						.filter(category => categoriesToConsiderForRemoval.has(category))
-				);
-
-				if (updatedFilters['category']) {
-					Object.keys(updatedFilters['category']).forEach(categoryKey => {
-						if (categoriesToConsiderForRemoval.has(categoryKey) && !categoriesToRetain.has(categoryKey)) {
-							delete updatedFilters['category'][categoryKey];
-						}
-					});
-
-					if (Object.keys(updatedFilters['category']).length === 0) {
-						delete updatedFilters['category'];
-					}
-				}
-			}
-
-			return updatedFilters;
-		});
-	};
-
-	useEffect(() => {
-		if (selectedFilters && selectedFilters[field] && Object.keys(selectedFilters[field])?.length > 0) return;
-		else if (activeItem === true) {
-			setActiveItem(false);
-		}
-	}, [selectedFilters]);
-
-	return (
-		<FilterItem
-			className={className}
-			item={item}
-			type={type}
-			itemKey={itemKey}
-			hasCount={hasCount}
-			field={field}
-			activeItem={activeItem}
-			setActiveItem={setActiveItem}
-			changeHandler={changeHandler}
-			isExternalLink={isExternalLink}
-			externalLinkUrl={externalLinkUrl}
-			trackEvent={trackEvent}
-			eventTypes={eventTypes}
-			{...rest}
-		/>
-	);
-};
-
-export default FilterItemContainer;
+import React, { useState, useEffect } from 'react';
+import { useTrackEvent } from '~/contexts/trackEventContext';
+import FilterItem from '~/components/modules/filter/item';
+import { useMapList } from '~/contexts/mapListContext';
+
+const FilterItemContainer = ({
+	className,
+	item,
+	type = 'checkbox',
+	itemKey = null,
+	hasCount = true,
+	field,
+	isExternalLink = false,
+	externalLinkUrl,
+	selectedFilters,
+	setSelectedFilters,
+	subcategoryRequireCategory = false,
+	...rest
+}) => {
+	const { trackEvent, eventTypes } = useTrackEvent();
+	const itemName = item.name ? item.name : item;
+	itemKey = itemKey === null ? itemName : itemKey;
+	const isActive = selectedFilters != undefined && !!selectedFilters[field]?.[itemKey];
+	const [activeItem, setActiveItem] = useState(isActive);
+
+	useEffect(() => {
+		if (!selectedFilters || isExternalLink) return;
+		setActiveItem(!!selectedFilters[field]?.[itemKey]);
+	}, [selectedFilters, field, itemKey]);
+
+	const { filteredListings } = useMapList();
+	const changeHandler = () => {
+		if (!isActive || isExternalLink) {
+			trackEvent(eventTypes.FILTER_APPLIED, { filterType: field, filterChecked: itemKey });
+		}
+
+		setSelectedFilters(prevFilters => {
+			const updatedFilters = { ...prevFilters };
+
+			if (field === 'city' || field === 'state' || field === 'cityState') {
+				delete updatedFilters['entityName'];
+			}
+
+			if (!isActive) {
+				if (!updatedFilters[field]) {
+					updatedFilters[field] = {};
+				}
+				updatedFilters[field][itemKey] = true;
+				return updatedFilters;
+			}
+
+			delete updatedFilters[field][itemKey];
+
+			if (updatedFilters[field] && Object.keys(updatedFilters[field]).length === 0) {
+				delete updatedFilters[field];
+			}
+
+			if (field === 'categoryClass' && subcategoryRequireCategory) {
+				const activeCategoryClass = itemKey;
+				const categoriesToConsiderForRemoval = new Set(
+					filteredListings
+						.filter(listing => listing.fields.categoryClass === activeCategoryClass)
+						.flatMap(listing => listing.fields.category || [])
+				);
+
+				const categoriesToRetain = new Set(
+					filteredListings
+						.filter(listing => listing.fields.categoryClass !== activeCategoryClass)
+						.flatMap(listing => listing.fields.category || [])
+						.filter(category => categoriesToConsiderForRemoval.has(category))
+				);
+
+				if (updatedFilters['category']) {
+					Object.keys(updatedFilters['category']).forEach(categoryKey => {
+						if (categoriesToConsiderForRemoval.has(categoryKey) && !categoriesToRetain.has(categoryKey)) {
+							delete updatedFilters['category'][categoryKey];
+						}
+					});
+
+					if (Object.keys(updatedFilters['category']).length === 0) {
+						delete updatedFilters['category'];
+					}
+				}
+			}
+
+			return updatedFilters;
+		});
+	};
+
+	useEffect(() => {
+		if (selectedFilters && selectedFilters[field] && Object.keys(selectedFilters[field])?.length > 0) return;
+		else if (activeItem === true) {
+			setActiveItem(false);
+		}
+	}, [selectedFilters]);
+
+	return (
+		<FilterItem
+			className={className}
+			item={item}
+			type={type}
+			itemKey={itemKey}
+			hasCount={hasCount}
+			field={field}
+			activeItem={activeItem}
+			setActiveItem={setActiveItem}
+			changeHandler={changeHandler}
+			isExternalLink={isExternalLink}
+			externalLinkUrl={externalLinkUrl}
+			trackEvent={trackEvent}
+			eventTypes={eventTypes}
+			{...rest}
+		/>
+	);
+};
+
+export default FilterItemContainer;

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

@@ -1,45 +1,45 @@
-import React from 'react';
-import FilterLocation from '~/components/modules/filter/location';
-import FilterCommute from '~/components/containers/filter/commute-container';
-import FilterPointsOfInterest from '~/components/containers/filter/points-of-interest-container';
-import { useMapList } from '~/contexts/mapListContext';
-
-const FilterLocationContainer = ({
-	className,
-	defaultValue,
-	setDefaultValue,
-	showMap = false,
-	setLocation,
-	setSelectedListItem
-}) => {
-	const { setSelectedFilters, selectedFilters, filterOptions } = useMapList();
-
-	const locations = filterOptions?.locations;
-	const pointsOfInterest = filterOptions?.pointsOfInterest;
-
-	return (
-		<FilterLocation
-			className={className}
-			defaultValue={defaultValue}
-			setDefaultValue={setDefaultValue}
-			showMap={showMap}
-			setLocation={setLocation}
-			setSelectedListItem={setSelectedListItem}
-			locations={locations}
-			setSelectedFilters={setSelectedFilters}
-			selectedFilters={selectedFilters}
-		>
-			{showMap && <FilterCommute className="hc-mt-6" />}
-			{showMap && (
-				<FilterPointsOfInterest
-					className="hc-mt-4"
-					pointsOfInterest={pointsOfInterest}
-					setDefaultValue={setDefaultValue}
-					defaultValue={defaultValue}
-				/>
-			)}
-		</FilterLocation>
-	);
-};
-
-export default FilterLocationContainer;
+import React from 'react';
+import FilterLocation from '~/components/modules/filter/location';
+import FilterCommute from '~/components/containers/filter/commute-container';
+import FilterPointsOfInterest from '~/components/containers/filter/points-of-interest-container';
+import { useMapList } from '~/contexts/mapListContext';
+
+const FilterLocationContainer = ({
+	className,
+	defaultValue,
+	setDefaultValue,
+	showMap = false,
+	setLocation,
+	setSelectedListItem
+}) => {
+	const { setSelectedFilters, selectedFilters, filterOptions } = useMapList();
+
+	const locations = filterOptions?.locations;
+	const pointsOfInterest = filterOptions?.pointsOfInterest;
+
+	return (
+		<FilterLocation
+			className={className}
+			defaultValue={defaultValue}
+			setDefaultValue={setDefaultValue}
+			showMap={showMap}
+			setLocation={setLocation}
+			setSelectedListItem={setSelectedListItem}
+			locations={locations}
+			setSelectedFilters={setSelectedFilters}
+			selectedFilters={selectedFilters}
+		>
+			{showMap && <FilterCommute className="hc-mt-6" />}
+			{showMap && (
+				<FilterPointsOfInterest
+					className="hc-mt-4"
+					pointsOfInterest={pointsOfInterest}
+					setDefaultValue={setDefaultValue}
+					defaultValue={defaultValue}
+				/>
+			)}
+		</FilterLocation>
+	);
+};
+
+export default FilterLocationContainer;

package/src/components/containers/filter/points-of-interest-container.js

@@ -1,33 +1,33 @@
-import React from 'react';
-import Accordion from '~/components/modules/accordions/default';
-import AccordionFilterItem from '~/components/modules/accordions/filterItem';
-import RadioItemContainer from '~/components/containers/filter/points-of-interest-radio-item-container';
-
-const FilterPointsOfInterestContainer = ({
-	title = "Points of interest",
-	pointsOfInterest,
-	setDefaultValue,
-	className,
-	defaultValue
-}) => {
-	const renderRadioItem = (item, index) => (
-		<RadioItemContainer key={item.key + index} item={item} field={item.id} />
-	);
-
-	const body = pointsOfInterest.items.map((item, index) => renderRadioItem(item, index));
-
-	return (
-		<div className={`hc-relative ${className ?? ""}`}>
-			<Accordion defaultValue={defaultValue} className="hc-space-y-4">
-				<AccordionFilterItem
-					id="points-of-interest"
-					setDefaultValue={setDefaultValue}
-					header={title}
-					body={body}
-				/>
-			</Accordion>
-		</div>
-	);
-};
-
-export default FilterPointsOfInterestContainer;
+import React from 'react';
+import Accordion from '~/components/modules/accordions/default';
+import AccordionFilterItem from '~/components/modules/accordions/filterItem';
+import RadioItemContainer from '~/components/containers/filter/points-of-interest-radio-item-container';
+
+const FilterPointsOfInterestContainer = ({
+	title = "Points of interest",
+	pointsOfInterest,
+	setDefaultValue,
+	className,
+	defaultValue
+}) => {
+	const renderRadioItem = (item, index) => (
+		<RadioItemContainer key={item.key + index} item={item} field={item.id} />
+	);
+
+	const body = pointsOfInterest.items.map((item, index) => renderRadioItem(item, index));
+
+	return (
+		<div className={`hc-relative ${className ?? ""}`}>
+			<Accordion defaultValue={defaultValue} className="hc-space-y-4">
+				<AccordionFilterItem
+					id="points-of-interest"
+					setDefaultValue={setDefaultValue}
+					header={title}
+					body={body}
+				/>
+			</Accordion>
+		</div>
+	);
+};
+
+export default FilterPointsOfInterestContainer;

package/src/components/containers/filter/points-of-interest-radio-item-container.js

@@ -1,35 +1,35 @@
-import React from 'react';
-import RadioItem from '~/components/modules/filter/radio-item';
-import { useMap } from '~/contexts/mapContext';
-import { useTrackEvent } from '~/contexts/trackEventContext';
-
-const RadioItemContainer = ({
-	className,
-	item,
-	field,
-	...rest
-}) => {
-	const { trackEvent, eventTypes } = useTrackEvent();
-	const { selectedPlaces, setSelectedPlaces } = useMap();
-	const chosenPlace = item.key.toLowerCase();
-	const isActive = selectedPlaces.includes(chosenPlace);
-
-	const changeHandler = () => {
-		if (!isActive)
-			trackEvent(eventTypes.POI_APPLIED, { chosenPlace });
-		setSelectedPlaces([isActive ? '' : chosenPlace]);
-	};
-
-	return (
-		<RadioItem
-			className={className}
-			item={item}
-			field={field}
-			isActive={isActive}
-			changeHandler={changeHandler}
-			{...rest}
-		/>
-	);
-};
-
-export default RadioItemContainer;
+import React from 'react';
+import RadioItem from '~/components/modules/filter/radio-item';
+import { useMap } from '~/contexts/mapContext';
+import { useTrackEvent } from '~/contexts/trackEventContext';
+
+const RadioItemContainer = ({
+	className,
+	item,
+	field,
+	...rest
+}) => {
+	const { trackEvent, eventTypes } = useTrackEvent();
+	const { selectedPlaces, setSelectedPlaces } = useMap();
+	const chosenPlace = item.key.toLowerCase();
+	const isActive = selectedPlaces.includes(chosenPlace);
+
+	const changeHandler = () => {
+		if (!isActive)
+			trackEvent(eventTypes.POI_APPLIED, { chosenPlace });
+		setSelectedPlaces([isActive ? '' : chosenPlace]);
+	};
+
+	return (
+		<RadioItem
+			className={className}
+			item={item}
+			field={field}
+			isActive={isActive}
+			changeHandler={changeHandler}
+			{...rest}
+		/>
+	);
+};
+
+export default RadioItemContainer;

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

@@ -1,61 +1,61 @@
-import React, { useRef, useState, useEffect } from 'react';
-import { useMapList } from '~/contexts/mapListContext';
-import Search from '~/components/modules/filter/search';
-
-const SearchContainer = ({
-	inputPlaceholder = "Keywords",
-	showSearchIcon = false,
-	className,
-	labelClassName
-}) => {
-	const { query, setQuery, siteConfig } = useMapList();
-	const [inputValue, setInputValue] = useState(query != null ? query : "");
-	const debounceTimer = useRef(null);
-
-	const handleInputChange = e => {
-		setInputValue(e.target.value);
-		if (debounceTimer.current) {
-			clearTimeout(debounceTimer.current);
-		}
-		debounceTimer.current = setTimeout(() => {
-			setQuery(e.target.value);
-		}, 500);
-	};
-
-	const handleSubmitInput = value => {
-		setInputValue(value);
-		if (debounceTimer.current) {
-			clearTimeout(debounceTimer.current);
-		}
-		debounceTimer.current = setTimeout(() => {
-			setQuery(value);
-		}, 500);
-	};
-
-	const handleReset = () => {
-		setInputValue("");
-		setQuery("");
-	};
-
-	useEffect(() => {
-		if (query == null) {
-			setInputValue("");
-		}
-	}, [query]);
-
-	return (
-		<Search
-			inputPlaceholder={siteConfig.searchConfig.placeholder || inputPlaceholder}
-			showSearchIcon={showSearchIcon}
-			className={className}
-			labelClassName={labelClassName}
-			inputValue={inputValue}
-			handleInputChange={handleInputChange}
-			handleReset={handleReset}
-			label={siteConfig.searchConfig.label}
-			handleSubmitInput={handleSubmitInput}
-		/>
-	);
-};
-
-export default SearchContainer;
+import React, { useRef, useState, useEffect } from 'react';
+import { useMapList } from '~/contexts/mapListContext';
+import Search from '~/components/modules/filter/search';
+
+const SearchContainer = ({
+	inputPlaceholder = "Keywords",
+	showSearchIcon = false,
+	className,
+	labelClassName
+}) => {
+	const { query, setQuery, siteConfig } = useMapList();
+	const [inputValue, setInputValue] = useState(query != null ? query : "");
+	const debounceTimer = useRef(null);
+
+	const handleInputChange = e => {
+		setInputValue(e.target.value);
+		if (debounceTimer.current) {
+			clearTimeout(debounceTimer.current);
+		}
+		debounceTimer.current = setTimeout(() => {
+			setQuery(e.target.value);
+		}, 500);
+	};
+
+	const handleSubmitInput = value => {
+		setInputValue(value);
+		if (debounceTimer.current) {
+			clearTimeout(debounceTimer.current);
+		}
+		debounceTimer.current = setTimeout(() => {
+			setQuery(value);
+		}, 500);
+	};
+
+	const handleReset = () => {
+		setInputValue("");
+		setQuery("");
+	};
+
+	useEffect(() => {
+		if (query == null) {
+			setInputValue("");
+		}
+	}, [query]);
+
+	return (
+		<Search
+			inputPlaceholder={siteConfig.searchConfig.placeholder || inputPlaceholder}
+			showSearchIcon={showSearchIcon}
+			className={className}
+			labelClassName={labelClassName}
+			inputValue={inputValue}
+			handleInputChange={handleInputChange}
+			handleReset={handleReset}
+			label={siteConfig.searchConfig.label}
+			handleSubmitInput={handleSubmitInput}
+		/>
+	);
+};
+
+export default SearchContainer;

package/src/components/containers/jobListing/listing-details-container.js

@@ -1,43 +1,43 @@
-import React from 'react';
-import { useMap } from '~/contexts/mapContext';
-import { useMapList } from '~/contexts/mapListContext';
-import { useTrackEvent } from '~/contexts/trackEventContext';
-import ListingDetails from '~/components/modules/jobListing/listing-details';
-
-const ListingDetailsContainer = ({ item, recruiter }) => {
-	const { trackEvent, eventTypes } = useTrackEvent();
-	const { travelTime } = useMap();
-	const { siteConfig, navigateToDetails, navigateToEasyApply, Link, linkFormat, easyApplyUrl, easyApplyText, isIframe } = useMapList();
-
-	const {
-	  useDetailsPostMessage,
-	  useApplyDialog,
-	  internalApplyLink,
-	  companyName,
-	  jobsDomain
-	} = siteConfig;
-
-	return (
-	  <ListingDetails
-			item={item}
-			recruiter={recruiter}
-			travelTime={travelTime}
-			useDetailsPostMessage={useDetailsPostMessage}
-			navigateToDetails={navigateToDetails}
-			navigateToEasyApply={navigateToEasyApply}
-			Link={Link}
-			linkFormat={linkFormat}
-			easyApplyUrl={easyApplyUrl}
-			easyApplyText={easyApplyText}
-			isIframe={isIframe}
-			useApplyDialog={useApplyDialog}
-			internalApplyLink={internalApplyLink}
-			companyName={companyName}
-			jobsDomain={jobsDomain}
-			trackEvent={trackEvent}
-			eventTypes={eventTypes}
-	  />
-	);
-};
-
-export default ListingDetailsContainer;
+import React from 'react';
+import { useMap } from '~/contexts/mapContext';
+import { useMapList } from '~/contexts/mapListContext';
+import { useTrackEvent } from '~/contexts/trackEventContext';
+import ListingDetails from '~/components/modules/jobListing/listing-details';
+
+const ListingDetailsContainer = ({ item, recruiter }) => {
+	const { trackEvent, eventTypes } = useTrackEvent();
+	const { travelTime } = useMap();
+	const { siteConfig, navigateToDetails, navigateToEasyApply, Link, linkFormat, easyApplyUrl, easyApplyText, isIframe } = useMapList();
+
+	const {
+	  useDetailsPostMessage,
+	  useApplyDialog,
+	  internalApplyLink,
+	  companyName,
+	  jobsDomain
+	} = siteConfig;
+
+	return (
+	  <ListingDetails
+			item={item}
+			recruiter={recruiter}
+			travelTime={travelTime}
+			useDetailsPostMessage={useDetailsPostMessage}
+			navigateToDetails={navigateToDetails}
+			navigateToEasyApply={navigateToEasyApply}
+			Link={Link}
+			linkFormat={linkFormat}
+			easyApplyUrl={easyApplyUrl}
+			easyApplyText={easyApplyText}
+			isIframe={isIframe}
+			useApplyDialog={useApplyDialog}
+			internalApplyLink={internalApplyLink}
+			companyName={companyName}
+			jobsDomain={jobsDomain}
+			trackEvent={trackEvent}
+			eventTypes={eventTypes}
+	  />
+	);
+};
+
+export default ListingDetailsContainer;