Move underpass configs to config/underpass file

hotosm · Apr 3, 2024 · bb9a5ed · bb9a5ed
1 parent 07969fe
commit bb9a5ed
Show file tree

Hide file tree

Showing 2 changed files with 78 additions and 71 deletions.
diff --git a/frontend/src/config/underpass.js b/frontend/src/config/underpass.js
@@ -0,0 +1,67 @@
+import { MAPBOX_TOKEN, UNDERPASS_URL } from '.';
+
+export const underpassConfig = {
+  API_URL: UNDERPASS_URL,
+  MAPBOX_TOKEN,
+  // set default sources of Tasking Manager
+  sources: {
+    osm: {
+      type: 'raster',
+      tiles: ['https://a.tile.openstreetmap.org/{z}/{x}/{y}.png'],
+      tileSize: 256,
+      attribution: '&copy; OpenStreetMap Contributors',
+      maxzoom: 19,
+    },
+    Bing: {
+      type: 'raster',
+      tiles: ['https://ecn.t3.tiles.virtualearth.net/tiles/a{quadkey}.jpeg?g=1'],
+      tileSize: 256,
+      attribution: '&copy; OpenStreetMap Contributors',
+      maxzoom: 18,
+    },
+    Mapbox: {
+      type: 'raster',
+      tiles: [
+        `https://api.mapbox.com/styles/v1/mapbox/satellite-v9/tiles/{z}/{x}/{y}?access_token=${MAPBOX_TOKEN}`,
+      ],
+      tileSize: 512,
+      attribution: '&copy; OpenStreetMap Contributors &copy; Mapbox',
+      maxzoom: 19,
+    },
+    EsriWorldImagery: {
+      type: 'raster',
+      tiles: [
+        'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
+      ],
+      tileSize: 256,
+      attribution: '&copy; OpenStreetMap Contributors &copy; ESRI',
+      maxzoom: 18,
+    },
+  },
+};
+
+export const availableImageryOptions = [
+  { label: 'OSM', value: 'osm' },
+  { label: 'Bing', value: 'Bing' },
+  { label: 'Mapbox Satellite', value: 'Mapbox' },
+  { label: 'ESRI World Imagery', value: 'EsriWorldImagery' },
+];
+
+export const statusList = {
+  ALL: '',
+  UNSQUARED: 'badgeom',
+  OVERLAPPING: 'overlapping',
+  BADVALUE: 'badvalue',
+};
+
+export const mappingTypesTags = {
+  ROADS: 'highway',
+  BUILDINGS: 'building',
+  WATERWAYS: 'waterway',
+};
+
+export const mappingTypesFeatureTypes = {
+  ROADS: 'line',
+  BUILDINGS: 'polygon',
+  WATERWAYS: 'line',
+};
diff --git a/frontend/src/views/projectLiveMonitoring.js b/frontend/src/views/projectLiveMonitoring.js
@@ -17,77 +17,17 @@ import { ProjectStatusBox } from '../components/projectDetail/statusBox';
 import { useSetTitleTag } from '../hooks/UseMetaTags';
 import { useFetch } from '../hooks/UseFetch';
 import useHasLiveMonitoringFeature from '../hooks/UseHasLiveMonitoringFeature';
+import {
+  underpassConfig,
+  availableImageryOptions,
+  statusList,
+  mappingTypesTags,
+  mappingTypesFeatureTypes,
+} from '../config/underpass';
 import './projectLiveMonitoring.css';
-import { MAPBOX_TOKEN, UNDERPASS_URL } from '../config';
-
-const availableImageryOptions = [
-  { label: 'OSM', value: 'osm' },
-  { label: 'Bing', value: 'Bing' },
-  { label: 'Mapbox Satellite', value: 'Mapbox' },
-  { label: 'ESRI World Imagery', value: 'EsriWorldImagery' },
-];
 
 const availableImageryValues = availableImageryOptions.map((item) => item.value);
 
-const config = {
-  API_URL: UNDERPASS_URL,
-  MAPBOX_TOKEN: MAPBOX_TOKEN,
-  // set default sources of Tasking Manager
-  sources: {
-    osm: {
-      type: 'raster',
-      tiles: ['https://a.tile.openstreetmap.org/{z}/{x}/{y}.png'],
-      tileSize: 256,
-      attribution: '&copy; OpenStreetMap Contributors',
-      maxzoom: 19,
-    },
-    Bing: {
-      type: 'raster',
-      tiles: ['https://ecn.t3.tiles.virtualearth.net/tiles/a{quadkey}.jpeg?g=1'],
-      tileSize: 256,
-      attribution: '&copy; OpenStreetMap Contributors',
-      maxzoom: 18,
-    },
-    Mapbox: {
-      type: 'raster',
-      tiles: [
-        `https://api.mapbox.com/styles/v1/mapbox/satellite-v9/tiles/{z}/{x}/{y}?access_token=${MAPBOX_TOKEN}`,
-      ],
-      tileSize: 512,
-      attribution: '&copy; OpenStreetMap Contributors &copy; Mapbox',
-      maxzoom: 19,
-    },
-    EsriWorldImagery: {
-      type: 'raster',
-      tiles: [
-        'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
-      ],
-      tileSize: 256,
-      attribution: '&copy; OpenStreetMap Contributors &copy; ESRI',
-      maxzoom: 18,
-    },
-  },
-};
-
-const statusList = {
-  ALL: '',
-  UNSQUARED: 'badgeom',
-  OVERLAPPING: 'overlapping',
-  BADVALUE: 'badvalue',
-};
-
-const mappingTypesTags = {
-  ROADS: 'highway',
-  BUILDINGS: 'building',
-  WATERWAYS: 'waterway',
-};
-
-const mappingTypesFeatureTypes = {
-  ROADS: 'line',
-  BUILDINGS: 'polygon',
-  WATERWAYS: 'line',
-};
-
 export function ProjectLiveMonitoring() {
   const { id } = useParams();
   const dispatch = useDispatch();
@@ -98,7 +38,7 @@ export function ProjectLiveMonitoring() {
   const [featureType, setFeatureType] = useState('polygon');
   const [mapSource, setMapSource] = useState('osm');
   const [imageryOptions, setImageryOptions] = useState(availableImageryOptions);
-  const [mapConfig, setMapConfig] = useState(config);
+  const [mapConfig, setMapConfig] = useState(underpassConfig);
   const [realtimeList, setRealtimeList] = useState(false);
   const [realtimeMap, setRealtimeMap] = useState(false);
   const [listAll, setListAll] = useState(false);
@@ -332,14 +272,14 @@ export function ProjectLiveMonitoring() {
                 tags={tags}
                 hashtag={'hotosm-project-' + id}
                 featureType={featureType}
-                apiUrl={config.API_URL}
+                apiUrl={underpassConfig.API_URL}
                 area={areaOfInterest}
               />
               <UnderpassValidationStats
                 tags={tags}
                 hashtag={'hotosm-project-' + id}
                 featureType={featureType}
-                apiUrl={config.API_URL}
+                apiUrl={underpassConfig.API_URL}
                 status="badgeom"
                 area={areaOfInterest}
               />
@@ -392,7 +332,7 @@ export function ProjectLiveMonitoring() {
                 setActiveFeature({ properties: { tags, status }, ...feature });
               }}
               realtime={realtimeList}
-              config={config}
+              config={underpassConfig}
               status={listAll ? '' : status}
               orderBy="created_at"
               onFetchFirstTime={(mostRecentFeature) => {