Merge pull request #670 from mz8i/update-dependencies-202104
Update core dependencies (2021/04)
This commit is contained in:
Maciej Ziarkowski
GitHub
commit
beed55d6d0
16649
app/package-lock.json
generated
16649
app/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -16,58 +16,64 @@
|
||||
"@fortawesome/fontawesome-svg-core": "^1.2.30",
|
||||
"@fortawesome/free-solid-svg-icons": "^5.14.0",
|
||||
"@fortawesome/react-fontawesome": "^0.1.11",
|
||||
"@loadable/component": "^5.14.1",
|
||||
"@mapbox/sphericalmercator": "^1.1.0",
|
||||
"ajv": "^7.1.1",
|
||||
"ajv-formats": "^1.5.1",
|
||||
"babel-runtime": "^6.26.0",
|
||||
"body-parser": "^1.19.0",
|
||||
"bootstrap": "^4.5.0",
|
||||
"canvas-confetti": "^1.2.0",
|
||||
"connect-pg-simple": "^6.1.0",
|
||||
"express": "^4.17.1",
|
||||
"express-session": "^1.17.1",
|
||||
"leaflet": "^1.6.0",
|
||||
"lodash.isequal": "^4.5.0",
|
||||
"mapnik": "^4.4.0",
|
||||
"geojson": "^0.5.0",
|
||||
"leaflet": "^1.7.1",
|
||||
"lodash": "^4.17.21",
|
||||
"mapnik": "^4.5.8",
|
||||
"node-fs": "^0.1.7",
|
||||
"nodemailer": "^6.4.11",
|
||||
"pg-promise": "^8.7.5",
|
||||
"query-string": "^6.13.1",
|
||||
"react": "^16.13.1",
|
||||
"react-dom": "^16.13.1",
|
||||
"react-leaflet": "^1.0.1",
|
||||
"react-leaflet-universal": "^2.2.1",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-leaflet": "^3.1.0",
|
||||
"react-router-dom": "^5.2.0",
|
||||
"serialize-javascript": "^2.1.1",
|
||||
"sharp": "^0.22.1",
|
||||
"serialize-javascript": "^5.0.1",
|
||||
"sharp": "^0.28.1",
|
||||
"use-throttle": "0.0.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/express": "^4.17.7",
|
||||
"@types/express-session": "^1.17.0",
|
||||
"@types/jest": "^24.9.1",
|
||||
"@types/lodash": "^4.14.158",
|
||||
"@types/lodash.isequal": "^4.5.5",
|
||||
"@types/geojson": "^7946.0.7",
|
||||
"@types/jest": "^26.0.22",
|
||||
"@types/leaflet": "^1.7.0",
|
||||
"@types/loadable__component": "^5.13.3",
|
||||
"@types/lodash": "^4.14.168",
|
||||
"@types/mapbox__sphericalmercator": "^1.1.3",
|
||||
"@types/node": "^12.12.53",
|
||||
"@types/nodemailer": "^6.4.0",
|
||||
"@types/react": "^16.9.44",
|
||||
"@types/react-dom": "^16.9.8",
|
||||
"@types/react-leaflet": "^2.5.2",
|
||||
"@types/react": "^17.0.3",
|
||||
"@types/react-dom": "^17.0.3",
|
||||
"@types/react-router-dom": "^4.3.5",
|
||||
"@types/sharp": "^0.22.3",
|
||||
"@types/webpack-env": "^1.15.2",
|
||||
"@typescript-eslint/eslint-plugin": "^2.34.0",
|
||||
"@typescript-eslint/parser": "^2.34.0",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"copy-webpack-plugin": "^6.2.1",
|
||||
"eslint": "^5.16.0",
|
||||
"eslint-plugin-jest": "^22.21.0",
|
||||
"eslint-plugin-react": "^7.20.5",
|
||||
"razzle": "^3.1.6",
|
||||
"razzle-plugin-typescript": "^3.1.6",
|
||||
"ts-jest": "^24.3.0",
|
||||
"typescript": "^3.9.7"
|
||||
"@types/sharp": "^0.28.0",
|
||||
"@types/webpack-env": "^1.16.0",
|
||||
"@typescript-eslint/eslint-plugin": "^4.22.0",
|
||||
"@typescript-eslint/parser": "^4.22.0",
|
||||
"copy-webpack-plugin": "^8.1.1",
|
||||
"eslint": "^7.24.0",
|
||||
"eslint-plugin-jest": "^24.3.5",
|
||||
"eslint-plugin-react": "^7.23.2",
|
||||
"html-webpack-plugin": "^5.2.0",
|
||||
"mini-css-extract-plugin": "^0.9.0",
|
||||
"postcss": "^8.2.4",
|
||||
"razzle": "^4.0.4",
|
||||
"razzle-dev-utils": "^4.0.4",
|
||||
"razzle-plugin-typescript": "^4.0.4",
|
||||
"ts-jest": "^26.5.5",
|
||||
"typescript": "^4.2.4",
|
||||
"webpack": "^5.24.0",
|
||||
"webpack-dev-server": "^3.11.0"
|
||||
},
|
||||
"jest": {
|
||||
"transform": {
|
||||
|
||||
@ -1,37 +1,31 @@
|
||||
const CopyWebpackPlugin = require('copy-webpack-plugin');
|
||||
const CopyPlugin = require('copy-webpack-plugin');
|
||||
|
||||
module.exports = {
|
||||
plugins: [
|
||||
{
|
||||
name: "typescript",
|
||||
name: 'typescript',
|
||||
options: {
|
||||
useBabel: true,
|
||||
useEslint: true,
|
||||
forkTsChecker: {
|
||||
tsconfig: "./tsconfig.json",
|
||||
tslint: undefined,
|
||||
watch: "./src",
|
||||
typeCheck: true,
|
||||
eslint: undefined // { files: './src/**/*.{ts,tsx,js,jsx}' }
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
modify: (config, { target, dev }, webpack) => {
|
||||
modifyWebpackConfig({ env: { target, dev }, webpackConfig }) {
|
||||
// load webfonts
|
||||
const rules = config.module.rules || [];
|
||||
rules.push({
|
||||
webpackConfig.module.rules = webpackConfig.module.rules || [];
|
||||
webpackConfig.module.rules.push({
|
||||
test: /\.(eot|svg|ttf|woff|woff2)$/,
|
||||
loader: 'file-loader?name=public/fonts/[name].[ext]'
|
||||
})
|
||||
config.module.rules = rules;
|
||||
type: 'asset/resource'
|
||||
});
|
||||
|
||||
// add the map_styles directory to the build output
|
||||
const plugins = config.plugins || [];
|
||||
plugins.push(new CopyWebpackPlugin({
|
||||
patterns: [ {from: 'map_styles', to: "map_styles"}]
|
||||
const plugins = webpackConfig.plugins || [];
|
||||
plugins.push(new CopyPlugin({
|
||||
patterns: [ {from: 'map_styles', to: 'map_styles'}]
|
||||
}));
|
||||
config.plugins = plugins;
|
||||
webpackConfig.plugins = plugins;
|
||||
|
||||
return config;
|
||||
return webpackConfig;
|
||||
},
|
||||
};
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import * as _ from 'lodash';
|
||||
import _ from 'lodash';
|
||||
|
||||
import { ArgumentError } from '../../../errors/general';
|
||||
import { LandUseState, updateLandUse } from '../../domainLogic/landUse';
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
* Building data access
|
||||
*
|
||||
*/
|
||||
import * as _ from 'lodash';
|
||||
import _ from 'lodash';
|
||||
|
||||
import { pickFields } from '../../../helpers';
|
||||
import { dataFieldsConfig } from '../../config/dataFields';
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { ITask } from 'pg-promise';
|
||||
import * as _ from 'lodash';
|
||||
import _ from 'lodash';
|
||||
|
||||
import db from '../../../db';
|
||||
import * as buildingDataAccess from '../../dataAccess/building';
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import * as _ from 'lodash';
|
||||
import _ from 'lodash';
|
||||
|
||||
import { hasAnyOwnProperty } from '../../../helpers';
|
||||
import { Building, BuildingUpdate } from '../../config/dataFields';
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import React, { useCallback, useState } from 'react'
|
||||
import * as _ from 'lodash';
|
||||
import _ from 'lodash';
|
||||
|
||||
import { BuildingAttributes } from '../../../models/building';
|
||||
import { FieldRow } from '../../data-components/field-row';
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import isEqual from 'lodash.isequal';
|
||||
import _ from 'lodash';
|
||||
import urlapi from 'url';
|
||||
|
||||
function sanitiseURL(string){
|
||||
@ -67,7 +67,7 @@ function compareObjects(objA: object, objB: object): [object, object] {
|
||||
const reverse = {};
|
||||
const forward = {};
|
||||
for (const [key, value] of Object.entries(objB)) {
|
||||
if (!isEqual(objA[key], value)) {
|
||||
if (!_.isEqual(objA[key], value)) {
|
||||
reverse[key] = objA[key];
|
||||
forward[key] = value;
|
||||
}
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import React, { useCallback, useEffect, useState } from 'react';
|
||||
import { Redirect, Route, Switch } from 'react-router-dom';
|
||||
import loadable from '@loadable/component';
|
||||
|
||||
import { useRevisionId } from './hooks/use-revision';
|
||||
import { useBuildingData } from './hooks/use-building-data';
|
||||
@ -14,7 +15,6 @@ import Categories from './building/categories';
|
||||
import { EditHistory } from './building/edit-history/edit-history';
|
||||
import MultiEdit from './building/multi-edit';
|
||||
import Sidebar from './building/sidebar';
|
||||
import ColouringMap from './map/map';
|
||||
import { Building, UserVerified } from './models/building';
|
||||
import Welcome from './pages/welcome';
|
||||
import { PrivateRoute } from './route';
|
||||
@ -23,6 +23,22 @@ import { Category } from './config/categories-config';
|
||||
import { defaultMapCategory } from './config/category-maps-config';
|
||||
import { useMultiEditData } from './hooks/use-multi-edit-data';
|
||||
|
||||
/**
|
||||
* Load and render ColouringMap component on client-side only.
|
||||
* This is because leaflet and react-leaflet currently don't work on the server
|
||||
* (leaflet assumes the presence of browser-specific global `window` variable).
|
||||
*
|
||||
* The previous solution involved installing react-leaflet-universal,
|
||||
* but that doesn't work with latest react-leaflet.
|
||||
*
|
||||
* The limitation is that ColouringMap needs to be the single entry point in the whole app
|
||||
* to all modules that import leaflet or react-leaflet.
|
||||
*/
|
||||
const ColouringMap = loadable(
|
||||
() => import('./map/map'),
|
||||
{ ssr: false }
|
||||
);
|
||||
|
||||
interface MapAppProps {
|
||||
building?: Building;
|
||||
building_like?: boolean;
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import { GeoJsonObject } from 'geojson';
|
||||
import React, { Component, Fragment } from 'react';
|
||||
import { AttributionControl, GeoJSON, Map, TileLayer, ZoomControl } from 'react-leaflet-universal';
|
||||
import { AttributionControl, GeoJSON, MapContainer, TileLayer, ZoomControl, useMapEvent } from 'react-leaflet';
|
||||
|
||||
import 'leaflet/dist/leaflet.css';
|
||||
import './map.css';
|
||||
@ -101,6 +101,7 @@ class ColouringMap extends Component<ColouringMapProps, ColouringMapState> {
|
||||
attribution={attribution}
|
||||
maxNativeZoom={18}
|
||||
maxZoom={19}
|
||||
detectRetina={true}
|
||||
/>;
|
||||
|
||||
const buildingsBaseUrl = `/tiles/base_${this.state.theme}/{z}/{x}/{y}{r}.png`;
|
||||
@ -116,16 +117,18 @@ class ColouringMap extends Component<ColouringMapProps, ColouringMapState> {
|
||||
url={`/tiles/${tileset}/{z}/{x}/{y}{r}.png?rev=${this.props.revisionId}`}
|
||||
minZoom={9}
|
||||
maxZoom={19}
|
||||
detectRetina={true}
|
||||
/>;
|
||||
|
||||
// highlight
|
||||
const highlightLayer = this.props.selectedBuildingId != undefined &&
|
||||
<TileLayer
|
||||
key={this.props.selectedBuildingId}
|
||||
key={this.props.selectedBuildingId + tileset}
|
||||
url={`/tiles/highlight/{z}/{x}/{y}{r}.png?highlight=${this.props.selectedBuildingId}&base=${tileset}`}
|
||||
minZoom={13}
|
||||
maxZoom={19}
|
||||
zIndex={100}
|
||||
detectRetina={true}
|
||||
/>;
|
||||
|
||||
const numbersLayer = <TileLayer
|
||||
@ -134,6 +137,7 @@ class ColouringMap extends Component<ColouringMapProps, ColouringMapState> {
|
||||
zIndex={200}
|
||||
minZoom={17}
|
||||
maxZoom={19}
|
||||
detectRetina={true}
|
||||
/>
|
||||
|
||||
const hasSelection = this.props.selectedBuildingId != undefined;
|
||||
@ -141,7 +145,7 @@ class ColouringMap extends Component<ColouringMapProps, ColouringMapState> {
|
||||
|
||||
return (
|
||||
<div className="map-container">
|
||||
<Map
|
||||
<MapContainer
|
||||
center={position}
|
||||
zoom={this.state.zoom}
|
||||
minZoom={9}
|
||||
@ -149,9 +153,8 @@ class ColouringMap extends Component<ColouringMapProps, ColouringMapState> {
|
||||
doubleClickZoom={false}
|
||||
zoomControl={false}
|
||||
attributionControl={false}
|
||||
onClick={this.handleClick}
|
||||
detectRetina={true}
|
||||
>
|
||||
<ClickHandler onClick={this.handleClick} />
|
||||
{ baseLayer }
|
||||
{ buildingBaseLayer }
|
||||
{ boundaryLayer }
|
||||
@ -160,7 +163,7 @@ class ColouringMap extends Component<ColouringMapProps, ColouringMapState> {
|
||||
{ numbersLayer }
|
||||
<ZoomControl position="topright" />
|
||||
<AttributionControl prefix=""/>
|
||||
</Map>
|
||||
</MapContainer>
|
||||
{
|
||||
this.props.mode !== 'basic' &&
|
||||
<Fragment>
|
||||
@ -180,4 +183,10 @@ class ColouringMap extends Component<ColouringMapProps, ColouringMapState> {
|
||||
}
|
||||
}
|
||||
|
||||
function ClickHandler({ onClick }: {onClick: (e) => void}) {
|
||||
useMapEvent('click', (e) => onClick(e));
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
export default ColouringMap;
|
||||
|
||||
@ -1,9 +0,0 @@
|
||||
/**
|
||||
* Export all type declarations available for react-leaflet as types for react-leaflet-universal.
|
||||
* This is because the latter doesn't have type declarations published as of 2019-09-09
|
||||
* but we can re-use types from react-leaflet as universal is mostly a wrapper, so the types
|
||||
* still apply.
|
||||
*/
|
||||
declare module 'react-leaflet-universal' {
|
||||
export * from 'react-leaflet';
|
||||
}
|
||||
@ -2,6 +2,7 @@
|
||||
"compilerOptions": {
|
||||
"outDir": "./build",
|
||||
"allowJs": true,
|
||||
"module": "es2020",
|
||||
"target": "es2017",
|
||||
"jsx": "react",
|
||||
"lib": ["es6", "es2015", "es2017", "dom"],
|
||||
|
||||
Loading…
Reference in New Issue
Block a user