mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2025-01-03 14:57:22 +03:00
Code Issues Projects Releases Packages Wiki Activity

Fixed reference error

Browse source
This commit is contained in:
Alejandro Celaya 2022-04-03 10:10:10 +02:00
parent bd549c8642
commit 965e69c525
6 changed files with 44 additions and 62 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

77
package-lock.json generated
View file

@ -33,7 +33,7 @@
"react-datepicker": "^4.7.0",
"react-dom": "^18.0.0",
"react-external-link": "^1.2.2",
"react-leaflet": "^3.2.5",
"react-leaflet": "^4.0.0-beta.0",
"react-redux": "^8.0.0-beta.4",
"react-router-dom": "^6.3.0",
"react-swipeable": "^6.2.0",
@ -67,7 +67,6 @@
"@types/react-copy-to-clipboard": "^5.0.2",
"@types/react-datepicker": "^4.3.4",
"@types/react-dom": "^17.0.14",
"@types/react-leaflet": "^2.8.2",
"@types/react-redux": "^7.1.23",
"@types/react-tag-autocomplete": "^6.1.1",
"@types/uuid": "^8.3.4",
@ -3383,6 +3382,16 @@
"url": "https://opencollective.com/popperjs"
}
},
"node_modules/@react-leaflet/core": {
"version": "2.0.0-beta.0",
"resolved": "https://registry.npmjs.org/@react-leaflet/core/-/core-2.0.0-beta.0.tgz",
"integrity": "sha512-hDk+9Y5vQ9rxkAR8hyvEymqOuPpQvOXTWanh1lW0YQVbsZnx+XMz2sBF0ExrWZm3l0LEKlpMD4VzbCrbDAIpBQ==",
"peerDependencies": {
"leaflet": "^1.7.1",
"react": "^18.0.0",
"react-dom": "^18.0.0"
}
},
"node_modules/@rollup/plugin-babel": {
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@ -4904,16 +4913,6 @@
"@types/react": "*"
}
},
"node_modules/@types/react-leaflet": {
"version": "2.8.2",
"resolved": "https://registry.npmjs.org/@types/react-leaflet/-/react-leaflet-2.8.2.tgz",
"integrity": "sha512-Iel8Vd1bSCD38Yhiqcmm/+9hjPEdd39LFE3tBMbOytq3QAQsC3LDrbo6ifoh8JbpqPbCsQPo9Wx5OELHixEShg==",
"dev": true,
"dependencies": {
"@types/leaflet": "*",
"@types/react": "*"
}
},
"node_modules/@types/react-redux": {
"version": "7.1.23",
"resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.23.tgz",
@ -19449,26 +19448,16 @@
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
},
"node_modules/react-leaflet": {
"version": "3.2.5",
"resolved": "https://registry.npmjs.org/react-leaflet/-/react-leaflet-3.2.5.tgz",
"integrity": "sha512-Z3KZ+4SijsRbbrt2I1a3ZDY6+V6Pm91eYTdxTN18G6IOkFRsJo1BuSPLFnyFrlF3WDjQFPEcTPkEgD1VEeAoBg==",
"version": "4.0.0-beta.0",
"resolved": "https://registry.npmjs.org/react-leaflet/-/react-leaflet-4.0.0-beta.0.tgz",
"integrity": "sha512-LCPSfqBOCvDcpXGAPhe5KrnO/rAmtWJ10SQG7FOLIErI+DU3rhhDfbao2/YPe+a1JJfvL4vODkp6Cf4jel0TBg==",
"dependencies": {
"@react-leaflet/core": "^1.1.1"
"@react-leaflet/core": "^2.0.0-beta.0"
},
"peerDependencies": {
"leaflet": "^1.7.1",
"react": "^17.0.1",
"react-dom": "^17.0.1"
}
},
"node_modules/react-leaflet/node_modules/@react-leaflet/core": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@react-leaflet/core/-/core-1.1.1.tgz",
"integrity": "sha512-7PGLWa9MZ5x/cWy8EH2VzI4T8q5WpuHbixzCDXqixP/WyqwIrg5NDUPgYuFnB4IEIZF+6nA265mYzswFo/h1Pw==",
"peerDependencies": {
"leaflet": "^1.7.1",
"react": "^17.0.1",
"react-dom": "^17.0.1"
"react": "^18.0.0",
"react-dom": "^18.0.0"
}
},
"node_modules/react-redux": {
@ -29354,6 +29343,12 @@
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.2.tgz",
"integrity": "sha512-92FRmppjjqz29VMJ2dn+xdyXZBrMlE42AV6Kq6BwjWV7CNUW1hs2FtxSNLQE+gJhaZ6AAmYuO9y8dshhcBl7vA=="
},
"@react-leaflet/core": {
"version": "2.0.0-beta.0",
"resolved": "https://registry.npmjs.org/@react-leaflet/core/-/core-2.0.0-beta.0.tgz",
"integrity": "sha512-hDk+9Y5vQ9rxkAR8hyvEymqOuPpQvOXTWanh1lW0YQVbsZnx+XMz2sBF0ExrWZm3l0LEKlpMD4VzbCrbDAIpBQ==",
"requires": {}
},
"@rollup/plugin-babel": {
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@ -30535,16 +30530,6 @@
"@types/react": "*"
}
},
"@types/react-leaflet": {
"version": "2.8.2",
"resolved": "https://registry.npmjs.org/@types/react-leaflet/-/react-leaflet-2.8.2.tgz",
"integrity": "sha512-Iel8Vd1bSCD38Yhiqcmm/+9hjPEdd39LFE3tBMbOytq3QAQsC3LDrbo6ifoh8JbpqPbCsQPo9Wx5OELHixEShg==",
"dev": true,
"requires": {
"@types/leaflet": "*",
"@types/react": "*"
}
},
"@types/react-redux": {
"version": "7.1.23",
"resolved": "https://registry.npmjs.org/@types/react-redux/-/react-redux-7.1.23.tgz",
@ -41542,19 +41527,11 @@
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
},
"react-leaflet": {
"version": "3.2.5",
"resolved": "https://registry.npmjs.org/react-leaflet/-/react-leaflet-3.2.5.tgz",
"integrity": "sha512-Z3KZ+4SijsRbbrt2I1a3ZDY6+V6Pm91eYTdxTN18G6IOkFRsJo1BuSPLFnyFrlF3WDjQFPEcTPkEgD1VEeAoBg==",
"version": "4.0.0-beta.0",
"resolved": "https://registry.npmjs.org/react-leaflet/-/react-leaflet-4.0.0-beta.0.tgz",
"integrity": "sha512-LCPSfqBOCvDcpXGAPhe5KrnO/rAmtWJ10SQG7FOLIErI+DU3rhhDfbao2/YPe+a1JJfvL4vODkp6Cf4jel0TBg==",
"requires": {
"@react-leaflet/core": "^1.1.1"
},
"dependencies": {
"@react-leaflet/core": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@react-leaflet/core/-/core-1.1.1.tgz",
"integrity": "sha512-7PGLWa9MZ5x/cWy8EH2VzI4T8q5WpuHbixzCDXqixP/WyqwIrg5NDUPgYuFnB4IEIZF+6nA265mYzswFo/h1Pw==",
"requires": {}
}
"@react-leaflet/core": "^2.0.0-beta.0"
}
},
"react-redux": {

3
package.json
View file

@ -49,7 +49,7 @@
"react-datepicker": "^4.7.0",
"react-dom": "^18.0.0",
"react-external-link": "^1.2.2",
"react-leaflet": "^3.2.5",
"react-leaflet": "^4.0.0-beta.0",
"react-redux": "^8.0.0-beta.4",
"react-router-dom": "^6.3.0",
"react-swipeable": "^6.2.0",
@ -83,7 +83,6 @@
"@types/react-copy-to-clipboard": "^5.0.2",
"@types/react-datepicker": "^4.3.4",
"@types/react-dom": "^17.0.14",
"@types/react-leaflet": "^2.8.2",
"@types/react-redux": "^7.1.23",
"@types/react-tag-autocomplete": "^6.1.1",
"@types/uuid": "^8.3.4",

6
src/utils/BooleanControl.tsx
View file

@ -1,7 +1,7 @@
import { ChangeEvent, FC, useRef } from 'react';
import { ChangeEvent, FC } from 'react';
import classNames from 'classnames';
import { v4 as uuid } from 'uuid';
import { identity } from 'ramda';
import { useDomId } from './helpers/hooks';
export interface BooleanControlProps {
checked?: boolean;
@ -17,7 +17,7 @@ interface BooleanControlWithTypeProps extends BooleanControlProps {
const BooleanControl: FC<BooleanControlWithTypeProps> = (
{ checked = false, onChange = identity, className, children, type, inline = false },
) => {
const { current: id } = useRef(uuid());
const id = useDomId();
const onChecked = (e: ChangeEvent<HTMLInputElement>) => onChange(e.target.checked, e);
const typeClasses = {
'form-switch': type === 'switch',

6
src/utils/helpers/hooks.ts
View file

@ -2,6 +2,7 @@ import { useState, useRef, EffectCallback, DependencyList, useEffect } from 'rea
import { useSwipeable as useReactSwipeable } from 'react-swipeable';
import { useNavigate } from 'react-router-dom';
import { parseQuery, stringifyQuery } from './query';
import { v4 as uuid } from 'uuid';
const DEFAULT_DELAY = 2000;
@ -82,3 +83,8 @@ export const useGoBack = () => {
return () => navigate(-1);
};
export const useDomId = (): string => {
const { current: id } = useRef(`dom-${uuid()}`);
return id;
};

10
src/visits/helpers/OpenMapModalBtn.tsx
View file

@ -1,8 +1,8 @@
import { useRef, useState } from 'react';
import { useState } from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faMapMarkedAlt as mapIcon } from '@fortawesome/free-solid-svg-icons';
import { Button, Dropdown, DropdownItem, DropdownMenu, UncontrolledTooltip } from 'reactstrap';
import { useToggle } from '../../utils/helpers/hooks';
import { useDomId, useToggle } from '../../utils/helpers/hooks';
import { CityStats } from '../types';
import MapModal from './MapModal';
import './OpenMapModalBtn.scss';
@ -17,7 +17,7 @@ const OpenMapModalBtn = ({ modalTitle, activeCities, locations = [] }: OpenMapMo
const [mapIsOpened, , openMap, closeMap] = useToggle();
const [dropdownIsOpened, toggleDropdown, openDropdown] = useToggle();
const [locationsToShow, setLocationsToShow] = useState<CityStats[]>([]);
const buttonRef = useRef<HTMLElement>();
const id = useDomId();
const filterLocations = (cities: CityStats[]) => cities.filter(({ cityName }) => activeCities.includes(cityName));
const onClick = () => {
@ -37,10 +37,10 @@ const OpenMapModalBtn = ({ modalTitle, activeCities, locations = [] }: OpenMapMo
return (
<>
<Button color="link" className="open-map-modal-btn__btn" ref={buttonRef as any} onClick={onClick}>
<Button color="link" className="open-map-modal-btn__btn" id={id} onClick={onClick}>
<FontAwesomeIcon icon={mapIcon} />
</Button>
<UncontrolledTooltip placement="left" target={(() => buttonRef.current) as any}>Show in map</UncontrolledTooltip>
<UncontrolledTooltip placement="left" target={id}>Show in map</UncontrolledTooltip>
<Dropdown isOpen={dropdownIsOpened} toggle={toggleDropdown} inNavbar>
<DropdownMenu end>
<DropdownItem onClick={openMapWithLocations(false)}>Show all locations</DropdownItem>

4
tsconfig.json
View file

@ -5,7 +5,7 @@
"jsx": "preserve",
"lib": [
"dom",
"es2019"
"es2021"
],
"module": "esnext",
"moduleResolution": "node",
@ -17,7 +17,7 @@
"skipLibCheck": true,
"sourceMap": true,
"strict": true,
"target": "es2019",
"target": "es2021",
"forceConsistentCasingInFileNames": true,
"esModuleInterop": true,
"resolveJsonModule": true,