feat: add option to hide member map pins on load

.env

@@ -20,6 +20,9 @@ VITE_COMMUNITY_PROGRAM_URL=https://community.preciousplastic.com/academy/guides/
 VITE_PROFILE_GUIDELINES_URL=https://community.preciousplastic.com/academy/guides/platform
 VITE_QUESTIONS_GUIDELINES_URL=https://community.preciousplastic.com/academy/guides/guidelines-questions
 
+# Optional variable for limiting the display of member map pins by default on load
+VITE_HIDE_MEMBER_PINS_BY_DEFAULT=false
+
 # For testing, VITE_PLATFORM_PROFILES in localStorage is prioritised over this value
 # All valid options for VITE_PLATFORM_PROFILES: "member,workspace,community-builder,space,collection-point,machine-builder"
 VITE_PLATFORM_PROFILES="member,workspace,community-builder,collection-point,machine-builder"

packages/cypress/src/integration/map.spec.ts

@@ -4,17 +4,22 @@ const urlLondon =
   'https://nominatim.openstreetmap.org/search?format=json&q=london&accept-language=en'
 
 describe('[Map]', () => {
-  beforeEach(() => {
-    localStorage.setItem('VITE_THEME', 'fixing-fashion')
-  })
-
   it('[Shows expected pins]', () => {
+    localStorage.setItem('VITE_THEME', 'fixing-fashion')
     cy.viewport('macbook-16')
 
     cy.step('Shows all pins onload')
     cy.visit('/map')
     cy.title().should('include', `Map`)
 
+    cy.step('No filters selected by default')
+    cy.visit('/map')
+    cy.get('[data-cy=MapFilterProfileTypeCardList]')
+      .first()
+      .within(() => {
+        cy.get('[data-cy="MapListFilter-active"]').should('have.length', 0)
+      })
+
     cy.step('Shows the cards')
     cy.get('[data-cy="CardList-desktop"]').should('be.visible')
     cy.get('[data-cy="list-results"]').contains(/\d+ results in view/)
@@ -124,4 +129,18 @@ describe('[Map]', () => {
     cy.step('LocationViewButton visable and clickable')
     cy.get('[data-cy="LocationViewButton"]').click()
   })
+
+  it("Doesn't show member pins when config is set", () => {
+    localStorage.setItem('VITE_THEME', 'precious-plastic') // Not essential
+    localStorage.setItem('VITE_HIDE_MEMBER_PINS_BY_DEFAULT', 'true')
+
+    cy.step('Every profile type other than member is set')
+    cy.visit('/map')
+    cy.get('[data-cy=MapFilterProfileTypeCardList]')
+      .first()
+      .within(() => {
+        cy.get('[data-cy="MapListFilter-active"]').should('have.length', 4)
+        cy.get('[data-cy="MapListFilter"]').should('have.length', 1)
+      })
+  })
 })

src/config/config.ts

@@ -172,6 +172,10 @@ export const VITE_PLATFORM_PROFILES = getFromLocalStorage(
   'VITE_PLATFORM_PROFILES',
 )
 
+export const VITE_HIDE_MEMBER_PINS_BY_DEFAULT = getFromLocalStorage(
+  'VITE_HIDE_MEMBER_PINS_BY_DEFAULT',
+)
+
 export const isPreciousPlastic = (): boolean => {
   return getFromLocalStorage('VITE_THEME') === 'precious-plastic'
 }

src/config/constants.ts

@@ -28,6 +28,7 @@ export const _supportedConfigurationOptions = [
   'VITE_PATREON_CLIENT_ID',
   'VITE_API_URL',
   'VITE_SITE_NAME',
+  'VITE_HIDE_MEMBER_PINS_BY_DEFAULT',
 ] as const
 
 export type ConfigurationOption =

src/pages/Maps/Content/MapView/MapContainer.tsx

@@ -3,6 +3,7 @@ import { useLocation, useNavigate } from 'react-router-dom'
 import { Flex } from 'theme-ui'
 
 import { filterPins } from '../../utils/filterPins'
+import { setDefaultPinFilters } from '../../utils/setDefaultPinFilters'
 import { latLongFilter } from './latLongFilter'
 import { MapList } from './MapList'
 import { MapView } from './MapView'
@@ -41,6 +42,13 @@ export const MapContainer = (props: IProps) => {
     }
   }, [allPins])
 
+  useEffect(() => {
+    if (allToggleFilters) {
+      const defaultSetFilteringOptions = setDefaultPinFilters(allToggleFilters)
+      setActivePinFilters(defaultSetFilteringOptions)
+    }
+  }, [allToggleFilters])
+
   useEffect(() => {
     if (allPins) {
       const filteredByLocation = boundaries

src/pages/Maps/utils/setDefaultPinFilters.test.ts

@@ -0,0 +1,28 @@
+import { describe, expect, it } from 'vitest'
+
+import { setDefaultPinFilters } from './setDefaultPinFilters'
+
+describe('setDefaultPinFilters', () => {
+  const filterOptions = [
+    {
+      _id: 'workspace',
+      filterType: 'profileType',
+      label: 'Workspace',
+    },
+    {
+      _id: 'member',
+      filterType: 'profileType',
+      label: 'Member',
+    },
+  ]
+
+  it('returns nothing when hideMembers is false', () => {
+    expect(setDefaultPinFilters(filterOptions, false)).toEqual([])
+  })
+
+  it('returns non-member options when hideMembers is true', () => {
+    expect(setDefaultPinFilters(filterOptions, true)).toEqual([
+      filterOptions[0],
+    ])
+  })
+})

src/pages/Maps/utils/setDefaultPinFilters.ts

@@ -0,0 +1,20 @@
+import { VITE_HIDE_MEMBER_PINS_BY_DEFAULT } from 'src/config/config'
+
+import type { MapFilterOptionsList } from 'oa-shared'
+
+const hideMembersDefault =
+  VITE_HIDE_MEMBER_PINS_BY_DEFAULT === 'true' ? true : false
+
+export const setDefaultPinFilters = (
+  filterOptions: MapFilterOptionsList,
+  hideMembers = hideMembersDefault,
+) => {
+  if (hideMembers) {
+    const options = filterOptions.filter(
+      ({ _id, filterType }) => _id !== 'member' && filterType === 'profileType',
+    )
+    return options
+  }
+
+  return []
+}