refactor: upgrade react to 17

package.json

@@ -30,18 +30,18 @@
     "@ant-design/compatible": "^1.0.8",
     "@ant-design/icons": "^4.2.2",
     "@apollo/react-hooks": "^4.0.0",
-    "@emotion/core": "^10.0.35",
+    "@emotion/core": "^10.1.1",
     "@graphql-tools/load-files": "^6.2.4",
-    "@graphql-tools/merge": "^6.2.4",
+    "@graphql-tools/merge": "^6.2.5",
     "@material-ui/core": "^4.11.0",
     "@material-ui/icons": "^4.9.1",
     "@zeit/next-css": "^1.0.1",
-    "antd": "^4.7.2",
-    "apollo": "^2.31.0",
+    "antd": "^4.8.1",
+    "apollo": "^2.31.1",
     "apollo-boost": "^0.4.9",
-    "apollo-server-koa": "^2.18.2",
-    "asuna-components": "^0.4.32",
-    "axios": "^0.20.0",
+    "apollo-server-koa": "^2.19.0",
+    "asuna-components": "^0.4.33",
+    "axios": "^0.21.0",
     "bluebird": "^3.7.2",
     "braft-editor": "^2.3.9",
     "braft-utils": "^3.0.12",
@@ -51,41 +51,41 @@
     "date-fns": "^2.16.1",
     "debug": "^4.2.0",
     "deep-diff": "^1.0.2",
-    "dynamic-antd-theme": "^0.6.1",
-    "formik": "^2.2.0",
+    "dynamic-antd-theme": "^0.6.2",
+    "formik": "^2.2.3",
     "graphql": "^15.4.0",
     "http-proxy": "^1.18.1",
     "koa": "^2.13.0",
-    "koa-router": "^9.4.0",
+    "koa-router": "^10.0.0",
     "localforage": "^1.9.0",
     "lodash": "^4.17.20",
     "lru-cache": "^6.0.0",
     "moment": "^2.29.1",
-    "nanoid": "^3.1.12",
-    "next": "^9.5.5",
+    "nanoid": "^3.1.16",
+    "next": "^10.0.1",
     "next-redux-wrapper": "^5.0.0",
     "next-transpile-modules": "^4.1.0",
     "node-buffs": "^0.8.9",
     "node-cache": "^5.1.2",
     "object-hash": "^2.0.3",
-    "ow": "^0.18.0",
+    "ow": "^0.19.0",
     "prettier": "^2.1.2",
     "qrcode.react": "^1.0.0",
     "ramda": "^0.27.1",
-    "react": "^16.14.0",
+    "react": "^17.0.1",
     "react-animations": "^1.0.0",
     "react-apollo": "^3.1.5",
     "react-async": "^10.0.1",
-    "react-color": "^2.18.1",
+    "react-color": "^2.19.3",
     "react-diff-viewer": "^3.1.1",
-    "react-dom": "^16.14.0",
+    "react-dom": "^17.0.1",
     "react-highlight": "^0.12.0",
     "react-image-crop": "^8.6.6",
     "react-json-editor-ajrm": "^2.5.13",
     "react-json-tree": "^0.13.0",
     "react-number-format": "^4.4.1",
-    "react-query": "^2.23.1",
-    "react-redux": "^7.2.1",
+    "react-query": "^2.26.2",
+    "react-redux": "^7.2.2",
     "react-sortable-hoc": "^1.11.0",
     "react-spinners": "^0.9.0",
     "react-truncate": "2.4.0",
@@ -99,15 +99,15 @@
     "redux-persist": "^6.0.0",
     "redux-saga": "^1.1.3",
     "rxjs": "^6.6.3",
-    "shortid": "^2.2.15",
-    "snyk": "^1.419.0",
+    "shortid": "^2.2.16",
+    "snyk": "^1.424.4",
     "socket.io-client": "^2.3.1",
     "spinkit": "^2.0.1",
     "stream-array": "^1.1.2",
-    "styled-components": "^5.2.0",
+    "styled-components": "^5.2.1",
     "styled-spinkit": "^1.1.0",
     "url-join": "^4.0.1",
