@abcagency/hc-ui-components 1.0.3 → 1.0.5

package/dist/index.js

@@ -1,7 +1,7 @@
 import React, { useContext, useState, useEffect, createContext, useRef, forwardRef, memo, Fragment } from 'react';
-import { useLocation, useNavigate, Link, BrowserRouter } from 'react-router-dom';
 import { twMerge } from 'tailwind-merge';
 import { useScroll, useTransform, useSpring, motion } from 'framer-motion';
+import { Link } from 'react-router-dom';
 import { Icon } from '@iconify/react';
 import * as RadixAccordion from '@radix-ui/react-accordion';
 import { Combobox, Transition } from '@headlessui/react';
@@ -1189,113 +1189,18 @@ var setStorageObject = function setStorageObject(key, item) {
   }
 };
 
-var updateURLWithFilters = function updateURLWithFilters(filters, location, navigate, query) {
-  console.log("attempting to update url");
-  console.log(filters);
-  console.log(location);
-  console.log(navigate);
-  console.log(query);
-  var searchParams = new URLSearchParams();
-
-  // Add the new filters to search params
-  Object.keys(filters).forEach(function (category) {
-    Object.keys(filters[category]).forEach(function (filter) {
-      if (filters[category][filter]) {
-        var key = "".concat(category, ".").concat(filter);
-        searchParams.set(key, 'true');
-      }
-    });
-  });
-
-  // Add the query to search params if it exists
-  if (query) {
-    searchParams.set('query', query);
-  }
-  navigate({
-    search: searchParams.toString()
-  }, {
-    replace: true
-  });
-  notifyParentOfUrlChange();
-};
-function notifyParentOfUrlChange() {
-  setTimeout(function () {
-    var message = {
-      type: 'URL_CHANGE',
-      url: window.location.href
-    };
-    window.parent.postMessage(message, "*");
-  }, 500);
-}
-var parseQueryParams = function parseQueryParams(search) {
-  var queryParams = {};
-  if (!search) return queryParams;
-  var queryString = search.split('?')[1];
-  if (!queryString) {
-    return queryParams;
-  }
-  queryString = queryString.replaceAll('+', ' ');
-  queryString.split('&').forEach(function (param) {
-    var _param$split = param.split('='),
-      _param$split2 = _slicedToArray(_param$split, 2),
-      key = _param$split2[0],
-      value = _param$split2[1];
-    queryParams[decodeURIComponent(key)] = decodeURIComponent(value);
-  });
-  return queryParams;
-};
-var filtersFromURL = function filtersFromURL(location) {
-  if (!location || !location.search) return;
-  var filters = {};
-  var queryParam = null;
-  var queryParams = parseQueryParams(location.search);
-  if (!queryParams) return;
-  Object.keys(queryParams).forEach(function (key) {
-    if (key && key.includes('.')) {
-      var _key$split = key.split('.'),
-        _key$split2 = _slicedToArray(_key$split, 2),
-        category = _key$split2[0],
-        filter = _key$split2[1];
-      if (!filters[category]) {
-        filters[category] = {};
-      }
-      filters[category][filter] = queryParams[key] === 'true';
-    } else if (key === 'query') {
-      queryParam = queryParams[key];
-    }
-  });
-  return {
-    filters: filters,
-    query: queryParam
-  };
-};
-var hasFiltersInURL = function hasFiltersInURL(location) {
-  if (!location || !location.search) return;
-  var queryParams = parseQueryParams(location.search);
-  if (!queryParams) return;
-  return Object.keys(queryParams).some(function (key) {
-    return key.includes('.');
-  });
-};
-var hasQueryInUrl = function hasQueryInUrl(location) {
-  console.log(location);
-  if (!location || !location.search) return;
-  var queryParams = parseQueryParams(location.search);
-  if (!queryParams) return;
-  return Object.keys(queryParams).includes('query');
-};
-
 var MapListContext = /*#__PURE__*/createContext();
 var useMapList = function useMapList() {
   return useContext(MapListContext);
 };
