hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Upgrade to React@18 (#5172)

Browse Source 
* upgrade to react@18
read more: https://reactjs.org/blog/2022/03/29/react-v18.html
This commit is contained in:
Roman 2022-04-07 17:23:52 +03:00 committed by GitHub
parent 06e7dfce5e
commit 71b222f9d0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 46 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
package.json
View File

@ -249,8 +249,8 @@
"p-limit": "^3.1.0", "p-limit": "^3.1.0",
"path-to-regexp": "^6.2.0", "path-to-regexp": "^6.2.0",
"proper-lockfile": "^4.1.2", "proper-lockfile": "^4.1.2",
"react": "^17.0.2", "react": "^18.0.0",
"react-dom": "^17.0.2", "react-dom": "^18.0.0",
"react-material-ui-carousel": "^2.3.11", "react-material-ui-carousel": "^2.3.11",
"react-router": "^5.2.0", "react-router": "^5.2.0",
"react-virtualized-auto-sizer": "^1.0.6", "react-virtualized-auto-sizer": "^1.0.6",
@ -281,7 +281,7 @@
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.4", "@pmmmwh/react-refresh-webpack-plugin": "^0.5.4",
"@sentry/types": "^6.19.3", "@sentry/types": "^6.19.3",
"@testing-library/jest-dom": "^5.16.3", "@testing-library/jest-dom": "^5.16.3",
"@testing-library/react": "^11.2.7", "@testing-library/react": "^12.1.4",
"@testing-library/user-event": "^13.5.0", "@testing-library/user-event": "^13.5.0",
"@types/byline": "^4.2.33", "@types/byline": "^4.2.33",
"@types/chart.js": "^2.9.36", "@types/chart.js": "^2.9.36",

13
src/renderer/bootstrap.tsx
View File

@ -12,7 +12,7 @@ import * as ReactRouter from "react-router";
import * as ReactRouterDom from "react-router-dom"; import * as ReactRouterDom from "react-router-dom";
import * as LensExtensionsCommonApi from "../extensions/common-api"; import * as LensExtensionsCommonApi from "../extensions/common-api";
import * as LensExtensionsRendererApi from "../extensions/renderer-api"; import * as LensExtensionsRendererApi from "../extensions/renderer-api";
import { render } from "react-dom"; import { createRoot } from "react-dom/client";
import { delay } from "../common/utils"; import { delay } from "../common/utils";
import { isMac, isDevelopment } from "../common/vars"; import { isMac, isDevelopment } from "../common/vars";
import { HelmRepoManager } from "../main/helm/helm-repo-manager"; import { HelmRepoManager } from "../main/helm/helm-repo-manager";
@ -69,6 +69,7 @@ export async function bootstrap(di: DiContainer) {
bindEvents(); bindEvents();
const rootElem = document.getElementById("app"); const rootElem = document.getElementById("app");
const rootNode = createRoot(rootElem);
const logPrefix = `[BOOTSTRAP-${process.isMainFrame ? "ROOT" : "CLUSTER"}-FRAME]:`; const logPrefix = `[BOOTSTRAP-${process.isMainFrame ? "ROOT" : "CLUSTER"}-FRAME]:`;
// TODO: Remove temporal dependencies to make timing of initialization not important // TODO: Remove temporal dependencies to make timing of initialization not important
@ -152,7 +153,7 @@ export async function bootstrap(di: DiContainer) {
} }
try { try {
await initializeApp(rootElem); await initializeApp(() => rootNode.unmount());
} catch (error) { } catch (error) {
console.error(`[BOOTSTRAP]: view initialization error: ${error}`, { console.error(`[BOOTSTRAP]: view initialization error: ${error}`, {
origin: location.href, origin: location.href,
@ -160,16 +161,12 @@ export async function bootstrap(di: DiContainer) {
}); });
} }
const history = di.inject(historyInjectable); rootNode.render(
render(
<DiContextProvider value={{ di }}> <DiContextProvider value={{ di }}>
<Router history={history}> <Router history={di.inject(historyInjectable)}>
{DefaultProps(App)} {DefaultProps(App)}
</Router> </Router>
</DiContextProvider>, </DiContextProvider>,
rootElem,
); );
} }