-    "video.js": "^7.9.7"
+    "video.js": "^7.10.2"
   },
   "devDependencies": {
     "@babel/cli": "^7.12.1",
@@ -116,19 +116,19 @@
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@babel/plugin-transform-modules-commonjs": "^7.12.1",
     "@babel/plugin-transform-runtime": "^7.12.1",
-    "@emotion/babel-preset-css-prop": "^10.0.27",
-    "@types/bluebird": "^3.5.32",
+    "@emotion/babel-preset-css-prop": "^10.2.0",
+    "@types/bluebird": "^3.5.33",
     "@types/debug": "^4.1.5",
     "@types/deep-diff": "^1.0.0",
     "@types/jest": "^26.0.15",
-    "@types/lodash": "^4.14.162",
+    "@types/lodash": "^4.14.165",
     "@types/qrcode.react": "^1.0.1",
-    "@types/ramda": "^0.27.29",
-    "@types/react": "^16.9.53",
+    "@types/ramda": "^0.27.32",
+    "@types/react": "^16.9.56",
     "@types/react-color": "^3.0.4",
     "@types/react-highlight": "^0.12.2",
-    "@types/react-pdf": "^4.0.6",
-    "@types/react-redux": "^7.1.9",
+    "@types/react-pdf": "^5.0.0",
+    "@types/react-redux": "^7.1.11",
     "@types/redux-logger": "^3.0.8",
     "@types/shortid": "^0.0.29",
     "@types/socket.io-client": "^1.4.34",
@@ -137,9 +137,9 @@
     "@types/styled-jsx": "^2.2.8",
     "@types/url-join": "^4.0.0",
     "@types/video.js": "^7.3.11",
-    "@types/webpack": "^4.41.23",
+    "@types/webpack": "^4.41.24",
     "@zeit/next-typescript": "^1.1.1",
-    "babel-jest": "^26.6.0",
+    "babel-jest": "^26.6.3",
     "babel-loader": "^8.1.0",
     "babel-plugin-async-import": "^2.1.0",
     "babel-plugin-import": "^1.13.1",
@@ -148,20 +148,20 @@
     "babel-plugin-ts-optchain": "^1.1.5",
     "glob": "^7.1.6",
     "husky": "^4.3.0",
-    "jest": "^26.6.0",
+    "jest": "^26.6.3",
     "jest-next-dynamic": "^1.0.1",
-    "lint-staged": "^10.4.2",
-    "source-map-loader": "^1.1.1",
-    "ts-jest": "^26.4.1",
-    "ts-loader": "^8.0.6",
+    "lint-staged": "^10.5.1",
+    "source-map-loader": "^1.1.2",
+    "ts-jest": "^26.4.4",
+    "ts-loader": "^8.0.10",
     "ts-morph": "^8.1.2",
     "tsconfig-extends": "^1.0.1",
     "tsconfig-paths": "^3.9.0",
     "tsconfig-paths-webpack-plugin": "^3.3.0",
-    "typescript": "^4.0.3",
-    "webpack": "^5.1.3",
-    "webpack-bundle-analyzer": "^3.9.0",
-    "webpack-cli": "^4.1.0"
+    "typescript": "^4.0.5",
+    "webpack": "^5.4.0",
+    "webpack-bundle-analyzer": "^4.1.0",
+    "webpack-cli": "^4.2.0"
   },
   "husky": {
     "hooks": {

src/common/login.page.tsx

@@ -1,3 +1,4 @@
+/** @jsxRuntime classic */
 /** @jsx jsx */
 import { Snow } from '@asuna-admin/components';
 import { Config } from '@asuna-admin/config';

src/components/DrawerButton.tsx

@@ -1,3 +1,4 @@
+/** @jsxRuntime classic */
 /** @jsx jsx */
 import { SelectOutlined } from '@ant-design/icons';
 import { css, jsx } from '@emotion/core';

src/components/EasyForm/index.tsx

@@ -1,3 +1,4 @@
+/** @jsxRuntime classic */
 /** @jsx jsx */
 import { AppContext } from '@asuna-admin/core';
 import { createLogger } from '@asuna-admin/logger';

src/components/KV/list.tsx

@@ -1,3 +1,4 @@
+/** @jsxRuntime classic */
 /** @jsx jsx */
 import { InfoCircleOutlined } from '@ant-design/icons';
 import { AppContext } from '@asuna-admin/core';

src/components/Login.tsx

@@ -1,3 +1,4 @@
+/** @jsxRuntime classic */
 /** @jsx jsx */
 import { LockOutlined, UserOutlined } from '@ant-design/icons';
 import { createLogger } from '@asuna-admin/logger';

src/components/Snippet.tsx

@@ -1,3 +1,4 @@
+/** @jsxRuntime classic */
 /** @jsx jsx */
 import { valueToArrays } from '@asuna-admin/core/url-rewriter';
 import { TooltipContent } from '@asuna-admin/helpers';

src/helpers/components.tsx

@@ -1,3 +1,4 @@
+/** @jsxRuntime classic */
 /** @jsx jsx */
 import { useQuery } from '@apollo/react-hooks';
 import { AsunaDrawerButton } from '@asuna-admin/components';

src/helpers/index.tsx

@@ -1,3 +1,4 @@
+/** @jsxRuntime classic */
 /** @jsx jsx */
 import { LinkOutlined, SearchOutlined } from '@ant-design/icons';
 import { modelProxyCaller } from '@asuna-admin/adapters';
@@ -882,9 +883,9 @@ export function TooltipContent({ value, link }: { value: any; link?: boolean })
         <div style={{ maxWidth: '15rem' }}>{shortValue}</div>
       </Tooltip>
     );
-    return <>{component}</>;
+    return <React.Fragment>{component}</React.Fragment>;
   }
