mirror of
https://github.com/lensapp/lens.git
synced 2025-05-20 05:10:56 +00:00
Upgrade to React@18 (#5172)
* upgrade to react@18 read more: https://reactjs.org/blog/2022/03/29/react-v18.html
This commit is contained in:
Roman
GitHub
parent
06e7dfce5e
commit
71b222f9d0
@ -249,8 +249,8 @@
|
||||
"p-limit": "^3.1.0",
|
||||
"path-to-regexp": "^6.2.0",
|
||||
"proper-lockfile": "^4.1.2",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react": "^18.0.0",
|
||||
"react-dom": "^18.0.0",
|
||||
"react-material-ui-carousel": "^2.3.11",
|
||||
"react-router": "^5.2.0",
|
||||
"react-virtualized-auto-sizer": "^1.0.6",
|
||||
@ -281,7 +281,7 @@
|
||||
"@pmmmwh/react-refresh-webpack-plugin": "^0.5.4",
|
||||
"@sentry/types": "^6.19.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",
|
||||
"@types/byline": "^4.2.33",
|
||||
"@types/chart.js": "^2.9.36",
|
||||
|
||||
@ -12,7 +12,7 @@ import * as ReactRouter from "react-router";
|
||||
import * as ReactRouterDom from "react-router-dom";
|
||||
import * as LensExtensionsCommonApi from "../extensions/common-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 { isMac, isDevelopment } from "../common/vars";
|
||||
import { HelmRepoManager } from "../main/helm/helm-repo-manager";
|
||||
@ -69,6 +69,7 @@ export async function bootstrap(di: DiContainer) {
|
||||
bindEvents();
|
||||
|
||||
const rootElem = document.getElementById("app");
|
||||
const rootNode = createRoot(rootElem);
|
||||
const logPrefix = `[BOOTSTRAP-${process.isMainFrame ? "ROOT" : "CLUSTER"}-FRAME]:`;
|
||||
|
||||
// TODO: Remove temporal dependencies to make timing of initialization not important
|
||||
@ -152,7 +153,7 @@ export async function bootstrap(di: DiContainer) {
|
||||
}
|
||||
|
||||
try {
|
||||
await initializeApp(rootElem);
|
||||
await initializeApp(() => rootNode.unmount());
|
||||
} catch (error) {
|
||||
console.error(`[BOOTSTRAP]: view initialization error: ${error}`, {
|
||||
origin: location.href,
|
||||
@ -160,16 +161,12 @@ export async function bootstrap(di: DiContainer) {
|
||||
});
|
||||
}
|
||||
|
||||
const history = di.inject(historyInjectable);
|
||||
|
||||
render(
|
||||
rootNode.render(
|
||||
<DiContextProvider value={{ di }}>
|
||||
<Router history={history}>
|
||||
<Router history={di.inject(historyInjectable)}>
|
||||
{DefaultProps(App)}
|
||||
</Router>
|
||||
</DiContextProvider>,
|
||||
|
||||
rootElem,
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@ -144,7 +144,7 @@ export class Menu extends React.Component<MenuProps, State> {
|
||||
}
|
||||
}
|
||||
|
||||
refreshPosition = () => {
|
||||
refreshPosition = () => requestAnimationFrame(() => {
|
||||
if (!this.props.usePortal || !this.opener || !this.elem) {
|
||||
return;
|
||||
}
|
||||
@ -187,7 +187,7 @@ export class Menu extends React.Component<MenuProps, State> {
|
||||
left: renderMenuLeft ? menuOnLeftSidePosition : menuOnRightSidePosition,
|
||||
},
|
||||
});
|
||||
};
|
||||
});
|
||||
|
||||
open() {
|
||||
if (this.isOpen) {
|
||||
|
||||
@ -10,7 +10,6 @@ import { Notifications } from "../../../components/notifications";
|
||||
import type { AppEvent } from "../../../../common/app-event-bus/event-bus";
|
||||
import type { CatalogEntity } from "../../../../common/catalog";
|
||||
import { when } from "mobx";
|
||||
import { unmountComponentAtNode } from "react-dom";
|
||||
import type { ClusterFrameContext } from "../../../cluster-frame-context/cluster-frame-context";
|
||||
import { KubeObjectStore } from "../../../../common/k8s-api/kube-object.store";
|
||||
import { requestSetClusterFrameId } from "../../../ipc";
|
||||
@ -30,7 +29,7 @@ const logPrefix = "[CLUSTER-FRAME]:";
|
||||
|
||||
export const initClusterFrame =
|
||||
({ hostedCluster, loadExtensions, catalogEntityRegistry, frameRoutingId, emitEvent, clusterFrameContext }: Dependencies) =>
|
||||
async (rootElem: HTMLElement) => {
|
||||
async (unmountRoot: () => void) => {
|
||||
|
||||
// TODO: Make catalogEntityRegistry already initialized when passed as dependency
|
||||
catalogEntityRegistry.init();
|
||||
@ -80,7 +79,7 @@ export const initClusterFrame =
|
||||
`${logPrefix} Unload dashboard, clusterId=${(hostedCluster.id)}, frameId=${frameRoutingId}`,
|
||||
);
|
||||
|
||||
unmountComponentAtNode(rootElem);
|
||||
unmountRoot();
|
||||
};
|
||||
|
||||
// TODO: Make context dependency of KubeObjectStore
|
||||
|
||||
@ -5,7 +5,6 @@
|
||||
import { delay } from "../../../../common/utils";
|
||||
import { broadcastMessage } from "../../../../common/ipc";
|
||||
import logger from "../../../../common/logger";
|
||||
import { unmountComponentAtNode } from "react-dom";
|
||||
import type { ExtensionLoading } from "../../../../extensions/extension-loader";
|
||||
import type { CatalogEntityRegistry } from "../../../api/catalog-entity-registry";
|
||||
import { bundledExtensionsLoaded } from "../../../../common/ipc/extension-handling";
|
||||
@ -34,10 +33,9 @@ export const initRootFrame =
|
||||
lensProtocolRouterRenderer,
|
||||
ipcRenderer,
|
||||
registerIpcListeners,
|
||||
|
||||
catalogEntityRegistry,
|
||||
}: Dependencies) =>
|
||||
async (rootElem: HTMLElement) => {
|
||||
async (unmountRoot: () => void) => {
|
||||
catalogEntityRegistry.init();
|
||||
|
||||
try {
|
||||
@ -72,6 +70,6 @@ export const initRootFrame =
|
||||
window.addEventListener("beforeunload", () => {
|
||||
logger.info(`${logPrefix} Unload app`);
|
||||
|
||||
unmountComponentAtNode(rootElem);
|
||||
unmountRoot();
|
||||
});
|
||||
};
|
||||
|
||||
61
yarn.lock
61
yarn.lock
@ -1176,19 +1176,19 @@
|
||||
lz-string "^1.4.4"
|
||||
pretty-format "^27.0.2"
|
||||
|
||||
"@testing-library/dom@^7.28.1":
|
||||
version "7.30.3"
|
||||
resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-7.30.3.tgz#779ea9bbb92d63302461800a388a5a890ac22519"
|
||||
integrity sha512-7JhIg2MW6WPwyikH2iL3o7z+FTVgSOd2jqCwTAHqK7Qal2gRRYiUQyURAxtbK9VXm/UTyG9bRihv8C5Tznr2zw==
|
||||
"@testing-library/dom@^8.0.0":
|
||||
version "8.12.0"
|
||||
resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-8.12.0.tgz#fef5e545533fb084175dda6509ee71d7d2f72e23"
|
||||
integrity sha512-rBrJk5WjI02X1edtiUcZhgyhgBhiut96r5Jp8J5qktKdcvLcZpKDW8i2hkGMMItxrghjXuQ5AM6aE0imnFawaw==
|
||||
dependencies:
|
||||
"@babel/code-frame" "^7.10.4"
|
||||
"@babel/runtime" "^7.12.5"
|
||||
"@types/aria-query" "^4.2.0"
|
||||
aria-query "^4.2.2"
|
||||
aria-query "^5.0.0"
|
||||
chalk "^4.1.0"
|
||||
dom-accessibility-api "^0.5.4"
|
||||
dom-accessibility-api "^0.5.9"
|
||||
lz-string "^1.4.4"
|
||||
pretty-format "^26.6.2"
|
||||
pretty-format "^27.0.2"
|
||||
|
||||
"@testing-library/jest-dom@^5.16.3":
|
||||
version "5.16.3"
|
||||
@ -1205,13 +1205,14 @@
|
||||
lodash "^4.17.15"
|
||||
redent "^3.0.0"
|
||||
|
||||
"@testing-library/react@^11.2.7":
|
||||
version "11.2.7"
|
||||
resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-11.2.7.tgz#b29e2e95c6765c815786c0bc1d5aed9cb2bf7818"
|
||||
integrity sha512-tzRNp7pzd5QmbtXNG/mhdcl7Awfu/Iz1RaVHY75zTdOkmHCuzMhRL83gWHSgOAcjS3CCbyfwUHMZgRJb4kAfpA==
|
||||
"@testing-library/react@^12.1.4":
|
||||
version "12.1.4"
|
||||
resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-12.1.4.tgz#09674b117e550af713db3f4ec4c0942aa8bbf2c0"
|
||||
integrity sha512-jiPKOm7vyUw311Hn/HlNQ9P8/lHNtArAx0PisXyFixDDvfl8DbD6EUdbshK5eqauvBSvzZd19itqQ9j3nferJA==
|
||||
dependencies:
|
||||
"@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":
|
||||
version "13.5.0"
|
||||
@ -4666,11 +4667,16 @@ doctrine@^3.0.0:
|
||||
dependencies:
|
||||
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"
|
||||
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.9.tgz#915f8531ba29a50e5c29389dbfb87a9642fef0d6"
|
||||
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:
|
||||
version "0.2.0"
|
||||
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"
|
||||
use-memo-one "^1.1.1"
|
||||
|
||||
react-dom@^17.0.2:
|
||||
version "17.0.2"
|
||||
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23"
|
||||
integrity sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==
|
||||
react-dom@^18.0.0:
|
||||
version "18.0.0"
|
||||
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.0.0.tgz#26b88534f8f1dbb80853e1eabe752f24100d8023"
|
||||
integrity sha512-XqX7uzmFo0pUceWFCt7Gff6IyIMzFUn7QMZrbrQfGxtaxXZIcGQzoNpRLE3fQLnS4XzLLPMZX2T9TRcSrasicw==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
scheduler "^0.20.2"
|
||||
scheduler "^0.21.0"
|
||||
|
||||
react-input-autosize@^3.0.0:
|
||||
version "3.0.0"
|
||||
@ -11063,13 +11068,12 @@ react-window@^1.8.6:
|
||||
"@babel/runtime" "^7.0.0"
|
||||
memoize-one ">=3.1.1 <6"
|
||||
|
||||
react@^17.0.2:
|
||||
version "17.0.2"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"
|
||||
integrity sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==
|
||||
react@^18.0.0:
|
||||
version "18.0.0"
|
||||
resolved "https://registry.yarnpkg.com/react/-/react-18.0.0.tgz#b468736d1f4a5891f38585ba8e8fb29f91c3cb96"
|
||||
integrity sha512-x+VL6wbT4JRVPm7EGxXhZ8w8LTROaxPXOqhlGyVSrv0sB1jkyFGgXxJ8LVoPRLvPR6/CIZGFmfzqUa2NYeMr2A==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
|
||||
read-cmd-shim@^1.0.1, read-cmd-shim@^1.0.5:
|
||||
version "1.0.5"
|
||||
@ -11628,13 +11632,12 @@ saxes@^5.0.1:
|
||||
dependencies:
|
||||
xmlchars "^2.2.0"
|
||||
|
||||
scheduler@^0.20.2:
|
||||
version "0.20.2"
|
||||
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.20.2.tgz#4baee39436e34aa93b4874bddcbf0fe8b8b50e91"
|
||||
integrity sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==
|
||||
scheduler@^0.21.0:
|
||||
version "0.21.0"
|
||||
resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.21.0.tgz#6fd2532ff5a6d877b6edb12f00d8ab7e8f308820"
|
||||
integrity sha512-1r87x5fz9MXqswA2ERLo0EbOAU74DpIUO090gIasYTqlVoJeMcl+Z1Rg7WHz+qtPujhS/hGIt9kxZOYBV3faRQ==
|
||||
dependencies:
|
||||
loose-envify "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
|
||||
schema-utils@2.7.0:
|
||||
version "2.7.0"
|
||||
|
||||
Loading…
Reference in New Issue
Block a user