filtering now only uses main zones

Author: DonovanAndrews300

src/components/Filters/MultiSelect.tsx

@@ -33,6 +33,7 @@ const MultiSelect: FC<MultiSelectProps> = ({
       <SelectFilter
         aria-describedby={aria_describedby_label}
         items={options}
+        searchable
         variant="flat"
         size="md"
         radius="md"

src/components/Filters/filterOptions.ts

@@ -414,39 +414,29 @@ export const rcos: string[] = [
 ];
 
 export const zoning: string[] = [
-  'CA-1',
-  'CA-2',
-  'CMX-1',
-  'CMX-2',
-  'CMX-2.5',
-  'CMX-3',
-  'CMX-4',
-  'CMX-5',
-  'I-1',
-  'I-2',
-  'I-3',
-  'I-P',
+  'CA',
+  'CMX',
+  'I',
   'ICMX',
   'IRMX',
-  'RM-1',
-  'RM-2',
-  'RM-3',
-  'RM-4',
-  'RMX-1',
-  'RMX-2',
-  'RMX-3',
-  'RSA-1',
-  'RSA-2',
-  'RSA-3',
-  'RSA-4',
-  'RSA-5',
-  'RSA-6',
-  'RSD-1',
-  'RSD-2',
-  'RSD-3',
-  'RTA-1',
-  'SP-AIR',
-  'SP-INS',
-  'SP-PO-A',
-  'SP-STA',
+  'RM',
+  'RMX',
+  'RSA',
+  'RSD',
+  'RTA',
+  'SP',
 ];
+
+export const subZoning: Record<string, string[]> = {
+  CA: ['CA-1', 'CA-2'],
+  RSD: ['RSD-1', 'RSD-2', 'RSD-3'],
+  RTA: ['RTA-1'],
+  RM: ['RM-1', 'RM-2', 'RM-3', 'RM-4'],
+  RMX: ['RMX-1', 'RMX-2', 'RMX-3'],
+  CAX: ['CAX'],
+  CMX: ['CMX-1', 'CMX-2', 'CMX-2.5', 'CMX-3', 'CMX-4', 'CMX-5'],
+  IRMX: ['IRMX'],
+  ICMX: ['ICMX'],
+  I: ['I-1', 'I-2', 'I-3', 'I-P'],
+  SP: ['SP-AIR', 'SP-INS', 'SP-PO-A', 'SP-STA'],
+};

src/components/PropertyMap.tsx

@@ -16,6 +16,7 @@ import {
   useStagingTiles,
   googleCloudBucketName,
 } from '../config/config';
+import { subZoning } from './Filters/filterOptions';
 import { useFilter } from '@/context/FilterContext';
 import Map, {
   Source,
@@ -396,14 +397,18 @@ const PropertyMap: FC<PropertyMapProps> = ({
           if (filterItem.values.length) {
             const thisFilterGroup: any = ['any'];
             filterItem.values.forEach((item) => {
-              if (filterItem.useIndexOfFilter) {
-                thisFilterGroup.push([
-                  '>=',
-                  ['index-of', item, ['get', property]],
-                  0,
-                ]);
-              } else {
-                thisFilterGroup.push(['in', ['get', property], item]);
+              if (Object.keys(subZoning).includes(item)) {
+                subZoning[item].forEach((subZone: string) => {
+                  if (filterItem) {
+                    thisFilterGroup.push([
+                      '>=',
+                      ['index-of', subZone, ['get', property]],
+                      0,
+                    ]);
+                  } else {
+                    thisFilterGroup.push(['in', ['get', property], subZone]);
+                  }
+                });
               }
             });