Examples for filters

phlask · Jul 8, 2024 · 6b9b1e4 · 6b9b1e4
1 parent 9536e6a
commit 6b9b1e4
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 87 deletions.
diff --git a/src/actions/actions.js b/src/actions/actions.js
@@ -4,20 +4,6 @@ import { getDatabase, get, ref } from 'firebase/database';
 import { resourcesConfig } from '../firebase/firebaseConfig';
 import { testData } from '../firebase/functionalTest';
 
-export const SET_TOGGLE_STATE = 'SET_TOGGLE_STATE';
-export const setToggleState = (toggle, toggleState) => ({
-  type: SET_TOGGLE_STATE,
-  toggle,
-  toggleState
-});
-
-export const SET_TOGGLE_STATE_FOOD = 'SET_TOGGLE_STATE_FOOD';
-export const setToggleStateFood = (toggle, toggleState) => ({
-  type: SET_TOGGLE_STATE_FOOD,
-  toggle,
-  toggleState
-});
-
 export const SET_FILTER_FUNCTION = 'SET_FILTER_FUNCTION';
 export const setFilterFunction = () => ({
   type: SET_FILTER_FUNCTION

diff --git a/src/components/ReactGoogleMaps/ReactGoogleMaps.js b/src/components/ReactGoogleMaps/ReactGoogleMaps.js
@@ -9,7 +9,7 @@ import {
   setUserLocation,
   toggleInfoWindow,
   getResources,
-  setSelectedPlace
+  setSelectedPlace, setFilterFunction
 } from '../../actions/actions';
 import SearchBar from '../SearchBar/SearchBar';
 import SelectedTap from '../SelectedTap/SelectedTap';
@@ -154,6 +154,7 @@ export const ReactGoogleMaps = ({ google }) => {
   const isMobile = useIsMobile();
   const allResources = useSelector(state => state.filterMarkers.allResources);
   const filteredResources = useSelector(state => selectFilteredResource(state));
+  const filters = useSelector(state => state.filterMarkers.filters); // { "tags": [] }
 
   const mapCenter = useSelector(state => state.filterMarkers.mapCenter);
   const resourceType = useSelector(state => state.filterMarkers.resourceType);
@@ -251,20 +252,11 @@ export const ReactGoogleMaps = ({ google }) => {
   };
 
   const handleTag = (type, filterType, index, key) => {
-    if (type == 0) {
-      let activeFilterTags_ = { ...activeFilterTags };
-      activeFilterTags_[filterType][index][key] =
-        !activeFilterTags_[filterType][index][key];
-      setActiveFilterTags(activeFilterTags_);
-    } else if (type == 1) {
-      let activeFilterTags_ = { ...activeFilterTags };
-      if (activeFilterTags_[filterType][index] == key) {
-        activeFilterTags_[filterType][index] = null;
-      } else {
-        activeFilterTags_[filterType][index] = { ...key };
-      }
-      setActiveFilterTags(activeFilterTags_);
-    }
+    // Figure out, based on what was just tapped, what is the tag?
+    // Scenario: Adding the tag (toggled on)
+    let tag = null //...
+    let newFilters = filters.tags.push(tag);
+    dispatch(setFilterFunction(newFilters));
   };
 
   const clearAllTags = () => {

diff --git a/src/reducers/filterMarkers.js b/src/reducers/filterMarkers.js
@@ -15,18 +15,8 @@ const initialState = {
   showingInfoWindow: false,
   infoIsExpanded: false,
   infoWindowClass: 'info-window-out-desktop',
-  tapFilters: {
-    filtered: false,
-    handicap: false,
-    sparkling: false,
-    openNow: false,
-    accessTypesHidden: []
-  },
-  foodFilters: {
-    idRequired: false,
-    kidOnly: false,
-    openNow: false,
-    accessTypesHidden: []
+  filters: {
+    "tags": [],
   },
   /** @type {ResourceEntry[]} */
   allResources: [],
@@ -38,49 +28,6 @@ const initialState = {
 
 export default (state = initialState, act) => {
   switch (act.type) {
-    case actions.SET_TOGGLE_STATE:
-      return {
-        ...state,
-        tapFilters: {
-          ...state.tapFilters,
-          filtered:
-            act.toggle === 'filtered'
-              ? act.toggleState
-              : state.tapFilters.filtered,
-          handicap:
-            act.toggle === 'handicap'
-              ? act.toggleState
-              : state.tapFilters.handicap,
-          sparkling:
-            act.toggle === 'sparkling'
-              ? act.toggleState
-              : state.tapFilters.sparkling,
-          openNow:
-            act.toggle === 'openNow'
-              ? act.toggleState
-              : state.tapFilters.openNow
-        }
-      };
-
-    case actions.SET_TOGGLE_STATE_FOOD:
-      return {
-        ...state,
-        foodFilters: {
-          ...state.foodFilters,
-          idRequired:
-            act.toggle === 'idRequired'
-              ? act.toggleState
-              : state.foodFilters.idRequired,
-          kidOnly:
-            act.toggle === 'kidOnly'
-              ? act.toggleState
-              : state.foodFilters.kidOnly,
-          openNow:
-            act.toggle === 'openNow'
-              ? act.toggleState
-              : state.foodFilters.openNow
-        }
-      };
 
     case actions.SET_USER_LOCATION:
       return { ...state, userLocation: act.coords };
@@ -98,7 +45,7 @@ export default (state = initialState, act) => {
       };
 
     case actions.SET_FILTER_FUNCTION:
-      return { filterFunction: !state.filterFunction, ...state };
+      return { ...state, filters: act.filters };
 
     case actions.SET_SELECTED_PLACE:
       // if passed Selected Place as an object, set selected place as the object

diff --git a/src/selectors/waterSelectors.js b/src/selectors/waterSelectors.js
@@ -5,13 +5,14 @@ import { hours } from '../helpers/hours';
 const getTapFilters = state => state.filterMarkers.tapFilters;
 const getAllResources = state => state.filterMarkers.allResources;
 const getResourceType = state => state.filterMarkers.resourceType;
+const filters = state => state.filterMarkers.filters;
 
 /**
  * This creates a selector for all resources filtered by the requested filters.
  */
 const selectFilteredResource = createSelector(
-  [getAllResources, getResourceType],
-  (allResources, resourceType) => {
+  [getAllResources, getResourceType, filters],
+  (allResources, resourceType, filters) => {
     // First, filter based on resource
     return allResources.filter(resource => {
       return resource.resource_type === resourceType;