diff --git a/.eslintrc b/.eslintrc index 4bed466..c3b49dc 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,3 +1,25 @@ { - "extends": "react-app" + "parser": "babel-eslint", + "parserOptions": { + "sourceType": "module", + "allowImportExportEverywhere": false, + "codeFrame": false + }, + "extends": ["react-app", "prettier"], + "env": { + "browser": true, + "jest": true + }, + "rules": { + "max-len": ["error", { + "code": 300 + }], + "prefer-promise-reject-errors": ["off"], + "react/jsx-filename-extension": ["off"], + "react/prop-types": ["off"], + "no-return-assign": ["off"] + }, + "globals": { + "chrome": "readonly" + } } \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index d2f76de..cc370b5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1001,6 +1001,52 @@ "to-fast-properties": "^2.0.0" } }, + "@fortawesome/fontawesome-common-types": { + "version": "0.2.19", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.19.tgz", + "integrity": "sha512-nd2Ul/CUs8U9sjofQYAALzOGpgkVJQgEhIJnOHaoyVR/LeC3x2mVg4eB910a4kS6WgLPebAY0M2fApEI497raQ==" + }, + "@fortawesome/fontawesome-svg-core": { + "version": "1.2.19", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.19.tgz", + "integrity": "sha512-D4ICXg9oU08eF9o7Or392gPpjmwwgJu8ecCFusthbID95CLVXOgIyd4mOKD9Nud5Ckz+Ty59pqkNtThDKR0erA==", + "requires": { + "@fortawesome/fontawesome-common-types": "^0.2.19" + } + }, + "@fortawesome/free-brands-svg-icons": { + "version": "5.9.0", + "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-5.9.0.tgz", + "integrity": "sha512-sOz1wFyslaHUak8tY6IEhSAV1mAWbCLssBR8yFQV6f065k8nUCkjyrcxW4RVl9+wiLXmeG1CJUABUJV9DiW+7Q==", + "requires": { + "@fortawesome/fontawesome-common-types": "^0.2.19" + } + }, + "@fortawesome/free-regular-svg-icons": { + "version": "5.9.0", + "resolved": "https://registry.npmjs.org/@fortawesome/free-regular-svg-icons/-/free-regular-svg-icons-5.9.0.tgz", + "integrity": "sha512-6ZO0jLhk/Yrso0u5pXeYYSfZiHCNoCF7SgtqStdlEX8WtWD4IOfAB1N+MlSnMo12P5KR4cmucX/K0NCOPrhJwg==", + "requires": { + "@fortawesome/fontawesome-common-types": "^0.2.19" + } + }, + "@fortawesome/free-solid-svg-icons": { + "version": "5.9.0", + "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.9.0.tgz", + "integrity": "sha512-U8YXPfWcSozsCW0psCtlRGKjjRs5+Am5JJwLOUmVHFZbIEWzaz4YbP84EoPwUsVmSAKrisu3QeNcVOtmGml0Xw==", + "requires": { + "@fortawesome/fontawesome-common-types": "^0.2.19" + } + }, + "@fortawesome/react-fontawesome": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/@fortawesome/react-fontawesome/-/react-fontawesome-0.1.4.tgz", + "integrity": "sha512-GwmxQ+TK7PEdfSwvxtGnMCqrfEm0/HbRHArbUudsYiy9KzVCwndxa2KMcfyTQ8El0vROrq8gOOff09RF1oQe8g==", + "requires": { + "humps": "^2.0.1", + "prop-types": "^15.5.10" + } + }, "@hot-loader/react-dom": { "version": "16.8.6", "resolved": "https://registry.npmjs.org/@hot-loader/react-dom/-/react-dom-16.8.6.tgz", @@ -1583,6 +1629,11 @@ "integrity": "sha1-qJS3XUvE9s1nnvMkSp/Y9Gri1Cg=", "dev": true }, + "asap": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz", + "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=" + }, "asn1.js": { "version": "4.10.1", "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.10.1.tgz", @@ -2056,6 +2107,11 @@ "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=", "dev": true }, + "bowser": { + "version": "1.9.4", + "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.9.4.tgz", + "integrity": "sha512-9IdMmj2KjigRq6oWhmwv1W36pDuA4STQZ8q6YO9um+x07xgYNCD3Oou+WP/3L1HNz7iqythGet3/p4wvc8AAwQ==" + }, "brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", @@ -2449,6 +2505,11 @@ } } }, + "classnames": { + "version": "2.2.6", + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz", + "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q==" + }, "clean-css": { "version": "4.2.1", "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.1.tgz", @@ -2833,6 +2894,11 @@ } } }, + "core-js": { + "version": "1.2.7", + "resolved": "https://registry.npmjs.org/core-js/-/core-js-1.2.7.tgz", + "integrity": "sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY=" + }, "core-js-compat": { "version": "3.1.4", "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.1.4.tgz", @@ -2945,6 +3011,15 @@ "randomfill": "^1.0.3" } }, + "css-in-js-utils": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.1.tgz", + "integrity": "sha512-PJF0SpJT+WdbVVt0AOYp9C8GnuruRlL/UFW7932nLWmFLQTaWEzTBQEx7/hn4BuV+WON75iAViSUJLiU3PKbpA==", + "requires": { + "hyphenate-style-name": "^1.0.2", + "isobject": "^3.0.1" + } + }, "css-loader": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-2.1.0.tgz", @@ -3330,6 +3405,14 @@ "integrity": "sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k=", "dev": true }, + "encoding": { + "version": "0.1.12", + "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz", + "integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s=", + "requires": { + "iconv-lite": "~0.4.13" + } + }, "end-of-stream": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.1.tgz", @@ -3499,6 +3582,23 @@ } } }, + "eslint-config-prettier": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-6.0.0.tgz", + "integrity": "sha512-vDrcCFE3+2ixNT5H83g28bO/uYAwibJxerXPj+E7op4qzBCsAV36QfvdAyVOoNxKAH2Os/e01T/2x++V0LPukA==", + "dev": true, + "requires": { + "get-stdin": "^6.0.0" + }, + "dependencies": { + "get-stdin": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/get-stdin/-/get-stdin-6.0.0.tgz", + "integrity": "sha512-jp4tHawyV7+fkkSKyvjuLZswblUtz+SQKzSWnBbii16BuZksJlU1wuBYXY75r+duh/llF1ur6oNwi+2ZzjKZ7g==", + "dev": true + } + } + }, "eslint-config-react-app": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/eslint-config-react-app/-/eslint-config-react-app-4.0.1.tgz", @@ -4089,6 +4189,11 @@ "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz", "integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=" }, + "fast-memoize": { + "version": "2.5.1", + "resolved": "https://registry.npmjs.org/fast-memoize/-/fast-memoize-2.5.1.tgz", + "integrity": "sha512-xdmw296PCL01tMOXx9mdJSmWY29jQgxyuZdq0rEHMu+Tpe1eOEtCycoG6chzlcrWsNgpZP7oL8RiQr7+G6Bl6g==" + }, "fastparse": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.2.tgz", @@ -4104,6 +4209,20 @@ "websocket-driver": ">=0.5.1" } }, + "fbjs": { + "version": "0.8.17", + "resolved": "https://registry.npmjs.org/fbjs/-/fbjs-0.8.17.tgz", + "integrity": "sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=", + "requires": { + "core-js": "^1.0.0", + "isomorphic-fetch": "^2.1.1", + "loose-envify": "^1.0.0", + "object-assign": "^4.1.0", + "promise": "^7.1.1", + "setimmediate": "^1.0.5", + "ua-parser-js": "^0.7.18" + } + }, "figgy-pudding": { "version": "3.5.1", "resolved": "https://registry.npmjs.org/figgy-pudding/-/figgy-pudding-3.5.1.tgz", @@ -5028,6 +5147,18 @@ "integrity": "sha1-3BXKHGcjh8p2vTesCjlbogQqLCg=", "dev": true }, + "glamor": { + "version": "2.20.40", + "resolved": "https://registry.npmjs.org/glamor/-/glamor-2.20.40.tgz", + "integrity": "sha512-DNXCd+c14N9QF8aAKrfl4xakPk5FdcFwmH7sD0qnC0Pr7xoZ5W9yovhUrY/dJc3psfGGXC58vqQyRtuskyUJxA==", + "requires": { + "fbjs": "^0.8.12", + "inline-style-prefixer": "^3.0.6", + "object-assign": "^4.1.1", + "prop-types": "^15.5.10", + "through": "^2.3.8" + } + }, "glob": { "version": "7.1.4", "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.4.tgz", @@ -5585,6 +5716,11 @@ "integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=", "dev": true }, + "humps": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/humps/-/humps-2.0.1.tgz", + "integrity": "sha1-3QLqYIG9BWjcXQcxhEY5V7qe+ao=" + }, "husky": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/husky/-/husky-3.0.1.tgz", @@ -5679,11 +5815,15 @@ } } }, + "hyphenate-style-name": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz", + "integrity": "sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ==" + }, "iconv-lite": { "version": "0.4.24", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==", - "dev": true, "requires": { "safer-buffer": ">= 2.1.2 < 3" } @@ -5781,6 +5921,15 @@ "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==", "dev": true }, + "inline-style-prefixer": { + "version": "3.0.8", + "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.8.tgz", + "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ=", + "requires": { + "bowser": "^1.7.3", + "css-in-js-utils": "^2.0.0" + } + }, "inquirer": { "version": "6.5.0", "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-6.5.0.tgz", @@ -6080,8 +6229,7 @@ "is-stream": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/is-stream/-/is-stream-1.1.0.tgz", - "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ=", - "dev": true + "integrity": "sha1-EtSj3U5o4Lec6428hBc66A2RykQ=" }, "is-symbol": { "version": "1.0.2", @@ -6119,8 +6267,16 @@ "isobject": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz", - "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8=", - "dev": true + "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8=" + }, + "isomorphic-fetch": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz", + "integrity": "sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=", + "requires": { + "node-fetch": "^1.0.1", + "whatwg-fetch": ">=0.10.0" + } }, "js-levenshtein": { "version": "1.1.6", @@ -6898,6 +7054,15 @@ "lower-case": "^1.1.1" } }, + "node-fetch": { + "version": "1.7.3", + "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-1.7.3.tgz", + "integrity": "sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==", + "requires": { + "encoding": "^0.1.11", + "is-stream": "^1.0.1" + } + }, "node-forge": { "version": "0.7.5", "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.7.5.tgz", @@ -7254,15 +7419,6 @@ "integrity": "sha512-y3b8Kpd8OAN444hxfBbFfj1FY/RjtTd8tzYwhUqNYXx0fXx2iX4maP4Qr6qhIKbQXI02wTLAda4fYUbDagTUFw==", "dev": true }, - "p-retry": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/p-retry/-/p-retry-3.0.1.tgz", - "integrity": "sha512-XE6G4+YTTkT2a0UWb2kjZe8xNwf8bIbnqpc/IS/idOBVhyves0mK5OJgeocjx7q5pvX/6m23xuzVPYT1uGM73w==", - "dev": true, - "requires": { - "retry": "^0.12.0" - } - }, "p-try": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz", @@ -7641,6 +7797,14 @@ "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==", "dev": true }, + "promise": { + "version": "7.3.1", + "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz", + "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==", + "requires": { + "asap": "~2.0.3" + } + }, "promise-inflight": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/promise-inflight/-/promise-inflight-1.0.1.tgz", @@ -7795,6 +7959,14 @@ } } }, + "re-resizable": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/re-resizable/-/re-resizable-5.0.1.tgz", + "integrity": "sha512-Iy8v5li7bhNBDxCN1DbA4l6G2Hk8NCZtcExoI1D+5pfvKyQcH8LH2P5h3DGoEfHhs0uyyRC1Qx8bHBomfrmxgA==", + "requires": { + "fast-memoize": "^2.5.1" + } + }, "react": { "version": "16.8.6", "resolved": "https://registry.npmjs.org/react/-/react-16.8.6.tgz", @@ -8312,12 +8484,6 @@ "integrity": "sha512-TTlYpa+OL+vMMNG24xSlQGEJ3B/RzEfUlLct7b5G/ytav+wPrplCpVMFuwzXbkecJrb6IYo1iFb0S9v37754mg==", "dev": true }, - "retry": { - "version": "0.12.0", - "resolved": "https://registry.npmjs.org/retry/-/retry-0.12.0.tgz", - "integrity": "sha1-G0KmJmoh8HQh0bC1S33BZ7AcATs=", - "dev": true - }, "rimraf": { "version": "2.6.3", "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.3.tgz", @@ -8388,8 +8554,7 @@ "safer-buffer": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", - "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", - "dev": true + "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==" }, "scheduler": { "version": "0.13.6", @@ -8590,8 +8755,7 @@ "setimmediate": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/setimmediate/-/setimmediate-1.0.5.tgz", - "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=", - "dev": true + "integrity": "sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=" }, "setprototypeof": { "version": "1.1.1", @@ -9228,8 +9392,7 @@ "through": { "version": "2.3.8", "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz", - "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=", - "dev": true + "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=" }, "through2": { "version": "2.0.5", @@ -9379,6 +9542,11 @@ "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=", "dev": true }, + "ua-parser-js": { + "version": "0.7.20", + "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.20.tgz", + "integrity": "sha512-8OaIKfzL5cpx8eCMAhhvTlft8GYF8b2eQr6JkCyVdrgjcytyOmPCXrqXFcUnhonRpLlh5yxEZVohm6mzaowUOw==" + }, "uglify-js": { "version": "3.4.10", "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.4.10.tgz", @@ -9876,42 +10044,41 @@ } }, "webpack-dev-server": { - "version": "3.7.2", - "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.7.2.tgz", - "integrity": "sha512-mjWtrKJW2T9SsjJ4/dxDC2fkFVUw8jlpemDERqV0ZJIkjjjamR2AbQlr3oz+j4JLhYCHImHnXZK5H06P2wvUew==", + "version": "3.2.1", + "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-3.2.1.tgz", + "integrity": "sha512-sjuE4mnmx6JOh9kvSbPYw3u/6uxCLHNWfhWaIPwcXWsvWOPN+nc5baq4i9jui3oOBRXGonK9+OI0jVkaz6/rCw==", "dev": true, "requires": { "ansi-html": "0.0.7", "bonjour": "^3.5.0", - "chokidar": "^2.1.6", - "compression": "^1.7.4", - "connect-history-api-fallback": "^1.6.0", + "chokidar": "^2.0.0", + "compression": "^1.5.2", + "connect-history-api-fallback": "^1.3.0", "debug": "^4.1.1", - "del": "^4.1.1", - "express": "^4.17.1", - "html-entities": "^1.2.1", + "del": "^3.0.0", + "express": "^4.16.2", + "html-entities": "^1.2.0", "http-proxy-middleware": "^0.19.1", "import-local": "^2.0.0", - "internal-ip": "^4.3.0", + "internal-ip": "^4.2.0", "ip": "^1.1.5", - "killable": "^1.0.1", - "loglevel": "^1.6.3", - "opn": "^5.5.0", - "p-retry": "^3.0.1", - "portfinder": "^1.0.20", + "killable": "^1.0.0", + "loglevel": "^1.4.1", + "opn": "^5.1.0", + "portfinder": "^1.0.9", "schema-utils": "^1.0.0", - "selfsigned": "^1.10.4", - "semver": "^6.1.1", - "serve-index": "^1.9.1", + "selfsigned": "^1.9.1", + "semver": "^5.6.0", + "serve-index": "^1.7.2", "sockjs": "0.3.19", "sockjs-client": "1.3.0", "spdy": "^4.0.0", - "strip-ansi": "^3.0.1", + "strip-ansi": "^3.0.0", "supports-color": "^6.1.0", "url": "^0.11.0", - "webpack-dev-middleware": "^3.7.0", + "webpack-dev-middleware": "^3.5.1", "webpack-log": "^2.0.0", - "yargs": "12.0.5" + "yargs": "12.0.2" }, "dependencies": { "ansi-regex": { @@ -9920,6 +10087,12 @@ "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=", "dev": true }, + "camelcase": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz", + "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=", + "dev": true + }, "cliui": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/cliui/-/cliui-4.1.0.tgz", @@ -9948,6 +10121,29 @@ } } }, + "decamelize": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-2.0.0.tgz", + "integrity": "sha512-Ikpp5scV3MSYxY39ymh45ZLEecsTdv/Xj2CaQfI8RLMuwi7XvjX9H/fhraiSuU+C5w5NTDu4ZU72xNiZnurBPg==", + "dev": true, + "requires": { + "xregexp": "4.0.0" + } + }, + "del": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/del/-/del-3.0.0.tgz", + "integrity": "sha1-U+z2mf/LyzljdpGrE7rxYIGXZuU=", + "dev": true, + "requires": { + "globby": "^6.1.0", + "is-path-cwd": "^1.0.0", + "is-path-in-cwd": "^1.0.0", + "p-map": "^1.1.1", + "pify": "^3.0.0", + "rimraf": "^2.2.8" + } + }, "get-caller-file": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-1.0.3.tgz", @@ -9963,18 +10159,48 @@ "number-is-nan": "^1.0.0" } }, + "is-path-cwd": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-1.0.0.tgz", + "integrity": "sha1-0iXsIxMuie3Tj9p2dHLmLmXxEG0=", + "dev": true + }, + "is-path-in-cwd": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/is-path-in-cwd/-/is-path-in-cwd-1.0.1.tgz", + "integrity": "sha512-FjV1RTW48E7CWM7eE/J2NJvAEEVektecDBVBE5Hh3nM1Jd0kvhHtX68Pr3xsDf857xt3Y4AkwVULK1Vku62aaQ==", + "dev": true, + "requires": { + "is-path-inside": "^1.0.0" + } + }, + "is-path-inside": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-1.0.1.tgz", + "integrity": "sha1-jvW33lBDej/cprToZe96pVy0gDY=", + "dev": true, + "requires": { + "path-is-inside": "^1.0.1" + } + }, + "p-map": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/p-map/-/p-map-1.2.0.tgz", + "integrity": "sha512-r6zKACMNhjPJMTl8KcFH4li//gkrXWfbD6feV8l6doRHlzljFWGJ2AP6iKaCJXyZmAUMOPtvbW7EXkbWO/pLEA==", + "dev": true + }, + "pify": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/pify/-/pify-3.0.0.tgz", + "integrity": "sha1-5aSs0sEB/fPZpNB/DbxNtJ3SgXY=", + "dev": true + }, "require-main-filename": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz", "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE=", "dev": true }, - "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", - "dev": true - }, "strip-ansi": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", @@ -10017,13 +10243,13 @@ } }, "yargs": { - "version": "12.0.5", - "resolved": "https://registry.npmjs.org/yargs/-/yargs-12.0.5.tgz", - "integrity": "sha512-Lhz8TLaYnxq/2ObqHDql8dX8CJi97oHxrjUcYtzKbbykPtVW9WB+poxI+NM2UIzsMgNCZTIf0AQwsjK5yMAqZw==", + "version": "12.0.2", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-12.0.2.tgz", + "integrity": "sha512-e7SkEx6N6SIZ5c5H22RTZae61qtn3PYUE8JYbBFlK9sYmh3DMQ6E5ygtaG/2BW0JZi4WGgTR2IV5ChqlqrDGVQ==", "dev": true, "requires": { "cliui": "^4.0.0", - "decamelize": "^1.2.0", + "decamelize": "^2.0.0", "find-up": "^3.0.0", "get-caller-file": "^1.0.1", "os-locale": "^3.0.0", @@ -10033,17 +10259,16 @@ "string-width": "^2.0.0", "which-module": "^2.0.0", "y18n": "^3.2.1 || ^4.0.0", - "yargs-parser": "^11.1.1" + "yargs-parser": "^10.1.0" } }, "yargs-parser": { - "version": "11.1.1", - "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-11.1.1.tgz", - "integrity": "sha512-C6kB/WJDiaxONLJQnF8ccx9SEeoTTLek8RVbaOIsrAUS8VrBEXfmeSnCZxygc+XC2sNMBIwOOnfcxiynjHsVSQ==", + "version": "10.1.0", + "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-10.1.0.tgz", + "integrity": "sha512-VCIyR1wJoEBZUqk5PA+oOBF6ypbwh5aNB3I50guxAL/quggdfs4TtNHQrSazFA3fYZ+tEqfs0zIGlv0c/rgjbQ==", "dev": true, "requires": { - "camelcase": "^5.0.0", - "decamelize": "^1.2.0" + "camelcase": "^4.1.0" } } } @@ -10093,6 +10318,11 @@ "integrity": "sha512-nqHUnMXmBzT0w570r2JpJxfiSD1IzoI+HGVdd3aZ0yNi3ngvQ4jv1dtHt5VGxfI2yj5yqImPhOK4vmIh2xMbGg==", "dev": true }, + "whatwg-fetch": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz", + "integrity": "sha512-9GSJUgz1D4MfyKU7KRqwOjXCXTqWdFNvEr7eUBYchQiVc744mqK/MzXPNR2WsPkmkOa4ywfg8C2n8h+13Bey1Q==" + }, "which": { "version": "1.3.1", "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz", @@ -10185,6 +10415,12 @@ } } }, + "xregexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/xregexp/-/xregexp-4.0.0.tgz", + "integrity": "sha512-PHyM+sQouu7xspQQwELlGwwd05mXUFqwFYfqPO0cC7x4fxyHnnuetmQr6CjJiafIDoH4MogHb9dOoJzR/Y4rFg==", + "dev": true + }, "xtend": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz", diff --git a/package.json b/package.json index 152b92f..6aa4507 100755 --- a/package.json +++ b/package.json @@ -13,7 +13,16 @@ "prettier": "prettier --write '**/*.{js,jsx,css,html}'" }, "dependencies": { + "@fortawesome/fontawesome-svg-core": "^1.2.19", + "@fortawesome/free-brands-svg-icons": "^5.9.0", + "@fortawesome/free-regular-svg-icons": "^5.9.0", + "@fortawesome/free-solid-svg-icons": "^5.9.0", + "@fortawesome/react-fontawesome": "^0.1.4", "@hot-loader/react-dom": "^16.8.6", + "classnames": "^2.2.6", + "glamor": "^2.20.40", + "prop-types": "^15.7.2", + "re-resizable": "^5.0.1", "react": "^16.8.6", "react-dom": "^16.8.6", "react-hot-loader": "^4.12.8" @@ -30,6 +39,7 @@ "copy-webpack-plugin": "^5.0.3", "css-loader": "2.1.0", "eslint": "^5.16.0", + "eslint-config-prettier": "^6.0.0", "eslint-config-react-app": "^4.0.1", "eslint-plugin-flowtype": "^2.50.3", "eslint-plugin-import": "^2.18.2", diff --git a/src/components/Logo/Logo.css b/src/components/Logo/Logo.css new file mode 100644 index 0000000..e906ebc --- /dev/null +++ b/src/components/Logo/Logo.css @@ -0,0 +1,12 @@ +.Logo { + transition: all 0.1s ease-out; +} + +.Img { + width: 100%; + height: 100%; + border-radius: 5px; + position: absolute; + top: 0px; + left: 0px; +} diff --git a/src/components/Logo/Logo.jsx b/src/components/Logo/Logo.jsx new file mode 100644 index 0000000..f10e009 --- /dev/null +++ b/src/components/Logo/Logo.jsx @@ -0,0 +1,35 @@ +import React from 'react'; + +import AppLogo from '../../assets/img/icon-128.png'; +import './Logo.css'; + +/* + props: + - hover: boolean (true / false) + - size: string ('50px') +*/ + +const logo = (props) => { + let src = AppLogo; + + if (window.chrome !== undefined && chrome.extension !== undefined) { + src = chrome.extension.getURL(AppLogo); + } + + return ( +
+ APP Logo +
+ ); +}; + +export default logo; diff --git a/src/containers/Greetings/Greetings.jsx b/src/containers/Greetings/Greetings.jsx deleted file mode 100644 index b0404c8..0000000 --- a/src/containers/Greetings/Greetings.jsx +++ /dev/null @@ -1,19 +0,0 @@ -import React, { Component } from 'react'; -import icon from '../../assets/img/icon-128.png'; - -class GreetingComponent extends Component { - state = { - name: 'dev', - }; - - render() { - return ( -
-

Hello, {this.state.name}!

- extension icon -
- ); - } -} - -export default GreetingComponent; diff --git a/src/manifest.json b/src/manifest.json index 286e9bb..6d35aef 100755 --- a/src/manifest.json +++ b/src/manifest.json @@ -13,6 +13,7 @@ "css": ["content.styles.css"] }], "web_accessible_resources": [ + "sidebar.html", "content.styles.css", "icon-128.png", "icon-34.png" diff --git a/src/pages/Content/index.js b/src/pages/Content/index.js deleted file mode 100644 index 12a65d9..0000000 --- a/src/pages/Content/index.js +++ /dev/null @@ -1,6 +0,0 @@ -import { printLine } from './modules/print'; - -console.log('Content script works!'); -console.log('Must reload extension for modifications to take effect.'); - -printLine('Using a function from the Print Module'); diff --git a/src/pages/Content/index.jsx b/src/pages/Content/index.jsx new file mode 100644 index 0000000..2891e9c --- /dev/null +++ b/src/pages/Content/index.jsx @@ -0,0 +1,41 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; +import Frame from './modules/frame'; + +let shouldShrinkBody = false; +let sidebarRoot = document.createElement('div'); +document.body.appendChild(sidebarRoot); +sidebarRoot.setAttribute('id', 'vt-sidebar-root'); + +function shrinkBody(isOpen) { + if (shouldShrinkBody) { + if (isOpen) { + document.body.style.marginRight = '410px'; + } else { + document.body.style.marginRight = '0px'; + } + } +} + +function mountSidebar() { + console.log(chrome.extension.getURL('sidebar.html')); + const App = ( + + ); + ReactDOM.render(App, sidebarRoot); +} + +function unmountSidebar() { + try { + document.body.style.marginRight = '0px'; + ReactDOM.unmountComponentAtNode(sidebarRoot); + } catch (e) { + console.log(e); + } +} + +mountSidebar(); diff --git a/src/pages/Content/modules/frame.css b/src/pages/Content/modules/frame.css new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/Content/modules/frame.jsx b/src/pages/Content/modules/frame.jsx new file mode 100644 index 0000000..2a9c5fd --- /dev/null +++ b/src/pages/Content/modules/frame.jsx @@ -0,0 +1,330 @@ +import React, { Component } from 'react'; +import cx from 'classnames'; +import { css } from 'glamor'; +import { node, object, string, number, func } from 'prop-types'; + +import { APP_NAME_SHORT } from '../../../shared//constants'; +import Logo from '../../../components/Logo/Logo'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { faChevronLeft } from '@fortawesome/free-solid-svg-icons'; +import { faChevronRight } from '@fortawesome/free-solid-svg-icons'; +import { Resizable } from 're-resizable'; +import styles from './frame.css'; + +const iframeClass = css({ + border: 'none', + width: '100%', + height: '100%', + background: 'white', + boxSizing: 'border-box', + borderRadius: '3px', + boxShadow: '-1px 1px 8px rgba(0,0,0,.15)', +}); + +const containerClass = css({ + position: 'fixed', + top: '0px', + right: '0px', + height: '100%', + padding: '3px 3px 3px 0px', + boxSizing: 'border-box', + borderRadius: '3px', + transform: 'translateX(115%)', + transition: 'transform .25s cubic-bezier(0, 0, 0.3, 1)', + zIndex: 99999999, +}); + +const containerVisibleClass = css({ + transform: 'translate3d(0,0,0)', +}); + +const containerMinimizedClass = css({ + cursor: 'pointer', + transform: 'translateX(98%)', + ':hover': { + transform: 'translateX(94%)', + }, + '& > iframe': { + pointerEvents: 'none', + }, +}); + +const toggleButtonClass = css({ + position: 'fixed', + bottom: '40px', + right: '30px', + zIndex: 9999999999, +}); + +const toggleButtonInnerClass = css({ + position: 'absolute', + right: '0px', + bottom: '0px', + width: '45px', + height: '35px', + boxSizing: 'border-box', + cursor: 'pointer', + padding: '2px 5px', + display: 'flex', + alignItems: 'center', + justifyContent: 'space-around', + fontSize: '16px', + fontFamily: 'arial', + backgroundColor: 'white', + color: 'rgb(193, 40, 27)', + borderRadius: '6px', + boxShadow: '-1px 1px 8px rgba(0,0,0,.2)', + transition: 'all 0.3s', + opacity: 0.3, + ':hover': { + width: '210px', + opacity: 1, + }, +}); + +const FRAME_TOGGLE_FUNCTION = 'chromeIframeSheetToggle'; + +export class Frame extends Component { + state = { + isVisible: false, + isMinimized: true, // default is minimized, + + isDragging: false, + width: 250, + height: '100%', + }; + + static defaultProps = { + url: '', + delay: 500, + maskClassName: '', + maskStyle: {}, + containerClassName: '', + containerStyle: {}, + iframeClassName: '', + iframeStyle: {}, + onMount: () => {}, + onUnmount: () => {}, + onLoad: () => {}, + }; + + static propTypes = { + url: string, + delay: number, + maskClassName: string, + maskStyle: object, + containerClassName: string, + containerStyle: object, + iframeClassName: string, + iframeStyle: object, + children: node, + containerChildren: node, + onMount: func, + onUnmount: func, + onLoad: func, + }; + + componentDidMount() { + const { delay, onMount } = this.props; + + window[FRAME_TOGGLE_FUNCTION] = this.toggleFrame; + + onMount({ + mask: this.mask, + frame: this.frame, + }); + + this._visibleRenderTimeout = setTimeout(() => { + this.setState({ + isVisible: true, + }); + }, delay); + + try { + let widthObj = localStorage.getItem('vt-sidebar-width'); + if (widthObj !== undefined) { + this.setState({ width: JSON.parse(widthObj).width }); + } + } catch (e) { + localStorage.removeItem('vt-sidebar-width'); + } + } + + componentWillUnmount() { + const { onUnmount } = this.props; + + onUnmount({ + mask: this.mask, + frame: this.frame, + }); + + delete window[FRAME_TOGGLE_FUNCTION]; + clearTimeout(this._visibleRenderTimeout); + } + + onLoad = () => { + const { onLoad } = this.props; + + onLoad({ + mask: this.mask, + frame: this.frame, + }); + }; + + toggleMinimizedStatus = (e) => { + // e.stopPropagation(); + window[FRAME_TOGGLE_FUNCTION](); + }; + + onFrameClick = () => { + this.toggleFrame(); + }; + + toggleFrame = (to = undefined) => { + if (to === undefined) { + this.setState((prevState) => { + this.props.shrinkBody(prevState.isMinimized); + return { isMinimized: !prevState.isMinimized }; + }); + } else { + this.props.shrinkBody(!to); + this.setState({ isMinimized: to }); + } + }; + + static isReady() { + return typeof window[FRAME_TOGGLE_FUNCTION] !== 'undefined'; + } + + static toggle(to = undefined) { + if (window[FRAME_TOGGLE_FUNCTION]) { + window[FRAME_TOGGLE_FUNCTION](to); + } + } + + render() { + const { isVisible, isMinimized, isDragging } = this.state; + const { + url, + className, + containerClassName, + containerStyle, + iframeClassName, + iframeStyle, + children, + containerChildren, + viewportWidth, + } = this.props; + + return ( + + {!isDragging && ( +
+
+
+ +
+ +
+
+ {` ${ + this.state.isMinimized ? 'Open' : 'Close' + } ${APP_NAME_SHORT} sidebar`} +
+
+
+
+ )} +
+ { + // e.stopPropagation(); + // }} + onResizeStart={(e) => { + this.setState({ isDragging: true }); + }} + onResizeStop={(e, direction, ref, d) => { + let width = + parseInt(this.state.width, 10) + parseInt(d.width, 10); + this.setState({ + width: width, + isDragging: false, + }); + localStorage.setItem( + 'vt-sidebar-width', + JSON.stringify({ width: width }) + ); + }} + > +