From 37a4c8eb3cb841ae60f2b89e6a271e6a90c82510 Mon Sep 17 00:00:00 2001 From: David Hay <89824813+hayitsdavid@users.noreply.github.com> Date: Sat, 18 Jun 2022 12:47:45 -0700 Subject: [PATCH] chore: cleanup unused filter code (#74) --- src/components/results/FilterBar.tsx | 109 +++++++++++++----------- src/components/results/filterHelpers.ts | 84 +++--------------- 2 files changed, 69 insertions(+), 124 deletions(-) diff --git a/src/components/results/FilterBar.tsx b/src/components/results/FilterBar.tsx index 76bf466..9ac4dc8 100644 --- a/src/components/results/FilterBar.tsx +++ b/src/components/results/FilterBar.tsx @@ -1,15 +1,17 @@ -import {CurrentFilters} from "../../types"; import React, {useContext} from "react"; -import FormControlLabel from "@mui/material/FormControlLabel"; -import Checkbox from "@mui/material/Checkbox"; import styled from "styled-components"; -import FormControl from "@mui/material/FormControl"; -import FormLabel from "@mui/material/FormLabel"; -import FormGroup from "@mui/material/FormGroup"; -import {filterGroups} from "./filterHelpers"; -import Button from "@mui/material/Button"; +import { + FormControlLabel, + Checkbox, + FormGroup, + FormControl, + FormLabel, + Button, +} from "@mui/material"; import {GlobalStateContext} from "../../context/globalStates"; -import { colors } from "../../theme"; +import {filterGroups} from "./filterHelpers"; +import {colors} from "../../theme"; +import {CurrentFilters} from "../../types"; const Sidebar = styled.div<{isFilterOpen: boolean}>` display: flex; @@ -38,58 +40,61 @@ const Sidebar = styled.div<{isFilterOpen: boolean}>` &:not(:first-child) { margin-top: 15px; } - } @media (max-width: 752px) { - display: ${props => (props.isFilterOpen ? "flex" : "none")}; + display: ${(props) => (props.isFilterOpen ? "flex" : "none")}; background-color: white; position: relative; box-shadow: 0px 5px 5px -3px rgb(0 0 0 / 20%), - 0px 8px 10px 1px rgb(0 0 0 / 14%), - 0px 3px 14px 2px rgb(0 0 0 / 12%); + 0px 8px 10px 1px rgb(0 0 0 / 14%), 0px 3px 14px 2px rgb(0 0 0 / 12%); padding: 30px; } `; export const FilterBar: React.FC = () => { - const { - isFilterOpen, - currentFilters, - handleFilterChange, - handleClearFilters - } = useContext(GlobalStateContext); + const {isFilterOpen, currentFilters, handleFilterChange, handleClearFilters} = + useContext(GlobalStateContext); - return ( - - {filterGroups.map(({groupName, groupLabel, filters}) => ( - - {groupLabel} - - {filters.map(({label, name}) => ( - - } - sx={{fontSize: '.75rem', height: '1.25rem', marginBottom: '0.3125rem', marginTop: '0.3125rem', whiteSpace: 'nowrap', lineHeight: '1'}} - /> - ))} - - - ))} - - ); - } -; + return ( + + {filterGroups.map(({groupName, groupLabel, filters}) => ( + + {groupLabel} + + {filters.map(({label, name}) => ( + + } + sx={{ + fontSize: ".75rem", + height: "1.25rem", + marginBottom: "0.3125rem", + marginTop: "0.3125rem", + whiteSpace: "nowrap", + lineHeight: "1", + }} + /> + ))} + + + ))} + + + ); +}; diff --git a/src/components/results/filterHelpers.ts b/src/components/results/filterHelpers.ts index 5c2ff8e..a903231 100644 --- a/src/components/results/filterHelpers.ts +++ b/src/components/results/filterHelpers.ts @@ -1,15 +1,21 @@ import {CurrentFilters, Result} from "../../types"; import {Dispatch, SetStateAction} from "react"; -const isEmpty = (currentFilters: CurrentFilters) => - Object.keys(currentFilters).length === 0; - type MatchGroupArgs = { result: Result; group: string; currentFilters: CurrentFilters; }; +type FilterGroup = { + groupName: string; + groupLabel: string; + filters: { + name: string; + label: string; + }[]; +}; + export const matchGroup = ({result, group, currentFilters}: MatchGroupArgs) => { for (const filter of currentFilters[group as keyof CurrentFilters]) { if (result[filter as keyof Result]) { @@ -19,6 +25,9 @@ export const matchGroup = ({result, group, currentFilters}: MatchGroupArgs) => { return false; }; +const isEmpty = (currentFilters: CurrentFilters) => + Object.keys(currentFilters).length === 0; + export const applyFilters = ( results: Result[], currentFilters: CurrentFilters @@ -58,55 +67,6 @@ export const applyFilterChanges = setCurrentFilters(newFilters); }; -export const allFilters = [ - "smallBusiness", - "nonProfit", - "sfCounty", - "alamedaCounty", - "sanMateoCounty", - "contraCostaCounty", - "santaClaraCounty", - "employs100OrFewer", - "employs500OrFewer", - "employs750OrFewer", - "employs750More", - "hasInterest", - "doesNotHaveInterest", - "covid19", - "protestDamage", - "blackOwned", - "lgbtq", - "public", - "private", - "spanish", - "chinese" -]; - -const defaultMatchCounts = () => { - const matchCounts = {} as {[key: string]: number}; - for (const filter of allFilters) matchCounts[filter] = 0; - return matchCounts; -}; - -export const getMatchCounts = (filteredResults: Result[]) => - filteredResults.reduce((matchCounts, result) => { - for (const filter of allFilters) { - if (result[filter as keyof Result]) { - matchCounts[filter]++; - } - } - return matchCounts; - }, defaultMatchCounts()); - -type FilterGroup = { - groupName: string; - groupLabel: string; - filters: { - name: string; - label: string; - }[]; -}; - export const filterGroups: FilterGroup[] = [ { groupName: "orgType", @@ -197,23 +157,3 @@ export const getFilterNameFromGroupAndTargetName = ( } return undefined; }; - - -export const getFilterNameFromGroupAndLabel = ( - groupName: string, - label: string -): string | undefined => { - const foundGroup = filterGroups.find( - (group) => group.groupName === groupName - ); - if (foundGroup) { - const foundFilter = foundGroup.filters.find( - (filter) => filter.label === label - ); - if (foundFilter) { - - return foundFilter.name; - } - } - return undefined; -};