-var getQuery = function getQuery(location) {
+var getQuery = function getQuery() {
   var query;
-  if (!hasQueryInUrl(location)) {
-    query = typeof window !== 'undefined' ? localStorage.getItem('query') : '';
-  } else {
-    query = filtersFromURL(location).query;
-  }
+  //if (!hasQueryInUrl(location)) {
+  query = typeof window !== 'undefined' ? localStorage.getItem('query') : '';
+  // } 
+  //else {
+  // 	query = filtersFromURL(location).query;
+  // }
   return query;
 };
 var MapListProvider = function MapListProvider(_ref) {
@@ -1303,8 +1208,8 @@ var MapListProvider = function MapListProvider(_ref) {
     siteConfig = _ref.siteConfig,
     resetFilters = _ref.resetFilters,
     navigateToDetails = _ref.navigateToDetails;
-  var location = useLocation();
-  var navigate = useNavigate();
+  // const location = useLocation();
+  // const navigate = useNavigate();
   var _useState = useState(getStorageObject("listings", [])),
     _useState2 = _slicedToArray(_useState, 2),
     allListings = _useState2[0],
@@ -1322,7 +1227,7 @@ var MapListProvider = function MapListProvider(_ref) {
     mapItems = _useState8[0],
     setMapItems = _useState8[1];
   var _useState9 = useState(function () {
-      return resetFilters ? null : getQuery(location);
+      return resetFilters ? null : getQuery();
     }),
     _useState10 = _slicedToArray(_useState9, 2),
     query = _useState10[0],
@@ -1340,11 +1245,11 @@ var MapListProvider = function MapListProvider(_ref) {
     commuteLocation = _useState16[0],
     setCommuteLocation = _useState16[1];
   var _useState17 = useState(function () {
-      return resetFilters ? {} : hasFiltersInURL(location) ? filtersFromURL(location).filters : getStorageObject('selectedFilters', {});
+      return resetFilters ? {} : getStorageObject('selectedFilters', {});
     }),
     _useState18 = _slicedToArray(_useState17, 2),
     selectedFilters = _useState18[0],
-    setSelectedFilters = _useState18[1];
+    setSelectedFilters = _useState18[1]; //hasFiltersInURL(location) ? filtersFromURL(location).filters : getStorageObject('selectedFilters', {}));
   var _useState19 = useState(),
     _useState20 = _slicedToArray(_useState19, 2),
     filterOptions = _useState20[0],
@@ -1479,19 +1384,16 @@ var MapListProvider = function MapListProvider(_ref) {
         });
       }
       setFilteredListings(filteredListings);
-      if (firstLoad && hasFiltersInURL(location)) {
-        var _filtersFromURL = filtersFromURL(location),
-          filters = _filtersFromURL.filters;
-        setSelectedFilters(filters);
-      }
-      if (firstLoad && selectedFilters) {
-        updateURLWithFilters(selectedFilters, location, navigate, query);
-      } else if (Object.keys(selectedFilters).length === 0 && !firstLoad) {
+      // if (firstLoad && hasFiltersInURL(location)) {
+      // 	const { filters } = filtersFromURL(location);
+      // 	setSelectedFilters(filters);
+      // }
+      if (firstLoad && selectedFilters) ; else if (Object.keys(selectedFilters).length === 0 && !firstLoad) {
         localStorage.removeItem('selectedFilters');
-        updateURLWithFilters(selectedFilters, location, navigate, query);
+        //updateURLWithFilters(selectedFilters,location, navigate, query);
       } else if (!firstLoad) {
         setStorageObject('selectedFilters', selectedFilters);
-        updateURLWithFilters(selectedFilters, location, navigate, query);
+        //updateURLWithFilters(selectedFilters,location, navigate, query);
       }
       query != null ? localStorage.setItem('query', query) : localStorage.removeItem('query');
       setMapItems(mapItems);
@@ -4601,23 +4503,16 @@ var HireControlMap = function HireControlMap(_ref) {
       };
     }();
     fetchSiteConfig();
-    var handlePopState = function handlePopState(event) {
-      window.location.reload();
-    };
-    window.addEventListener('popstate', handlePopState);
-    return function () {
-      window.removeEventListener('popstate', handlePopState);
-    };
   }, [clientToken]);
   var _useLoadScript = useLoadScript({
       googleMapsApiKey: "AIzaSyAXPlfaoMCrmjNV1u-vFYdLBi7GkGeh4S4",
       libraries: libraries
     }),
     isLoaded = _useLoadScript.isLoaded;
-  return /*#__PURE__*/React.createElement(BrowserRouter, null, /*#__PURE__*/React.createElement(RootLayout, null, isLoaded && siteConfig && /*#__PURE__*/React.createElement(HomeBody, {
+  return /*#__PURE__*/React.createElement(RootLayout, null, isLoaded && siteConfig && /*#__PURE__*/React.createElement(HomeBody, {
     siteConfig: siteConfig,
     navigateToDetails: navigateToDetails
-  })));
+  }));
 };
 var HomeBody = function HomeBody(_ref3) {
   var _siteConfig$pointsOfI, _siteConfig$pointsOfI2;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abcagency/hc-ui-components",
-  "version": "1.0.3",
+  "version": "1.0.5",
   "description": "",
   "main": "index.js",
   "scripts": {

package/src/components/modules/navigation/navbar.js

@@ -1,8 +1,5 @@
-'use client';
-
 import { useState } from 'react';
 import { Link } from 'react-router-dom';
-
 import NavLink from '~/components/modules/navigation/nav-link';
 import Icon from '~/components/modules/icon';
 import React from 'react'

package/src/contexts/mapListContext.js

@@ -1,5 +1,5 @@
 import React, { createContext, useState, useEffect, useContext } from 'react';
-import { useLocation, useNavigate } from 'react-router-dom';
+// import { useLocation, useNavigate } from 'react-router-dom';
 import fetchListings from '~/services/listingAggregatorService';
 import {
 	generateFilterOptions,
@@ -7,35 +7,36 @@ import {
 	filterListingsByLocation
 } from '~/util/filterUtil';
 import { getStorageObject, setStorageObject } from '~/util/localStorageUtil';
-import { updateURLWithFilters, hasFiltersInURL, filtersFromURL, hasQueryInUrl } from '~/util/urlFilterUtil';
+//import { updateURLWithFilters, hasFiltersInURL, filtersFromURL, hasQueryInUrl } from '~/util/urlFilterUtil';
 import { getListingEntities } from "~/services/listingEntityService";
 
 const MapListContext = createContext();
 
 export const useMapList = () => useContext(MapListContext);
 
-const getQuery = (location) => {
+const getQuery = () => {
 	let query;
-	if (!hasQueryInUrl(location)) {
+	//if (!hasQueryInUrl(location)) {
 		query = typeof window !== 'undefined' ? localStorage.getItem('query') : '';
-	} else {
-		query = filtersFromURL(location).query;
-	}
+	// } 
+	 //else {
+	// 	query = filtersFromURL(location).query;
+	// }
 	return query;
 };
 
 export const MapListProvider = ({ children, siteConfig, resetFilters, navigateToDetails }) => {
-	const location = useLocation();
-	const navigate = useNavigate();
+	// const location = useLocation();
+	// const navigate = useNavigate();
 	const [allListings, setAllListings] = useState(getStorageObject("listings",[]));
 	const [filteredListings, setFilteredListings] = useState([]);
 	const [loading, setLoading] = useState(false);
 	const [mapItems, setMapItems] = useState(getStorageObject('mapItems', []));
-	const [query, setQuery] = useState(() => resetFilters ? null : getQuery(location));
+	const [query, setQuery] = useState(() => resetFilters ? null : getQuery());
 	const [listingEntities, setListingEntities] = useState(getStorageObject("listingEntities",null));
 	const [firstLoad, setFirstLoad] = useState(true);
 	const [commuteLocation, setCommuteLocation] = useState(null);
-	const [selectedFilters, setSelectedFilters] = useState(() => resetFilters ? {} : hasFiltersInURL(location) ? filtersFromURL(location).filters : getStorageObject('selectedFilters', {}));
+	const [selectedFilters, setSelectedFilters] = useState(() => resetFilters ? {} : getStorageObject('selectedFilters', {}));//hasFiltersInURL(location) ? filtersFromURL(location).filters : getStorageObject('selectedFilters', {}));
 	const [filterOptions, setFilterOptions] = useState();
 	const [recruiters, setRecruiters] = useState(getStorageObject("recruiters", {}));
 	const [filterDialogIsOpen, setFilterDialogIsOpen] = useState(false);
@@ -123,18 +124,18 @@ export const MapListProvider = ({ children, siteConfig, resetFilters, navigateTo
 				filteredListings = filteredListings.filter(x => favorites.includes(x.id));
 			}
 			setFilteredListings(filteredListings);
-			if (firstLoad && hasFiltersInURL(location)) {
-				const { filters } = filtersFromURL(location);
-				setSelectedFilters(filters);
-			}
+			// if (firstLoad && hasFiltersInURL(location)) {
+			// 	const { filters } = filtersFromURL(location);
+			// 	setSelectedFilters(filters);
+			// }
 			if (firstLoad && selectedFilters) {
-				updateURLWithFilters(selectedFilters,location, navigate, query);
+				//updateURLWithFilters(selectedFilters,location, navigate, query);
 			} else if (Object.keys(selectedFilters).length === 0 && !firstLoad) {
 				localStorage.removeItem('selectedFilters');
-				updateURLWithFilters(selectedFilters,location, navigate, query);
+				//updateURLWithFilters(selectedFilters,location, navigate, query);
 			} else if (!firstLoad) {
 				setStorageObject('selectedFilters', selectedFilters);
-				updateURLWithFilters(selectedFilters,location, navigate, query);
+				//updateURLWithFilters(selectedFilters,location, navigate, query);
 			}
 			query != null ? localStorage.setItem('query', query) : localStorage.removeItem('query');
 			setMapItems(mapItems);

package/src/index.js

@@ -7,7 +7,6 @@ import { useLoadScript } from '@react-google-maps/api';
 import { MapProvider } from '~/contexts/mapContext';
 import { PlacesProvider } from '~/contexts/placesContext';
 import { MapListProvider } from '~/contexts/mapListContext';
-import { BrowserRouter as Router } from 'react-router-dom';
 import './index.css';
 import RootLayout from './components/layout/layout';
 import { getMapConfig } from '~/services/configService';
@@ -30,16 +29,6 @@ export const HireControlMap = ({ clientToken, navigateToDetails = null }) => {
     };
 
     fetchSiteConfig();
-
-    const handlePopState = (event) => {
-      window.location.reload();
-    };
-
-    window.addEventListener('popstate', handlePopState);
-
-    return () => {
-      window.removeEventListener('popstate', handlePopState);
-    };
   }, [clientToken]);
 
   const { isLoaded } = useLoadScript({
@@ -48,13 +37,11 @@ export const HireControlMap = ({ clientToken, navigateToDetails = null }) => {
   });
 
   return (
-    <Router>
       <RootLayout>
           {isLoaded && siteConfig && (
             <HomeBody siteConfig={siteConfig} navigateToDetails={navigateToDetails} />
           )}
       </RootLayout>
-    </Router>
   );
 };
 

package/src/util/urlFilterUtil.js

@@ -1,33 +1,33 @@
 export const updateURLWithFilters = (filters, location, navigate, query) => {
-	console.log("attempting to update url");
-	console.log(filters);
-	console.log(location);
-	console.log(navigate);
-	console.log(query);
-  
-	const searchParams = new URLSearchParams();
-  
-	// Add the new filters to search params
-	Object.keys(filters).forEach(category => {
-	  Object.keys(filters[category]).forEach(filter => {
-		if (filters[category][filter]) {
-		  const key = `${category}.${filter}`;
-		  searchParams.set(key, 'true');
-		}
-	  });
-	});
-  
-	// Add the query to search params if it exists
-	if (query) {
-	  searchParams.set('query', query);
-	}
-  
-	navigate({
-	  search: searchParams.toString(),
-	}, { replace: true });
-  
-	notifyParentOfUrlChange();
-  };
+  const searchParams = new URLSearchParams(location.search);
+
+  Object.keys(Object.fromEntries(searchParams)).forEach(key => {
+    if (!key.includes('.') && key !== 'query') {
+      searchParams.set(key, searchParams.get(key));
+    }
+  });
+
+  if (query) {
+    searchParams.set('query', query);
+  }
+
+  Object.keys(filters).forEach(category => {
+    Object.keys(filters[category]).forEach(filter => {
+      const key = `${category}.${filter}`;
+      if (filters[category][filter]) {
+        searchParams.set(key, 'true');
+      } else {
+        searchParams.delete(key);
+      }
+    });
+  });
+
+  navigate({
+    search: searchParams.toString(),
+  }, { replace: true });
+
+  notifyParentOfUrlChange();
+};
 
 function notifyParentOfUrlChange() {
   setTimeout(() => {
@@ -83,7 +83,6 @@ export const hasFiltersInURL = location => {
 };
 
 export const hasQueryInUrl = location => {
-  console.log(location);
   if (!location || !location.search) return;
   const queryParams = parseQueryParams(location.search);
   if (!queryParams) return;