From bb9a5ed1006a5a4ddbd458733c4a020f7b7f0ac4 Mon Sep 17 00:00:00 2001 From: royallsilwallz Date: Wed, 3 Apr 2024 22:33:36 +0545 Subject: [PATCH] Move underpass configs to config/underpass file --- frontend/src/config/underpass.js | 67 +++++++++++++++++ frontend/src/views/projectLiveMonitoring.js | 82 +++------------------ 2 files changed, 78 insertions(+), 71 deletions(-) create mode 100644 frontend/src/config/underpass.js diff --git a/frontend/src/config/underpass.js b/frontend/src/config/underpass.js new file mode 100644 index 0000000000..62359cba05 --- /dev/null +++ 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: '© OpenStreetMap Contributors', + maxzoom: 19, + }, + Bing: { + type: 'raster', + tiles: ['https://ecn.t3.tiles.virtualearth.net/tiles/a{quadkey}.jpeg?g=1'], + tileSize: 256, + attribution: '© 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: '© OpenStreetMap Contributors © Mapbox', + maxzoom: 19, + }, + EsriWorldImagery: { + type: 'raster', + tiles: [ + 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', + ], + tileSize: 256, + attribution: '© OpenStreetMap Contributors © 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 index 6878bab7e3..4a1647391d 100644 --- 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: '© OpenStreetMap Contributors', - maxzoom: 19, - }, - Bing: { - type: 'raster', - tiles: ['https://ecn.t3.tiles.virtualearth.net/tiles/a{quadkey}.jpeg?g=1'], - tileSize: 256, - attribution: '© 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: '© OpenStreetMap Contributors © Mapbox', - maxzoom: 19, - }, - EsriWorldImagery: { - type: 'raster', - tiles: [ - 'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', - ], - tileSize: 256, - attribution: '© OpenStreetMap Contributors © 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} /> @@ -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) => {