diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..0505610 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,6 @@ +module.exports = { + "extends": "airbnb", + "env": { + "browser": true + }, +}; \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 928fcaf..2ec2718 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2707,6 +2707,11 @@ "safe-buffer": "^5.0.1" } }, + "circular-json": { + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/circular-json/-/circular-json-0.3.3.tgz", + "integrity": "sha512-UZK3NBx2Mca+b5LsG7bY183pHWt5Y1xts4P3Pz7ENTwGVnJOUWbRb3ocjvX7hx9tq/yTAdclXm9sZ38gNuem4A==" + }, "class-utils": { "version": "0.3.6", "resolved": "https://registry.npmjs.org/class-utils/-/class-utils-0.3.6.tgz", @@ -3954,15 +3959,16 @@ } }, "eslint": { - "version": "5.6.0", - "resolved": "https://registry.npmjs.org/eslint/-/eslint-5.6.0.tgz", - "integrity": "sha512-/eVYs9VVVboX286mBK7bbKnO1yamUy2UCRjiY6MryhQL2PaaXCExsCQ2aO83OeYRhU2eCU/FMFP+tVMoOrzNrA==", + "version": "5.9.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-5.9.0.tgz", + "integrity": "sha512-g4KWpPdqN0nth+goDNICNXGfJF7nNnepthp46CAlJoJtC5K/cLu3NgCM3AHu1CkJ5Hzt9V0Y0PBAO6Ay/gGb+w==", + "dev": true, "requires": { "@babel/code-frame": "^7.0.0", "ajv": "^6.5.3", "chalk": "^2.1.0", "cross-spawn": "^6.0.5", - "debug": "^3.1.0", + "debug": "^4.0.1", "doctrine": "^2.1.0", "eslint-scope": "^4.0.0", "eslint-utils": "^1.3.1", @@ -3989,24 +3995,35 @@ "path-is-inside": "^1.0.2", "pluralize": "^7.0.0", "progress": "^2.0.0", - "regexpp": "^2.0.0", + "regexpp": "^2.0.1", "require-uncached": "^1.0.3", "semver": "^5.5.1", "strip-ansi": "^4.0.0", "strip-json-comments": "^2.0.1", - "table": "^4.0.3", + "table": "^5.0.2", "text-table": "^0.2.0" }, "dependencies": { "ansi-regex": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz", - "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=" + "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=", + "dev": true + }, + "debug": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.0.tgz", + "integrity": "sha512-heNPJUJIqC+xB6ayLAMHaIrmN9HKa7aQO8MGqKpvCA+uJYVcvR6l5kgdrhRuwPFHU7P5/A1w0BjByPHwpfTDKg==", + "dev": true, + "requires": { + "ms": "^2.1.1" + } }, "eslint-scope": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-4.0.0.tgz", "integrity": "sha512-1G6UTDi7Jc1ELFwnR58HV4fK9OQK4S6N985f166xqXxpjU6plxFISJa2Ba9KCQuFa8RCnj/lSFJbHo7UFDBnUA==", + "dev": true, "requires": { "esrecurse": "^4.1.0", "estraverse": "^4.1.1" @@ -4016,12 +4033,35 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz", "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=", + "dev": true, "requires": { "ansi-regex": "^3.0.0" } } } }, + "eslint-config-airbnb": { + "version": "17.1.0", + "resolved": "https://registry.npmjs.org/eslint-config-airbnb/-/eslint-config-airbnb-17.1.0.tgz", + "integrity": "sha512-R9jw28hFfEQnpPau01NO5K/JWMGLi6aymiF6RsnMURjTk+MqZKllCqGK/0tOvHkPi/NWSSOU2Ced/GX++YxLnw==", + "dev": true, + "requires": { + "eslint-config-airbnb-base": "^13.1.0", + "object.assign": "^4.1.0", + "object.entries": "^1.0.4" + } + }, + "eslint-config-airbnb-base": { + "version": "13.1.0", + "resolved": "https://registry.npmjs.org/eslint-config-airbnb-base/-/eslint-config-airbnb-base-13.1.0.tgz", + "integrity": "sha512-XWwQtf3U3zIoKO1BbHh6aUhJZQweOwSt4c2JrPDg9FP3Ltv3+YfEv7jIDB8275tVnO/qOHbfuYg3kzw6Je7uWw==", + "dev": true, + "requires": { + "eslint-restricted-globals": "^0.1.1", + "object.assign": "^4.1.0", + "object.entries": "^1.0.4" + } + }, "eslint-config-react-app": { "version": "3.0.5", "resolved": "https://registry.npmjs.org/eslint-config-react-app/-/eslint-config-react-app-3.0.5.tgz", @@ -4150,7 +4190,7 @@ }, "doctrine": { "version": "1.5.0", - "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz", + "resolved": "http://registry.npmjs.org/doctrine/-/doctrine-1.5.0.tgz", "integrity": "sha1-N53Ocw9hZvds76TmcHoVmwLFpvo=", "requires": { "esutils": "^2.0.2", @@ -4242,6 +4282,12 @@ "prop-types": "^15.6.2" } }, + "eslint-restricted-globals": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/eslint-restricted-globals/-/eslint-restricted-globals-0.1.1.tgz", + "integrity": "sha1-NfDVy8ZMLj7WLpO0saevBbp+1Nc=", + "dev": true + }, "eslint-scope": { "version": "3.7.1", "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-3.7.1.tgz", @@ -4973,21 +5019,16 @@ } }, "flat-cache": { - "version": "1.3.1", - "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-1.3.1.tgz", - "integrity": "sha512-BUaXPScuox3BPmS9CGqbsh7tvAGzBEU2Dlnw243WoHjC0vO57faTOvHOkPQkPZZdpvJuwOQhMdAQx3BtdUh6nQ==", + "version": "1.3.4", + "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-1.3.4.tgz", + "integrity": "sha512-VwyB3Lkgacfik2vhqR4uv2rvebqmDvFu4jlN/C1RzWoJEo8I7z4Q404oiqYCkq41mni8EzQnm95emU9seckwtg==", "requires": { - "del": "^3.0.0", - "flatted": "^2.0.0", + "circular-json": "^0.3.1", "graceful-fs": "^4.1.2", + "rimraf": "~2.6.2", "write": "^0.2.1" } }, - "flatted": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/flatted/-/flatted-2.0.0.tgz", - "integrity": "sha512-R+H8IZclI8AAkSBRQJLVOsxwAoHd6WC40b4QTNWIjzAa6BXOBfQcM587MXDTVPeYaopFNWHUFLx7eNmHDSxMWg==" - }, "flatten": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz", @@ -8759,6 +8800,18 @@ "object-keys": "^1.0.11" } }, + "object.entries": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.0.4.tgz", + "integrity": "sha1-G/mk3SKI9bM/Opk9JXZh8F0WGl8=", + "dev": true, + "requires": { + "define-properties": "^1.1.2", + "es-abstract": "^1.6.1", + "function-bind": "^1.1.0", + "has": "^1.0.1" + } + }, "object.getownpropertydescriptors": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/object.getownpropertydescriptors/-/object.getownpropertydescriptors-2.0.3.tgz", @@ -11437,6 +11490,88 @@ "webpack-dev-server": "3.1.9", "webpack-manifest-plugin": "2.0.4", "workbox-webpack-plugin": "3.6.3" + }, + "dependencies": { + "ansi-regex": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz", + "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=" + }, + "eslint": { + "version": "5.6.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-5.6.0.tgz", + "integrity": "sha512-/eVYs9VVVboX286mBK7bbKnO1yamUy2UCRjiY6MryhQL2PaaXCExsCQ2aO83OeYRhU2eCU/FMFP+tVMoOrzNrA==", + "requires": { + "@babel/code-frame": "^7.0.0", + "ajv": "^6.5.3", + "chalk": "^2.1.0", + "cross-spawn": "^6.0.5", + "debug": "^3.1.0", + "doctrine": "^2.1.0", + "eslint-scope": "^4.0.0", + "eslint-utils": "^1.3.1", + "eslint-visitor-keys": "^1.0.0", + "espree": "^4.0.0", + "esquery": "^1.0.1", + "esutils": "^2.0.2", + "file-entry-cache": "^2.0.0", + "functional-red-black-tree": "^1.0.1", + "glob": "^7.1.2", + "globals": "^11.7.0", + "ignore": "^4.0.6", + "imurmurhash": "^0.1.4", + "inquirer": "^6.1.0", + "is-resolvable": "^1.1.0", + "js-yaml": "^3.12.0", + "json-stable-stringify-without-jsonify": "^1.0.1", + "levn": "^0.3.0", + "lodash": "^4.17.5", + "minimatch": "^3.0.4", + "mkdirp": "^0.5.1", + "natural-compare": "^1.4.0", + "optionator": "^0.8.2", + "path-is-inside": "^1.0.2", + "pluralize": "^7.0.0", + "progress": "^2.0.0", + "regexpp": "^2.0.0", + "require-uncached": "^1.0.3", + "semver": "^5.5.1", + "strip-ansi": "^4.0.0", + "strip-json-comments": "^2.0.1", + "table": "^4.0.3", + "text-table": "^0.2.0" + } + }, + "eslint-scope": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-4.0.0.tgz", + "integrity": "sha512-1G6UTDi7Jc1ELFwnR58HV4fK9OQK4S6N985f166xqXxpjU6plxFISJa2Ba9KCQuFa8RCnj/lSFJbHo7UFDBnUA==", + "requires": { + "esrecurse": "^4.1.0", + "estraverse": "^4.1.1" + } + }, + "strip-ansi": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz", + "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=", + "requires": { + "ansi-regex": "^3.0.0" + } + }, + "table": { + "version": "4.0.3", + "resolved": "http://registry.npmjs.org/table/-/table-4.0.3.tgz", + "integrity": "sha512-S7rnFITmBH1EnyKcvxBh1LjYeQMmnZtCXSEbHcH6S0NoKit24ZuFO/T1vDcLdYsLQkM188PVVhQmzKIuThNkKg==", + "requires": { + "ajv": "^6.0.1", + "ajv-keywords": "^3.0.0", + "chalk": "^2.1.0", + "lodash": "^4.17.4", + "slice-ansi": "1.0.0", + "string-width": "^2.1.1" + } + } } }, "react-transition-group": { @@ -13342,14 +13477,13 @@ "integrity": "sha1-rifbOPZgp64uHDt9G8KQgZuFGeY=" }, "table": { - "version": "4.0.3", - "resolved": "http://registry.npmjs.org/table/-/table-4.0.3.tgz", - "integrity": "sha512-S7rnFITmBH1EnyKcvxBh1LjYeQMmnZtCXSEbHcH6S0NoKit24ZuFO/T1vDcLdYsLQkM188PVVhQmzKIuThNkKg==", + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/table/-/table-5.1.0.tgz", + "integrity": "sha512-e542in22ZLhD/fOIuXs/8yDZ9W61ltF8daM88rkRNtgTIct+vI2fTnAyu/Db2TCfEcI8i7mjZz6meLq0nW7TYg==", + "dev": true, "requires": { - "ajv": "^6.0.1", - "ajv-keywords": "^3.0.0", - "chalk": "^2.1.0", - "lodash": "^4.17.4", + "ajv": "^6.5.3", + "lodash": "^4.17.10", "slice-ansi": "1.0.0", "string-width": "^2.1.1" } diff --git a/package.json b/package.json index 8065079..85828a4 100644 --- a/package.json +++ b/package.json @@ -27,5 +27,12 @@ "not dead", "not ie <= 11", "not op_mini all" - ] + ], + "devDependencies": { + "eslint": "^5.9.0", + "eslint-config-airbnb": "^17.1.0", + "eslint-plugin-import": "^2.14.0", + "eslint-plugin-jsx-a11y": "^6.1.2", + "eslint-plugin-react": "^7.11.1" + } } diff --git a/src/Components/Header.js b/src/Components/Header.js index 3a496af..0a87be0 100644 --- a/src/Components/Header.js +++ b/src/Components/Header.js @@ -15,19 +15,19 @@ import { DropdownToggle, DropdownMenu, DropdownItem, - Badge + Badge, } from 'reactstrap'; import { - FaSearch + FaSearch, } from 'react-icons/fa'; -import Api from './Api'; import { NotificationContainer, - NotificationManager + NotificationManager, } from 'react-notifications'; +import Api from './Api'; import strToSlug from '../StrToSlug'; -import '../css/Header.css' +import '../css/Header.css'; export default class Header extends React.Component { constructor(props) { @@ -38,7 +38,7 @@ export default class Header extends React.Component { this.state = { isOpen: false, - types: [] + types: [], }; this.getVegetablesTypes(); @@ -46,20 +46,20 @@ export default class Header extends React.Component { toggle() { this.setState({ - isOpen: !this.state.isOpen + isOpen: !this.state.isOpen, }); } getVegetablesTypes() { Api.get('types') - .then(res => { + .then((res) => { this.setState({ - types: res.data.rows + types: res.data.rows, }); }) .catch(() => { NotificationManager.error('Erreur lors de la récupération des catégories'); - }) + }); } render() { @@ -80,15 +80,17 @@ export default class Header extends React.Component { { - this.state.types.map((type, key) => - ( + this.state.types.map((type, key) => ( + - {type.name} {type.Vegetables.length} + {type.name} + {' '} + {type.Vegetables.length} - ) - ) + + )) } @@ -108,4 +110,4 @@ export default class Header extends React.Component { ); } -} \ No newline at end of file +} diff --git a/src/Components/Map.js b/src/Components/Map.js index 3681600..09ae1c1 100644 --- a/src/Components/Map.js +++ b/src/Components/Map.js @@ -2,17 +2,17 @@ import React from 'react'; import { Row, Col, - Tooltip + Tooltip, } from 'reactstrap'; import { - FaMapMarkerAlt + FaMapMarkerAlt, } from 'react-icons/fa'; import { - Link + Link, } from 'react-router-dom'; -import strToSlug from '../StrToSlug' +import strToSlug from '../StrToSlug'; -import '../css/Map.css' +import '../css/Map.css'; const MapDimensions = { width: 734, @@ -30,8 +30,8 @@ export default class Map extends React.Component { width: '20px', height: '20px', }, - tooltipOpen: false - } + tooltipOpen: false, + }; this.selectVegetable = this.selectVegetable.bind(this); this.setMap = this.setMap.bind(this); @@ -42,7 +42,7 @@ export default class Map extends React.Component { this.setState(prevState => ({ ...prevState, selectedType: newProps.selectedType, - selectedVegetable: newProps.selectedVegetable + selectedVegetable: newProps.selectedVegetable, })); } @@ -75,14 +75,14 @@ export default class Map extends React.Component { selectVegetable(vegetable) { this.setState({ - selectedVegetable: vegetable - }) - this.props.selectVegetable(vegetable) + selectedVegetable: vegetable, + }); + this.props.selectVegetable(vegetable); } toggle(id) { this.setState(prevState => ({ - tooltipOpen: prevState.tooltipOpen === id ? false : id + tooltipOpen: prevState.tooltipOpen === id ? false : id, })); } @@ -93,23 +93,22 @@ export default class Map extends React.Component {
{ - this.state.selectedType && - this.state.selectedType.Vegetables && - this.state.selectedType.Vegetables.map((vegetable, key) => - ( - this.selectVegetable(vegetable)} - > - this.toggle(vegetable.id)}> - {vegetable.name} - - - - ) - ) + this.state.selectedType + && this.state.selectedType.Vegetables + && this.state.selectedType.Vegetables.map((vegetable, key) => ( + this.selectVegetable(vegetable)} + > + this.toggle(vegetable.id)}> + {vegetable.name} + + + + )) }
@@ -117,4 +116,4 @@ export default class Map extends React.Component { ); } -} \ No newline at end of file +} diff --git a/src/Components/Vegetables.js b/src/Components/Vegetables.js index a4e5c16..aaac5ae 100644 --- a/src/Components/Vegetables.js +++ b/src/Components/Vegetables.js @@ -1,14 +1,14 @@ import React from 'react'; import { ListGroup, - ListGroupItem + ListGroupItem, } from 'reactstrap'; import { - Link + Link, } from 'react-router-dom'; -import strToSlug from '../StrToSlug' +import strToSlug from '../StrToSlug'; -import '../css/Vegetables.css' +import '../css/Vegetables.css'; export default class Map extends React.Component { constructor(props) { @@ -16,8 +16,8 @@ export default class Map extends React.Component { this.state = { selectedType: this.props.selectedType, - selectedVegetable: this.props.selectVegetable - } + selectedVegetable: this.props.selectVegetable, + }; } componentWillReceiveProps(newProps) { @@ -29,28 +29,26 @@ export default class Map extends React.Component {
- + { - this.state.selectedType && - this.state.selectedType.Vegetables && - this.state.selectedType.Vegetables.map((vegetable, key) => - ( - this.props.selectVegetable(vegetable)} - > - - {vegetable.name} - + this.state.selectedType + && this.state.selectedType.Vegetables + && this.state.selectedType.Vegetables.map((vegetable, key) => ( + this.props.selectVegetable(vegetable)} + > + + {vegetable.name} + - - ) - ) + + )) }
); } -} \ No newline at end of file +} diff --git a/src/Routes/Home.js b/src/Routes/Home.js index fe71638..731786f 100644 --- a/src/Routes/Home.js +++ b/src/Routes/Home.js @@ -2,13 +2,12 @@ import React from 'react'; import { Container, Row, - Col + Col, } from 'reactstrap'; import '../css/Home.css'; export default class RouterHome extends React.Component { - render() { return ( @@ -32,4 +31,4 @@ export default class RouterHome extends React.Component { ); } -} \ No newline at end of file +} diff --git a/src/Routes/Map.js b/src/Routes/Map.js index ef4d0e9..72783a4 100644 --- a/src/Routes/Map.js +++ b/src/Routes/Map.js @@ -5,15 +5,15 @@ import { Col, ListGroup, ListGroupItem, - Badge + Badge, } from 'reactstrap'; -import Api from '../Components/Api'; import { NotificationContainer, - NotificationManager + NotificationManager, } from 'react-notifications'; -import MapItem from '../Components/Map' -import Vegetables from '../Components/Vegetables' +import Api from '../Components/Api'; +import MapItem from '../Components/Map'; +import Vegetables from '../Components/Vegetables'; export default class RouterMap extends React.Component { constructor(props) { @@ -23,8 +23,8 @@ export default class RouterMap extends React.Component { types: [], vegetables: [], selectedType: {}, - selectedVegetable: {} - } + selectedVegetable: {}, + }; this.getVegetablesTypes = this.getVegetablesTypes.bind(this); this.selectType = this.selectType.bind(this); @@ -35,26 +35,26 @@ export default class RouterMap extends React.Component { getVegetablesTypes() { Api.get('types') - .then(res => { + .then((res) => { this.setState({ - types: res.data.rows + types: res.data.rows, }); }) .catch(() => { NotificationManager.error('Erreur lors de la récupération des catégories'); - }) + }); } selectType(type) { this.setState({ - selectedType: type + selectedType: type, }); } selectVegetable(vegetable) { this.setState({ - selectedVegetable: vegetable - }) + selectedVegetable: vegetable, + }); } render() { @@ -75,18 +75,18 @@ export default class RouterMap extends React.Component {
- + { - this.state.types.map((type, key) => - ( - this.selectType(type)}> - {type.name} - {type.Vegetables.length} - - ) - ) + this.state.types.map((type, key) => ( + this.selectType(type)} + > + {type.name} + {type.Vegetables.length} + + )) }
@@ -101,8 +101,8 @@ export default class RouterMap extends React.Component { - - + + ); } -} \ No newline at end of file +} diff --git a/src/Routes/Vegetables.js b/src/Routes/Vegetables.js index c0376ae..cd0c35a 100644 --- a/src/Routes/Vegetables.js +++ b/src/Routes/Vegetables.js @@ -2,15 +2,15 @@ import React from 'react'; import { Container, Row, - Col + Col, } from 'reactstrap'; -import Api from '../Components/Api'; import { NotificationContainer, - NotificationManager + NotificationManager, } from 'react-notifications'; -import MapItem from '../Components/Map' -import VegetablesList from '../Components/Vegetables' +import Api from '../Components/Api'; +import MapItem from '../Components/Map'; +import VegetablesList from '../Components/Vegetables'; export default class RouterVegetables extends React.Component { constructor(props) { @@ -19,8 +19,8 @@ export default class RouterVegetables extends React.Component { this.state = { typeId: props.match.params.typeId, selectedType: {}, - selectedVegetable: {} - } + selectedVegetable: {}, + }; this.getItem = this.getItem.bind(this); this.selectVegetable = this.selectVegetable.bind(this); @@ -28,23 +28,22 @@ export default class RouterVegetables extends React.Component { this.getItem(); } - selectVegetable(vegetable) { - this.setState({ - selectedVegetable: vegetable - }) - } - getItem() { Api.get(`/types/${this.state.typeId}`) - .then(res => { + .then((res) => { this.setState({ - selectedType: res.data + selectedType: res.data, }); }) .catch(() => { NotificationManager.error('Erreur lors de la récupération des végétaux'); - }) + }); + } + selectVegetable(vegetable) { + this.setState({ + selectedVegetable: vegetable, + }); } render() { @@ -71,8 +70,8 @@ export default class RouterVegetables extends React.Component { - - + + ); } -} \ No newline at end of file +} diff --git a/src/StrToSlug.js b/src/StrToSlug.js index 3361192..aeeefb9 100644 --- a/src/StrToSlug.js +++ b/src/StrToSlug.js @@ -1,11 +1,12 @@ -export default (str) => { +export default (string) => { + let str = string; str = str.replace(/^\s+|\s+$/g, ''); // trim str = str.toLowerCase(); // remove accents, swap ñ for n, etc - var from = "àáäâèéëêìíïîòóöôùúüûñç·/_,:;"; - var to = "aaaaeeeeiiiioooouuuunc------"; - for (var i = 0, l = from.length; i < l; i++) { + const from = 'àáäâèéëêìíïîòóöôùúüûñç·/_,:;'; + const to = 'aaaaeeeeiiiioooouuuunc------'; + for (let i = 0, l = from.length; i < l; i += 1) { str = str.replace(new RegExp(from.charAt(i), 'g'), to.charAt(i)); } @@ -14,4 +15,4 @@ export default (str) => { .replace(/-+/g, '-'); // collapse dashes return str; -} \ No newline at end of file +}; diff --git a/src/serviceWorker.js b/src/serviceWorker.js index 2283ff9..2ce4c52 100644 --- a/src/serviceWorker.js +++ b/src/serviceWorker.js @@ -1,33 +1,15 @@ -// This optional code is used to register a service worker. -// register() is not called by default. - -// This lets the app load faster on subsequent visits in production, and gives -// it offline capabilities. However, it also means that developers (and users) -// will only see deployed updates on subsequent visits to a page, after all the -// existing tabs open on the page have been closed, since previously cached -// resources are updated in the background. - -// To learn more about the benefits of this model and instructions on how to -// opt-in, read http://bit.ly/CRA-PWA - const isLocalhost = Boolean( - window.location.hostname === 'localhost' || - // [::1] is the IPv6 localhost address. - window.location.hostname === '[::1]' || - // 127.0.0.1/8 is considered localhost for IPv4. - window.location.hostname.match( - /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/ - ) + window.location.hostname === 'localhost' + || window.location.hostname === '[::1]' + || window.location.hostname.match( + /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/, + ), ); export function register(config) { if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) { - // The URL constructor is available in all browsers that support SW. const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href); if (publicUrl.origin !== window.location.origin) { - // Our service worker won't work if PUBLIC_URL is on a different origin - // from what our page is served on. This might happen if a CDN is used to - // serve assets; see https://github.com/facebook/create-react-app/issues/2374 return; } @@ -35,15 +17,12 @@ export function register(config) { const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`; if (isLocalhost) { - // This is running on localhost. Let's check if a service worker still exists or not. checkValidServiceWorker(swUrl, config); - // Add some additional logging to localhost, pointing developers to the - // service worker/PWA documentation. navigator.serviceWorker.ready.then(() => { console.log( - 'This web app is being served cache-first by a service ' + - 'worker. To learn more, visit http://bit.ly/CRA-PWA' + 'This web app is being served cache-first by a service ' + + 'worker. To learn more, visit http://bit.ly/CRA-PWA', ); }); } else { @@ -57,7 +36,7 @@ export function register(config) { function registerValidSW(swUrl, config) { navigator.serviceWorker .register(swUrl) - .then(registration => { + .then((registration) => { registration.onupdatefound = () => { const installingWorker = registration.installing; if (installingWorker == null) { @@ -70,8 +49,8 @@ function registerValidSW(swUrl, config) { // but the previous service worker will still serve the older // content until all client tabs are closed. console.log( - 'New content is available and will be used when all ' + - 'tabs for this page are closed. See http://bit.ly/CRA-PWA.' + 'New content is available and will be used when all ' + + 'tabs for this page are closed. See http://bit.ly/CRA-PWA.', ); // Execute callback @@ -93,7 +72,7 @@ function registerValidSW(swUrl, config) { }; }; }) - .catch(error => { + .catch((error) => { console.error('Error during service worker registration:', error); }); } @@ -101,15 +80,15 @@ function registerValidSW(swUrl, config) { function checkValidServiceWorker(swUrl, config) { // Check if the service worker can be found. If it can't reload the page. fetch(swUrl) - .then(response => { + .then((response) => { // Ensure service worker exists, and that we really are getting a JS file. const contentType = response.headers.get('content-type'); if ( - response.status === 404 || - (contentType != null && contentType.indexOf('javascript') === -1) + response.status === 404 + || (contentType != null && contentType.indexOf('javascript') === -1) ) { // No service worker found. Probably a different app. Reload the page. - navigator.serviceWorker.ready.then(registration => { + navigator.serviceWorker.ready.then((registration) => { registration.unregister().then(() => { window.location.reload(); }); @@ -121,14 +100,14 @@ function checkValidServiceWorker(swUrl, config) { }) .catch(() => { console.log( - 'No internet connection found. App is running in offline mode.' + 'No internet connection found. App is running in offline mode.', ); }); } export function unregister() { if ('serviceWorker' in navigator) { - navigator.serviceWorker.ready.then(registration => { + navigator.serviceWorker.ready.then((registration) => { registration.unregister(); }); }