diff options
46 files changed, 1175 insertions, 450 deletions
diff --git a/webui/package-lock.json b/webui/package-lock.json index 91b62ed5..e574c0de 100644 --- a/webui/package-lock.json +++ b/webui/package-lock.json @@ -10,10 +10,12 @@ "dependencies": { "@apollo/client": "^3.5.9", "@arrows/composition": "^1.2.2", - "@material-ui/core": "^4.12.3", - "@material-ui/icons": "^4.11.2", - "@material-ui/lab": "^4.0.0-alpha.60", - "@material-ui/styles": "^4.10.0", + "@emotion/react": "^11.8.1", + "@emotion/styled": "^11.8.1", + "@mui/icons-material": "^5.4.2", + "@mui/lab": "^5.0.0-alpha.70", + "@mui/material": "^5.4.3", + "@mui/styles": "^5.4.2", "@types/node": "^17.0.18", "@types/react": "^17.0.39", "@types/react-dom": "^17.0.11", @@ -2063,11 +2065,237 @@ "postcss": "^8.3" } }, + "node_modules/@date-io/core": { + "version": "2.13.1", + "resolved": "https://registry.npmjs.org/@date-io/core/-/core-2.13.1.tgz", + "integrity": "sha512-pVI9nfkf2qClb2Cxdq0Q4zJhdawMG4ybWZUVGifT78FDwzRMX2SwXBb55s5NRJk0HcIicDuxktmCtemZqMH1Zg==" + }, + "node_modules/@date-io/date-fns": { + "version": "2.13.1", + "resolved": "https://registry.npmjs.org/@date-io/date-fns/-/date-fns-2.13.1.tgz", + "integrity": "sha512-8fmfwjiLMpFLD+t4NBwDx0eblWnNcgt4NgfT/uiiQTGI81fnPu9tpBMYdAcuWxaV7LLpXgzLBx1SYWAMDVUDQQ==", + "dependencies": { + "@date-io/core": "^2.13.1" + }, + "peerDependencies": { + "date-fns": "^2.0.0" + }, + "peerDependenciesMeta": { + "date-fns": { + "optional": true + } + } + }, + "node_modules/@date-io/dayjs": { + "version": "2.13.1", + "resolved": "https://registry.npmjs.org/@date-io/dayjs/-/dayjs-2.13.1.tgz", + "integrity": "sha512-5bL4WWWmlI4uGZVScANhHJV7Mjp93ec2gNeUHDqqLaMZhp51S0NgD25oqj/k0LqBn1cdU2MvzNpk/ObMmVv5cQ==", + "dependencies": { + "@date-io/core": "^2.13.1" + }, + "peerDependencies": { + "dayjs": "^1.8.17" + }, + "peerDependenciesMeta": { + "dayjs": { + "optional": true + } + } + }, + "node_modules/@date-io/luxon": { + "version": "2.13.1", + "resolved": "https://registry.npmjs.org/@date-io/luxon/-/luxon-2.13.1.tgz", + "integrity": "sha512-yG+uM7lXfwLyKKEwjvP8oZ7qblpmfl9gxQYae55ifbwiTs0CoCTkYkxEaQHGkYtTqGTzLqcb0O9Pzx6vgWg+yg==", + "dependencies": { + "@date-io/core": "^2.13.1" + }, + "peerDependencies": { + "luxon": "^1.21.3 || ^2.x" + }, + "peerDependenciesMeta": { + "luxon": { + "optional": true + } + } + }, + "node_modules/@date-io/moment": { + "version": "2.13.1", + "resolved": "https://registry.npmjs.org/@date-io/moment/-/moment-2.13.1.tgz", + "integrity": "sha512-XX1X/Tlvl3TdqQy2j0ZUtEJV6Rl8tOyc5WOS3ki52He28Uzme4Ro/JuPWTMBDH63weSWIZDlbR7zBgp3ZA2y1A==", + "dependencies": { + "@date-io/core": "^2.13.1" + }, + "peerDependencies": { + "moment": "^2.24.0" + }, + "peerDependenciesMeta": { + "moment": { + "optional": true + } + } + }, + "node_modules/@emotion/babel-plugin": { + "version": "11.7.2", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.7.2.tgz", + "integrity": "sha512-6mGSCWi9UzXut/ZAN6lGFu33wGR3SJisNl3c0tvlmb8XChH1b2SUvxvnOh7hvLpqyRdHHU9AiazV3Cwbk5SXKQ==", + "dependencies": { + "@babel/helper-module-imports": "^7.12.13", + "@babel/plugin-syntax-jsx": "^7.12.13", + "@babel/runtime": "^7.13.10", + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.5", + "@emotion/serialize": "^1.0.2", + "babel-plugin-macros": "^2.6.1", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.0.13" + }, + "peerDependencies": { + "@babel/core": "^7.0.0" + } + }, + "node_modules/@emotion/babel-plugin/node_modules/babel-plugin-macros": { + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz", + "integrity": "sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==", + "dependencies": { + "@babel/runtime": "^7.7.2", + "cosmiconfig": "^6.0.0", + "resolve": "^1.12.0" + } + }, + "node_modules/@emotion/babel-plugin/node_modules/escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@emotion/cache": { + "version": "11.7.1", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.7.1.tgz", + "integrity": "sha512-r65Zy4Iljb8oyjtLeCuBH8Qjiy107dOYC6SJq7g7GV5UCQWMObY4SJDPGFjiiVpPrOJ2hmJOoBiYTC7hwx9E2A==", + "dependencies": { + "@emotion/memoize": "^0.7.4", + "@emotion/sheet": "^1.1.0", + "@emotion/utils": "^1.0.0", + "@emotion/weak-memoize": "^0.2.5", + "stylis": "4.0.13" + } + }, "node_modules/@emotion/hash": { "version": "0.8.0", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" }, + "node_modules/@emotion/is-prop-valid": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz", + "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==", + "dependencies": { + "@emotion/memoize": "^0.7.4" + } + }, + "node_modules/@emotion/memoize": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz", + "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==" + }, + "node_modules/@emotion/react": { + "version": "11.8.1", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.8.1.tgz", + "integrity": "sha512-XGaie4nRxmtP1BZYBXqC5JGqMYF2KRKKI7vjqNvQxyRpekVAZhb6QqrElmZCAYXH1L90lAelADSVZC4PFsrJ8Q==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/cache": "^11.7.1", + "@emotion/serialize": "^1.0.2", + "@emotion/sheet": "^1.1.0", + "@emotion/utils": "^1.1.0", + "@emotion/weak-memoize": "^0.2.5", + "hoist-non-react-statics": "^3.3.1" + }, + "peerDependencies": { + "@babel/core": "^7.0.0", + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@babel/core": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/serialize": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.0.2.tgz", + "integrity": "sha512-95MgNJ9+/ajxU7QIAruiOAdYNjxZX7G2mhgrtDWswA21VviYIRP1R5QilZ/bDY42xiKsaktP4egJb3QdYQZi1A==", + "dependencies": { + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.4", + "@emotion/unitless": "^0.7.5", + "@emotion/utils": "^1.0.0", + "csstype": "^3.0.2" + } + }, + "node_modules/@emotion/serialize/node_modules/csstype": { + "version": "3.0.10", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz", + "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==" + }, + "node_modules/@emotion/sheet": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.1.0.tgz", + "integrity": "sha512-u0AX4aSo25sMAygCuQTzS+HsImZFuS8llY8O7b9MDRzbJM0kVJlAz6KNDqcG7pOuQZJmj/8X/rAW+66kMnMW+g==" + }, + "node_modules/@emotion/styled": { + "version": "11.8.1", + "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.8.1.tgz", + "integrity": "sha512-OghEVAYBZMpEquHZwuelXcRjRJQOVayvbmNR0zr174NHdmMgrNkLC6TljKC5h9lZLkN5WGrdUcrKlOJ4phhoTQ==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/is-prop-valid": "^1.1.2", + "@emotion/serialize": "^1.0.2", + "@emotion/utils": "^1.1.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0", + "@emotion/react": "^11.0.0-rc.0", + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@babel/core": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/unitless": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", + "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==" + }, + "node_modules/@emotion/utils": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.1.0.tgz", + "integrity": "sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ==" + }, + "node_modules/@emotion/weak-memoize": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz", + "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==" + }, "node_modules/@endemolshinegroup/cosmiconfig-typescript-loader": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/@endemolshinegroup/cosmiconfig-typescript-loader/-/cosmiconfig-typescript-loader-3.0.2.tgz", @@ -3784,36 +4012,36 @@ "unist-util-is": "^3.0.0" } }, - "node_modules/@material-ui/core": { - "version": "4.12.3", - "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.12.3.tgz", - "integrity": "sha512-sdpgI/PL56QVsEJldwEe4FFaFTLUqN+rd7sSZiRCdx2E/C7z5yK0y/khAWVBH24tXwto7I1hCzNWfJGZIYJKnw==", - "deprecated": "You can now upgrade to @mui/material. See the guide: https://mui.com/guides/migration-v4/", + "node_modules/@microsoft/fetch-event-source": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/@microsoft/fetch-event-source/-/fetch-event-source-2.0.1.tgz", + "integrity": "sha512-W6CLUJ2eBMw3Rec70qrsEW0jOm/3twwJv21mrmj2yORiaVmVYGS4sSS5yUwvQc1ZlDLYGPnClVWmUUMagKNsfA==", + "dev": true + }, + "node_modules/@mui/base": { + "version": "5.0.0-alpha.69", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.69.tgz", + "integrity": "sha512-IxUUj/lkilCTNBIybQxyQGW/zpxFp490G0QBQJgRp9TJkW2PWSTLvAH7gcH0YHd0L2TAf1TRgfdemoRseMzqQA==", "dependencies": { - "@babel/runtime": "^7.4.4", - "@material-ui/styles": "^4.11.4", - "@material-ui/system": "^4.12.1", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.2", - "@types/react-transition-group": "^4.2.0", - "clsx": "^1.0.4", - "hoist-non-react-statics": "^3.3.2", - "popper.js": "1.16.1-lts", + "@babel/runtime": "^7.17.0", + "@emotion/is-prop-valid": "^1.1.1", + "@mui/utils": "^5.4.2", + "@popperjs/core": "^2.4.4", + "clsx": "^1.1.1", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0", - "react-transition-group": "^4.4.0" + "react-is": "^17.0.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui" }, "peerDependencies": { "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "react": "^17.0.0", + "react-dom": "^17.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -3821,21 +4049,29 @@ } } }, - "node_modules/@material-ui/icons": { - "version": "4.11.2", - "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.11.2.tgz", - "integrity": "sha512-fQNsKX2TxBmqIGJCSi3tGTO/gZ+eJgWmMJkgDiOfyNaunNaxcklJQFaFogYcFl0qFuaEz1qaXYXboa/bUXVSOQ==", + "node_modules/@mui/base/node_modules/react-is": { + "version": "17.0.2", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", + "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" + }, + "node_modules/@mui/icons-material": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.4.2.tgz", + "integrity": "sha512-7c+G3jBT+e+pN0a9DJ0Bd8Kr1Vy6os5Q1yd2aXcwuhlRI3uzJBLJ8sX6FSWoh5DSEBchb7Bsk1uHz6U0YN9l+Q==", "dependencies": { - "@babel/runtime": "^7.4.4" + "@babel/runtime": "^7.17.0" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "@material-ui/core": "^4.0.0", + "@mui/material": "^5.0.0", "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "react": "^17.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -3843,25 +4079,138 @@ } } }, - "node_modules/@material-ui/lab": { - "version": "4.0.0-alpha.60", - "resolved": "https://registry.npmjs.org/@material-ui/lab/-/lab-4.0.0-alpha.60.tgz", - "integrity": "sha512-fadlYsPJF+0fx2lRuyqAuJj7hAS1tLDdIEEdov5jlrpb5pp4b+mRDUqQTUxi4inRZHS1bEXpU8QWUhO6xX88aA==", + "node_modules/@mui/lab": { + "version": "5.0.0-alpha.70", + "resolved": "https://registry.npmjs.org/@mui/lab/-/lab-5.0.0-alpha.70.tgz", + "integrity": "sha512-F4OIfPy9yl3RwEqHAHRkyzgmC9ud0HSualGzX59qNq7HqjVb34lJWC8I9P/cdh3d59eLl6M62FDrO3M5h4DhKg==", "dependencies": { - "@babel/runtime": "^7.4.4", - "@material-ui/utils": "^4.11.2", - "clsx": "^1.0.4", + "@babel/runtime": "^7.17.0", + "@date-io/date-fns": "^2.13.1", + "@date-io/dayjs": "^2.13.1", + "@date-io/luxon": "^2.13.1", + "@date-io/moment": "^2.13.1", + "@mui/base": "5.0.0-alpha.69", + "@mui/system": "^5.4.3", + "@mui/utils": "^5.4.2", + "clsx": "^1.1.1", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0" + "react-is": "^17.0.2", + "react-transition-group": "^4.4.2", + "rifm": "^0.12.1" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "@material-ui/core": "^4.12.1", + "@mui/material": "^5.0.0", "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "date-fns": "^2.25.0", + "dayjs": "^1.10.7", + "luxon": "^1.28.0 || ^2.0.0", + "moment": "^2.29.1", + "react": "^17.0.0", + "react-dom": "^17.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "date-fns": { + "optional": true + }, + "dayjs": { + "optional": true + }, + "luxon": { + "optional": true + }, + "moment": { + "optional": true + } + } + }, + "node_modules/@mui/lab/node_modules/react-is": { + "version": "17.0.2", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", + "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" + }, + "node_modules/@mui/material": { + "version": "5.4.3", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.4.3.tgz", + "integrity": "sha512-E2K402xjz3U09mTgrVYj+vUACeOppV41uEcu9GSkm7QSg4Nzy48WkdaiGL7TRCyH0T8HsonFSMJvCpwyQbD6iw==", + "dependencies": { + "@babel/runtime": "^7.17.0", + "@mui/base": "5.0.0-alpha.69", + "@mui/system": "^5.4.3", + "@mui/types": "^7.1.2", + "@mui/utils": "^5.4.2", + "@types/react-transition-group": "^4.4.4", + "clsx": "^1.1.1", + "csstype": "^3.0.10", + "hoist-non-react-statics": "^3.3.2", + "prop-types": "^15.7.2", + "react-is": "^17.0.2", + "react-transition-group": "^4.4.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@types/react": "^16.8.6 || ^17.0.0", + "react": "^17.0.0", + "react-dom": "^17.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/material/node_modules/csstype": { + "version": "3.0.10", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz", + "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==" + }, + "node_modules/@mui/material/node_modules/react-is": { + "version": "17.0.2", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", + "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" + }, + "node_modules/@mui/private-theming": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.4.2.tgz", + "integrity": "sha512-mlPDYYko4wIcwXjCPEmOWbNTT4DZ6h9YHdnRtQPnWM28+TRUHEo7SbydnnmVDQLRXUfaH4Y6XtEHIfBNPE/SLg==", + "dependencies": { + "@babel/runtime": "^7.17.0", + "@mui/utils": "^5.4.2", + "prop-types": "^15.7.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@types/react": "^16.8.6 || ^17.0.0", + "react": "^17.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -3869,39 +4218,69 @@ } } }, - "node_modules/@material-ui/styles": { - "version": "4.11.4", - "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.11.4.tgz", - "integrity": "sha512-KNTIZcnj/zprG5LW0Sao7zw+yG3O35pviHzejMdcSGCdWbiO8qzRgOYL8JAxAsWBKOKYwVZxXtHWaB5T2Kvxew==", + "node_modules/@mui/styled-engine": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.4.2.tgz", + "integrity": "sha512-tz9p3aRtzXHKAg7x3BgP0hVQEoGKaxNCFxsJ+d/iqEHYvywWFSs6oxqYAvDHIRpvMlUZyPNoTrkcNnbdMmH/ng==", "dependencies": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.0", + "@emotion/cache": "^11.7.1", + "prop-types": "^15.7.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@emotion/react": "^11.4.1", + "@emotion/styled": "^11.3.0", + "react": "^17.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + } + } + }, + "node_modules/@mui/styles": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@mui/styles/-/styles-5.4.2.tgz", + "integrity": "sha512-BX75fNHmRF51yove9dBkH28gpSFjClOPDEnUwLTghPYN913OsqViS/iuCd61dxzygtEEmmeYuWfQjxu/F6vF5g==", + "dependencies": { + "@babel/runtime": "^7.17.0", "@emotion/hash": "^0.8.0", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.2", - "clsx": "^1.0.4", - "csstype": "^2.5.2", + "@mui/private-theming": "^5.4.2", + "@mui/types": "^7.1.2", + "@mui/utils": "^5.4.2", + "clsx": "^1.1.1", + "csstype": "^3.0.10", "hoist-non-react-statics": "^3.3.2", - "jss": "^10.5.1", - "jss-plugin-camel-case": "^10.5.1", - "jss-plugin-default-unit": "^10.5.1", - "jss-plugin-global": "^10.5.1", - "jss-plugin-nested": "^10.5.1", - "jss-plugin-props-sort": "^10.5.1", - "jss-plugin-rule-value-function": "^10.5.1", - "jss-plugin-vendor-prefixer": "^10.5.1", + "jss": "^10.8.2", + "jss-plugin-camel-case": "^10.8.2", + "jss-plugin-default-unit": "^10.8.2", + "jss-plugin-global": "^10.8.2", + "jss-plugin-nested": "^10.8.2", + "jss-plugin-props-sort": "^10.8.2", + "jss-plugin-rule-value-function": "^10.8.2", + "jss-plugin-vendor-prefixer": "^10.8.2", "prop-types": "^15.7.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui" }, "peerDependencies": { "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "react": "^17.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -3909,38 +4288,59 @@ } } }, - "node_modules/@material-ui/system": { - "version": "4.12.1", - "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.12.1.tgz", - "integrity": "sha512-lUdzs4q9kEXZGhbN7BptyiS1rLNHe6kG9o8Y307HCvF4sQxbCgpL2qi+gUk+yI8a2DNk48gISEQxoxpgph0xIw==", + "node_modules/@mui/styles/node_modules/csstype": { + "version": "3.0.10", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz", + "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==" + }, + "node_modules/@mui/system": { + "version": "5.4.3", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.4.3.tgz", + "integrity": "sha512-Xz5AVe9JMufJVozMzUv93IRtnLNZnw/Q8k+Mg7Q4oRuwdir0TcYkMVUqAHetVKb3rAouIVCu/cQv0jB8gVeVsQ==", "dependencies": { - "@babel/runtime": "^7.4.4", - "@material-ui/utils": "^4.11.2", - "csstype": "^2.5.2", + "@babel/runtime": "^7.17.0", + "@mui/private-theming": "^5.4.2", + "@mui/styled-engine": "^5.4.2", + "@mui/types": "^7.1.2", + "@mui/utils": "^5.4.2", + "clsx": "^1.1.1", + "csstype": "^3.0.10", "prop-types": "^15.7.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui" }, "peerDependencies": { + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "react": "^17.0.0" }, "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, "@types/react": { "optional": true } } }, - "node_modules/@material-ui/types": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz", - "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==", + "node_modules/@mui/system/node_modules/csstype": { + "version": "3.0.10", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz", + "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==" + }, + "node_modules/@mui/types": { + "version": "7.1.2", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.1.2.tgz", + "integrity": "sha512-SD7O1nVzqG+ckQpFjDhXPZjRceB8HQFHEvdLLrPhlJy4lLbwEBbxK74Tj4t6Jgk0fTvLJisuwOutrtYe9P/xBQ==", "peerDependencies": { "@types/react": "*" }, @@ -3950,28 +4350,32 @@ } } }, - "node_modules/@material-ui/utils": { - "version": "4.11.2", - "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.11.2.tgz", - "integrity": "sha512-Uul8w38u+PICe2Fg2pDKCaIG7kOyhowZ9vjiC1FsVwPABTW8vPPKfF6OvxRq3IiBaI1faOJmgdvMG7rMJARBhA==", + "node_modules/@mui/utils": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.4.2.tgz", + "integrity": "sha512-646dBCC57MXTo/Gf3AnZSHRHznaTETQq5x7AWp5FRQ4jPeyT4WSs18cpJVwkV01cAHKh06pNQTIufIALIWCL5g==", "dependencies": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.0", + "@types/prop-types": "^15.7.4", + "@types/react-is": "^16.7.1 || ^17.0.0", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0" + "react-is": "^17.0.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "react": "^17.0.0" } }, - "node_modules/@microsoft/fetch-event-source": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/@microsoft/fetch-event-source/-/fetch-event-source-2.0.1.tgz", - "integrity": "sha512-W6CLUJ2eBMw3Rec70qrsEW0jOm/3twwJv21mrmj2yORiaVmVYGS4sSS5yUwvQc1ZlDLYGPnClVWmUUMagKNsfA==", - "dev": true + "node_modules/@mui/utils/node_modules/react-is": { + "version": "17.0.2", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", + "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" }, "node_modules/@nodelib/fs.scandir": { "version": "2.1.3", @@ -4005,6 +4409,15 @@ "node": ">= 8" } }, + "node_modules/@popperjs/core": { + "version": "2.11.2", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.2.tgz", + "integrity": "sha512-92FRmppjjqz29VMJ2dn+xdyXZBrMlE42AV6Kq6BwjWV7CNUW1hs2FtxSNLQE+gJhaZ6AAmYuO9y8dshhcBl7vA==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, "node_modules/@rollup/plugin-babel": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.0.tgz", @@ -4665,9 +5078,9 @@ "integrity": "sha512-ReVR2rLTV1kvtlWFyuot+d1pkpG2Fw/XKE3PDAdj57rbM97ttSp9JZ2UsP+2EHTylra9cUf6JA7tGwW1INzUrA==" }, "node_modules/@types/prop-types": { - "version": "15.7.3", - "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz", - "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==" + "version": "15.7.4", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz", + "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==" }, "node_modules/@types/q": { "version": "1.5.5", @@ -4702,10 +5115,18 @@ "@types/react": "*" } }, + "node_modules/@types/react-is": { + "version": "17.0.3", + "resolved": "https://registry.npmjs.org/@types/react-is/-/react-is-17.0.3.tgz", + "integrity": "sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/react-transition-group": { - "version": "4.4.0", - "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.0.tgz", - "integrity": "sha512-/QfLHGpu+2fQOqQaXh8MG9q03bFENooTb/it4jr5kKaZlDQfWvjqWZg48AwzPVMBHlRuTRAY7hRHCEOXz5kV6w==", + "version": "4.4.4", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.4.tgz", + "integrity": "sha512-7gAPz7anVK5xzbeQW9wFBDg7G++aPLAFY0QaSMOou9rJZpbuI58WAuJrgu+qR92l61grlnCUe7AFX8KGahAgug==", "dependencies": { "@types/react": "*" } @@ -7604,11 +8025,6 @@ "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.8.tgz", "integrity": "sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==" }, - "node_modules/csstype": { - "version": "2.6.13", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.13.tgz", - "integrity": "sha512-ul26pfSQTZW8dcOnD2iiJssfXw0gdNVX9IJDH/X3K5DGPfj+fUYe3kB+swUY6BF3oZDxaID3AJt+9/ojSAE05A==" - }, "node_modules/damerau-levenshtein": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz", @@ -7634,10 +8050,18 @@ "dev": true }, "node_modules/date-fns": { - "version": "1.30.1", - "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz", - "integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==", - "dev": true + "version": "2.28.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.28.0.tgz", + "integrity": "sha512-8d35hViGYx/QH0icHYCeLmsLmMUheMmTyV9Fcm6gvNwdw31yXXH+O85sOBJ+OLnLQMKZowvpKb6FgMIQjcpvQw==", + "optional": true, + "peer": true, + "engines": { + "node": ">=0.11" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/date-fns" + } }, "node_modules/debounce": { "version": "1.2.0", @@ -9943,6 +10367,11 @@ "url": "https://github.com/avajs/find-cache-dir?sponsor=1" } }, + "node_modules/find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "node_modules/find-up": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz", @@ -13071,6 +13500,12 @@ "node": ">=4" } }, + "node_modules/listr-verbose-renderer/node_modules/date-fns": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz", + "integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==", + "dev": true + }, "node_modules/listr-verbose-renderer/node_modules/figures": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/figures/-/figures-2.0.0.tgz", @@ -15084,11 +15519,6 @@ "node": ">=4" } }, - "node_modules/popper.js": { - "version": "1.16.1-lts", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", - "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" - }, "node_modules/portfinder": { "version": "1.0.28", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz", @@ -17472,6 +17902,14 @@ "node": ">=0.10.0" } }, + "node_modules/rifm": { + "version": "0.12.1", + "resolved": "https://registry.npmjs.org/rifm/-/rifm-0.12.1.tgz", + "integrity": "sha512-OGA1Bitg/dSJtI/c4dh90svzaUPt228kzFsUkJbtA2c964IqEAwWXeL9ZJi86xWv3j5SMqRvGULl7bA6cK0Bvg==", + "peerDependencies": { + "react": ">=16.8" + } + }, "node_modules/rimraf": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", @@ -18358,6 +18796,11 @@ "postcss": "^8.2.15" } }, + "node_modules/stylis": { + "version": "4.0.13", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz", + "integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==" + }, "node_modules/subscriptions-transport-ws": { "version": "0.9.18", "resolved": "https://registry.npmjs.org/subscriptions-transport-ws/-/subscriptions-transport-ws-0.9.18.tgz", @@ -21967,11 +22410,175 @@ "postcss-value-parser": "^4.2.0" } }, + "@date-io/core": { + "version": "2.13.1", + "resolved": "https://registry.npmjs.org/@date-io/core/-/core-2.13.1.tgz", + "integrity": "sha512-pVI9nfkf2qClb2Cxdq0Q4zJhdawMG4ybWZUVGifT78FDwzRMX2SwXBb55s5NRJk0HcIicDuxktmCtemZqMH1Zg==" + }, + "@date-io/date-fns": { + "version": "2.13.1", + "resolved": "https://registry.npmjs.org/@date-io/date-fns/-/date-fns-2.13.1.tgz", + "integrity": "sha512-8fmfwjiLMpFLD+t4NBwDx0eblWnNcgt4NgfT/uiiQTGI81fnPu9tpBMYdAcuWxaV7LLpXgzLBx1SYWAMDVUDQQ==", + "requires": { + "@date-io/core": "^2.13.1" + } + }, + "@date-io/dayjs": { + "version": "2.13.1", + "resolved": "https://registry.npmjs.org/@date-io/dayjs/-/dayjs-2.13.1.tgz", + "integrity": "sha512-5bL4WWWmlI4uGZVScANhHJV7Mjp93ec2gNeUHDqqLaMZhp51S0NgD25oqj/k0LqBn1cdU2MvzNpk/ObMmVv5cQ==", + "requires": { + "@date-io/core": "^2.13.1" + } + }, + "@date-io/luxon": { + "version": "2.13.1", + "resolved": "https://registry.npmjs.org/@date-io/luxon/-/luxon-2.13.1.tgz", + "integrity": "sha512-yG+uM7lXfwLyKKEwjvP8oZ7qblpmfl9gxQYae55ifbwiTs0CoCTkYkxEaQHGkYtTqGTzLqcb0O9Pzx6vgWg+yg==", + "requires": { + "@date-io/core": "^2.13.1" + } + }, + "@date-io/moment": { + "version": "2.13.1", + "resolved": "https://registry.npmjs.org/@date-io/moment/-/moment-2.13.1.tgz", + "integrity": "sha512-XX1X/Tlvl3TdqQy2j0ZUtEJV6Rl8tOyc5WOS3ki52He28Uzme4Ro/JuPWTMBDH63weSWIZDlbR7zBgp3ZA2y1A==", + "requires": { + "@date-io/core": "^2.13.1" + } + }, + "@emotion/babel-plugin": { + "version": "11.7.2", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.7.2.tgz", + "integrity": "sha512-6mGSCWi9UzXut/ZAN6lGFu33wGR3SJisNl3c0tvlmb8XChH1b2SUvxvnOh7hvLpqyRdHHU9AiazV3Cwbk5SXKQ==", + "requires": { + "@babel/helper-module-imports": "^7.12.13", + "@babel/plugin-syntax-jsx": "^7.12.13", + "@babel/runtime": "^7.13.10", + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.5", + "@emotion/serialize": "^1.0.2", + "babel-plugin-macros": "^2.6.1", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.0.13" + }, + "dependencies": { + "babel-plugin-macros": { + "version": "2.8.0", + "resolved": "https://registry.npmjs.org/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz", + "integrity": "sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==", + "requires": { + "@babel/runtime": "^7.7.2", + "cosmiconfig": "^6.0.0", + "resolve": "^1.12.0" + } + }, + "escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==" + } + } + }, + "@emotion/cache": { + "version": "11.7.1", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.7.1.tgz", + "integrity": "sha512-r65Zy4Iljb8oyjtLeCuBH8Qjiy107dOYC6SJq7g7GV5UCQWMObY4SJDPGFjiiVpPrOJ2hmJOoBiYTC7hwx9E2A==", + "requires": { + "@emotion/memoize": "^0.7.4", + "@emotion/sheet": "^1.1.0", + "@emotion/utils": "^1.0.0", + "@emotion/weak-memoize": "^0.2.5", + "stylis": "4.0.13" + } + }, "@emotion/hash": { "version": "0.8.0", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" }, + "@emotion/is-prop-valid": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz", + "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==", + "requires": { + "@emotion/memoize": "^0.7.4" + } + }, + "@emotion/memoize": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz", + "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==" + }, + "@emotion/react": { + "version": "11.8.1", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.8.1.tgz", + "integrity": "sha512-XGaie4nRxmtP1BZYBXqC5JGqMYF2KRKKI7vjqNvQxyRpekVAZhb6QqrElmZCAYXH1L90lAelADSVZC4PFsrJ8Q==", + "requires": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/cache": "^11.7.1", + "@emotion/serialize": "^1.0.2", + "@emotion/sheet": "^1.1.0", + "@emotion/utils": "^1.1.0", + "@emotion/weak-memoize": "^0.2.5", + "hoist-non-react-statics": "^3.3.1" + } + }, + "@emotion/serialize": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.0.2.tgz", + "integrity": "sha512-95MgNJ9+/ajxU7QIAruiOAdYNjxZX7G2mhgrtDWswA21VviYIRP1R5QilZ/bDY42xiKsaktP4egJb3QdYQZi1A==", + "requires": { + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.4", + "@emotion/unitless": "^0.7.5", + "@emotion/utils": "^1.0.0", + "csstype": "^3.0.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.10", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz", + "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==" + } + } + }, + "@emotion/sheet": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.1.0.tgz", + "integrity": "sha512-u0AX4aSo25sMAygCuQTzS+HsImZFuS8llY8O7b9MDRzbJM0kVJlAz6KNDqcG7pOuQZJmj/8X/rAW+66kMnMW+g==" + }, + "@emotion/styled": { + "version": "11.8.1", + "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.8.1.tgz", + "integrity": "sha512-OghEVAYBZMpEquHZwuelXcRjRJQOVayvbmNR0zr174NHdmMgrNkLC6TljKC5h9lZLkN5WGrdUcrKlOJ4phhoTQ==", + "requires": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/is-prop-valid": "^1.1.2", + "@emotion/serialize": "^1.0.2", + "@emotion/utils": "^1.1.0" + } + }, + "@emotion/unitless": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", + "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==" + }, + "@emotion/utils": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.1.0.tgz", + "integrity": "sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ==" + }, + "@emotion/weak-memoize": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz", + "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==" + }, "@endemolshinegroup/cosmiconfig-typescript-loader": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/@endemolshinegroup/cosmiconfig-typescript-loader/-/cosmiconfig-typescript-loader-3.0.2.tgz", @@ -23393,101 +24000,197 @@ } } }, - "@material-ui/core": { - "version": "4.12.3", - "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.12.3.tgz", - "integrity": "sha512-sdpgI/PL56QVsEJldwEe4FFaFTLUqN+rd7sSZiRCdx2E/C7z5yK0y/khAWVBH24tXwto7I1hCzNWfJGZIYJKnw==", + "@microsoft/fetch-event-source": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/@microsoft/fetch-event-source/-/fetch-event-source-2.0.1.tgz", + "integrity": "sha512-W6CLUJ2eBMw3Rec70qrsEW0jOm/3twwJv21mrmj2yORiaVmVYGS4sSS5yUwvQc1ZlDLYGPnClVWmUUMagKNsfA==", + "dev": true + }, + "@mui/base": { + "version": "5.0.0-alpha.69", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.69.tgz", + "integrity": "sha512-IxUUj/lkilCTNBIybQxyQGW/zpxFp490G0QBQJgRp9TJkW2PWSTLvAH7gcH0YHd0L2TAf1TRgfdemoRseMzqQA==", "requires": { - "@babel/runtime": "^7.4.4", - "@material-ui/styles": "^4.11.4", - "@material-ui/system": "^4.12.1", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.2", - "@types/react-transition-group": "^4.2.0", - "clsx": "^1.0.4", - "hoist-non-react-statics": "^3.3.2", - "popper.js": "1.16.1-lts", + "@babel/runtime": "^7.17.0", + "@emotion/is-prop-valid": "^1.1.1", + "@mui/utils": "^5.4.2", + "@popperjs/core": "^2.4.4", + "clsx": "^1.1.1", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0", - "react-transition-group": "^4.4.0" + "react-is": "^17.0.2" + }, + "dependencies": { + "react-is": { + "version": "17.0.2", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", + "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" + } } }, - "@material-ui/icons": { - "version": "4.11.2", - "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.11.2.tgz", - "integrity": "sha512-fQNsKX2TxBmqIGJCSi3tGTO/gZ+eJgWmMJkgDiOfyNaunNaxcklJQFaFogYcFl0qFuaEz1qaXYXboa/bUXVSOQ==", + "@mui/icons-material": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.4.2.tgz", + "integrity": "sha512-7c+G3jBT+e+pN0a9DJ0Bd8Kr1Vy6os5Q1yd2aXcwuhlRI3uzJBLJ8sX6FSWoh5DSEBchb7Bsk1uHz6U0YN9l+Q==", "requires": { - "@babel/runtime": "^7.4.4" + "@babel/runtime": "^7.17.0" } }, - "@material-ui/lab": { - "version": "4.0.0-alpha.60", - "resolved": "https://registry.npmjs.org/@material-ui/lab/-/lab-4.0.0-alpha.60.tgz", - "integrity": "sha512-fadlYsPJF+0fx2lRuyqAuJj7hAS1tLDdIEEdov5jlrpb5pp4b+mRDUqQTUxi4inRZHS1bEXpU8QWUhO6xX88aA==", + "@mui/lab": { + "version": "5.0.0-alpha.70", + "resolved": "https://registry.npmjs.org/@mui/lab/-/lab-5.0.0-alpha.70.tgz", + "integrity": "sha512-F4OIfPy9yl3RwEqHAHRkyzgmC9ud0HSualGzX59qNq7HqjVb34lJWC8I9P/cdh3d59eLl6M62FDrO3M5h4DhKg==", "requires": { - "@babel/runtime": "^7.4.4", - "@material-ui/utils": "^4.11.2", - "clsx": "^1.0.4", + "@babel/runtime": "^7.17.0", + "@date-io/date-fns": "^2.13.1", + "@date-io/dayjs": "^2.13.1", + "@date-io/luxon": "^2.13.1", + "@date-io/moment": "^2.13.1", + "@mui/base": "5.0.0-alpha.69", + "@mui/system": "^5.4.3", + "@mui/utils": "^5.4.2", + "clsx": "^1.1.1", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0" + "react-is": "^17.0.2", + "react-transition-group": "^4.4.2", + "rifm": "^0.12.1" + }, + "dependencies": { + "react-is": { + "version": "17.0.2", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", + "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" + } + } + }, + "@mui/material": { + "version": "5.4.3", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.4.3.tgz", + "integrity": "sha512-E2K402xjz3U09mTgrVYj+vUACeOppV41uEcu9GSkm7QSg4Nzy48WkdaiGL7TRCyH0T8HsonFSMJvCpwyQbD6iw==", + "requires": { + "@babel/runtime": "^7.17.0", + "@mui/base": "5.0.0-alpha.69", + "@mui/system": "^5.4.3", + "@mui/types": "^7.1.2", + "@mui/utils": "^5.4.2", + "@types/react-transition-group": "^4.4.4", + "clsx": "^1.1.1", + "csstype": "^3.0.10", + "hoist-non-react-statics": "^3.3.2", + "prop-types": "^15.7.2", + "react-is": "^17.0.2", + "react-transition-group": "^4.4.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.10", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz", + "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==" + }, + "react-is": { + "version": "17.0.2", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", + "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" + } + } + }, + "@mui/private-theming": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.4.2.tgz", + "integrity": "sha512-mlPDYYko4wIcwXjCPEmOWbNTT4DZ6h9YHdnRtQPnWM28+TRUHEo7SbydnnmVDQLRXUfaH4Y6XtEHIfBNPE/SLg==", + "requires": { + "@babel/runtime": "^7.17.0", + "@mui/utils": "^5.4.2", + "prop-types": "^15.7.2" + } + }, + "@mui/styled-engine": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.4.2.tgz", + "integrity": "sha512-tz9p3aRtzXHKAg7x3BgP0hVQEoGKaxNCFxsJ+d/iqEHYvywWFSs6oxqYAvDHIRpvMlUZyPNoTrkcNnbdMmH/ng==", + "requires": { + "@babel/runtime": "^7.17.0", + "@emotion/cache": "^11.7.1", + "prop-types": "^15.7.2" } }, - "@material-ui/styles": { - "version": "4.11.4", - "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.11.4.tgz", - "integrity": "sha512-KNTIZcnj/zprG5LW0Sao7zw+yG3O35pviHzejMdcSGCdWbiO8qzRgOYL8JAxAsWBKOKYwVZxXtHWaB5T2Kvxew==", + "@mui/styles": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@mui/styles/-/styles-5.4.2.tgz", + "integrity": "sha512-BX75fNHmRF51yove9dBkH28gpSFjClOPDEnUwLTghPYN913OsqViS/iuCd61dxzygtEEmmeYuWfQjxu/F6vF5g==", "requires": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.0", "@emotion/hash": "^0.8.0", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.2", - "clsx": "^1.0.4", - "csstype": "^2.5.2", + "@mui/private-theming": "^5.4.2", + "@mui/types": "^7.1.2", + "@mui/utils": "^5.4.2", + "clsx": "^1.1.1", + "csstype": "^3.0.10", "hoist-non-react-statics": "^3.3.2", - "jss": "^10.5.1", - "jss-plugin-camel-case": "^10.5.1", - "jss-plugin-default-unit": "^10.5.1", - "jss-plugin-global": "^10.5.1", - "jss-plugin-nested": "^10.5.1", - "jss-plugin-props-sort": "^10.5.1", - "jss-plugin-rule-value-function": "^10.5.1", - "jss-plugin-vendor-prefixer": "^10.5.1", + "jss": "^10.8.2", + "jss-plugin-camel-case": "^10.8.2", + "jss-plugin-default-unit": "^10.8.2", + "jss-plugin-global": "^10.8.2", + "jss-plugin-nested": "^10.8.2", + "jss-plugin-props-sort": "^10.8.2", + "jss-plugin-rule-value-function": "^10.8.2", + "jss-plugin-vendor-prefixer": "^10.8.2", "prop-types": "^15.7.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.10", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz", + "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==" + } } }, - "@material-ui/system": { - "version": "4.12.1", - "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.12.1.tgz", - "integrity": "sha512-lUdzs4q9kEXZGhbN7BptyiS1rLNHe6kG9o8Y307HCvF4sQxbCgpL2qi+gUk+yI8a2DNk48gISEQxoxpgph0xIw==", + "@mui/system": { + "version": "5.4.3", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.4.3.tgz", + "integrity": "sha512-Xz5AVe9JMufJVozMzUv93IRtnLNZnw/Q8k+Mg7Q4oRuwdir0TcYkMVUqAHetVKb3rAouIVCu/cQv0jB8gVeVsQ==", "requires": { - "@babel/runtime": "^7.4.4", - "@material-ui/utils": "^4.11.2", - "csstype": "^2.5.2", + "@babel/runtime": "^7.17.0", + "@mui/private-theming": "^5.4.2", + "@mui/styled-engine": "^5.4.2", + "@mui/types": "^7.1.2", + "@mui/utils": "^5.4.2", + "clsx": "^1.1.1", + "csstype": "^3.0.10", "prop-types": "^15.7.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.10", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz", + "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==" + } } }, - "@material-ui/types": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz", - "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==", + "@mui/types": { + "version": "7.1.2", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.1.2.tgz", + "integrity": "sha512-SD7O1nVzqG+ckQpFjDhXPZjRceB8HQFHEvdLLrPhlJy4lLbwEBbxK74Tj4t6Jgk0fTvLJisuwOutrtYe9P/xBQ==", "requires": {} }, - "@material-ui/utils": { - "version": "4.11.2", - "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.11.2.tgz", - "integrity": "sha512-Uul8w38u+PICe2Fg2pDKCaIG7kOyhowZ9vjiC1FsVwPABTW8vPPKfF6OvxRq3IiBaI1faOJmgdvMG7rMJARBhA==", + "@mui/utils": { + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.4.2.tgz", + "integrity": "sha512-646dBCC57MXTo/Gf3AnZSHRHznaTETQq5x7AWp5FRQ4jPeyT4WSs18cpJVwkV01cAHKh06pNQTIufIALIWCL5g==", "requires": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.0", + "@types/prop-types": "^15.7.4", + "@types/react-is": "^16.7.1 || ^17.0.0", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0" + "react-is": "^17.0.2" + }, + "dependencies": { + "react-is": { + "version": "17.0.2", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", + "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" + } } }, - "@microsoft/fetch-event-source": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/@microsoft/fetch-event-source/-/fetch-event-source-2.0.1.tgz", - "integrity": "sha512-W6CLUJ2eBMw3Rec70qrsEW0jOm/3twwJv21mrmj2yORiaVmVYGS4sSS5yUwvQc1ZlDLYGPnClVWmUUMagKNsfA==", - "dev": true - }, "@nodelib/fs.scandir": { "version": "2.1.3", "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.3.tgz", @@ -23511,6 +24214,11 @@ "fastq": "^1.6.0" } }, + "@popperjs/core": { + "version": "2.11.2", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.2.tgz", + "integrity": "sha512-92FRmppjjqz29VMJ2dn+xdyXZBrMlE42AV6Kq6BwjWV7CNUW1hs2FtxSNLQE+gJhaZ6AAmYuO9y8dshhcBl7vA==" + }, "@rollup/plugin-babel": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.0.tgz", @@ -24016,9 +24724,9 @@ "integrity": "sha512-ReVR2rLTV1kvtlWFyuot+d1pkpG2Fw/XKE3PDAdj57rbM97ttSp9JZ2UsP+2EHTylra9cUf6JA7tGwW1INzUrA==" }, "@types/prop-types": { - "version": "15.7.3", - "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.3.tgz", - "integrity": "sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==" + "version": "15.7.4", + "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz", + "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==" }, "@types/q": { "version": "1.5.5", @@ -24060,10 +24768,18 @@ "@types/react": "*" } }, + "@types/react-is": { + "version": "17.0.3", + "resolved": "https://registry.npmjs.org/@types/react-is/-/react-is-17.0.3.tgz", + "integrity": "sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==", + "requires": { + "@types/react": "*" + } + }, "@types/react-transition-group": { - "version": "4.4.0", - "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.0.tgz", - "integrity": "sha512-/QfLHGpu+2fQOqQaXh8MG9q03bFENooTb/it4jr5kKaZlDQfWvjqWZg48AwzPVMBHlRuTRAY7hRHCEOXz5kV6w==", + "version": "4.4.4", + "resolved": "https://registry.npmjs.org/@types/react-transition-group/-/react-transition-group-4.4.4.tgz", + "integrity": "sha512-7gAPz7anVK5xzbeQW9wFBDg7G++aPLAFY0QaSMOou9rJZpbuI58WAuJrgu+qR92l61grlnCUe7AFX8KGahAgug==", "requires": { "@types/react": "*" } @@ -26281,11 +26997,6 @@ } } }, - "csstype": { - "version": "2.6.13", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.13.tgz", - "integrity": "sha512-ul26pfSQTZW8dcOnD2iiJssfXw0gdNVX9IJDH/X3K5DGPfj+fUYe3kB+swUY6BF3oZDxaID3AJt+9/ojSAE05A==" - }, "damerau-levenshtein": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz", @@ -26308,10 +27019,11 @@ "dev": true }, "date-fns": { - "version": "1.30.1", - "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz", - "integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==", - "dev": true + "version": "2.28.0", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.28.0.tgz", + "integrity": "sha512-8d35hViGYx/QH0icHYCeLmsLmMUheMmTyV9Fcm6gvNwdw31yXXH+O85sOBJ+OLnLQMKZowvpKb6FgMIQjcpvQw==", + "optional": true, + "peer": true }, "debounce": { "version": "1.2.0", @@ -28080,6 +28792,11 @@ "pkg-dir": "^4.1.0" } }, + "find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "find-up": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz", @@ -30419,6 +31136,12 @@ "restore-cursor": "^2.0.0" } }, + "date-fns": { + "version": "1.30.1", + "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz", + "integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==", + "dev": true + }, "figures": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/figures/-/figures-2.0.0.tgz", @@ -31827,11 +32550,6 @@ } } }, - "popper.js": { - "version": "1.16.1-lts", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", - "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" - }, "portfinder": { "version": "1.0.28", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz", @@ -33428,6 +34146,12 @@ "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz", "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==" }, + "rifm": { + "version": "0.12.1", + "resolved": "https://registry.npmjs.org/rifm/-/rifm-0.12.1.tgz", + "integrity": "sha512-OGA1Bitg/dSJtI/c4dh90svzaUPt228kzFsUkJbtA2c964IqEAwWXeL9ZJi86xWv3j5SMqRvGULl7bA6cK0Bvg==", + "requires": {} + }, "rimraf": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", @@ -34121,6 +34845,11 @@ "postcss-selector-parser": "^6.0.4" } }, + "stylis": { + "version": "4.0.13", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz", + "integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==" + }, "subscriptions-transport-ws": { "version": "0.9.18", "resolved": "https://registry.npmjs.org/subscriptions-transport-ws/-/subscriptions-transport-ws-0.9.18.tgz", diff --git a/webui/package.json b/webui/package.json index 87020315..f3ad7258 100644 --- a/webui/package.json +++ b/webui/package.json @@ -5,10 +5,12 @@ "dependencies": { "@apollo/client": "^3.5.9", "@arrows/composition": "^1.2.2", - "@material-ui/core": "^4.12.3", - "@material-ui/icons": "^4.11.2", - "@material-ui/lab": "^4.0.0-alpha.60", - "@material-ui/styles": "^4.10.0", + "@emotion/react": "^11.8.1", + "@emotion/styled": "^11.8.1", + "@mui/icons-material": "^5.4.2", + "@mui/lab": "^5.0.0-alpha.70", + "@mui/material": "^5.4.3", + "@mui/styles": "^5.4.2", "@types/node": "^17.0.18", "@types/react": "^17.0.39", "@types/react-dom": "^17.0.11", diff --git a/webui/src/apollo.ts b/webui/src/apollo.ts index 99860842..c111dbd8 100644 --- a/webui/src/apollo.ts +++ b/webui/src/apollo.ts @@ -6,6 +6,12 @@ const client = new ApolloClient({ uri: '/graphql', cache: new InMemoryCache({ possibleTypes: introspectionResult.possibleTypes, + typePolicies: { + // TODO: For now, we only query the default repository, so consider it as a singleton + Repository: { + keyFields: [], + }, + }, }), }); diff --git a/webui/src/components/Author.tsx b/webui/src/components/Author.tsx index b9f95aae..92e14d40 100644 --- a/webui/src/components/Author.tsx +++ b/webui/src/components/Author.tsx @@ -1,9 +1,8 @@ +import MAvatar from '@mui/material/Avatar'; +import Link from '@mui/material/Link'; +import Tooltip from '@mui/material/Tooltip/Tooltip'; import { Link as RouterLink } from 'react-router-dom'; -import MAvatar from '@material-ui/core/Avatar'; -import Link from '@material-ui/core/Link'; -import Tooltip from '@material-ui/core/Tooltip/Tooltip'; - import { AuthoredFragment } from '../graphql/fragments.generated'; type Props = AuthoredFragment & { @@ -14,7 +13,12 @@ type Props = AuthoredFragment & { const Author = ({ author, ...props }: Props) => { return ( <Tooltip title={`Goto the ${author.displayName}'s profile.`}> - <Link {...props} component={RouterLink} to={`/user/${author.id}`}> + <Link + {...props} + component={RouterLink} + to={`/user/${author.id}`} + underline="hover" + > {author.displayName} </Link> </Tooltip> diff --git a/webui/src/components/BackToListButton.tsx b/webui/src/components/BackToListButton.tsx index 8bc75491..a4e4ea9c 100644 --- a/webui/src/components/BackToListButton.tsx +++ b/webui/src/components/BackToListButton.tsx @@ -1,9 +1,8 @@ +import ArrowBackIcon from '@mui/icons-material/ArrowBack'; +import Button from '@mui/material/Button'; +import makeStyles from '@mui/styles/makeStyles'; import { Link } from 'react-router-dom'; -import Button from '@material-ui/core/Button'; -import { makeStyles } from '@material-ui/core/styles'; -import ArrowBackIcon from '@material-ui/icons/ArrowBack'; - const useStyles = makeStyles((theme) => ({ backButton: { position: 'sticky', diff --git a/webui/src/components/BugTitleForm/BugTitleForm.tsx b/webui/src/components/BugTitleForm/BugTitleForm.tsx index 6007680f..78b9e901 100644 --- a/webui/src/components/BugTitleForm/BugTitleForm.tsx +++ b/webui/src/components/BugTitleForm/BugTitleForm.tsx @@ -1,8 +1,8 @@ -import { useState } from 'react'; +import { Button, Typography } from '@mui/material'; +import makeStyles from '@mui/styles/makeStyles'; +import { useRef, useState } from 'react'; import { Link } from 'react-router-dom'; -import { Button, makeStyles, Typography } from '@material-ui/core'; - import { TimelineDocument } from '../../pages/bug/TimelineQuery.generated'; import IfLoggedIn from '../IfLoggedIn/IfLoggedIn'; import Author from 'src/components/Author'; @@ -71,11 +71,11 @@ function BugTitleForm({ bug }: Props) { const [setTitle, { loading, error }] = useSetTitleMutation(); const [issueTitle, setIssueTitle] = useState(bug.title); const classes = useStyles(); - let issueTitleInput: any; + const issueTitleInput = useRef<HTMLInputElement>(); function isFormValid() { - if (issueTitleInput) { - return issueTitleInput.value.length > 0; + if (issueTitleInput.current) { + return issueTitleInput.current.value.length > 0; } else { return false; } @@ -83,7 +83,7 @@ function BugTitleForm({ bug }: Props) { function submitNewTitle() { if (!isFormValid()) return; - if (bug.title === issueTitleInput.value) { + if (bug.title === issueTitleInput.current?.value) { cancelChange(); return; } @@ -91,7 +91,7 @@ function BugTitleForm({ bug }: Props) { variables: { input: { prefix: bug.id, - title: issueTitleInput.value, + title: issueTitleInput.current!!.value, }, }, refetchQueries: [ @@ -117,9 +117,7 @@ function BugTitleForm({ bug }: Props) { return ( <form className={classes.headerTitle}> <BugTitleInput - inputRef={(node) => { - issueTitleInput = node; - }} + inputRef={issueTitleInput} label="Title" variant="outlined" fullWidth diff --git a/webui/src/components/BugTitleForm/BugTitleInput.tsx b/webui/src/components/BugTitleForm/BugTitleInput.tsx index d2b060a2..11cbbdb6 100644 --- a/webui/src/components/BugTitleForm/BugTitleInput.tsx +++ b/webui/src/components/BugTitleForm/BugTitleInput.tsx @@ -1,5 +1,7 @@ -import { createStyles, fade, withStyles, TextField } from '@material-ui/core'; -import { Theme } from '@material-ui/core/styles'; +import { alpha, TextField } from '@mui/material'; +import { Theme } from '@mui/material/styles'; +import createStyles from '@mui/styles/createStyles'; +import withStyles from '@mui/styles/withStyles'; const BugTitleInput = withStyles((theme: Theme) => createStyles({ @@ -14,7 +16,7 @@ const BugTitleInput = withStyles((theme: Theme) => }, '& input:valid:hover + fieldset': { color: theme.palette.text.primary, - borderColor: fade(theme.palette.divider, 0.3), + borderColor: alpha(theme.palette.divider, 0.3), borderWidth: 2, }, '& input:valid:focus + fieldset': { diff --git a/webui/src/components/CloseBugButton/index.tsx b/webui/src/components/CloseBugButton/index.tsx index 77b93e7f..70b92392 100644 --- a/webui/src/components/CloseBugButton/index.tsx +++ b/webui/src/components/CloseBugButton/index.tsx @@ -1,20 +1,12 @@ -import Button from '@material-ui/core/Button'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import { makeStyles, Theme } from '@material-ui/core/styles'; -import ErrorOutlineIcon from '@material-ui/icons/ErrorOutline'; +import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline'; +import Button from '@mui/material/Button'; +import CircularProgress from '@mui/material/CircularProgress'; import { BugFragment } from 'src/pages/bug/Bug.generated'; import { TimelineDocument } from 'src/pages/bug/TimelineQuery.generated'; import { useCloseBugMutation } from './CloseBug.generated'; -const useStyles = makeStyles((theme: Theme) => ({ - closeIssueIcon: { - color: theme.palette.secondary.dark, - paddingTop: '0.1rem', - }, -})); - interface Props { bug: BugFragment; disabled?: boolean; @@ -22,7 +14,6 @@ interface Props { function CloseBugButton({ bug, disabled }: Props) { const [closeBug, { loading, error }] = useCloseBugMutation(); - const classes = useStyles(); function closeBugAction() { closeBug({ @@ -54,7 +45,7 @@ function CloseBugButton({ bug, disabled }: Props) { variant="contained" onClick={() => closeBugAction()} disabled={bug.status === 'CLOSED' || disabled} - startIcon={<ErrorOutlineIcon className={classes.closeIssueIcon} />} + startIcon={<ErrorOutlineIcon />} > Close bug </Button> diff --git a/webui/src/components/CloseBugWithCommentButton/index.tsx b/webui/src/components/CloseBugWithCommentButton/index.tsx index 9663ec3f..efad39b3 100644 --- a/webui/src/components/CloseBugWithCommentButton/index.tsx +++ b/webui/src/components/CloseBugWithCommentButton/index.tsx @@ -1,20 +1,12 @@ -import Button from '@material-ui/core/Button'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import { makeStyles, Theme } from '@material-ui/core/styles'; -import ErrorOutlineIcon from '@material-ui/icons/ErrorOutline'; +import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline'; +import Button from '@mui/material/Button'; +import CircularProgress from '@mui/material/CircularProgress'; import { BugFragment } from 'src/pages/bug/Bug.generated'; import { TimelineDocument } from 'src/pages/bug/TimelineQuery.generated'; import { useAddCommentAndCloseBugMutation } from './CloseBugWithComment.generated'; -const useStyles = makeStyles((theme: Theme) => ({ - closeIssueIcon: { - color: theme.palette.secondary.dark, - paddingTop: '0.1rem', - }, -})); - interface Props { bug: BugFragment; comment: string; @@ -24,7 +16,6 @@ interface Props { function CloseBugWithCommentButton({ bug, comment, postClick }: Props) { const [addCommentAndCloseBug, { loading, error }] = useAddCommentAndCloseBugMutation(); - const classes = useStyles(); function addCommentAndCloseBugAction() { addCommentAndCloseBug({ @@ -60,7 +51,7 @@ function CloseBugWithCommentButton({ bug, comment, postClick }: Props) { <Button variant="contained" onClick={() => addCommentAndCloseBugAction()} - startIcon={<ErrorOutlineIcon className={classes.closeIssueIcon} />} + startIcon={<ErrorOutlineIcon />} > Close bug with comment </Button> diff --git a/webui/src/components/CommentInput/CommentInput.tsx b/webui/src/components/CommentInput/CommentInput.tsx index 07322a22..0fde1d95 100644 --- a/webui/src/components/CommentInput/CommentInput.tsx +++ b/webui/src/components/CommentInput/CommentInput.tsx @@ -1,11 +1,10 @@ -import { useState, useEffect } from 'react'; +import { Typography } from '@mui/material'; +import Tab from '@mui/material/Tab'; +import Tabs from '@mui/material/Tabs'; +import TextField from '@mui/material/TextField'; +import makeStyles from '@mui/styles/makeStyles'; import * as React from 'react'; - -import { Typography } from '@material-ui/core'; -import Tab from '@material-ui/core/Tab'; -import Tabs from '@material-ui/core/Tabs'; -import TextField from '@material-ui/core/TextField'; -import { makeStyles } from '@material-ui/core/styles'; +import { useState, useEffect } from 'react'; import Content from '../Content'; diff --git a/webui/src/components/Content/AnchorTag.tsx b/webui/src/components/Content/AnchorTag.tsx index 0ded34b6..e9edef95 100644 --- a/webui/src/components/Content/AnchorTag.tsx +++ b/webui/src/components/Content/AnchorTag.tsx @@ -1,8 +1,7 @@ +import makeStyles from '@mui/styles/makeStyles'; import * as React from 'react'; import { Link } from 'react-router-dom'; -import { makeStyles } from '@material-ui/core/styles'; - const useStyles = makeStyles((theme) => ({ tag: { color: theme.palette.text.secondary, diff --git a/webui/src/components/Content/BlockQuoteTag.tsx b/webui/src/components/Content/BlockQuoteTag.tsx index d9674b5d..ae6c34f4 100644 --- a/webui/src/components/Content/BlockQuoteTag.tsx +++ b/webui/src/components/Content/BlockQuoteTag.tsx @@ -1,7 +1,6 @@ +import makeStyles from '@mui/styles/makeStyles'; import * as React from 'react'; -import { makeStyles } from '@material-ui/core/styles'; - const useStyles = makeStyles((theme) => ({ tag: { color: theme.palette.text.secondary, diff --git a/webui/src/components/Content/ImageTag.tsx b/webui/src/components/Content/ImageTag.tsx index 2e12ee45..f6e7d5ba 100644 --- a/webui/src/components/Content/ImageTag.tsx +++ b/webui/src/components/Content/ImageTag.tsx @@ -1,7 +1,6 @@ +import { makeStyles } from '@mui/styles'; import * as React from 'react'; -import { makeStyles } from '@material-ui/styles'; - const useStyles = makeStyles({ tag: { maxWidth: '100%', diff --git a/webui/src/components/Content/PreTag.tsx b/webui/src/components/Content/PreTag.tsx index 4601cc2d..aeefa655 100644 --- a/webui/src/components/Content/PreTag.tsx +++ b/webui/src/components/Content/PreTag.tsx @@ -1,7 +1,6 @@ +import { makeStyles } from '@mui/styles'; import * as React from 'react'; -import { makeStyles } from '@material-ui/styles'; - const useStyles = makeStyles({ tag: { maxWidth: '100%', diff --git a/webui/src/components/Date.tsx b/webui/src/components/Date.tsx index edc531b0..1454fac7 100644 --- a/webui/src/components/Date.tsx +++ b/webui/src/components/Date.tsx @@ -1,8 +1,7 @@ +import Tooltip from '@mui/material/Tooltip/Tooltip'; import moment from 'moment'; import Moment from 'react-moment'; -import Tooltip from '@material-ui/core/Tooltip/Tooltip'; - const HOUR = 1000 * 3600; const DAY = 24 * HOUR; const WEEK = 7 * DAY; @@ -10,7 +9,9 @@ const WEEK = 7 * DAY; type Props = { date: string }; const Date = ({ date }: Props) => ( <Tooltip title={moment(date).format('LLLL')}> - <Moment date={date} format="on ll" fromNowDuring={WEEK} /> + <span> + <Moment date={date} format="on ll" fromNowDuring={WEEK} /> + </span> </Tooltip> ); diff --git a/webui/src/components/Header/Header.tsx b/webui/src/components/Header/Header.tsx index f9053f76..961696d7 100644 --- a/webui/src/components/Header/Header.tsx +++ b/webui/src/components/Header/Header.tsx @@ -1,12 +1,12 @@ +import AppBar from '@mui/material/AppBar'; +import Tab, { TabProps } from '@mui/material/Tab'; +import Tabs from '@mui/material/Tabs'; +import Toolbar from '@mui/material/Toolbar'; +import Tooltip from '@mui/material/Tooltip/Tooltip'; +import { alpha } from '@mui/material/styles'; +import makeStyles from '@mui/styles/makeStyles'; import { Link, useLocation } from 'react-router-dom'; -import AppBar from '@material-ui/core/AppBar'; -import Tab, { TabProps } from '@material-ui/core/Tab'; -import Tabs from '@material-ui/core/Tabs'; -import Toolbar from '@material-ui/core/Toolbar'; -import Tooltip from '@material-ui/core/Tooltip/Tooltip'; -import { fade, makeStyles } from '@material-ui/core/styles'; - import CurrentIdentity from '../Identity/CurrentIdentity'; import { LightSwitch } from '../Themer'; @@ -30,7 +30,7 @@ const useStyles = makeStyles((theme) => ({ }, lightSwitch: { marginRight: '20px', - color: fade(theme.palette.primary.contrastText, 0.5), + color: alpha(theme.palette.primary.contrastText, 0.5), }, logo: { height: '42px', diff --git a/webui/src/components/Header/index.tsx b/webui/src/components/Header/index.tsx index e4dc8d19..8375c74a 100644 --- a/webui/src/components/Header/index.tsx +++ b/webui/src/components/Header/index.tsx @@ -1,7 +1,6 @@ +import CssBaseline from '@mui/material/CssBaseline'; import * as React from 'react'; -import CssBaseline from '@material-ui/core/CssBaseline'; - import Header from './Header'; type Props = { children: React.ReactNode }; diff --git a/webui/src/components/Identity/CurrentIdentity.tsx b/webui/src/components/Identity/CurrentIdentity.tsx index 7be2a5f0..e6a396a8 100644 --- a/webui/src/components/Identity/CurrentIdentity.tsx +++ b/webui/src/components/Identity/CurrentIdentity.tsx @@ -1,6 +1,4 @@ -import { useState, useRef } from 'react'; -import { Link as RouterLink } from 'react-router-dom'; - +import LockIcon from '@mui/icons-material/Lock'; import { Button, ClickAwayListener, @@ -10,10 +8,11 @@ import { MenuList, Paper, Popper, -} from '@material-ui/core'; -import Avatar from '@material-ui/core/Avatar'; -import { makeStyles } from '@material-ui/core/styles'; -import LockIcon from '@material-ui/icons/Lock'; +} from '@mui/material'; +import Avatar from '@mui/material/Avatar'; +import makeStyles from '@mui/styles/makeStyles'; +import { useState, useRef } from 'react'; +import { Link as RouterLink } from 'react-router-dom'; import { useCurrentIdentityQuery } from './CurrentIdentity.generated'; @@ -97,6 +96,7 @@ const CurrentIdentity = () => { className={classes.profileLink} component={RouterLink} to={`/user/${user.id}`} + underline="hover" > Open profile </Link> diff --git a/webui/src/components/Label.tsx b/webui/src/components/Label.tsx index 05f6c279..709aceff 100644 --- a/webui/src/components/Label.tsx +++ b/webui/src/components/Label.tsx @@ -1,9 +1,6 @@ -import { Chip } from '@material-ui/core'; -import { common } from '@material-ui/core/colors'; -import { - darken, - getContrastRatio, -} from '@material-ui/core/styles/colorManipulator'; +import { Chip } from '@mui/material'; +import { common } from '@mui/material/colors'; +import { darken, getContrastRatio } from '@mui/material/styles'; import { Color } from '../gqlTypes'; import { LabelFragment } from '../graphql/fragments.generated'; diff --git a/webui/src/components/ReopenBugButton/index.tsx b/webui/src/components/ReopenBugButton/index.tsx index 2433bc60..b6321560 100644 --- a/webui/src/components/ReopenBugButton/index.tsx +++ b/webui/src/components/ReopenBugButton/index.tsx @@ -1,5 +1,5 @@ -import Button from '@material-ui/core/Button'; -import CircularProgress from '@material-ui/core/CircularProgress'; +import Button from '@mui/material/Button'; +import CircularProgress from '@mui/material/CircularProgress'; import { BugFragment } from 'src/pages/bug/Bug.generated'; import { TimelineDocument } from 'src/pages/bug/TimelineQuery.generated'; diff --git a/webui/src/components/ReopenBugWithCommentButton/index.tsx b/webui/src/components/ReopenBugWithCommentButton/index.tsx index 54e8b1e7..66bc04c6 100644 --- a/webui/src/components/ReopenBugWithCommentButton/index.tsx +++ b/webui/src/components/ReopenBugWithCommentButton/index.tsx @@ -1,5 +1,5 @@ -import Button from '@material-ui/core/Button'; -import CircularProgress from '@material-ui/core/CircularProgress'; +import Button from '@mui/material/Button'; +import CircularProgress from '@mui/material/CircularProgress'; import { BugFragment } from 'src/pages/bug/Bug.generated'; import { TimelineDocument } from 'src/pages/bug/TimelineQuery.generated'; diff --git a/webui/src/components/Themer.tsx b/webui/src/components/Themer.tsx index 063587e3..9934888d 100644 --- a/webui/src/components/Themer.tsx +++ b/webui/src/components/Themer.tsx @@ -1,11 +1,15 @@ -import { createContext, useContext, useState } from 'react'; +import { NightsStayRounded, WbSunnyRounded } from '@mui/icons-material'; +import { ThemeProvider, StyledEngineProvider } from '@mui/material'; +import IconButton from '@mui/material/IconButton'; +import Tooltip from '@mui/material/Tooltip'; +import { Theme } from '@mui/material/styles'; import * as React from 'react'; +import { createContext, useContext, useState } from 'react'; -import { ThemeProvider } from '@material-ui/core'; -import IconButton from '@material-ui/core/IconButton'; -import Tooltip from '@material-ui/core/Tooltip'; -import { Theme } from '@material-ui/core/styles'; -import { NightsStayRounded, WbSunnyRounded } from '@material-ui/icons'; +declare module '@mui/styles/defaultTheme' { + // eslint-disable-next-line @typescript-eslint/no-empty-interface + interface DefaultTheme extends Theme {} +} const ThemeContext = createContext({ toggleMode: () => {}, @@ -26,6 +30,7 @@ const LightSwitch = ({ className }: LightSwitchProps) => { onClick={toggleMode} aria-label={description} className={className} + size="large" > {mode === 'light' ? <WbSunnyRounded /> : <NightsStayRounded />} </IconButton> @@ -53,7 +58,9 @@ const Themer = ({ children, lightTheme, darkTheme }: Props) => { return ( <ThemeContext.Provider value={{ toggleMode: toggleMode, mode: mode }}> - <ThemeProvider theme={preferedTheme}>{children}</ThemeProvider> + <StyledEngineProvider injectFirst> + <ThemeProvider theme={preferedTheme}>{children}</ThemeProvider> + </StyledEngineProvider> </ThemeContext.Provider> ); }; diff --git a/webui/src/pages/bug/Bug.tsx b/webui/src/pages/bug/Bug.tsx index 99f43064..f5b97cc2 100644 --- a/webui/src/pages/bug/Bug.tsx +++ b/webui/src/pages/bug/Bug.tsx @@ -1,4 +1,4 @@ -import { makeStyles } from '@material-ui/core/styles'; +import makeStyles from '@mui/styles/makeStyles'; import BugTitleForm from 'src/components/BugTitleForm/BugTitleForm'; import IfLoggedIn from 'src/components/IfLoggedIn/IfLoggedIn'; diff --git a/webui/src/pages/bug/BugQuery.tsx b/webui/src/pages/bug/BugQuery.tsx index 6b31197d..244b0836 100644 --- a/webui/src/pages/bug/BugQuery.tsx +++ b/webui/src/pages/bug/BugQuery.tsx @@ -1,8 +1,7 @@ +import CircularProgress from '@mui/material/CircularProgress'; import * as React from 'react'; import { useParams } from 'react-router-dom'; -import CircularProgress from '@material-ui/core/CircularProgress'; - import NotFoundPage from '../notfound/NotFoundPage'; import Bug from './Bug'; diff --git a/webui/src/pages/bug/CommentForm.tsx b/webui/src/pages/bug/CommentForm.tsx index 3634f43e..f80b89e1 100644 --- a/webui/src/pages/bug/CommentForm.tsx +++ b/webui/src/pages/bug/CommentForm.tsx @@ -1,9 +1,9 @@ -import { useState, useRef } from 'react'; +import Button from '@mui/material/Button'; +import Paper from '@mui/material/Paper'; +import { Theme } from '@mui/material/styles'; +import makeStyles from '@mui/styles/makeStyles'; import * as React from 'react'; - -import Button from '@material-ui/core/Button'; -import Paper from '@material-ui/core/Paper'; -import { makeStyles, Theme } from '@material-ui/core/styles'; +import { useState, useRef } from 'react'; import CommentInput from '../../components/CommentInput/CommentInput'; import CloseBugButton from 'src/components/CloseBugButton'; diff --git a/webui/src/pages/bug/EditCommentForm.tsx b/webui/src/pages/bug/EditCommentForm.tsx index 77453941..4da051e6 100644 --- a/webui/src/pages/bug/EditCommentForm.tsx +++ b/webui/src/pages/bug/EditCommentForm.tsx @@ -1,9 +1,9 @@ -import { useState, useRef } from 'react'; +import Button from '@mui/material/Button'; +import Paper from '@mui/material/Paper'; +import { Theme } from '@mui/material/styles'; +import makeStyles from '@mui/styles/makeStyles'; import * as React from 'react'; - -import Button from '@material-ui/core/Button'; -import Paper from '@material-ui/core/Paper'; -import { makeStyles, Theme } from '@material-ui/core/styles'; +import { useState, useRef } from 'react'; import CommentInput from '../../components/CommentInput/CommentInput'; diff --git a/webui/src/pages/bug/LabelChange.tsx b/webui/src/pages/bug/LabelChange.tsx index 8c88faf2..6b356d14 100644 --- a/webui/src/pages/bug/LabelChange.tsx +++ b/webui/src/pages/bug/LabelChange.tsx @@ -1,5 +1,5 @@ -import { Typography } from '@material-ui/core'; -import { makeStyles } from '@material-ui/core/styles'; +import { Typography } from '@mui/material'; +import makeStyles from '@mui/styles/makeStyles'; import Author from 'src/components/Author'; import Date from 'src/components/Date'; diff --git a/webui/src/pages/bug/Message.tsx b/webui/src/pages/bug/Message.tsx index 450d5902..a5dbbff0 100644 --- a/webui/src/pages/bug/Message.tsx +++ b/webui/src/pages/bug/Message.tsx @@ -1,12 +1,11 @@ -import { useState } from 'react'; +import EditIcon from '@mui/icons-material/Edit'; +import HistoryIcon from '@mui/icons-material/History'; +import IconButton from '@mui/material/IconButton'; +import Paper from '@mui/material/Paper'; +import Tooltip from '@mui/material/Tooltip/Tooltip'; +import makeStyles from '@mui/styles/makeStyles'; import * as React from 'react'; - -import IconButton from '@material-ui/core/IconButton'; -import Paper from '@material-ui/core/Paper'; -import Tooltip from '@material-ui/core/Tooltip/Tooltip'; -import { makeStyles } from '@material-ui/core/styles'; -import EditIcon from '@material-ui/icons/Edit'; -import HistoryIcon from '@material-ui/icons/History'; +import { useState } from 'react'; import Author, { Avatar } from 'src/components/Author'; import Content from 'src/components/Content'; @@ -98,6 +97,7 @@ function HistoryMenuToggleButton({ bugId, commentId }: HistBtnProps) { aria-haspopup="true" onClick={handleClickOpen} className={classes.headerActions} + size="large" > <HistoryIcon /> </IconButton> @@ -150,6 +150,7 @@ function Message({ bug, op }: Props) { className={classes.headerActions} aria-label="edit message" onClick={() => editComment(comment.id)} + size="large" > <EditIcon /> </IconButton> diff --git a/webui/src/pages/bug/MessageHistoryDialog.tsx b/webui/src/pages/bug/MessageHistoryDialog.tsx index c1302196..77f82d86 100644 --- a/webui/src/pages/bug/MessageHistoryDialog.tsx +++ b/webui/src/pages/bug/MessageHistoryDialog.tsx @@ -1,27 +1,24 @@ +import CloseIcon from '@mui/icons-material/Close'; +import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; +import MuiAccordion from '@mui/material/Accordion'; +import MuiAccordionDetails from '@mui/material/AccordionDetails'; +import MuiAccordionSummary from '@mui/material/AccordionSummary'; +import CircularProgress from '@mui/material/CircularProgress'; +import Dialog from '@mui/material/Dialog'; +import MuiDialogContent from '@mui/material/DialogContent'; +import MuiDialogTitle from '@mui/material/DialogTitle'; +import Grid from '@mui/material/Grid'; +import IconButton from '@mui/material/IconButton'; +import Tooltip from '@mui/material/Tooltip/Tooltip'; +import Typography from '@mui/material/Typography'; +import { Theme } from '@mui/material/styles'; +import { WithStyles } from '@mui/styles'; +import createStyles from '@mui/styles/createStyles'; +import withStyles from '@mui/styles/withStyles'; import moment from 'moment'; import * as React from 'react'; import Moment from 'react-moment'; -import MuiAccordion from '@material-ui/core/Accordion'; -import MuiAccordionDetails from '@material-ui/core/AccordionDetails'; -import MuiAccordionSummary from '@material-ui/core/AccordionSummary'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import Dialog from '@material-ui/core/Dialog'; -import MuiDialogContent from '@material-ui/core/DialogContent'; -import MuiDialogTitle from '@material-ui/core/DialogTitle'; -import Grid from '@material-ui/core/Grid'; -import IconButton from '@material-ui/core/IconButton'; -import Tooltip from '@material-ui/core/Tooltip/Tooltip'; -import Typography from '@material-ui/core/Typography'; -import { - createStyles, - Theme, - withStyles, - WithStyles, -} from '@material-ui/core/styles'; -import CloseIcon from '@material-ui/icons/Close'; -import ExpandMoreIcon from '@material-ui/icons/ExpandMore'; - import Content from '../../components/Content'; import { AddCommentFragment } from './MessageCommentFragment.generated'; @@ -50,13 +47,14 @@ export interface DialogTitleProps extends WithStyles<typeof styles> { const DialogTitle = withStyles(styles)((props: DialogTitleProps) => { const { children, classes, onClose, ...other } = props; return ( - <MuiDialogTitle disableTypography className={classes.root} {...other}> + <MuiDialogTitle className={classes.root} {...other}> <Typography variant="h6">{children}</Typography> {onClose ? ( <IconButton aria-label="close" className={classes.closeButton} onClick={onClose} + size="large" > <CloseIcon /> </IconButton> @@ -141,7 +139,7 @@ function MessageHistoryDialog({ bugId, commentId, open, onClose }: Props) { Loading... </DialogTitle> <DialogContent dividers> - <Grid container justify="center"> + <Grid container justifyContent="center"> <CircularProgress /> </Grid> </DialogContent> diff --git a/webui/src/pages/bug/SetStatus.tsx b/webui/src/pages/bug/SetStatus.tsx index 87f16267..dfe07071 100644 --- a/webui/src/pages/bug/SetStatus.tsx +++ b/webui/src/pages/bug/SetStatus.tsx @@ -1,5 +1,5 @@ -import { Typography } from '@material-ui/core'; -import { makeStyles } from '@material-ui/core/styles'; +import { Typography } from '@mui/material'; +import makeStyles from '@mui/styles/makeStyles'; import { Status } from '../../gqlTypes'; import Author from 'src/components/Author'; diff --git a/webui/src/pages/bug/SetTitle.tsx b/webui/src/pages/bug/SetTitle.tsx index 39657532..3ec04a0c 100644 --- a/webui/src/pages/bug/SetTitle.tsx +++ b/webui/src/pages/bug/SetTitle.tsx @@ -1,5 +1,5 @@ -import { Typography } from '@material-ui/core'; -import { makeStyles } from '@material-ui/core/styles'; +import { Typography } from '@mui/material'; +import makeStyles from '@mui/styles/makeStyles'; import Author from 'src/components/Author'; import Date from 'src/components/Date'; diff --git a/webui/src/pages/bug/Timeline.tsx b/webui/src/pages/bug/Timeline.tsx index 1e17fd0a..fc88edd7 100644 --- a/webui/src/pages/bug/Timeline.tsx +++ b/webui/src/pages/bug/Timeline.tsx @@ -1,4 +1,4 @@ -import { makeStyles } from '@material-ui/core/styles'; +import makeStyles from '@mui/styles/makeStyles'; import { BugFragment } from './Bug.generated'; import LabelChange from './LabelChange'; diff --git a/webui/src/pages/bug/TimelineQuery.tsx b/webui/src/pages/bug/TimelineQuery.tsx index 52e8a827..ab9e4cd6 100644 --- a/webui/src/pages/bug/TimelineQuery.tsx +++ b/webui/src/pages/bug/TimelineQuery.tsx @@ -1,4 +1,4 @@ -import CircularProgress from '@material-ui/core/CircularProgress'; +import CircularProgress from '@mui/material/CircularProgress'; import { BugFragment } from './Bug.generated'; import Timeline from './Timeline'; diff --git a/webui/src/pages/bug/labels/LabelMenu.tsx b/webui/src/pages/bug/labels/LabelMenu.tsx index 2c30fcc2..909068fb 100644 --- a/webui/src/pages/bug/labels/LabelMenu.tsx +++ b/webui/src/pages/bug/labels/LabelMenu.tsx @@ -1,14 +1,14 @@ -import { useEffect, useRef, useState } from 'react'; +import CheckIcon from '@mui/icons-material/Check'; +import SettingsIcon from '@mui/icons-material/Settings'; +import { IconButton } from '@mui/material'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import TextField from '@mui/material/TextField'; +import { darken } from '@mui/material/styles'; +import makeStyles from '@mui/styles/makeStyles'; +import withStyles from '@mui/styles/withStyles'; import * as React from 'react'; - -import { IconButton } from '@material-ui/core'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import TextField from '@material-ui/core/TextField'; -import { makeStyles, withStyles } from '@material-ui/core/styles'; -import { darken } from '@material-ui/core/styles/colorManipulator'; -import CheckIcon from '@material-ui/icons/Check'; -import SettingsIcon from '@material-ui/icons/Settings'; +import { useEffect, useRef, useState } from 'react'; import { Color } from '../../../gqlTypes'; import { @@ -109,7 +109,7 @@ function FilterDropdown({ const [open, setOpen] = useState(false); const [filter, setFilter] = useState<string>(''); const buttonRef = useRef<HTMLButtonElement>(null); - const searchRef = useRef<HTMLButtonElement>(null); + const searchRef = useRef<HTMLInputElement>(null); const classes = useStyles({ active: false }); useEffect(() => { @@ -125,6 +125,7 @@ function FilterDropdown({ onClick={() => setOpen(!open)} className={classes.gearBtn} disableRipple + size="large" > <SettingsIcon fontSize={'small'} /> </IconButton> @@ -132,8 +133,6 @@ function FilterDropdown({ <Menu className={classes.menu} - getContentAnchorEl={null} - ref={searchRef} anchorOrigin={{ vertical: 'bottom', horizontal: 'left', @@ -147,7 +146,6 @@ function FilterDropdown({ setOpen(false); onClose(); }} - onExited={() => setFilter('')} anchorEl={buttonRef.current} PaperProps={{ style: { @@ -155,9 +153,13 @@ function FilterDropdown({ width: '25ch', }, }} + TransitionProps={{ + onExited: () => setFilter(''), + }} > {hasFilter && ( <CustomTextField + inputRef={searchRef} onChange={(e) => { const { value } = e.target; setFilter(value); diff --git a/webui/src/pages/identity/BugList.tsx b/webui/src/pages/identity/BugList.tsx index c053d1cf..a7c37a32 100644 --- a/webui/src/pages/identity/BugList.tsx +++ b/webui/src/pages/identity/BugList.tsx @@ -1,6 +1,6 @@ -import { Card, Divider, Link, Typography } from '@material-ui/core'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import { makeStyles } from '@material-ui/core/styles'; +import { Card, Divider, Link, Typography } from '@mui/material'; +import CircularProgress from '@mui/material/CircularProgress'; +import makeStyles from '@mui/styles/makeStyles'; import Date from '../../components/Date'; @@ -47,6 +47,7 @@ function BugList({ id }: Props) { className={classes.bugLink} href={'/bug/' + bug.id} color={'inherit'} + underline="hover" > {bug.title} </Link> diff --git a/webui/src/pages/identity/Identity.tsx b/webui/src/pages/identity/Identity.tsx index 786b40d8..19b80b1c 100644 --- a/webui/src/pages/identity/Identity.tsx +++ b/webui/src/pages/identity/Identity.tsx @@ -1,13 +1,12 @@ +import InfoIcon from '@mui/icons-material/Info'; +import MailOutlineIcon from '@mui/icons-material/MailOutline'; +import { Link, Paper, Typography } from '@mui/material'; +import Avatar from '@mui/material/Avatar'; +import CircularProgress from '@mui/material/CircularProgress'; +import Grid from '@mui/material/Grid'; +import makeStyles from '@mui/styles/makeStyles'; import { Link as RouterLink } from 'react-router-dom'; -import { Link, Paper, Typography } from '@material-ui/core'; -import Avatar from '@material-ui/core/Avatar'; -import CircularProgress from '@material-ui/core/CircularProgress'; -import Grid from '@material-ui/core/Grid'; -import { makeStyles } from '@material-ui/core/styles'; -import InfoIcon from '@material-ui/icons/Info'; -import MailOutlineIcon from '@material-ui/icons/MailOutline'; - import { IdentityFragment } from '../../components/Identity/IdentityFragment.generated'; import { useGetUserStatisticQuery } from './GetUserStatistic.generated'; @@ -98,7 +97,11 @@ const Identity = ({ identity }: Props) => { }} > <MailOutlineIcon /> - <Link href={'mailto:' + user?.email} color={'inherit'}> + <Link + href={'mailto:' + user?.email} + color={'inherit'} + underline="hover" + > {user?.email} </Link> </Typography> @@ -112,6 +115,7 @@ const Identity = ({ identity }: Props) => { component={RouterLink} to={`/?q=author%3A${user?.id}+sort%3Acreation`} color={'inherit'} + underline="hover" > <Typography variant="subtitle1"> Created {authoredCount} bugs. @@ -121,6 +125,7 @@ const Identity = ({ identity }: Props) => { component={RouterLink} to={`/?q=participant%3A${user?.id}+sort%3Acreation`} color={'inherit'} + underline="hover" > <Typography variant="subtitle1"> Participated to {participatedCount} bugs. @@ -130,6 +135,7 @@ const Identity = ({ identity }: Props) => { component={RouterLink} to={`/?q=actor%3A${user?.id}+sort%3Acreation`} color={'inherit'} + underline="hover" > <Typography variant="subtitle1"> Interacted with {actionCount} bugs. diff --git a/webui/src/pages/identity/IdentityQuery.tsx b/webui/src/pages/identity/IdentityQuery.tsx index 5a3b2616..d18f8c6b 100644 --- a/webui/src/pages/identity/IdentityQuery.tsx +++ b/webui/src/pages/identity/IdentityQuery.tsx @@ -9,7 +9,7 @@ import Identity from './Identity'; const UserQuery: React.FC = () => { const params = useParams<'id'>(); - if (params.id === undefined) throw new Error(); + if (params.id === undefined) throw new Error('missing route parameters'); const { loading, error, data } = useGetUserByIdQuery({ variables: { userId: params.id }, diff --git a/webui/src/pages/list/BugRow.tsx b/webui/src/pages/list/BugRow.tsx index b3380dd7..82582dbe 100644 --- a/webui/src/pages/list/BugRow.tsx +++ b/webui/src/pages/list/BugRow.tsx @@ -1,14 +1,13 @@ +import CheckCircleOutline from '@mui/icons-material/CheckCircleOutline'; +import CommentOutlinedIcon from '@mui/icons-material/CommentOutlined'; +import ErrorOutline from '@mui/icons-material/ErrorOutline'; +import TableCell from '@mui/material/TableCell/TableCell'; +import TableRow from '@mui/material/TableRow/TableRow'; +import Tooltip from '@mui/material/Tooltip/Tooltip'; +import makeStyles from '@mui/styles/makeStyles'; import * as React from 'react'; import { Link } from 'react-router-dom'; -import TableCell from '@material-ui/core/TableCell/TableCell'; -import TableRow from '@material-ui/core/TableRow/TableRow'; -import Tooltip from '@material-ui/core/Tooltip/Tooltip'; -import { makeStyles } from '@material-ui/core/styles'; -import CheckCircleOutline from '@material-ui/icons/CheckCircleOutline'; -import CommentOutlinedIcon from '@material-ui/icons/CommentOutlined'; -import ErrorOutline from '@material-ui/icons/ErrorOutline'; - import Author from 'src/components/Author'; import Date from 'src/components/Date'; import Label from 'src/components/Label'; diff --git a/webui/src/pages/list/Filter.tsx b/webui/src/pages/list/Filter.tsx index fd2d5a3a..6b3422be 100644 --- a/webui/src/pages/list/Filter.tsx +++ b/webui/src/pages/list/Filter.tsx @@ -1,17 +1,17 @@ +import ArrowDropDown from '@mui/icons-material/ArrowDropDown'; +import CheckIcon from '@mui/icons-material/Check'; +import Menu from '@mui/material/Menu'; +import MenuItem from '@mui/material/MenuItem'; +import { SvgIconProps } from '@mui/material/SvgIcon'; +import TextField from '@mui/material/TextField'; +import { darken } from '@mui/material/styles'; +import makeStyles from '@mui/styles/makeStyles'; +import withStyles from '@mui/styles/withStyles'; import clsx from 'clsx'; -import { useRef, useState, useEffect } from 'react'; import * as React from 'react'; +import { useRef, useState, useEffect } from 'react'; import { Location, Link } from 'react-router-dom'; -import Menu from '@material-ui/core/Menu'; -import MenuItem from '@material-ui/core/MenuItem'; -import { SvgIconProps } from '@material-ui/core/SvgIcon'; -import TextField from '@material-ui/core/TextField'; -import { makeStyles, withStyles } from '@material-ui/core/styles'; -import { darken } from '@material-ui/core/styles/colorManipulator'; -import ArrowDropDown from '@material-ui/icons/ArrowDropDown'; -import CheckIcon from '@material-ui/icons/Check'; - import { Color } from '../../gqlTypes'; const CustomTextField = withStyles((theme) => ({ @@ -153,7 +153,7 @@ function FilterDropdown({ const [open, setOpen] = useState(false); const [filter, setFilter] = useState<string>(''); const buttonRef = useRef<HTMLButtonElement>(null); - const searchRef = useRef<HTMLButtonElement>(null); + const searchRef = useRef<HTMLInputElement>(null); const classes = useStyles({ active: false }); useEffect(() => { @@ -180,8 +180,6 @@ function FilterDropdown({ </button> <Menu className={classes.labelMenu} - getContentAnchorEl={null} - ref={searchRef} anchorOrigin={{ vertical: 'bottom', horizontal: 'left', @@ -202,6 +200,7 @@ function FilterDropdown({ > {hasFilter && ( <CustomTextField + inputRef={searchRef} onChange={(e) => { const { value } = e.target; setFilter(value); diff --git a/webui/src/pages/list/FilterToolbar.tsx b/webui/src/pages/list/FilterToolbar.tsx index 1a3476e2..5e774734 100644 --- a/webui/src/pages/list/FilterToolbar.tsx +++ b/webui/src/pages/list/FilterToolbar.tsx @@ -1,12 +1,11 @@ import { pipe } from '@arrows/composition'; +import CheckCircleOutline from '@mui/icons-material/CheckCircleOutline'; +import ErrorOutline from '@mui/icons-material/ErrorOutline'; +import Toolbar from '@mui/material/Toolbar'; +import makeStyles from '@mui/styles/makeStyles'; import * as React from 'react'; import { Location } from 'react-router-dom'; -import Toolbar from '@material-ui/core/Toolbar'; -import { makeStyles } from '@material-ui/core/styles'; -import CheckCircleOutline from '@material-ui/icons/CheckCircleOutline'; -import ErrorOutline from '@material-ui/icons/ErrorOutline'; - import { Filter, FilterDropdown, diff --git a/webui/src/pages/list/List.tsx b/webui/src/pages/list/List.tsx index 11760509..4d0666ec 100644 --- a/webui/src/pages/list/List.tsx +++ b/webui/src/pages/list/List.tsx @@ -1,5 +1,5 @@ -import Table from '@material-ui/core/Table/Table'; -import TableBody from '@material-ui/core/TableBody/TableBody'; +import Table from '@mui/material/Table/Table'; +import TableBody from '@mui/material/TableBody/TableBody'; import BugRow from './BugRow'; import { BugListFragment } from './ListQuery.generated'; diff --git a/webui/src/pages/list/ListQuery.tsx b/webui/src/pages/list/ListQuery.tsx index 21818758..6b508e90 100644 --- a/webui/src/pages/list/ListQuery.tsx +++ b/webui/src/pages/list/ListQuery.tsx @@ -1,20 +1,20 @@ import { ApolloError } from '@apollo/client'; import { pipe } from '@arrows/composition'; -import { useState, useEffect, useRef } from 'react'; +import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown'; +import ErrorOutline from '@mui/icons-material/ErrorOutline'; +import KeyboardArrowLeft from '@mui/icons-material/KeyboardArrowLeft'; +import KeyboardArrowRight from '@mui/icons-material/KeyboardArrowRight'; +import { Button, FormControl, Menu, MenuItem } from '@mui/material'; +import IconButton from '@mui/material/IconButton'; +import InputBase from '@mui/material/InputBase'; +import Paper from '@mui/material/Paper'; +import Skeleton from '@mui/material/Skeleton'; +import { Theme } from '@mui/material/styles'; +import makeStyles from '@mui/styles/makeStyles'; import * as React from 'react'; +import { useState, useEffect, useRef } from 'react'; import { useLocation, useNavigate, Link } from 'react-router-dom'; -import { Button, FormControl, Menu, MenuItem } from '@material-ui/core'; -import IconButton from '@material-ui/core/IconButton'; -import InputBase from '@material-ui/core/InputBase'; -import Paper from '@material-ui/core/Paper'; -import { makeStyles, Theme } from '@material-ui/core/styles'; -import ArrowDropDownIcon from '@material-ui/icons/ArrowDropDown'; -import ErrorOutline from '@material-ui/icons/ErrorOutline'; -import KeyboardArrowLeft from '@material-ui/icons/KeyboardArrowLeft'; -import KeyboardArrowRight from '@material-ui/icons/KeyboardArrowRight'; -import Skeleton from '@material-ui/lab/Skeleton'; - import { useCurrentIdentityQuery } from '../../components/Identity/CurrentIdentity.generated'; import IfLoggedIn from 'src/components/IfLoggedIn/IfLoggedIn'; @@ -88,7 +88,7 @@ const useStyles = makeStyles<Theme, StylesProps>((theme) => ({ ...theme.typography.h5, padding: theme.spacing(8), textAlign: 'center', - color: theme.palette.text.hint, + color: theme.palette.text.primary, borderBottomColor: theme.palette.divider, borderBottomWidth: '1px', borderBottomStyle: 'solid', @@ -141,7 +141,7 @@ const Placeholder: React.FC<PlaceholderProps> = ({ <div key={i} className={classes.placeholderRow}> <Skeleton className={classes.placeholderRowStatus} - variant="circle" + variant="circular" width={20} height={20} /> @@ -327,7 +327,6 @@ function ListQuery() { <Menu open={filterMenuIsOpen} onClose={() => setFilterMenuIsOpen(false)} - getContentAnchorEl={null} anchorEl={filterButtonRef.current} anchorOrigin={{ vertical: 'bottom', @@ -382,21 +381,21 @@ function ListQuery() { {content} <div className={classes.pagination}> {previousPage ? ( - <IconButton component={Link} to={previousPage}> + <IconButton component={Link} to={previousPage} size="large"> <KeyboardArrowLeft /> </IconButton> ) : ( - <IconButton disabled> + <IconButton disabled size="large"> <KeyboardArrowLeft /> </IconButton> )} <div>{loading ? 'Loading' : `Total: ${count}`}</div> {nextPage ? ( - <IconButton component={Link} to={nextPage}> + <IconButton component={Link} to={nextPage} size="large"> <KeyboardArrowRight /> </IconButton> ) : ( - <IconButton disabled> + <IconButton disabled size="large"> <KeyboardArrowRight /> </IconButton> )} diff --git a/webui/src/pages/new/NewBugPage.tsx b/webui/src/pages/new/NewBugPage.tsx index 3ab2a92a..0852ef39 100644 --- a/webui/src/pages/new/NewBugPage.tsx +++ b/webui/src/pages/new/NewBugPage.tsx @@ -1,9 +1,9 @@ -import { FormEvent, useState } from 'react'; +import { Button, Paper } from '@mui/material'; +import { Theme } from '@mui/material/styles'; +import makeStyles from '@mui/styles/makeStyles'; +import { FormEvent, useRef, useState } from 'react'; import { useNavigate } from 'react-router-dom'; -import { Button, Paper } from '@material-ui/core'; -import { makeStyles, Theme } from '@material-ui/core/styles'; - import BugTitleInput from '../../components/BugTitleForm/BugTitleInput'; import CommentInput from '../../components/CommentInput/CommentInput'; @@ -48,8 +48,8 @@ function NewBugPage() { const [issueComment, setIssueComment] = useState(''); const classes = useStyles(); - let issueTitleInput: any; - let navigate = useNavigate(); + const issueTitleInput = useRef<HTMLInputElement>(null); + const navigate = useNavigate(); function submitNewIssue(e: FormEvent) { e.preventDefault(); @@ -65,7 +65,10 @@ function NewBugPage() { const id = data.data?.newBug.bug.id; navigate('/bug/' + id); }); - issueTitleInput.value = ''; + + if (issueTitleInput.current) { + issueTitleInput.current.value = ''; + } } function isFormValid() { @@ -79,9 +82,7 @@ function NewBugPage() { <Paper className={classes.main}> <form className={classes.form} onSubmit={submitNewIssue}> <BugTitleInput - inputRef={(node) => { - issueTitleInput = node; - }} + inputRef={issueTitleInput} label="Title" variant="outlined" fullWidth diff --git a/webui/src/pages/notfound/NotFoundPage.tsx b/webui/src/pages/notfound/NotFoundPage.tsx index 2fb2a1bb..22e86355 100644 --- a/webui/src/pages/notfound/NotFoundPage.tsx +++ b/webui/src/pages/notfound/NotFoundPage.tsx @@ -1,4 +1,4 @@ -import { makeStyles } from '@material-ui/core/styles'; +import makeStyles from '@mui/styles/makeStyles'; import BackToListButton from '../../components/BackToListButton'; diff --git a/webui/src/themes/DefaultDark.ts b/webui/src/themes/DefaultDark.ts index 65dd6329..7b292800 100644 --- a/webui/src/themes/DefaultDark.ts +++ b/webui/src/themes/DefaultDark.ts @@ -1,8 +1,8 @@ -import { createMuiTheme } from '@material-ui/core/styles'; +import { createTheme } from '@mui/material/styles'; -const defaultDarkTheme = createMuiTheme({ +const defaultDarkTheme = createTheme({ palette: { - type: 'dark', + mode: 'dark', primary: { dark: '#263238', main: '#2a393e', diff --git a/webui/src/themes/DefaultLight.ts b/webui/src/themes/DefaultLight.ts index 9c57ebe5..bfc454e9 100644 --- a/webui/src/themes/DefaultLight.ts +++ b/webui/src/themes/DefaultLight.ts @@ -1,8 +1,8 @@ -import { createMuiTheme } from '@material-ui/core/styles'; +import { createTheme } from '@mui/material/styles'; -const defaultLightTheme = createMuiTheme({ +const defaultLightTheme = createTheme({ palette: { - type: 'light', + mode: 'light', primary: { dark: '#263238', main: '#5a6b73', |