-  return link ? <TextLink url={component} text={component} /> : <>{component}</>;
+  return link ? <TextLink url={component} text={component} /> : <React.Fragment>{component}</React.Fragment>;
 }
 
 function TextLink({ url, text }: { url: string; text?: string }) {

src/schema/index.ts

@@ -101,7 +101,7 @@ export const associationDecorator = ({ modelName, fields }: { modelName: string;
     const withAssociations = R.mapObjIndexed<any, any>((field) => ({
       ...field,
       foreignOpts: wrapForeignOpt(field.foreignOpts),
-    }))(associationFields);
+    }), associationFields);
     logger.debug(TAG, { withAssociations, wrapForeignOpt });
 
     const wrappedFields = R.mergeDeepRight(fields, withAssociations);

yarn.lock

@@ -5097,14 +5097,14 @@ camelize@^1.0.0:
   integrity sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=
 
 caniuse-lite@^1.0.30001093, caniuse-lite@^1.0.30001113, caniuse-lite@^1.0.30001124:
-  version "1.0.30001124"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001124.tgz#5d9998190258e11630d674fc50ea8e579ae0ced2"
-  integrity sha512-zQW8V3CdND7GHRH6rxm6s59Ww4g/qGWTheoboW9nfeMg7sUoopIfKCcNZUjwYRCOrvereh3kwDpZj4VLQ7zGtA==
+  version "1.0.30001157"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001157.tgz"
+  integrity sha512-gOerH9Wz2IRZ2ZPdMfBvyOi3cjaz4O4dgNwPGzx8EhqAs4+2IL/O+fJsbt+znSigujoZG8bVcIAUM/I/E5K3MA==
 
 caniuse-lite@^1.0.30001135:
-  version "1.0.30001150"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001150.tgz#6d0d829da654b0b233576de00335586bc2004df1"
-  integrity sha512-kiNKvihW0m36UhAFnl7bOAv0i1K1f6wpfVtTF5O5O82XzgtBnb05V0XeV3oZ968vfg2sRNChsHw8ASH2hDfoYQ==
+  version "1.0.30001157"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001157.tgz"
+  integrity sha512-gOerH9Wz2IRZ2ZPdMfBvyOi3cjaz4O4dgNwPGzx8EhqAs4+2IL/O+fJsbt+znSigujoZG8bVcIAUM/I/E5K3MA==
 
 capital-case@^1.0.3:
   version "1.0.3"