diff --git a/constants/operators.ts b/constants/operators.ts index 40616aa..9894118 100644 --- a/constants/operators.ts +++ b/constants/operators.ts @@ -52,20 +52,110 @@ export const HELMET = [ '[CAMOED]', '[CYPHERED]', '[REDACTED]', + 'Aquaflux cybernetic goggles', + 'Aquamarine immersive visor', + 'Aureate cybernetic goggles', + 'Aureate cypher gaiter', + 'Aureate harlequin mask', 'Aurora crested helm', + 'Brimstone mindguard', + 'Brimstone nebula visor', + 'Canopy cybernetic goggles', + 'Canopy versatility goggles', 'Celestial crested helm', + 'Cobalt mindguard', + 'Cobalt technomancer helm', + 'Cyberglow spartan hawk', 'Ethereal crested helm', + 'Ferrous spartan hawk', + 'Gaudy immersive visor', + 'Garnet harlequin mask', + 'Holochrome spartan hawk', + 'Indigo cypher gaiter', + 'Inferno cybernetic goggles', + 'Inferno cypher gaiter', + 'Inferno immersive visor', + 'Inferno mindguard', + 'Inferno versatility goggles', + 'Iodine technomancer helm', + 'Iolite harlequin mask', + 'Iridium mindguard', + 'Jade harlequin mask', + 'Marine versatility goggles', + 'Mercurial cypher gaiter', + 'Mercurial mindguard', + 'Neon cybernetic goggles', + 'Neon spartan hawk', + 'Neon technomancer helm', + 'Nightshade immersive visor', + 'Nightshade nebula visor', + 'Onyx harlequin mask', + 'Oxide nebula visor', + 'Oxide technomancer helm', 'Regal crested helm', + 'Sulphur technomancer helm', + 'Sulphur versatility goggles', + 'Tempest nebula visor', + 'Twilight cypher gaiter', 'Verdant crested helm', + 'Verdigris spartan hawk', + 'Vespa nebula visor', + 'Wisteria immersive visor', + 'Zenith versatility goggles', ] export const JACKET = [ '[CAMOED]', '[CYPHERED]', '[REDACTED]', + 'Amethyst bomber jacket', + 'Amethyst coveralls', + 'Amethyst cowl', 'Amethyst frock coat', + 'Amethyst funnel neck', + 'Amethyst fusion mantle', + 'Amethyst hoody', + 'Amethyst sakáki', + 'Amethyst tactical jacket', + 'Azure obscurer', + 'Canopy obscurer', + 'Carmine bomber jacket', + 'Carmine coveralls', + 'Carmine cowl', 'Carmine frock coat', + 'Carmine funnel neck', + 'Carmine fusion mantle', + 'Carmine hoody', + 'Carmine obscurer', + 'Carmine sakáki', + 'Carmine tactical jacket', 'Cobalt frock coat', + 'Cyan bomber jacket', + 'Cyan coveralls', + 'Cyan cowl', + 'Cyan funnel neck', + 'Cyan fusion mantle', + 'Cyan hoody', + 'Cyan sakáki', + 'Cyan tactical jacket', + 'Digital gold bomber jacket', + 'Digital gold coveralls', + 'Digital gold cowl', + 'Digital gold funnel neck', + 'Digital gold fusion mantle', + 'Digital gold hoody', + 'Digital gold sakáki', + 'Digital gold tactical jacket', + 'Dusk obscurer', + 'Emerald bomber jacket', + 'Emerald coveralls', + 'Emerald cowl', 'Emerald frock coat', + 'Emerald funnel neck', + 'Emerald fusion mantle', + 'Emerald hoody', + 'Emerald sakáki', + 'Emerald tactical jacket', 'Sulphur frock coat', + 'Sunset obscurer', ] diff --git a/data/operators.json b/data/operators.json index 00ee501..d0368e2 100644 --- a/data/operators.json +++ b/data/operators.json @@ -5901,7 +5901,7 @@ "background": "Rust", "skin": "IC1", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Vigilant_Stealthy_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Vigilant_Stealthy_Polymath.jpeg" }, @@ -6374,7 +6374,7 @@ "background": "Phantom", "skin": "IC1", "helmet": "Marine versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Vigilant_Silent_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Vigilant_Silent_Polymath.jpeg" }, @@ -6506,7 +6506,7 @@ "background": "Mariana", "skin": "IC1", "helmet": "Sulphur versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Fragmented_Stealthy_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Fragmented_Stealthy_Polymath.jpeg" }, @@ -6539,7 +6539,7 @@ "background": "Sulphur", "skin": "IC1", "helmet": "Sulphur versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Enigmatic_Unseen_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Enigmatic_Unseen_Polymath.jpeg" }, @@ -6737,7 +6737,7 @@ "background": "Marooned", "skin": "IC6", "helmet": "Marine versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Arcane_Dissident_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Arcane_Dissident_Polymath.jpeg" }, @@ -6770,7 +6770,7 @@ "background": "Mariana", "skin": "IC4", "helmet": "Marine versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Unseen_Radical_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Unseen_Radical_Polymath.jpeg" }, @@ -6946,7 +6946,7 @@ "background": "Nightfall", "skin": "IC1", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Dissident_Autonomous_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Dissident_Autonomous_Polymath.jpeg" }, @@ -7309,7 +7309,7 @@ "background": "Mariana", "skin": "IC1", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Autonomous_Occult_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Autonomous_Occult_Polymath.jpeg" }, @@ -7342,7 +7342,7 @@ "background": "Marooned", "skin": "IC3", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Subversive_Dissident_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Subversive_Dissident_Polymath.jpeg" }, @@ -7463,7 +7463,7 @@ "background": "Sulphur", "skin": "IC1", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Arcane_Autonomous_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Arcane_Autonomous_Polymath.jpeg" }, @@ -7606,7 +7606,7 @@ "background": "Void", "skin": "IC3", "helmet": "Canopy versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Cryptic_Nomadic_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Cryptic_Nomadic_Polymath.jpeg" }, @@ -7639,7 +7639,7 @@ "background": "Sanguine", "skin": "IC3", "helmet": "Zenith versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Cryptic_Radical_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Cryptic_Radical_Polymath.jpeg" }, @@ -7650,7 +7650,7 @@ "background": "Cypress", "skin": "IC2", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Sovereign_Quantum_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Sovereign_Quantum_Polymath.jpeg" }, @@ -7837,7 +7837,7 @@ "background": "Marooned", "skin": "IC2", "helmet": "Zenith versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Vigilant_Enigmatic_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Vigilant_Enigmatic_Polymath.jpeg" }, @@ -7991,7 +7991,7 @@ "background": "Sulphur", "skin": "IC1", "helmet": "Canopy versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Vigilant_Nocturnal_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Vigilant_Nocturnal_Polymath.jpeg" }, @@ -8475,7 +8475,7 @@ "background": "Cypress", "skin": "IC3", "helmet": "Zenith versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Augmented_Defiant_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Augmented_Defiant_Polymath.jpeg" }, @@ -8519,7 +8519,7 @@ "background": "Sanguine", "skin": "IC6", "helmet": "Marine versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Ciphered_Dissident_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Ciphered_Dissident_Polymath.jpeg" }, @@ -8530,7 +8530,7 @@ "background": "Mariana", "skin": "IC6", "helmet": "Zenith versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Unseen_Paradoxical_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Unseen_Paradoxical_Polymath.jpeg" }, @@ -8937,7 +8937,7 @@ "background": "Nightfall", "skin": "IC1", "helmet": "Marine versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Radical_Covert_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Radical_Covert_Polymath.jpeg" }, @@ -9564,7 +9564,7 @@ "background": "Nightfall", "skin": "IC4", "helmet": "Canopy versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Unseen_Anarchic_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Unseen_Anarchic_Polymath.jpeg" }, @@ -9597,7 +9597,7 @@ "background": "Phantom", "skin": "IC1", "helmet": "Zenith versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Defiant_Inquisitive_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Defiant_Inquisitive_Polymath.jpeg" }, @@ -9663,7 +9663,7 @@ "background": "Marooned", "skin": "IC3", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Spectral_Nocturnal_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Spectral_Nocturnal_Polymath.jpeg" }, @@ -9751,7 +9751,7 @@ "background": "Sanguine", "skin": "IC1", "helmet": "Zenith versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Recursive_Temporal_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Recursive_Temporal_Polymath.jpeg" }, @@ -9905,7 +9905,7 @@ "background": "Nightfall", "skin": "IC3", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Silent_Temporal_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Silent_Temporal_Polymath.jpeg" }, @@ -10081,7 +10081,7 @@ "background": "Phantom", "skin": "IC2", "helmet": "Canopy versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Unseen_Rogue_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Unseen_Rogue_Polymath.jpeg" }, @@ -10158,7 +10158,7 @@ "background": "LimeWire", "skin": "IC1", "helmet": "Zenith versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Sovereign_Nomadic_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Sovereign_Nomadic_Polymath.jpeg" }, @@ -10191,7 +10191,7 @@ "background": "Rust", "skin": "IC3", "helmet": "Sulphur versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Dystopian_Covert_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Dystopian_Covert_Polymath.jpeg" }, @@ -10301,7 +10301,7 @@ "background": "Marooned", "skin": "IC3", "helmet": "Zenith versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Fractal_Fragmented_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Fractal_Fragmented_Polymath.jpeg" }, @@ -10356,7 +10356,7 @@ "background": "Sulphur", "skin": "IC3", "helmet": "Canopy versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Recursive_Disruptive_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Recursive_Disruptive_Polymath.jpeg" }, @@ -10587,7 +10587,7 @@ "background": "Phantom", "skin": "IC6", "helmet": "Zenith versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Paradoxical_Dissident_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Paradoxical_Dissident_Polymath.jpeg" }, @@ -10598,7 +10598,7 @@ "background": "LimeWire", "skin": "IC3", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Inquisitive_Ciphered_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Inquisitive_Ciphered_Polymath.jpeg" }, @@ -10620,7 +10620,7 @@ "background": "Phantom", "skin": "IC4", "helmet": "Sulphur versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Paradoxical_Nocturnal_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Paradoxical_Nocturnal_Polymath.jpeg" }, @@ -10686,7 +10686,7 @@ "background": "Cypress", "skin": "IC1", "helmet": "Marine versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Dystopian_Disruptive_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Dystopian_Disruptive_Polymath.jpeg" }, @@ -10730,7 +10730,7 @@ "background": "Sulphur", "skin": "IC2", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Recursive_Autonomous_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Recursive_Autonomous_Polymath.jpeg" }, @@ -10741,7 +10741,7 @@ "background": "Cypress", "skin": "IC1", "helmet": "Canopy versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Ethereal_Cryptic_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Ethereal_Cryptic_Polymath.jpeg" }, @@ -10851,7 +10851,7 @@ "background": "Nightfall", "skin": "IC6", "helmet": "Canopy versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Ethereal_Anarchic_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Ethereal_Anarchic_Polymath.jpeg" }, @@ -10873,7 +10873,7 @@ "background": "Nightfall", "skin": "IC1", "helmet": "Inferno versatility goggles", - "jacket": "Cyan tactical jacke", + "jacket": "Cyan tactical jacket", "image_400_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Sovereign_Defiant_Polymath.gif", "image_400_jpeg_url": "https://ordinal-operators.s3.amazonaws.com/Polymaths/400/Sovereign_Defiant_Polymath.jpeg" }, diff --git a/src/components/Dropdown/Dropdown.tsx b/src/components/Dropdown/Dropdown.tsx index 992bbd8..96ed2ee 100644 --- a/src/components/Dropdown/Dropdown.tsx +++ b/src/components/Dropdown/Dropdown.tsx @@ -84,14 +84,16 @@ const Dropdown: React.FC = ({ {isExpanded && ( - {options.map((option, index) => ( - handleSelect(option)} - label={option} - /> - ))} + + {options.map((option, index) => ( + handleSelect(option)} + label={option} + /> + ))} + @@ -176,4 +178,20 @@ const Button = styled.button` } ` +const ScrollDiv = styled.div` + max-height: 400px; + overflow-y: auto; + overflow-x: hidden; + box-sizing: border-box; + + // white scrollbar + &::-webkit-scrollbar { + width: 10px; + } + + &::-webkit-scrollbar-thumb { + background-color: white; + } +` + export default Dropdown diff --git a/src/containers/Explore/ExploreContainer.tsx b/src/containers/Explore/ExploreContainer.tsx index 005b109..a8d68ca 100644 --- a/src/containers/Explore/ExploreContainer.tsx +++ b/src/containers/Explore/ExploreContainer.tsx @@ -3,7 +3,7 @@ import { OperatorGrid } from '@/components/Explore/OperatorGrid' import { defaultFilterState } from '@/states/filterState' import styled from '@emotion/styled' import { hookstate, useHookstate } from '@hookstate/core' -import React from 'react' +import React, { useMemo } from 'react' import useGetOperators from '../../../apis/operators/useGetOperators' import { ARCHETYPE, @@ -17,7 +17,9 @@ import { processOperators, shuffleOperators } from '../../../utils/operators' interface ExploreSectionProps {} -const globalState = hookstate(defaultFilterState) +const globalState = hookstate(() => + JSON.parse(JSON.stringify(defaultFilterState)), +) const ExploreSection: React.FC = () => { const { data, isLoading } = useGetOperators() @@ -30,21 +32,14 @@ const ExploreSection: React.FC = () => { filter.archetype.slice(), ) - const selectedOperators = processedOperators?.filter((operator) => { - // filter by comp, skin, helmet, jacket, background - return ( - (filter.comp.length === 0 || - filter.comp.includes(operator.comp as string)) && - (filter.skin.length === 0 || - filter.skin.includes(operator.skin as string)) && - (filter.helmet.length === 0 || - filter.helmet.includes(operator.helmet as string)) && - (filter.jacket.length === 0 || - filter.jacket.includes(operator.jacket as string)) && - (filter.background.length === 0 || - filter.background.includes(operator.background as string)) - ) - }) + const selectedOperators = useMemo(() => { + const filterCopied = JSON.parse(JSON.stringify(filter)) + + return processedOperators + ?.filter((op) => filterCopied.comp.includes(op.comp)) + ?.filter((op) => filterCopied.skin.includes(op.skin)) + ?.filter((op) => filterCopied.background.includes(op.background)) + }, [processedOperators, filter]) const randomizedOperators = shuffleOperators(selectedOperators) @@ -52,7 +47,8 @@ const ExploreSection: React.FC = () => { selectedOptions: string[], filterType: string, ) => { - ;(state[filterType as keyof typeof filter] as any).set(selectedOptions) + // @ts-ignore + state[filterType].set(selectedOptions) } return ( diff --git a/utils/operators.ts b/utils/operators.ts index 7cc68c3..0705f99 100644 --- a/utils/operators.ts +++ b/utils/operators.ts @@ -78,3 +78,23 @@ export function shuffleOperators( } return array } + +export function extractUniqueValues(data: any, field: string) { + if (!data || !field) { + return [] + } + const uniqueValues = new Set() + + function traverse(item: any) { + if (item[field]) { + uniqueValues.add(item[field]) + } + if (item.operators && Array.isArray(item.operators)) { + item.operators?.forEach(traverse) + } + } + + data.forEach(traverse) + + return Array.from(uniqueValues) +}