From 4c0ba57a0a6c6f17276e9ec1dafe8a9b71a77ccc Mon Sep 17 00:00:00 2001 From: Jason Matthias Date: Thu, 20 Jun 2019 12:05:18 -0700 Subject: [PATCH 1/7] Add dev dependency prop-types --- package-lock.json | 129 ++++++++++++++++++++++++++++------------------ package.json | 1 + 2 files changed, 79 insertions(+), 51 deletions(-) diff --git a/package-lock.json b/package-lock.json index 174dc95..35cc7d2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1599,7 +1599,7 @@ }, "util": { "version": "0.10.3", - "resolved": "http://registry.npmjs.org/util/-/util-0.10.3.tgz", + "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz", "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=", "requires": { "inherits": "2.0.1" @@ -1732,7 +1732,7 @@ }, "supports-color": { "version": "2.0.0", - "resolved": "http://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=" } } @@ -2384,7 +2384,7 @@ "dependencies": { "resolve": { "version": "1.1.7", - "resolved": "http://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz", + "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.1.7.tgz", "integrity": "sha1-IDEU2CrSxe2ejgQRs5ModeiJ6Xs=" } } @@ -3277,7 +3277,7 @@ }, "regexpu-core": { "version": "1.0.0", - "resolved": "http://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz", + "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz", "integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs=", "requires": { "regenerate": "^1.2.1", @@ -3287,12 +3287,12 @@ }, "regjsgen": { "version": "0.2.0", - "resolved": "http://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz", + "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz", "integrity": "sha1-bAFq3qxVT3WCP+N6wFuS1aTtsfc=" }, "regjsparser": { "version": "0.1.5", - "resolved": "http://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz", + "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz", "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw=", "requires": { "jsesc": "~0.5.0" @@ -3656,7 +3656,7 @@ "dependencies": { "pify": { "version": "2.3.0", - "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz", + "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=" } } @@ -5508,7 +5508,8 @@ }, "ansi-regex": { "version": "2.1.1", - "bundled": true + "bundled": true, + "optional": true }, "aproba": { "version": "1.2.0", @@ -5526,11 +5527,13 @@ }, "balanced-match": { "version": "1.0.0", - "bundled": true + "bundled": true, + "optional": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, + "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -5543,15 +5546,18 @@ }, "code-point-at": { "version": "1.1.0", - "bundled": true + "bundled": true, + "optional": true }, "concat-map": { "version": "0.0.1", - "bundled": true + "bundled": true, + "optional": true }, "console-control-strings": { "version": "1.1.0", - "bundled": true + "bundled": true, + "optional": true }, "core-util-is": { "version": "1.0.2", @@ -5654,7 +5660,8 @@ }, "inherits": { "version": "2.0.3", - "bundled": true + "bundled": true, + "optional": true }, "ini": { "version": "1.3.5", @@ -5664,6 +5671,7 @@ "is-fullwidth-code-point": { "version": "1.0.0", "bundled": true, + "optional": true, "requires": { "number-is-nan": "^1.0.0" } @@ -5676,17 +5684,20 @@ "minimatch": { "version": "3.0.4", "bundled": true, + "optional": true, "requires": { "brace-expansion": "^1.1.7" } }, "minimist": { "version": "0.0.8", - "bundled": true + "bundled": true, + "optional": true }, "minipass": { "version": "2.2.4", "bundled": true, + "optional": true, "requires": { "safe-buffer": "^5.1.1", "yallist": "^3.0.0" @@ -5703,6 +5714,7 @@ "mkdirp": { "version": "0.5.1", "bundled": true, + "optional": true, "requires": { "minimist": "0.0.8" } @@ -5775,7 +5787,8 @@ }, "number-is-nan": { "version": "1.0.1", - "bundled": true + "bundled": true, + "optional": true }, "object-assign": { "version": "4.1.1", @@ -5785,6 +5798,7 @@ "once": { "version": "1.4.0", "bundled": true, + "optional": true, "requires": { "wrappy": "1" } @@ -5860,7 +5874,8 @@ }, "safe-buffer": { "version": "5.1.1", - "bundled": true + "bundled": true, + "optional": true }, "safer-buffer": { "version": "2.1.2", @@ -5890,6 +5905,7 @@ "string-width": { "version": "1.0.2", "bundled": true, + "optional": true, "requires": { "code-point-at": "^1.0.0", "is-fullwidth-code-point": "^1.0.0", @@ -5907,6 +5923,7 @@ "strip-ansi": { "version": "3.0.1", "bundled": true, + "optional": true, "requires": { "ansi-regex": "^2.0.0" } @@ -5945,11 +5962,13 @@ }, "wrappy": { "version": "1.0.2", - "bundled": true + "bundled": true, + "optional": true }, "yallist": { "version": "3.0.2", - "bundled": true + "bundled": true, + "optional": true } } }, @@ -8513,7 +8532,7 @@ }, "media-typer": { "version": "0.3.0", - "resolved": "http://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", + "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", "integrity": "sha1-hxDXrwqmJvj/+hzgAWhUUmMlV0g=" }, "mem": { @@ -8653,7 +8672,7 @@ }, "minimist": { "version": "1.2.0", - "resolved": "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz", "integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=" }, "mississippi": { @@ -8710,7 +8729,7 @@ }, "mkdirp": { "version": "0.5.1", - "resolved": "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", + "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", "integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=", "requires": { "minimist": "0.0.8" @@ -8718,7 +8737,7 @@ "dependencies": { "minimist": { "version": "0.0.8", - "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=" } } @@ -8763,7 +8782,7 @@ }, "mute-stream": { "version": "0.0.7", - "resolved": "http://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz", + "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz", "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=" }, "nan": { @@ -9110,7 +9129,7 @@ "dependencies": { "minimist": { "version": "0.0.10", - "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz", "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8=" }, "wordwrap": { @@ -9157,7 +9176,7 @@ }, "os-homedir": { "version": "1.0.2", - "resolved": "http://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz", + "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz", "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=" }, "os-locale": { @@ -9172,7 +9191,7 @@ }, "os-tmpdir": { "version": "1.0.2", - "resolved": "http://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz", + "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz", "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=" }, "p-defer": { @@ -9293,7 +9312,7 @@ }, "path-browserify": { "version": "0.0.0", - "resolved": "http://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz", + "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-0.0.0.tgz", "integrity": "sha1-oLhwcpquIUAFt9UDLsLLuw+0RRo=" }, "path-dirname": { @@ -9308,7 +9327,7 @@ }, "path-is-absolute": { "version": "1.0.1", - "resolved": "http://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", + "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=" }, "path-is-inside": { @@ -10950,7 +10969,7 @@ }, "pretty-bytes": { "version": "4.0.2", - "resolved": "http://registry.npmjs.org/pretty-bytes/-/pretty-bytes-4.0.2.tgz", + "resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-4.0.2.tgz", "integrity": "sha1-sr+C5zUNZcbDOqlaqlpPYyf2HNk=" }, "pretty-error": { @@ -11062,12 +11081,20 @@ } }, "prop-types": { - "version": "15.6.2", - "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.6.2.tgz", - "integrity": "sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==", + "version": "15.7.2", + "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz", + "integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==", "requires": { - "loose-envify": "^1.3.1", - "object-assign": "^4.1.1" + "loose-envify": "^1.4.0", + "object-assign": "^4.1.1", + "react-is": "^16.8.1" + }, + "dependencies": { + "react-is": { + "version": "16.8.6", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.8.6.tgz", + "integrity": "sha512-aUk3bHfZ2bRSVFFbbeVS4i+lNPZr3/WM5jT2J5omUVV1zzcs1nAaf3l51ctA5FFvCRbhrH0bdAsRRQddFJZPtA==" + } } }, "proxy-addr": { @@ -11553,7 +11580,7 @@ }, "readable-stream": { "version": "2.3.6", - "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz", + "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz", "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==", "requires": { "core-util-is": "~1.0.0", @@ -12103,7 +12130,7 @@ }, "require-uncached": { "version": "1.0.3", - "resolved": "http://registry.npmjs.org/require-uncached/-/require-uncached-1.0.3.tgz", + "resolved": "https://registry.npmjs.org/require-uncached/-/require-uncached-1.0.3.tgz", "integrity": "sha1-Tg1W1slmL9MeQwEcS5WqSZVUIdM=", "requires": { "caller-path": "^0.1.0", @@ -12191,7 +12218,7 @@ }, "rgba-regex": { "version": "1.0.0", - "resolved": "http://registry.npmjs.org/rgba-regex/-/rgba-regex-1.0.0.tgz", + "resolved": "https://registry.npmjs.org/rgba-regex/-/rgba-regex-1.0.0.tgz", "integrity": "sha1-QzdOLiyglosO8VI0YLfXMP8i7rM=" }, "rimraf": { @@ -12253,7 +12280,7 @@ }, "safe-regex": { "version": "1.1.0", - "resolved": "http://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz", + "resolved": "https://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz", "integrity": "sha1-QKNmnzsHfR6UPURinhV91IAjvy4=", "requires": { "ret": "~0.1.10" @@ -12773,7 +12800,7 @@ }, "sha.js": { "version": "2.4.11", - "resolved": "http://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz", + "resolved": "https://registry.npmjs.org/sha.js/-/sha.js-2.4.11.tgz", "integrity": "sha512-QMEp5B7cftE7APOjk5Y6xgrbWu+WkLVQwk8JNjZ8nKRciZaByEW6MubieAiToS7+dwvrjGhH8jRXz3MVd0AYqQ==", "requires": { "inherits": "^2.0.1", @@ -13167,7 +13194,7 @@ }, "sprintf-js": { "version": "1.0.3", - "resolved": "http://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz", + "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz", "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=" }, "sshpk": { @@ -13318,7 +13345,7 @@ }, "string_decoder": { "version": "1.1.1", - "resolved": "http://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", + "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==", "requires": { "safe-buffer": "~5.1.0" @@ -13336,7 +13363,7 @@ }, "strip-ansi": { "version": "3.0.1", - "resolved": "http://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=", "requires": { "ansi-regex": "^2.0.0" @@ -13361,7 +13388,7 @@ }, "strip-eof": { "version": "1.0.0", - "resolved": "http://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz", + "resolved": "https://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz", "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8=" }, "strip-indent": { @@ -13468,7 +13495,7 @@ }, "table": { "version": "4.0.3", - "resolved": "http://registry.npmjs.org/table/-/table-4.0.3.tgz", + "resolved": "https://registry.npmjs.org/table/-/table-4.0.3.tgz", "integrity": "sha512-S7rnFITmBH1EnyKcvxBh1LjYeQMmnZtCXSEbHcH6S0NoKit24ZuFO/T1vDcLdYsLQkM188PVVhQmzKIuThNkKg==", "requires": { "ajv": "^6.0.1", @@ -13561,7 +13588,7 @@ }, "through": { "version": "2.3.8", - "resolved": "http://registry.npmjs.org/through/-/through-2.3.8.tgz", + "resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz", "integrity": "sha1-DdTJ/6q8NXlgsbckEV1+Doai4fU=" }, "through2": { @@ -13654,7 +13681,7 @@ }, "topo": { "version": "2.0.2", - "resolved": "http://registry.npmjs.org/topo/-/topo-2.0.2.tgz", + "resolved": "https://registry.npmjs.org/topo/-/topo-2.0.2.tgz", "integrity": "sha1-zVYVdSU5BXwNwEkaYhw7xvvh0YI=", "requires": { "hoek": "4.x.x" @@ -13694,7 +13721,7 @@ }, "tty-browserify": { "version": "0.0.0", - "resolved": "http://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz", + "resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz", "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY=" }, "tunnel-agent": { @@ -14111,7 +14138,7 @@ }, "vm-browserify": { "version": "0.0.4", - "resolved": "http://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz", + "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz", "integrity": "sha1-XX6kW7755Kb/ZflUOOCofDV9WnM=", "requires": { "indexof": "0.0.1" @@ -14941,7 +14968,7 @@ }, "wrap-ansi": { "version": "2.1.0", - "resolved": "http://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz", + "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz", "integrity": "sha1-2Pw9KE3QV5T+hJc8rs3Rz4JP3YU=", "requires": { "string-width": "^1.0.1", @@ -14958,7 +14985,7 @@ }, "string-width": { "version": "1.0.2", - "resolved": "http://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=", "requires": { "code-point-at": "^1.0.0", @@ -15031,7 +15058,7 @@ }, "yargs": { "version": "11.1.0", - "resolved": "http://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", + "resolved": "https://registry.npmjs.org/yargs/-/yargs-11.1.0.tgz", "integrity": "sha512-NwW69J42EsCSanF8kyn5upxvjp5ds+t3+udGBeTbFnERA+lF541DDpMawzo4z6W/QrzNM18D+BPMiOBibnFV5A==", "requires": { "cliui": "^4.0.0", diff --git a/package.json b/package.json index 8079fd8..517fc56 100644 --- a/package.json +++ b/package.json @@ -39,6 +39,7 @@ "jest-dom": "^3.0.0", "prettier": "1.15.3", "pretty-quick": "^1.8.0", + "prop-types": "^15.7.2", "react-testing-library": "^5.4.2", "redux-mock-store": "^1.5.3" } From 882f0063c728aad289982e201d7aa77f0c909ef0 Mon Sep 17 00:00:00 2001 From: Jason Matthias Date: Thu, 20 Jun 2019 12:06:06 -0700 Subject: [PATCH 2/7] Add proptypes and default props to components with containers --- src/components/Burst.js | 17 +++++++++++++++++ src/components/ErrorToast.js | 5 +++++ src/components/Preview.js | 35 +++++++++++++++++++++++++++++++++++ src/components/Settings.js | 19 +++++++++++++++++++ src/components/Sidebar.js | 25 +++++++++++++++++++++++++ 5 files changed, 101 insertions(+) diff --git a/src/components/Burst.js b/src/components/Burst.js index 4b3a7fe..a6a0272 100644 --- a/src/components/Burst.js +++ b/src/components/Burst.js @@ -1,4 +1,5 @@ import React, { Component } from 'react'; +import PropTypes from 'prop-types'; import classNames from 'classnames'; import { getBurstErrors } from '../lib/input-helpers'; import './Burst.css'; @@ -103,4 +104,20 @@ class Burst extends Component { } } +Burst.defaultProps = { + expanded: false, + width: 300, + height: 300, + oversample: false, + requestBurst: () => {} +}; + +Burst.propTypes = { + expanded: PropTypes.bool.isRequired, + width: PropTypes.number.isRequired, + height: PropTypes.number.isRequired, + oversample: PropTypes.bool.isRequired, + requestBurst: PropTypes.func.isRequired +}; + export default Burst; diff --git a/src/components/ErrorToast.js b/src/components/ErrorToast.js index 2fa934d..198ae99 100644 --- a/src/components/ErrorToast.js +++ b/src/components/ErrorToast.js @@ -1,4 +1,5 @@ import React from 'react'; +import PropTypes from 'prop-types'; import './ErrorToast.css'; const ErrorToast = ({ message }) => { @@ -10,4 +11,8 @@ const ErrorToast = ({ message }) => { ); }; +ErrorToast.propTypes = { + message: PropTypes.string.isRequired +}; + export default ErrorToast; diff --git a/src/components/Preview.js b/src/components/Preview.js index 485895a..0955e63 100644 --- a/src/components/Preview.js +++ b/src/components/Preview.js @@ -1,4 +1,5 @@ import React, { Component } from 'react'; +import PropTypes from 'prop-types'; import classNames from 'classnames'; import Frame from './Frame'; import './Preview.css'; @@ -107,4 +108,38 @@ class Preview extends Component { } } +Preview.defaultProps = { + expanded: false, + previewIdx: 0, + playing: false, + frames: {}, + frameIDs: [], + gifProgress: 0, + width: 300, + height: 300, + oversample: false, + interval: 100, + updatePreviewIdx: () => {}, + generateGIF: () => {}, + startAnimation: () => {}, + stopAnimation: () => {} +}; + +Preview.propTypes = { + expanded: PropTypes.bool.isRequired, + previewIdx: PropTypes.number.isRequired, + playing: PropTypes.bool.isRequired, + frames: PropTypes.object.isRequired, + frameIDs: PropTypes.array.isRequired, + gifProgress: PropTypes.number.isRequired, + width: PropTypes.number.isRequired, + height: PropTypes.number.isRequired, + oversample: PropTypes.bool.isRequired, + interval: PropTypes.number.isRequired, + updatePreviewIdx: PropTypes.func.isRequired, + generateGIF: PropTypes.func.isRequired, + startAnimation: PropTypes.func.isRequired, + stopAnimation: PropTypes.func.isRequired +}; + export default Preview; diff --git a/src/components/Settings.js b/src/components/Settings.js index 9780026..8572570 100644 --- a/src/components/Settings.js +++ b/src/components/Settings.js @@ -1,4 +1,5 @@ import React, { Component } from 'react'; +import PropTypes from 'prop-types'; import classNames from 'classnames'; import { isPositiveInteger } from '../lib/input-helpers'; import './Settings.css'; @@ -75,4 +76,22 @@ class Settings extends Component { } } +Settings.defaultProps = { + expanded: false, + width: 300, + height: 300, + oversample: false, + interval: 100, + updateSetting: () => {} +}; + +Settings.propTypes = { + expanded: PropTypes.bool.isRequired, + width: PropTypes.number.isRequired, + height: PropTypes.number.isRequired, + oversample: PropTypes.bool.isRequired, + interval: PropTypes.number.isRequired, + updateSetting: PropTypes.func.isRequired +}; + export default Settings; diff --git a/src/components/Sidebar.js b/src/components/Sidebar.js index a686b08..ea7e621 100644 --- a/src/components/Sidebar.js +++ b/src/components/Sidebar.js @@ -1,4 +1,5 @@ import React, { Component } from 'react'; +import PropTypes from 'prop-types'; import download from 'downloadjs'; import SidebarButton from './SidebarButton'; import SidebarButtonWithBadge from './SidebarButtonWithBadge'; @@ -99,4 +100,28 @@ class Sidebar extends Component { } } +Sidebar.propTypes = { + numFrames: PropTypes.number.isRequired, + expandedPane: PropTypes.string.isRequired, + gifData: PropTypes.string.isRequired, + width: PropTypes.number.isRequired, + height: PropTypes.number.isRequired, + oversample: PropTypes.bool.isRequired, + requestFrame: PropTypes.func.isRequired, + togglePane: PropTypes.func.isRequired, + reset: PropTypes.func.isRequired +}; + +Sidebar.defaultProps = { + numFrames: 0, + expandedPane: 'NONE', + gifData: '', + width: 100, + height: 100, + oversample: false, + requestFrame: () => {}, + togglePane: () => {}, + reset: () => {} +}; + export default Sidebar; From 3a489407b94aff59689695bd642b713e9880bff8 Mon Sep 17 00:00:00 2001 From: Jason Matthias Date: Thu, 20 Jun 2019 12:28:33 -0700 Subject: [PATCH 3/7] add defaultProps and propTypes to non-container components --- src/components/App.js | 9 +++++++++ src/components/Frame.js | 13 +++++++++++++ src/components/SidebarButton.js | 13 +++++++++++++ src/components/SidebarButtonWithBadge.js | 19 +++++++++++++++++++ 4 files changed, 54 insertions(+) diff --git a/src/components/App.js b/src/components/App.js index 8c16571..bc33df1 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -1,4 +1,5 @@ import React, { Component } from 'react'; +import PropTypes from 'prop-types'; import Header from '../components/Header'; import SidebarContainer from '../containers/SidebarContainer'; import PreviewContainer from '../containers/PreviewContainer'; @@ -48,4 +49,12 @@ class App extends Component { } } +App.defaultProps = { + onEscape: () => {} +}; + +App.propTypes = { + onEscape: PropTypes.func.isRequired +}; + export default App; diff --git a/src/components/Frame.js b/src/components/Frame.js index 4314541..0b651e8 100644 --- a/src/components/Frame.js +++ b/src/components/Frame.js @@ -1,4 +1,5 @@ import React from 'react'; +import PropTypes from 'prop-types'; import classNames from 'classnames'; import './Frame.css'; @@ -21,4 +22,16 @@ const Frame = ({ imageSrc, playing, togglePlaying }) => ( ); +Frame.defaultProps = { + imageSrc: '', + playing: false, + togglePlaying: () => {} +}; + +Frame.propTypes = { + imageSrc: PropTypes.string.isRequired, + playing: PropTypes.bool.isRequired, + togglePlaying: PropTypes.func.isRequired +}; + export default Frame; diff --git a/src/components/SidebarButton.js b/src/components/SidebarButton.js index 45bd28e..cfe83ea 100644 --- a/src/components/SidebarButton.js +++ b/src/components/SidebarButton.js @@ -1,4 +1,5 @@ import React from 'react'; +import PropTypes from 'prop-types'; import classNames from 'classnames'; import camera from './icons/camera.svg'; import preview from './icons/preview.svg'; @@ -40,4 +41,16 @@ const SidebarButton = ({ children, icon, onClick, expanded }) => ( ); +SidebarButton.defaultProps = { + icon: '', + onClick: () => {}, + expanded: false +}; + +SidebarButton.propTypes = { + icon: PropTypes.string.isRequired, + onClick: PropTypes.func.isRequired, + expanded: PropTypes.bool +}; + export default SidebarButton; diff --git a/src/components/SidebarButtonWithBadge.js b/src/components/SidebarButtonWithBadge.js index e7055ed..e79f5e8 100644 --- a/src/components/SidebarButtonWithBadge.js +++ b/src/components/SidebarButtonWithBadge.js @@ -1,4 +1,5 @@ import React from 'react'; +import PropTypes from 'prop-types'; import classNames from 'classnames'; import SidebarButton from './SidebarButton'; @@ -17,4 +18,22 @@ const SidebarButtonWithBadge = ({ showBadge, value, color, ...props }) => ( ); +SidebarButtonWithBadge.defaultProps = { + icon: '', + onClick: () => {}, + expanded: false, + color: '', + showBadge: false, + value: '' +}; + +SidebarButtonWithBadge.propTypes = { + icon: PropTypes.string.isRequired, + onClick: PropTypes.func.isRequired, + expanded: PropTypes.bool, + color: PropTypes.string.isRequired, + showBadge: PropTypes.bool.isRequired, + value: PropTypes.string.isRequired +}; + export default SidebarButtonWithBadge; From fd296373ac60e81eca324591b87b5f79e875eab4 Mon Sep 17 00:00:00 2001 From: Jason Matthias Date: Fri, 21 Jun 2019 10:52:07 -0700 Subject: [PATCH 4/7] fix propType value for SidebarButtonWithBadge --- src/components/SidebarButtonWithBadge.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/SidebarButtonWithBadge.js b/src/components/SidebarButtonWithBadge.js index e79f5e8..b83c7ed 100644 --- a/src/components/SidebarButtonWithBadge.js +++ b/src/components/SidebarButtonWithBadge.js @@ -24,7 +24,7 @@ SidebarButtonWithBadge.defaultProps = { expanded: false, color: '', showBadge: false, - value: '' + value: 0 }; SidebarButtonWithBadge.propTypes = { @@ -33,7 +33,7 @@ SidebarButtonWithBadge.propTypes = { expanded: PropTypes.bool, color: PropTypes.string.isRequired, showBadge: PropTypes.bool.isRequired, - value: PropTypes.string.isRequired + value: PropTypes.number.isRequired }; export default SidebarButtonWithBadge; From 84a1b7ace31d5792382a1721460b1cb38041e2a6 Mon Sep 17 00:00:00 2001 From: Jason Matthias Date: Thu, 27 Jun 2019 10:35:25 -0700 Subject: [PATCH 5/7] Small refactor --- src/components/Burst.js | 10 ++++------ src/components/Settings.js | 10 ++++------ src/components/Sidebar.js | 10 ++++------ src/components/SidebarButton.js | 3 +-- src/lib/defaultProps.js | 5 +++++ src/lib/propTypes.js | 9 +++++++++ 6 files changed, 27 insertions(+), 20 deletions(-) create mode 100644 src/lib/defaultProps.js create mode 100644 src/lib/propTypes.js diff --git a/src/components/Burst.js b/src/components/Burst.js index aab37a0..93a75d5 100644 --- a/src/components/Burst.js +++ b/src/components/Burst.js @@ -2,6 +2,8 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import classNames from 'classnames'; import { getCalcState, setCalcState } from '../lib/calc-helpers'; +import { imageSettingsProps } from '../lib/propTypes'; +import { imageSettingDefaults } from '../lib/defaultProps'; import { getBurstErrors } from '../lib/input-helpers'; import './Burst.css'; @@ -162,18 +164,14 @@ class Burst extends Component { } Burst.defaultProps = { + ...imageSettingDefaults, expanded: false, - width: 300, - height: 300, - oversample: false, requestBurst: () => {} }; Burst.propTypes = { + ...imageSettingsProps, expanded: PropTypes.bool.isRequired, - width: PropTypes.number.isRequired, - height: PropTypes.number.isRequired, - oversample: PropTypes.bool.isRequired, requestBurst: PropTypes.func.isRequired }; diff --git a/src/components/Settings.js b/src/components/Settings.js index 0c2a014..9ca8e42 100644 --- a/src/components/Settings.js +++ b/src/components/Settings.js @@ -1,5 +1,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; +import { imageSettingsPropTypes } from '../lib/propTypes'; +import { imageSettingDefaults } from '../lib/defaultProps'; import classNames from 'classnames'; import { isPositiveInteger, isProperBound } from '../lib/input-helpers'; import './Settings.css'; @@ -164,18 +166,14 @@ class Settings extends Component { Settings.defaultProps = { expanded: false, - width: 300, - height: 300, - oversample: false, + ...imageSettingDefaults, interval: 100, updateSetting: () => {} }; Settings.propTypes = { expanded: PropTypes.bool.isRequired, - width: PropTypes.number.isRequired, - height: PropTypes.number.isRequired, - oversample: PropTypes.bool.isRequired, + ...imageSettingsPropTypes, interval: PropTypes.number.isRequired, updateSetting: PropTypes.func.isRequired }; diff --git a/src/components/Sidebar.js b/src/components/Sidebar.js index b03615d..418e35a 100644 --- a/src/components/Sidebar.js +++ b/src/components/Sidebar.js @@ -1,5 +1,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; +import { imageSettingsPropTypes } from '../lib/propTypes'; +import { imageSettingDefaults } from '../lib/defaultProps'; import SidebarButton from './SidebarButton'; import SidebarButtonWithBadge from './SidebarButtonWithBadge'; import panes from '../constants/pane-types'; @@ -115,12 +117,10 @@ class Sidebar extends Component { } Sidebar.propTypes = { + ...imageSettingsPropTypes, numFrames: PropTypes.number.isRequired, expandedPane: PropTypes.string.isRequired, gifData: PropTypes.string.isRequired, - width: PropTypes.number.isRequired, - height: PropTypes.number.isRequired, - oversample: PropTypes.bool.isRequired, requestFrame: PropTypes.func.isRequired, togglePane: PropTypes.func.isRequired, reset: PropTypes.func.isRequired @@ -130,9 +130,7 @@ Sidebar.defaultProps = { numFrames: 0, expandedPane: 'NONE', gifData: '', - width: 100, - height: 100, - oversample: false, + ...imageSettingDefaults, requestFrame: () => {}, togglePane: () => {}, reset: () => {} diff --git a/src/components/SidebarButton.js b/src/components/SidebarButton.js index 12f5617..54eae32 100644 --- a/src/components/SidebarButton.js +++ b/src/components/SidebarButton.js @@ -56,8 +56,7 @@ SidebarButton.defaultProps = { SidebarButton.propTypes = { icon: PropTypes.string.isRequired, onClick: PropTypes.func.isRequired, - expanded: PropTypes.bool, - icon: 'icon' + expanded: PropTypes.bool }; export default SidebarButton; diff --git a/src/lib/defaultProps.js b/src/lib/defaultProps.js new file mode 100644 index 0000000..8c78e4c --- /dev/null +++ b/src/lib/defaultProps.js @@ -0,0 +1,5 @@ +export const imageSettingDefaults = { + width: 300, + height: 300, + oversample: false +}; diff --git a/src/lib/propTypes.js b/src/lib/propTypes.js new file mode 100644 index 0000000..7c515c7 --- /dev/null +++ b/src/lib/propTypes.js @@ -0,0 +1,9 @@ +import PropTypes from 'prop-types'; + +export const imageSettingsPropTypes = { + width: PropTypes.number.isRequired, + height: PropTypes.number.isRequired, + oversample: PropTypes.bool.isRequired +}; + +export const sidebarProps = {}; From ab4164e668292d2b48b0037b2f88fc8640298330 Mon Sep 17 00:00:00 2001 From: Jason Matthias Date: Thu, 27 Jun 2019 10:59:18 -0700 Subject: [PATCH 6/7] Small refactor prop types --- src/components/ErrorToast.js | 8 ++++---- src/components/SidebarButton.js | 8 ++++---- src/components/SidebarButtonWithBadge.js | 8 ++++---- src/lib/defaultProps.js | 5 +++++ src/lib/propTypes.js | 5 ++++- 5 files changed, 21 insertions(+), 13 deletions(-) diff --git a/src/components/ErrorToast.js b/src/components/ErrorToast.js index bedf2f8..9509c5e 100644 --- a/src/components/ErrorToast.js +++ b/src/components/ErrorToast.js @@ -11,12 +11,12 @@ const ErrorToast = ({ message }) => { ); }; -ErrorToast.propTypes = { - message: PropTypes.string.isRequired -}; - ErrorToast.defaultProps = { message: '' }; +ErrorToast.propTypes = { + message: PropTypes.string.isRequired +}; + export default ErrorToast; diff --git a/src/components/SidebarButton.js b/src/components/SidebarButton.js index 54eae32..0e5b76a 100644 --- a/src/components/SidebarButton.js +++ b/src/components/SidebarButton.js @@ -1,5 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; +import { sidebarButtonDefaults } from '..lib/defaultProps'; +import { sidebarButtonPropsTypes } from '..lib/propTypes'; import classNames from 'classnames'; import camera from './icons/camera.svg'; import preview from './icons/preview.svg'; @@ -48,14 +50,12 @@ const SidebarButton = ({ children, icon, onClick, expanded }) => ( ); SidebarButton.defaultProps = { - icon: '', - onClick: () => {}, + ...sidebarButtonDefaults, expanded: false }; SidebarButton.propTypes = { - icon: PropTypes.string.isRequired, - onClick: PropTypes.func.isRequired, + ...sidebarButtonPropsTypes, expanded: PropTypes.bool }; diff --git a/src/components/SidebarButtonWithBadge.js b/src/components/SidebarButtonWithBadge.js index dc0b8f4..be242de 100644 --- a/src/components/SidebarButtonWithBadge.js +++ b/src/components/SidebarButtonWithBadge.js @@ -1,5 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; +import { sidebarButtonDefaults } from '..lib/defaultProps'; +import { sidebarButtonPropsTypes } from '..lib/propTypes'; import classNames from 'classnames'; import SidebarButton from './SidebarButton'; @@ -20,8 +22,7 @@ const SidebarButtonWithBadge = ({ showBadge, value, color, ...props }) => ( ); SidebarButtonWithBadge.defaultProps = { - icon: '', - onClick: () => {}, + ...sidebarButtonDefaults, expanded: false, color: '', showBadge: false, @@ -29,8 +30,7 @@ SidebarButtonWithBadge.defaultProps = { }; SidebarButtonWithBadge.propTypes = { - icon: PropTypes.string.isRequired, - onClick: PropTypes.func.isRequired, + ...sidebarButtonPropsTypes, expanded: PropTypes.bool, color: PropTypes.string.isRequired, showBadge: PropTypes.bool.isRequired, diff --git a/src/lib/defaultProps.js b/src/lib/defaultProps.js index 8c78e4c..26d20be 100644 --- a/src/lib/defaultProps.js +++ b/src/lib/defaultProps.js @@ -3,3 +3,8 @@ export const imageSettingDefaults = { height: 300, oversample: false }; + +export const sidebarButtonDefaults = { + icon: '', + onClick: () => {} +}; diff --git a/src/lib/propTypes.js b/src/lib/propTypes.js index 7c515c7..39bb0a9 100644 --- a/src/lib/propTypes.js +++ b/src/lib/propTypes.js @@ -6,4 +6,7 @@ export const imageSettingsPropTypes = { oversample: PropTypes.bool.isRequired }; -export const sidebarProps = {}; +export const sidebarButtonPropsTypes = { + icon: PropTypes.string.isRequired, + onClick: PropTypes.func.isRequired +}; From 738b27a5b1580e4def2538f30f92f9e68515cc3a Mon Sep 17 00:00:00 2001 From: Jason Matthias Date: Thu, 27 Jun 2019 12:16:28 -0700 Subject: [PATCH 7/7] Fix PR concerns --- package.json | 1 - src/components/Burst.js | 4 ++-- src/components/Preview.js | 2 ++ src/components/Preview.test.js | 8 +------- src/components/Settings.js | 4 ++-- src/components/Sidebar.js | 4 ++-- src/components/SidebarButton.js | 6 +++--- src/components/SidebarButton.test.js | 6 ++---- src/components/SidebarButtonWithBadge.js | 6 +++--- src/components/SidebarButtonWithBadge.test.js | 6 ++---- src/lib/defaultProps.js | 2 +- src/lib/propTypes.js | 4 ++-- 12 files changed, 22 insertions(+), 31 deletions(-) diff --git a/package.json b/package.json index 753cd81..6899f4f 100644 --- a/package.json +++ b/package.json @@ -42,7 +42,6 @@ "prettier": "1.15.3", "pretty-quick": "^1.8.0", "prop-types": "^15.7.2", - "react-testing-library": "^5.4.2", "redux-mock-store": "^1.5.3" } } diff --git a/src/components/Burst.js b/src/components/Burst.js index 17ef7f6..bb43f8a 100644 --- a/src/components/Burst.js +++ b/src/components/Burst.js @@ -2,7 +2,7 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; import classNames from 'classnames'; import { getCalcState, setCalcState } from '../lib/calc-helpers'; -import { imageSettingsProps } from '../lib/propTypes'; +import { imageSettingPropTypes } from '../lib/propTypes'; import { imageSettingDefaults } from '../lib/defaultProps'; import { getBurstErrors } from '../lib/input-helpers'; import './Burst.css'; @@ -178,7 +178,7 @@ Burst.defaultProps = { }; Burst.propTypes = { - ...imageSettingsProps, + ...imageSettingPropTypes, expanded: PropTypes.bool.isRequired, requestBurst: PropTypes.func.isRequired }; diff --git a/src/components/Preview.js b/src/components/Preview.js index d3a2db5..9a942ad 100644 --- a/src/components/Preview.js +++ b/src/components/Preview.js @@ -170,6 +170,7 @@ Preview.defaultProps = { playing: false, frames: {}, frameIDs: [], + gifData: '', gifProgress: 0, width: 300, height: 300, @@ -187,6 +188,7 @@ Preview.propTypes = { playing: PropTypes.bool.isRequired, frames: PropTypes.object.isRequired, frameIDs: PropTypes.array.isRequired, + gifData: PropTypes.string.isRequired, gifProgress: PropTypes.number.isRequired, width: PropTypes.number.isRequired, height: PropTypes.number.isRequired, diff --git a/src/components/Preview.test.js b/src/components/Preview.test.js index b6a4a14..caa6970 100644 --- a/src/components/Preview.test.js +++ b/src/components/Preview.test.js @@ -11,13 +11,7 @@ describe('', () => { it('renders appropriate content', () => { const { getByTestId } = global.renderWithRedux( - + ); expect(getByTestId('Preview-scrubber').firstChild.type).toBe('range'); expect(getByTestId('Preview-scrubber-counter').textContent).toBe('1 / 1'); diff --git a/src/components/Settings.js b/src/components/Settings.js index 7b202af..c0b3b0a 100644 --- a/src/components/Settings.js +++ b/src/components/Settings.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { imageSettingsPropTypes } from '../lib/propTypes'; +import { imageSettingPropTypes } from '../lib/propTypes'; import { imageSettingDefaults } from '../lib/defaultProps'; import classNames from 'classnames'; import { isPositiveInteger, isProperBound } from '../lib/input-helpers'; @@ -180,7 +180,7 @@ Settings.defaultProps = { Settings.propTypes = { expanded: PropTypes.bool.isRequired, - ...imageSettingsPropTypes, + ...imageSettingPropTypes, interval: PropTypes.number.isRequired, updateSetting: PropTypes.func.isRequired }; diff --git a/src/components/Sidebar.js b/src/components/Sidebar.js index 418e35a..450a92b 100644 --- a/src/components/Sidebar.js +++ b/src/components/Sidebar.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import { imageSettingsPropTypes } from '../lib/propTypes'; +import { imageSettingPropTypes } from '../lib/propTypes'; import { imageSettingDefaults } from '../lib/defaultProps'; import SidebarButton from './SidebarButton'; import SidebarButtonWithBadge from './SidebarButtonWithBadge'; @@ -117,7 +117,7 @@ class Sidebar extends Component { } Sidebar.propTypes = { - ...imageSettingsPropTypes, + ...imageSettingPropTypes, numFrames: PropTypes.number.isRequired, expandedPane: PropTypes.string.isRequired, gifData: PropTypes.string.isRequired, diff --git a/src/components/SidebarButton.js b/src/components/SidebarButton.js index 0e5b76a..ad594dd 100644 --- a/src/components/SidebarButton.js +++ b/src/components/SidebarButton.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { sidebarButtonDefaults } from '..lib/defaultProps'; -import { sidebarButtonPropsTypes } from '..lib/propTypes'; +import { sidebarButtonDefaults } from '../lib/defaultProps'; +import { sidebarButtonPropTypes } from '../lib/propTypes'; import classNames from 'classnames'; import camera from './icons/camera.svg'; import preview from './icons/preview.svg'; @@ -55,7 +55,7 @@ SidebarButton.defaultProps = { }; SidebarButton.propTypes = { - ...sidebarButtonPropsTypes, + ...sidebarButtonPropTypes, expanded: PropTypes.bool }; diff --git a/src/components/SidebarButton.test.js b/src/components/SidebarButton.test.js index f1799ab..64cd101 100644 --- a/src/components/SidebarButton.test.js +++ b/src/components/SidebarButton.test.js @@ -6,13 +6,11 @@ afterEach(cleanup); describe('', () => { it('renders without crashing', () => { - global.renderWithRedux(); + global.renderWithRedux(); }); it('renders appropriate content', () => { - const { getByTestId } = global.renderWithRedux( - - ); + const { getByTestId } = global.renderWithRedux(); expect(getByTestId('SidebarButton-icon-button').firstChild.alt).toBe( 'icon icon' ); diff --git a/src/components/SidebarButtonWithBadge.js b/src/components/SidebarButtonWithBadge.js index be242de..8cfa0ea 100644 --- a/src/components/SidebarButtonWithBadge.js +++ b/src/components/SidebarButtonWithBadge.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { sidebarButtonDefaults } from '..lib/defaultProps'; -import { sidebarButtonPropsTypes } from '..lib/propTypes'; +import { sidebarButtonDefaults } from '../lib/defaultProps'; +import { sidebarButtonPropTypes } from '../lib/propTypes'; import classNames from 'classnames'; import SidebarButton from './SidebarButton'; @@ -30,7 +30,7 @@ SidebarButtonWithBadge.defaultProps = { }; SidebarButtonWithBadge.propTypes = { - ...sidebarButtonPropsTypes, + ...sidebarButtonPropTypes, expanded: PropTypes.bool, color: PropTypes.string.isRequired, showBadge: PropTypes.bool.isRequired, diff --git a/src/components/SidebarButtonWithBadge.test.js b/src/components/SidebarButtonWithBadge.test.js index c0b55a8..e3b49ff 100644 --- a/src/components/SidebarButtonWithBadge.test.js +++ b/src/components/SidebarButtonWithBadge.test.js @@ -6,13 +6,11 @@ afterEach(cleanup); describe('', () => { it('renders without crashing', () => { - global.renderWithRedux(); + global.renderWithRedux(); }); it('renders appropriate content', () => { - const { getByTestId } = global.renderWithRedux( - - ); + const { getByTestId } = global.renderWithRedux(); // check that badge is present expect(getByTestId('SidebarButton-icon-button').lastChild).toBeTruthy(); }); diff --git a/src/lib/defaultProps.js b/src/lib/defaultProps.js index 26d20be..ef0ed51 100644 --- a/src/lib/defaultProps.js +++ b/src/lib/defaultProps.js @@ -5,6 +5,6 @@ export const imageSettingDefaults = { }; export const sidebarButtonDefaults = { - icon: '', + icon: 'icon', onClick: () => {} }; diff --git a/src/lib/propTypes.js b/src/lib/propTypes.js index 39bb0a9..1055907 100644 --- a/src/lib/propTypes.js +++ b/src/lib/propTypes.js @@ -1,12 +1,12 @@ import PropTypes from 'prop-types'; -export const imageSettingsPropTypes = { +export const imageSettingPropTypes = { width: PropTypes.number.isRequired, height: PropTypes.number.isRequired, oversample: PropTypes.bool.isRequired }; -export const sidebarButtonPropsTypes = { +export const sidebarButtonPropTypes = { icon: PropTypes.string.isRequired, onClick: PropTypes.func.isRequired };