diff --git a/extensions/example-extension/webpack.config.js b/extensions/example-extension/webpack.config.js
index 70ed538264..94a27a8e08 100644
--- a/extensions/example-extension/webpack.config.js
+++ b/extensions/example-extension/webpack.config.js
@@ -18,6 +18,7 @@ module.exports = [
externals: [
{
"@k8slens/extensions": "var global.LensExtensions",
+ "mobx": "var global.Mobx",
"react": "var global.React"
}
],
@@ -48,6 +49,7 @@ module.exports = [
{
"@k8slens/extensions": "var global.LensExtensions",
"react": "var global.React",
+ "mobx": "var global.Mobx"
}
],
resolve: {
diff --git a/extensions/kube-object-event-status/webpack.config.js b/extensions/kube-object-event-status/webpack.config.js
index 5b776a0935..a35cf40850 100644
--- a/extensions/kube-object-event-status/webpack.config.js
+++ b/extensions/kube-object-event-status/webpack.config.js
@@ -19,6 +19,7 @@ module.exports = [
{
"@k8slens/extensions": "var global.LensExtensions",
"react": "var global.React",
+ "mobx": "var global.Mobx"
}
],
resolve: {
diff --git a/extensions/license-menu-item/webpack.config.ts b/extensions/license-menu-item/webpack.config.ts
index f5846a8b38..7b69571cd7 100644
--- a/extensions/license-menu-item/webpack.config.ts
+++ b/extensions/license-menu-item/webpack.config.ts
@@ -19,6 +19,7 @@ export default [
},
externals: {
"@k8slens/extensions": "var global.LensExtensions",
+ "mobx": "var global.Mobx",
},
resolve: {
extensions: [".tsx", ".ts", ".js"],
diff --git a/extensions/metrics-cluster-feature/webpack.config.js b/extensions/metrics-cluster-feature/webpack.config.js
index 8ef76c4a30..8d3ea196ba 100644
--- a/extensions/metrics-cluster-feature/webpack.config.js
+++ b/extensions/metrics-cluster-feature/webpack.config.js
@@ -19,6 +19,7 @@ module.exports = [
{
"@k8slens/extensions": "var global.LensExtensions",
"react": "var global.React",
+ "mobx": "var global.Mobx"
}
],
resolve: {
diff --git a/extensions/node-menu/webpack.config.js b/extensions/node-menu/webpack.config.js
index 5b776a0935..a35cf40850 100644
--- a/extensions/node-menu/webpack.config.js
+++ b/extensions/node-menu/webpack.config.js
@@ -19,6 +19,7 @@ module.exports = [
{
"@k8slens/extensions": "var global.LensExtensions",
"react": "var global.React",
+ "mobx": "var global.Mobx"
}
],
resolve: {
diff --git a/extensions/pod-menu/webpack.config.js b/extensions/pod-menu/webpack.config.js
index 5b776a0935..91c886ec28 100644
--- a/extensions/pod-menu/webpack.config.js
+++ b/extensions/pod-menu/webpack.config.js
@@ -19,6 +19,8 @@ module.exports = [
{
"@k8slens/extensions": "var global.LensExtensions",
"react": "var global.React",
+ "mobx": "var global.Mobx",
+ "mobx-react": "var global.MobxReact"
}
],
resolve: {
diff --git a/extensions/survey/package-lock.json b/extensions/survey/package-lock.json
index 23a04c2e11..1554140de2 100644
--- a/extensions/survey/package-lock.json
+++ b/extensions/survey/package-lock.json
@@ -5166,18 +5166,18 @@
"dev": true
},
"mobx-react": {
- "version": "6.3.1",
- "resolved": "https://registry.npmjs.org/mobx-react/-/mobx-react-6.3.1.tgz",
- "integrity": "sha512-IOxdJGnRSNSJrL2uGpWO5w9JH5q5HoxEqwOF4gye1gmZYdjoYkkMzSGMDnRCUpN/BNzZcFoMdHXrjvkwO7KgaQ==",
+ "version": "7.1.0",
+ "resolved": "https://registry.npmjs.org/mobx-react/-/mobx-react-7.1.0.tgz",
+ "integrity": "sha512-DxvA6VXmnZ+N9f/UTtolWtdRnAAQY2iHWTSPLktfpj8NKlXUe4dabBAjuXrBcZUM8GjLWnxD1ZEjssXq1M0RAw==",
"dev": true,
"requires": {
- "mobx-react-lite": "^2.2.0"
+ "mobx-react-lite": "^3.2.0"
}
},
"mobx-react-lite": {
- "version": "2.2.2",
- "resolved": "https://registry.npmjs.org/mobx-react-lite/-/mobx-react-lite-2.2.2.tgz",
- "integrity": "sha512-2SlXALHIkyUPDsV4VTKVR9DW7K3Ksh1aaIv3NrNJygTbhXe2A9GrcKHZ2ovIiOp/BXilOcTYemfHHZubP431dg==",
+ "version": "3.2.0",
+ "resolved": "https://registry.npmjs.org/mobx-react-lite/-/mobx-react-lite-3.2.0.tgz",
+ "integrity": "sha512-q5+UHIqYCOpBoFm/PElDuOhbcatvTllgRp3M1s+Hp5j0Z6XNgDbgqxawJ0ZAUEyKM8X1zs70PCuhAIzX1f4Q/g==",
"dev": true
},
"move-concurrently": {
diff --git a/extensions/survey/package.json b/extensions/survey/package.json
index bd6c4718d7..5881b40a6d 100644
--- a/extensions/survey/package.json
+++ b/extensions/survey/package.json
@@ -17,10 +17,10 @@
"@k8slens/extensions": "file:../../src/extensions/npm/extensions",
"got": "^11.8.1",
"jest": "^26.6.3",
- "mobx": "^6.2.0",
- "mobx-react": "^6.2.2",
+ "react": "*",
+ "mobx": "*",
+ "mobx-react": "*",
"node-machine-id": "^1.1.12",
- "react": "^16.13.1",
"refiner-js": "^1.0.1",
"ts-loader": "^8.0.4",
"typescript": "^4.0.3",
diff --git a/extensions/survey/webpack.config.js b/extensions/survey/webpack.config.js
index 2c684b1d0f..c7862dc2c9 100644
--- a/extensions/survey/webpack.config.js
+++ b/extensions/survey/webpack.config.js
@@ -19,6 +19,7 @@ module.exports = [
{
"@k8slens/extensions": "var global.LensExtensions",
"react": "var global.React",
+ "mobx": "var global.Mobx"
}
],
resolve: {
@@ -49,6 +50,8 @@ module.exports = [
{
"@k8slens/extensions": "var global.LensExtensions",
"react": "var global.React",
+ "mobx": "var global.Mobx",
+ "mobx-react": "var global.MobxReact"
}
],
resolve: {
diff --git a/extensions/telemetry/webpack.config.js b/extensions/telemetry/webpack.config.js
index 2c684b1d0f..c7862dc2c9 100644
--- a/extensions/telemetry/webpack.config.js
+++ b/extensions/telemetry/webpack.config.js
@@ -19,6 +19,7 @@ module.exports = [
{
"@k8slens/extensions": "var global.LensExtensions",
"react": "var global.React",
+ "mobx": "var global.Mobx"
}
],
resolve: {
@@ -49,6 +50,8 @@ module.exports = [
{
"@k8slens/extensions": "var global.LensExtensions",
"react": "var global.React",
+ "mobx": "var global.Mobx",
+ "mobx-react": "var global.MobxReact"
}
],
resolve: {
diff --git a/src/common/libs-config.ts b/src/common/libs-config.ts
index ab69e623c8..1d7a728606 100644
--- a/src/common/libs-config.ts
+++ b/src/common/libs-config.ts
@@ -3,11 +3,11 @@
import { configure } from "mobx";
import { enableMapSet, setAutoFreeze } from "immer";
-// Mobx, docs: https://mobx.js.org/configuration.html
+// Mobx
+// Docs: https://mobx.js.org/configuration.html
configure({
- isolateGlobalState: true, // allow to use different versions of mobx in app & extensions
- enforceActions: "never", // skip required usage of @action for class methods
- reactionRequiresObservable: true,
+ isolateGlobalState: true,
+ enforceActions: "never",
});
// Immer
diff --git a/src/main/index.ts b/src/main/index.ts
index 24d885bedd..4a5208903c 100644
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -3,6 +3,7 @@
import "../common/system-ca";
import "../common/libs-config";
import "../common/prometheus-providers";
+import * as Mobx from "mobx";
import * as LensExtensions from "../extensions/core-api";
import { app, autoUpdater, ipcMain, dialog, powerMonitor } from "electron";
import { appName, isMac } from "../common/vars";
@@ -253,5 +254,6 @@ export const LensExtensionsApi = {
};
export {
+ Mobx,
LensExtensionsApi as LensExtensions,
};
diff --git a/src/renderer/bootstrap.tsx b/src/renderer/bootstrap.tsx
index 730bf1ef79..45f43cf6a4 100644
--- a/src/renderer/bootstrap.tsx
+++ b/src/renderer/bootstrap.tsx
@@ -1,6 +1,8 @@
import "./components/app.scss";
import "../common/libs-config";
-import * as React from "react";
+import React from "react";
+import * as Mobx from "mobx";
+import * as MobxReact from "mobx-react";
import * as ReactRouter from "react-router";
import * as ReactRouterDom from "react-router-dom";
import * as LensExtensions from "../extensions/extension-api";
@@ -8,7 +10,7 @@ import { render, unmountComponentAtNode } from "react-dom";
import { clusterStore } from "../common/cluster-store";
import { userStore } from "../common/user-store";
import { delay } from "../common/utils";
-import { isDevelopment, isMac } from "../common/vars";
+import { isMac, isDevelopment } from "../common/vars";
import { extensionDiscovery } from "../extensions/extension-discovery";
import { extensionLoader } from "../extensions/extension-loader";
import { extensionsStore } from "../extensions/extensions-store";
@@ -37,6 +39,8 @@ export {
React,
ReactRouter,
ReactRouterDom,
+ Mobx,
+ MobxReact,
LensExtensions
};
@@ -75,8 +79,8 @@ export async function bootstrap(App: AppComponent) {
}
});
render(<>
- {isMac && }
-
+ {isMac && }
+
, rootElem);
}
diff --git a/src/renderer/components/layout/page-layout.tsx b/src/renderer/components/layout/page-layout.tsx
index 9009e107c7..03ac1a09f4 100644
--- a/src/renderer/components/layout/page-layout.tsx
+++ b/src/renderer/components/layout/page-layout.tsx
@@ -1,8 +1,6 @@
import "./page-layout.scss";
import React from "react";
-import { makeObservable } from "mobx";
-import { observer } from "mobx-react";
import { autobind, cssNames, IClassName } from "../../utils";
import { navigation } from "../../navigation";
import { Icon } from "../icon";
@@ -24,15 +22,9 @@ const defaultProps: Partial = {
contentGaps: true,
};
-@observer
export class PageLayout extends React.Component {
static defaultProps = defaultProps as object;
- constructor(props: PageLayoutProps) {
- super(props);
- makeObservable(this);
- }
-
@autobind()
back(evt?: React.MouseEvent | KeyboardEvent) {
if (this.props.back) {