4
src/renderer/components/menu/menu.tsx
View File

@ -144,7 +144,7 @@ export class Menu extends React.Component<MenuProps, State> {
} }
} }
refreshPosition = () => { refreshPosition = () => requestAnimationFrame(() => {
if (!this.props.usePortal || !this.opener || !this.elem) { if (!this.props.usePortal || !this.opener || !this.elem) {
return; return;
} }
@ -187,7 +187,7 @@ export class Menu extends React.Component<MenuProps, State> {
left: renderMenuLeft ? menuOnLeftSidePosition : menuOnRightSidePosition, left: renderMenuLeft ? menuOnLeftSidePosition : menuOnRightSidePosition,
}, },
}); });
}; });
open() { open() {
if (this.isOpen) { if (this.isOpen) {

5
src/renderer/frames/cluster-frame/init-cluster-frame/init-cluster-frame.ts
View File

@ -10,7 +10,6 @@ import { Notifications } from "../../../components/notifications";
import type { AppEvent } from "../../../../common/app-event-bus/event-bus"; import type { AppEvent } from "../../../../common/app-event-bus/event-bus";
import type { CatalogEntity } from "../../../../common/catalog"; import type { CatalogEntity } from "../../../../common/catalog";
import { when } from "mobx"; import { when } from "mobx";
import { unmountComponentAtNode } from "react-dom";
import type { ClusterFrameContext } from "../../../cluster-frame-context/cluster-frame-context"; import type { ClusterFrameContext } from "../../../cluster-frame-context/cluster-frame-context";
import { KubeObjectStore } from "../../../../common/k8s-api/kube-object.store"; import { KubeObjectStore } from "../../../../common/k8s-api/kube-object.store";
import { requestSetClusterFrameId } from "../../../ipc"; import { requestSetClusterFrameId } from "../../../ipc";
@ -30,7 +29,7 @@ const logPrefix = "[CLUSTER-FRAME]:";
export const initClusterFrame = export const initClusterFrame =
({ hostedCluster, loadExtensions, catalogEntityRegistry, frameRoutingId, emitEvent, clusterFrameContext }: Dependencies) => ({ hostedCluster, loadExtensions, catalogEntityRegistry, frameRoutingId, emitEvent, clusterFrameContext }: Dependencies) =>
async (rootElem: HTMLElement) => { async (unmountRoot: () => void) => {
// TODO: Make catalogEntityRegistry already initialized when passed as dependency // TODO: Make catalogEntityRegistry already initialized when passed as dependency
catalogEntityRegistry.init(); catalogEntityRegistry.init();
@ -80,7 +79,7 @@ export const initClusterFrame =
`${logPrefix} Unload dashboard, clusterId=${(hostedCluster.id)}, frameId=${frameRoutingId}`, `${logPrefix} Unload dashboard, clusterId=${(hostedCluster.id)}, frameId=${frameRoutingId}`,
); );
unmountComponentAtNode(rootElem); unmountRoot();
}; };
// TODO: Make context dependency of KubeObjectStore // TODO: Make context dependency of KubeObjectStore

6
src/renderer/frames/root-frame/init-root-frame/init-root-frame.ts
View File

@ -5,7 +5,6 @@
import { delay } from "../../../../common/utils"; import { delay } from "../../../../common/utils";
import { broadcastMessage } from "../../../../common/ipc"; import { broadcastMessage } from "../../../../common/ipc";
import logger from "../../../../common/logger"; import logger from "../../../../common/logger";
import { unmountComponentAtNode } from "react-dom";
import type { ExtensionLoading } from "../../../../extensions/extension-loader"; import type { ExtensionLoading } from "../../../../extensions/extension-loader";
import type { CatalogEntityRegistry } from "../../../api/catalog-entity-registry"; import type { CatalogEntityRegistry } from "../../../api/catalog-entity-registry";
import { bundledExtensionsLoaded } from "../../../../common/ipc/extension-handling"; import { bundledExtensionsLoaded } from "../../../../common/ipc/extension-handling";
@ -34,10 +33,9 @@ export const initRootFrame =
lensProtocolRouterRenderer, lensProtocolRouterRenderer,
ipcRenderer, ipcRenderer,
registerIpcListeners, registerIpcListeners,
catalogEntityRegistry, catalogEntityRegistry,
}: Dependencies) => }: Dependencies) =>
async (rootElem: HTMLElement) => { async (unmountRoot: () => void) => {
catalogEntityRegistry.init(); catalogEntityRegistry.init();
try { try {
@ -72,6 +70,6 @@ export const initRootFrame =
window.addEventListener("beforeunload", () => { window.addEventListener("beforeunload", () => {
logger.info(`${logPrefix} Unload app`); logger.info(`${logPrefix} Unload app`);
unmountComponentAtNode(rootElem); unmountRoot();
}); });
}; };

61
yarn.lock
View File

@ -1176,19 +1176,19 @@
lz-string "^1.4.4" lz-string "^1.4.4"
pretty-format "^27.0.2" pretty-format "^27.0.2"
"@testing-library/dom@^7.28.1": "@testing-library/dom@^8.0.0":
version "7.30.3" version "8.12.0"
resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-7.30.3.tgz#779ea9bbb92d63302461800a388a5a890ac22519" resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-8.12.0.tgz#fef5e545533fb084175dda6509ee71d7d2f72e23"
integrity sha512-7JhIg2MW6WPwyikH2iL3o7z+FTVgSOd2jqCwTAHqK7Qal2gRRYiUQyURAxtbK9VXm/UTyG9bRihv8C5Tznr2zw== integrity sha512-rBrJk5WjI02X1edtiUcZhgyhgBhiut96r5Jp8J5qktKdcvLcZpKDW8i2hkGMMItxrghjXuQ5AM6aE0imnFawaw==
dependencies: dependencies:
"@babel/code-frame" "^7.10.4" "@babel/code-frame" "^7.10.4"
"@babel/runtime" "^7.12.5" "@babel/runtime" "^7.12.5"
"@types/aria-query" "^4.2.0" "@types/aria-query" "^4.2.0"
aria-query "^4.2.2" aria-query "^5.0.0"
chalk "^4.1.0" chalk "^4.1.0"
dom-accessibility-api "^0.5.4" dom-accessibility-api "^0.5.9"
lz-string "^1.4.4" lz-string "^1.4.4"
pretty-format "^26.6.2" pretty-format "^27.0.2"
"@testing-library/jest-dom@^5.16.3": "@testing-library/jest-dom@^5.16.3":
version "5.16.3" version "5.16.3"
@ -1205,13 +1205,14 @@
lodash "^4.17.15" lodash "^4.17.15"
redent "^3.0.0" redent "^3.0.0"
"@testing-library/react@^11.2.7": "@testing-library/react@^12.1.4":
version "11.2.7" version "12.1.4"
resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-11.2.7.tgz#b29e2e95c6765c815786c0bc1d5aed9cb2bf7818" resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-12.1.4.tgz#09674b117e550af713db3f4ec4c0942aa8bbf2c0"
integrity sha512-tzRNp7pzd5QmbtXNG/mhdcl7Awfu/Iz1RaVHY75zTdOkmHCuzMhRL83gWHSgOAcjS3CCbyfwUHMZgRJb4kAfpA== integrity sha512-jiPKOm7vyUw311Hn/HlNQ9P8/lHNtArAx0PisXyFixDDvfl8DbD6EUdbshK5eqauvBSvzZd19itqQ9j3nferJA==
dependencies: dependencies:
"@babel/runtime" "^7.12.5" "@babel/runtime" "^7.12.5"
"@testing-library/dom" "^7.28.1" "@testing-library/dom" "^8.0.0"
"@types/react-dom" "*"
"@testing-library/user-event@^13.5.0": "@testing-library/user-event@^13.5.0":
version "13.5.0" version "13.5.0"
@ -4666,11 +4667,16 @@ doctrine@^3.0.0:
dependencies: dependencies:
esutils "^2.0.2" esutils "^2.0.2"
dom-accessibility-api@^0.5.4, dom-accessibility-api@^0.5.6: dom-accessibility-api@^0.5.6:
version "0.5.9" version "0.5.9"
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.9.tgz#915f8531ba29a50e5c29389dbfb87a9642fef0d6" resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.9.tgz#915f8531ba29a50e5c29389dbfb87a9642fef0d6"
integrity sha512-+KPF4o71fl6NrdnqIrJc6m44NA+Rhf1h7In2MRznejSQasWkjqmHOBUlk+pXJ77cVOSYyZeNHFwn/sjotB6+Sw== integrity sha512-+KPF4o71fl6NrdnqIrJc6m44NA+Rhf1h7In2MRznejSQasWkjqmHOBUlk+pXJ77cVOSYyZeNHFwn/sjotB6+Sw==
dom-accessibility-api@^0.5.9:
version "0.5.13"
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.13.tgz#102ee5f25eacce09bdf1cfa5a298f86da473be4b"
integrity sha512-R305kwb5CcMDIpSHUnLyIAp7SrSPBx6F0VfQFB3M75xVMHhXJJIdePYgbPPh1o57vCHNu5QztokWUPsLjWzFqw==
dom-converter@^0.2.0: dom-converter@^0.2.0:
version "0.2.0" version "0.2.0"
resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768" resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
@ -10924,14 +10930,13 @@ react-beautiful-dnd@^13.1.0:
redux "^4.0.4" redux "^4.0.4"
use-memo-one "^1.1.1" use-memo-one "^1.1.1"
react-dom@^17.0.2: react-dom@^18.0.0:
version "17.0.2" version "18.0.0"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23" resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.0.0.tgz#26b88534f8f1dbb80853e1eabe752f24100d8023"
integrity sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA== integrity sha512-XqX7uzmFo0pUceWFCt7Gff6IyIMzFUn7QMZrbrQfGxtaxXZIcGQzoNpRLE3fQLnS4XzLLPMZX2T9TRcSrasicw==
dependencies: dependencies:
loose-envify "^1.1.0" loose-envify "^1.1.0"
object-assign "^4.1.1" scheduler "^0.21.0"
scheduler "^0.20.2"
react-input-autosize@^3.0.0: react-input-autosize@^3.0.0:
version "3.0.0" version "3.0.0"
@ -11063,13 +11068,12 @@ react-window@^1.8.6:
"@babel/runtime" "^7.0.0" "@babel/runtime" "^7.0.0"
memoize-one ">=3.1.1 <6" memoize-one ">=3.1.1 <6"
react@^17.0.2: react@^18.0.0:
version "17.0.2" version "18.0.0"
resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037" resolved "https://registry.yarnpkg.com/react/-/react-18.0.0.tgz#b468736d1f4a5891f38585ba8e8fb29f91c3cb96"
integrity sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA== integrity sha512-x+VL6wbT4JRVPm7EGxXhZ8w8LTROaxPXOqhlGyVSrv0sB1jkyFGgXxJ8LVoPRLvPR6/CIZGFmfzqUa2NYeMr2A==
dependencies: dependencies:
loose-envify "^1.1.0" loose-envify "^1.1.0"
object-assign "^4.1.1"
read-cmd-shim@^1.0.1, read-cmd-shim@^1.0.5: read-cmd-shim@^1.0.1, read-cmd-shim@^1.0.5:
version "1.0.5" version "1.0.5"
@ -11628,13 +11632,12 @@ saxes@^5.0.1:
dependencies: dependencies:
xmlchars "^2.2.0" xmlchars "^2.2.0"
scheduler@^0.20.2: scheduler@^0.21.0:
version "0.20.2" version "0.21.0"
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.20.2.tgz#4baee39436e34aa93b4874bddcbf0fe8b8b50e91" resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.21.0.tgz#6fd2532ff5a6d877b6edb12f00d8ab7e8f308820"
integrity sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ== integrity sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==
dependencies: dependencies:
loose-envify "^1.1.0" loose-envify "^1.1.0"
object-assign "^4.1.1"
schema-utils@2.7.0: schema-utils@2.7.0:
version "2.7.0" version "2.7.0"