Add types for react-leaflet-universal

app/package-lock.json

@@ -1037,6 +1037,12 @@
         "@types/node": "*"
       }
     },
+    "@types/geojson": {
+      "version": "7946.0.7",
+      "resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.7.tgz",
+      "integrity": "sha512-wE2v81i4C4Ol09RtsWFAqg3BUitWbHSpSlIo+bNdsCJijO9sjme+zm+73ZMCa/qMC8UEERxzGbvmr1cffo2SiQ==",
+      "dev": true
+    },
     "@types/glob": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.1.1.tgz",
@@ -1075,6 +1081,15 @@
       "integrity": "sha512-Il2DtDVRGDcqjDtE+rF8iqg1CArehSK84HZJCT7AMITlyXRBpuPhqGLDQMowraqqu1coEaimg4ZOqggt6L6L+A==",
       "dev": true
     },
+    "@types/leaflet": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/@types/leaflet/-/leaflet-1.5.1.tgz",
+      "integrity": "sha512-E5k+vyE2Tv9wQsO6ZsEy08Pjd8RjHPkCzz3Ubt7feMc+5+VkbXtcZMcciczRWuMN5rFIsVywLxRhvTp7fAbbzg==",
+      "dev": true,
+      "requires": {
+        "@types/geojson": "*"
+      }
+    },
     "@types/mime": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/@types/mime/-/mime-2.0.1.tgz",
@@ -1139,6 +1154,16 @@
         "@types/react": "*"
       }
     },
+    "@types/react-leaflet": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/@types/react-leaflet/-/react-leaflet-2.4.0.tgz",
+      "integrity": "sha512-kDZ2Ky6FQxXRODBEFlq25Lu80Nc7UsDSHCmHTa22UQn2RIJxe3O443K0vzOrFyzWPpVEOmqBpfDkX9QSTBoFxg==",
+      "dev": true,
+      "requires": {
+        "@types/leaflet": "*",
+        "@types/react": "*"
+      }
+    },
     "@types/react-router": {
       "version": "5.0.3",
       "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.0.3.tgz",
@@ -10515,7 +10540,7 @@
         },
         "semver": {
           "version": "4.3.2",
-          "resolved": "http://registry.npmjs.org/semver/-/semver-4.3.2.tgz",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-4.3.2.tgz",
           "integrity": "sha1-x6BxWKgL7dBSNVt3DYLWZA+AO+c="
         }
       }

app/package.json

@@ -45,6 +45,7 @@
     "@types/prop-types": "^15.7.1",
     "@types/react": "^16.9.1",
     "@types/react-dom": "^16.8.5",
+    "@types/react-leaflet": "^2.4.0",
     "@types/react-router-dom": "^4.3.4",
     "@types/webpack-env": "^1.14.0",
     "babel-eslint": "^10.0.2",

app/src/frontend/map/map.tsx

@@ -1,5 +1,6 @@
-import React, { Component, Fragment } from 'react';
+import { LatLngExpression } from 'leaflet';
 import PropTypes from 'prop-types';
+import React, { Component, Fragment } from 'react';
 import { Map, TileLayer, ZoomControl, AttributionControl } from 'react-leaflet-universal';
 
 import '../../../node_modules/leaflet/dist/leaflet.css'
@@ -13,10 +14,16 @@ import ThemeSwitcher from './theme-switcher';
 
 const OS_API_KEY = 'NVUxtY5r8eA6eIfwrPTAGKrAAsoeI9E9';
 
+interface ColouringMapState {
+    theme: 'light' | 'night';
+    lat: number;
+    lng: number;
+    zoom: number;
+}
 /**
  * Map area
  */
-class ColouringMap extends Component<any, any> { // TODO: add proper types
+class ColouringMap extends Component<any, ColouringMapState> { // TODO: add proper types
     static propTypes = { // TODO: generate propTypes from TS
         building: PropTypes.object,
         revision_id: PropTypes.number,
@@ -91,7 +98,7 @@ class ColouringMap extends Component<any, any> { // TODO: add proper types
     }
 
     render() {
-        const position = [this.state.lat, this.state.lng];
+        const position: LatLngExpression = [this.state.lat, this.state.lng];
 
         // baselayer
         const key = OS_API_KEY

app/src/frontend/map/react-leaflet-universal.d.ts

@@ -0,0 +1,3 @@
+declare module 'react-leaflet-universal' {
+    export * from 'react-leaflet';
+}