StaticDatasets: render geojson exactly like pmtiles

FixMyBerlin · Jun 5, 2024 · 978907c · 978907c
1 parent 38e47af
commit 978907c
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 25 deletions.
diff --git a/...pp/regionen/[regionSlug]/_components/Map/SourcesAndLayers/SourcesLayersStaticDatasets.tsx b/...pp/regionen/[regionSlug]/_components/Map/SourcesAndLayers/SourcesLayersStaticDatasets.tsx
@@ -1,4 +1,5 @@
 import { Layer, LayerProps, Source } from 'react-map-gl/maplibre'
+import { LayerSpecification } from 'maplibre-gl'
 import { useMapDebugState } from 'src/app/regionen/[regionSlug]/_hooks/mapStateInteraction/useMapDebugState'
 import { useDataParam } from 'src/app/regionen/[regionSlug]/_hooks/useQueryState/useDataParam'
 import { useRegionDatasets } from '../../../_hooks/useRegionDatasets/useRegionDatasets'
@@ -31,33 +32,13 @@ export const SourcesLayersStaticDatasets: React.FC = () => {
             ? { type: 'geojson', data: url }
             : { type: 'vector', url: createPmtilesUrl(url) }
 
-        if (sourceProps.type === 'geojson') {
-          return (
-            <Source
-              id={datasetSourceId}
-              key={datasetSourceId}
-              attribution={attributionHtml}
-              {...sourceProps}
-            >
-              <Layer
-                id="lineLayer"
-                type="line"
-                source="debug"
-                paint={{
-                  'line-color': 'red',
-                  'line-width': 5,
-                }}
-              />
-            </Source>
-          )
-        }
-
         return (
+          // @ts-ignore - see comment at {...sourceProps}
           <Source
             id={datasetSourceId}
             key={datasetSourceId}
             attribution={attributionHtml}
-            {...sourceProps}
+            {...sourceProps} // type inference fails here - maybe a typescript bug?
           >
             {layers.map((layer) => {
               const layout =
@@ -75,12 +56,12 @@ export const SourcesLayersStaticDatasets: React.FC = () => {
                   }).find((l) => l.type === layer.type)?.paint
                 : (layer.paint as any)
 
-              const layerProps = {
+              let layerProps: LayerSpecification = {
                 id: layerId,
                 source: datasetSourceId,
-                'source-layer': 'default', // set in `datasets/process.ts`
                 type: layer.type,
                 layout: layout,
+                // @ts-ignore
                 filter: layerFilter,
                 paint: layerPaint,
                 beforeId:
@@ -89,7 +70,11 @@ export const SourcesLayersStaticDatasets: React.FC = () => {
                     : 'atlas-app-beforeid-fallback',
               }
 
-              // To get LayerHighlight working some more refactoring is needed to harmoize sourceData and datasetsData
+              if (type === 'PMTILES') {
+                layerProps['source-layer'] = 'default'
+              }
+
+              // To get LayerHighlight working some more refactoring is needed to harmonize sourceData and datasetsData
               // <LayerHighlight {...layerProps} />
               return <Layer key={layerId} {...(layerProps as LayerProps)} />
             })}

diff --git a/src/app/regionen/[regionSlug]/_hooks/useRegionDatasets/useRegionDatasets.ts b/src/app/regionen/[regionSlug]/_hooks/useRegionDatasets/useRegionDatasets.ts
@@ -20,6 +20,7 @@ export const useRegionDatasets = () => {
       isPublic: boolean
       id: string
       url: string
+      type: 'PMTILES' | 'GEOJSON'
       githubUrl: string // an addition to MetaData['configs'] in updateStaticDatasets.ts
     }
   >