+
+
+
+
+
+);
diff --git a/src/components/filters/Location.tsx b/src/components/filters/Location.tsx
new file mode 100644
index 0000000..3259adb
--- /dev/null
+++ b/src/components/filters/Location.tsx
@@ -0,0 +1,91 @@
+import Graphic from '@arcgis/core/Graphic';
+import { Button, featureServiceProvider, multiProvider, Sherlock, Tag, TagGroup } from '@ugrc/utah-design-system';
+import { useEffect } from 'react';
+import { useListData } from 'react-stately';
+import config from '../../config';
+import { useFilter } from '../contexts/FilterProvider';
+
+const streamsProvider = featureServiceProvider(
+ config.urls.streams,
+ config.fieldNames.WaterName,
+ // @ts-ignore
+ config.fieldNames.COUNTY,
+);
+const lakesProvider = featureServiceProvider(
+ config.urls.lakes,
+ config.fieldNames.WaterName,
+ // @ts-ignore
+ config.fieldNames.COUNTY,
+);
+const provider = multiProvider([streamsProvider, lakesProvider]);
+const filterKey = 'location';
+
+export default function Location(): JSX.Element {
+ const list = useListData
+
+ );
+}
diff --git a/src/config.ts b/src/config.ts
index 62cba4d..47d6b10 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -6,6 +6,7 @@ const databaseSecrets: { databaseName: string; user: string } = JSON.parse(impor
// TODO: this should come from an env var once we get UtahID wired up
const arcgisServerHost = 'wrimaps.utah.gov';
const mapService = `https://${arcgisServerHost}/arcgis/rest/services/Electrofishing/Public/MapServer`;
+const referenceMapService = `https://${arcgisServerHost}/arcgis/rest/services/Electrofishing/Reference/MapServer`;
const config = {
MIN_DESKTOP_WIDTH: 768,
@@ -59,6 +60,8 @@ const config = {
fish: `${mapService}/2`,
landownership:
'https://gis.trustlands.utah.gov/hosting/rest/services/Hosted/Land_Ownership_WM_VectorTile/VectorTileServer',
+ streams: `${referenceMapService}/0`,
+ lakes: `${referenceMapService}/1`,
},
};
Location
+
+ list.remove(...keys)}
+ items={list.items}
+ selectionMode="multiple"
+ >
+ {(graphic: Graphic) => {
+ const attributes = graphic.attributes;
+ const name = `${attributes[config.fieldNames.WaterName]} (${attributes[config.fieldNames.COUNTY]})`;
+
+ return {name} ;
+ }}
+
+
+
+
+
+