mirror of
https://github.com/lensapp/lens.git
synced 2024-09-20 05:47:24 +03:00
Refactor app-preferences-registry to use di (#4671)
* converting app-preferences to use di Signed-off-by: Jim Ehrismann <jehrismann@mirantis.com> * address review comments and fix lint Signed-off-by: Jim Ehrismann <jehrismann@mirantis.com> * use compact license header Signed-off-by: Jim Ehrismann <jehrismann@mirantis.com>
This commit is contained in:
parent
86f14a9cdf
commit
d31ab690c2
@ -16,6 +16,12 @@ module.exports = {
|
||||
react: {
|
||||
version: packageJson.devDependencies.react || "detect",
|
||||
},
|
||||
// the package eslint-import-resolver-typescript is required for this line which fixes errors when using .d.ts files
|
||||
"import/resolver": {
|
||||
"typescript": {
|
||||
"alwaysTryTypes": true,
|
||||
},
|
||||
},
|
||||
},
|
||||
overrides: [
|
||||
{
|
||||
|
@ -340,6 +340,7 @@
|
||||
"esbuild": "^0.13.15",
|
||||
"esbuild-loader": "^2.16.0",
|
||||
"eslint": "^7.32.0",
|
||||
"eslint-import-resolver-typescript": "^2.5.0",
|
||||
"eslint-plugin-header": "^3.1.1",
|
||||
"eslint-plugin-import": "^2.25.3",
|
||||
"eslint-plugin-react": "^7.27.1",
|
||||
|
@ -3,7 +3,7 @@
|
||||
* Licensed under MIT License. See LICENSE in root directory for more information.
|
||||
*/
|
||||
|
||||
export type { AppPreferenceRegistration, AppPreferenceComponents } from "../registries/app-preference-registry";
|
||||
export type { AppPreferenceRegistration, AppPreferenceComponents } from "../../renderer/components/+preferences/app-preferences/app-preference-registration";
|
||||
export type { KubeObjectDetailRegistration, KubeObjectDetailComponents } from "../registries/kube-object-detail-registry";
|
||||
export type { KubeObjectMenuRegistration, KubeObjectMenuComponents } from "../registries/kube-object-menu-registry";
|
||||
export type { KubeObjectStatusRegistration } from "../registries/kube-object-status-registry";
|
||||
|
@ -252,7 +252,6 @@ export class ExtensionLoader {
|
||||
return this.autoInitExtensions(async (extension: LensRendererExtension) => {
|
||||
const removeItems = [
|
||||
registries.GlobalPageRegistry.getInstance().add(extension.globalPages, extension),
|
||||
registries.AppPreferenceRegistry.getInstance().add(extension.appPreferences),
|
||||
registries.EntitySettingRegistry.getInstance().add(extension.entitySettings),
|
||||
registries.StatusBarRegistry.getInstance().add(extension.statusBarItems),
|
||||
registries.CatalogEntityDetailRegistry.getInstance().add(extension.catalogEntityDetailItems),
|
||||
|
@ -15,13 +15,14 @@ import type { KubernetesCluster } from "../common/catalog-entities";
|
||||
import type { WelcomeMenuRegistration } from "../renderer/components/+welcome/welcome-menu-items/welcome-menu-registration";
|
||||
import type { WelcomeBannerRegistration } from "../renderer/components/+welcome/welcome-banner-items/welcome-banner-registration";
|
||||
import type { CommandRegistration } from "../renderer/components/command-palette/registered-commands/commands";
|
||||
import type { AppPreferenceRegistration } from "../renderer/components/+preferences/app-preferences/app-preference-registration";
|
||||
|
||||
export class LensRendererExtension extends LensExtension {
|
||||
globalPages: registries.PageRegistration[] = [];
|
||||
clusterPages: registries.PageRegistration[] = [];
|
||||
clusterPageMenus: registries.ClusterPageMenuRegistration[] = [];
|
||||
kubeObjectStatusTexts: registries.KubeObjectStatusRegistration[] = [];
|
||||
appPreferences: registries.AppPreferenceRegistration[] = [];
|
||||
appPreferences: AppPreferenceRegistration[] = [];
|
||||
entitySettings: registries.EntitySettingRegistration[] = [];
|
||||
statusBarItems: registries.StatusBarRegistration[] = [];
|
||||
kubeObjectDetailItems: registries.KubeObjectDetailRegistration[] = [];
|
||||
|
@ -7,7 +7,6 @@
|
||||
|
||||
export * from "./page-registry";
|
||||
export * from "./page-menu-registry";
|
||||
export * from "./app-preference-registry";
|
||||
export * from "./status-bar-registry";
|
||||
export * from "./kube-object-detail-registry";
|
||||
export * from "./kube-object-menu-registry";
|
||||
|
@ -4,7 +4,6 @@
|
||||
*/
|
||||
|
||||
import type React from "react";
|
||||
import { BaseRegistry } from "./base-registry";
|
||||
|
||||
export interface AppPreferenceComponents {
|
||||
Hint: React.ComponentType<any>;
|
||||
@ -22,11 +21,3 @@ export interface RegisteredAppPreference extends AppPreferenceRegistration {
|
||||
id: string;
|
||||
}
|
||||
|
||||
export class AppPreferenceRegistry extends BaseRegistry<AppPreferenceRegistration, RegisteredAppPreference> {
|
||||
getRegisteredItem(item: AppPreferenceRegistration): RegisteredAppPreference {
|
||||
return {
|
||||
id: item.id || item.title.toLowerCase().replace(/[^0-9a-zA-Z]+/g, "-"),
|
||||
...item,
|
||||
};
|
||||
}
|
||||
}
|
@ -0,0 +1,19 @@
|
||||
/**
|
||||
* Copyright (c) OpenLens Authors. All rights reserved.
|
||||
* Licensed under MIT License. See LICENSE in root directory for more information.
|
||||
*/
|
||||
|
||||
import { getInjectable, lifecycleEnum } from "@ogre-tools/injectable";
|
||||
import rendererExtensionsInjectable from "../../../../extensions/renderer-extensions.injectable";
|
||||
import { getAppPreferences } from "./get-app-preferences";
|
||||
|
||||
const appPreferencesInjectable = getInjectable({
|
||||
instantiate: (di) =>
|
||||
getAppPreferences({
|
||||
extensions: di.inject(rendererExtensionsInjectable),
|
||||
}),
|
||||
|
||||
lifecycle: lifecycleEnum.singleton,
|
||||
});
|
||||
|
||||
export default appPreferencesInjectable;
|
@ -0,0 +1,28 @@
|
||||
/**
|
||||
* Copyright (c) OpenLens Authors. All rights reserved.
|
||||
* Licensed under MIT License. See LICENSE in root directory for more information.
|
||||
*/
|
||||
|
||||
import { computed, IComputedValue } from "mobx";
|
||||
import type { LensRendererExtension } from "../../../../extensions/lens-renderer-extension";
|
||||
import type { AppPreferenceRegistration, RegisteredAppPreference } from "./app-preference-registration";
|
||||
|
||||
interface Dependencies {
|
||||
extensions: IComputedValue<LensRendererExtension[]>;
|
||||
}
|
||||
|
||||
function getRegisteredItem(item: AppPreferenceRegistration): RegisteredAppPreference {
|
||||
return {
|
||||
id: item.id || item.title.toLowerCase().replace(/[^0-9a-zA-Z]+/g, "-"),
|
||||
...item,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
export const getAppPreferences = ({ extensions }: Dependencies) => {
|
||||
return computed(() => (
|
||||
extensions.get()
|
||||
.flatMap((extension) => extension.appPreferences)
|
||||
.map(getRegisteredItem)
|
||||
));
|
||||
};
|
@ -14,10 +14,12 @@ import { isWindows } from "../../../common/vars";
|
||||
import { Switch } from "../switch";
|
||||
import moment from "moment-timezone";
|
||||
import { CONSTANTS, defaultExtensionRegistryUrl, ExtensionRegistryLocation } from "../../../common/user-store/preferences-helpers";
|
||||
import { action } from "mobx";
|
||||
import { action, IComputedValue } from "mobx";
|
||||
import { isUrl } from "../input/input_validators";
|
||||
import { AppPreferenceRegistry } from "../../../extensions/registries";
|
||||
import { ExtensionSettings } from "./extension-settings";
|
||||
import type { RegisteredAppPreference } from "./app-preferences/app-preference-registration";
|
||||
import { withInjectables } from "@ogre-tools/injectable-react";
|
||||
import appPreferencesInjectable from "./app-preferences/app-preferences.injectable";
|
||||
|
||||
const timezoneOptions: SelectOption<string>[] = moment.tz.names().map(zone => ({
|
||||
label: zone,
|
||||
@ -28,7 +30,11 @@ const updateChannelOptions: SelectOption<string>[] = Array.from(
|
||||
([value, { label }]) => ({ value, label }),
|
||||
);
|
||||
|
||||
export const Application = observer(() => {
|
||||
interface Dependencies {
|
||||
appPreferenceItems: IComputedValue<RegisteredAppPreference[]>
|
||||
}
|
||||
|
||||
const NonInjectedApplication: React.FC<Dependencies> = ({ appPreferenceItems }) => {
|
||||
const userStore = UserStore.getInstance();
|
||||
const defaultShell = process.env.SHELL
|
||||
|| process.env.PTYSHELL
|
||||
@ -40,7 +46,7 @@ export const Application = observer(() => {
|
||||
|
||||
const [customUrl, setCustomUrl] = React.useState(userStore.extensionRegistryUrl.customUrl || "");
|
||||
const [shell, setShell] = React.useState(userStore.shell || "");
|
||||
const extensionSettings = AppPreferenceRegistry.getInstance().getItems().filter((preference) => preference.showInPreferencesTab === "application");
|
||||
const extensionSettings = appPreferenceItems.get().filter((preference) => preference.showInPreferencesTab === "application");
|
||||
const themeStore = ThemeStore.getInstance();
|
||||
|
||||
return (
|
||||
@ -125,10 +131,10 @@ export const Application = observer(() => {
|
||||
/>
|
||||
</section>
|
||||
|
||||
<hr/>
|
||||
<hr />
|
||||
|
||||
<section id="other">
|
||||
<SubTitle title="Start-up"/>
|
||||
<SubTitle title="Start-up" />
|
||||
<Switch checked={userStore.openAtLogin} onChange={() => userStore.openAtLogin = !userStore.openAtLogin}>
|
||||
Automatically start Lens on login
|
||||
</Switch>
|
||||
@ -141,7 +147,7 @@ export const Application = observer(() => {
|
||||
))}
|
||||
|
||||
<section id="update-channel">
|
||||
<SubTitle title="Update Channel"/>
|
||||
<SubTitle title="Update Channel" />
|
||||
<Select
|
||||
options={updateChannelOptions}
|
||||
value={userStore.updateChannel}
|
||||
@ -163,4 +169,14 @@ export const Application = observer(() => {
|
||||
</section>
|
||||
</section>
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
export const Application = withInjectables<Dependencies>(
|
||||
observer(NonInjectedApplication),
|
||||
|
||||
{
|
||||
getProps: (di) => ({
|
||||
appPreferenceItems: di.inject(appPreferencesInjectable),
|
||||
}),
|
||||
},
|
||||
);
|
||||
|
@ -3,12 +3,12 @@
|
||||
* Licensed under MIT License. See LICENSE in root directory for more information.
|
||||
*/
|
||||
import { SubTitle } from "../layout/sub-title";
|
||||
import type { RegisteredAppPreference } from "../../../extensions/registries/app-preference-registry";
|
||||
import type { AppPreferenceRegistration } from "./app-preferences/app-preference-registration";
|
||||
import React from "react";
|
||||
import { cssNames } from "../../../renderer/utils";
|
||||
|
||||
interface ExtensionSettingsProps {
|
||||
setting: RegisteredAppPreference;
|
||||
setting: AppPreferenceRegistration;
|
||||
size: "small" | "normal"
|
||||
}
|
||||
|
||||
|
@ -3,13 +3,21 @@
|
||||
* Licensed under MIT License. See LICENSE in root directory for more information.
|
||||
*/
|
||||
|
||||
import { withInjectables } from "@ogre-tools/injectable-react";
|
||||
import type { IComputedValue } from "mobx";
|
||||
import { observer } from "mobx-react";
|
||||
import React from "react";
|
||||
import { AppPreferenceRegistry } from "../../../extensions/registries";
|
||||
import type { RegisteredAppPreference } from "./app-preferences/app-preference-registration";
|
||||
import appPreferencesInjectable from "./app-preferences/app-preferences.injectable";
|
||||
import { ExtensionSettings } from "./extension-settings";
|
||||
|
||||
export const Extensions = observer(() => {
|
||||
const settings = AppPreferenceRegistry.getInstance().getItems();
|
||||
interface Dependencies {
|
||||
appPreferenceItems: IComputedValue<RegisteredAppPreference[]>
|
||||
}
|
||||
|
||||
const NonInjectedExtensions: React.FC<Dependencies> = ({ appPreferenceItems }) => {
|
||||
|
||||
const settings = appPreferenceItems.get();
|
||||
|
||||
return (
|
||||
<section id="extensions">
|
||||
@ -19,4 +27,14 @@ export const Extensions = observer(() => {
|
||||
)}
|
||||
</section>
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
export const Extensions = withInjectables<Dependencies>(
|
||||
observer(NonInjectedExtensions),
|
||||
|
||||
{
|
||||
getProps: (di) => ({
|
||||
appPreferenceItems: di.inject(appPreferencesInjectable),
|
||||
}),
|
||||
},
|
||||
);
|
||||
|
@ -4,7 +4,7 @@
|
||||
*/
|
||||
import "./preferences.scss";
|
||||
|
||||
import { makeObservable, observable } from "mobx";
|
||||
import type { IComputedValue } from "mobx";
|
||||
import { observer } from "mobx-react";
|
||||
import React from "react";
|
||||
import { matchPath, Redirect, Route, RouteProps, Switch } from "react-router";
|
||||
@ -23,7 +23,6 @@ import {
|
||||
telemetryRoute,
|
||||
telemetryURL,
|
||||
} from "../../../common/routes";
|
||||
import { AppPreferenceRegistry } from "../../../extensions/registries/app-preference-registry";
|
||||
import { navigateWithoutHistoryChange, navigation } from "../../navigation";
|
||||
import { SettingLayout } from "../layout/setting-layout";
|
||||
import { Tab, Tabs } from "../tabs";
|
||||
@ -34,18 +33,18 @@ import { LensProxy } from "./proxy";
|
||||
import { Telemetry } from "./telemetry";
|
||||
import { Extensions } from "./extensions";
|
||||
import { sentryDsn } from "../../../common/vars";
|
||||
import { withInjectables } from "@ogre-tools/injectable-react";
|
||||
import type { RegisteredAppPreference } from "./app-preferences/app-preference-registration";
|
||||
import appPreferencesInjectable from "./app-preferences/app-preferences.injectable";
|
||||
|
||||
@observer
|
||||
export class Preferences extends React.Component {
|
||||
@observable historyLength: number | undefined;
|
||||
interface Dependencies {
|
||||
appPreferenceItems: IComputedValue<RegisteredAppPreference[]>
|
||||
}
|
||||
|
||||
constructor(props: {}) {
|
||||
super(props);
|
||||
makeObservable(this);
|
||||
}
|
||||
const NonInjectedPreferences: React.FC<Dependencies> = ({ appPreferenceItems }) => {
|
||||
|
||||
renderNavigation() {
|
||||
const extensions = AppPreferenceRegistry.getInstance().getItems();
|
||||
function renderNavigation() {
|
||||
const extensions = appPreferenceItems.get();
|
||||
const telemetryExtensions = extensions.filter(e => e.showInPreferencesTab == "telemetry");
|
||||
const currentLocation = navigation.location.pathname;
|
||||
const isActive = (route: RouteProps) => !!matchPath(currentLocation, { path: route.path, exact: route.exact });
|
||||
@ -67,23 +66,31 @@ export class Preferences extends React.Component {
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<SettingLayout
|
||||
navigation={this.renderNavigation()}
|
||||
className="Preferences"
|
||||
contentGaps={false}
|
||||
>
|
||||
<Switch>
|
||||
<Route path={appURL()} component={Application}/>
|
||||
<Route path={proxyURL()} component={LensProxy}/>
|
||||
<Route path={kubernetesURL()} component={Kubernetes}/>
|
||||
<Route path={editorURL()} component={Editor}/>
|
||||
<Route path={telemetryURL()} component={Telemetry}/>
|
||||
<Route path={extensionURL()} component={Extensions}/>
|
||||
<Redirect exact from={`${preferencesURL()}/`} to={appURL()}/>
|
||||
</Switch>
|
||||
</SettingLayout>
|
||||
);
|
||||
}
|
||||
}
|
||||
return (
|
||||
<SettingLayout
|
||||
navigation={renderNavigation()}
|
||||
className="Preferences"
|
||||
contentGaps={false}
|
||||
>
|
||||
<Switch>
|
||||
<Route path={appURL()} component={Application}/>
|
||||
<Route path={proxyURL()} component={LensProxy}/>
|
||||
<Route path={kubernetesURL()} component={Kubernetes}/>
|
||||
<Route path={editorURL()} component={Editor}/>
|
||||
<Route path={telemetryURL()} component={Telemetry}/>
|
||||
<Route path={extensionURL()} component={Extensions}/>
|
||||
<Redirect exact from={`${preferencesURL()}/`} to={appURL()}/>
|
||||
</Switch>
|
||||
</SettingLayout>
|
||||
);
|
||||
};
|
||||
|
||||
export const Preferences = withInjectables<Dependencies>(
|
||||
observer(NonInjectedPreferences),
|
||||
|
||||
{
|
||||
getProps: (di) => ({
|
||||
appPreferenceItems: di.inject(appPreferencesInjectable),
|
||||
}),
|
||||
},
|
||||
);
|
||||
|
@ -6,13 +6,20 @@ import { observer } from "mobx-react";
|
||||
import React from "react";
|
||||
import { UserStore } from "../../../common/user-store";
|
||||
import { sentryDsn } from "../../../common/vars";
|
||||
import { AppPreferenceRegistry } from "../../../extensions/registries";
|
||||
import { Checkbox } from "../checkbox";
|
||||
import { SubTitle } from "../layout/sub-title";
|
||||
import { ExtensionSettings } from "./extension-settings";
|
||||
import type { RegisteredAppPreference } from "./app-preferences/app-preference-registration";
|
||||
import appPreferencesInjectable from "./app-preferences/app-preferences.injectable";
|
||||
import type { IComputedValue } from "mobx";
|
||||
import { withInjectables } from "@ogre-tools/injectable-react";
|
||||
|
||||
export const Telemetry = observer(() => {
|
||||
const extensions = AppPreferenceRegistry.getInstance().getItems();
|
||||
interface Dependencies {
|
||||
appPreferenceItems: IComputedValue<RegisteredAppPreference[]>
|
||||
}
|
||||
|
||||
const NonInjectedTelemetry: React.FC<Dependencies> = ({ appPreferenceItems }) => {
|
||||
const extensions = appPreferenceItems.get();
|
||||
const telemetryExtensions = extensions.filter(e => e.showInPreferencesTab == "telemetry");
|
||||
|
||||
return (
|
||||
@ -44,4 +51,14 @@ export const Telemetry = observer(() => {
|
||||
}
|
||||
</section>
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
export const Telemetry = withInjectables<Dependencies>(
|
||||
observer(NonInjectedTelemetry),
|
||||
|
||||
{
|
||||
getProps: (di) => ({
|
||||
appPreferenceItems: di.inject(appPreferencesInjectable),
|
||||
}),
|
||||
},
|
||||
);
|
||||
|
@ -6,7 +6,6 @@
|
||||
import * as registries from "../../extensions/registries";
|
||||
|
||||
export function initRegistries() {
|
||||
registries.AppPreferenceRegistry.createInstance();
|
||||
registries.CatalogEntityDetailRegistry.createInstance();
|
||||
registries.ClusterPageMenuRegistry.createInstance();
|
||||
registries.ClusterPageRegistry.createInstance();
|
||||
|
13
yarn.lock
13
yarn.lock
@ -5460,6 +5460,17 @@ eslint-import-resolver-node@^0.3.6:
|
||||
debug "^3.2.7"
|
||||
resolve "^1.20.0"
|
||||
|
||||
eslint-import-resolver-typescript@^2.5.0:
|
||||
version "2.5.0"
|
||||
resolved "https://registry.yarnpkg.com/eslint-import-resolver-typescript/-/eslint-import-resolver-typescript-2.5.0.tgz#07661966b272d14ba97f597b51e1a588f9722f0a"
|
||||
integrity sha512-qZ6e5CFr+I7K4VVhQu3M/9xGv9/YmwsEXrsm3nimw8vWaVHRDrQRp26BgCypTxBp3vUp4o5aVEJRiy0F2DFddQ==
|
||||
dependencies:
|
||||
debug "^4.3.1"
|
||||
glob "^7.1.7"
|
||||
is-glob "^4.0.1"
|
||||
resolve "^1.20.0"
|
||||
tsconfig-paths "^3.9.0"
|
||||
|
||||
eslint-module-utils@^2.7.1:
|
||||
version "2.7.1"
|
||||
resolved "https://registry.yarnpkg.com/eslint-module-utils/-/eslint-module-utils-2.7.1.tgz#b435001c9f8dd4ab7f6d0efcae4b9696d4c24b7c"
|
||||
@ -6516,7 +6527,7 @@ glob-to-regexp@^0.4.1:
|
||||
resolved "https://registry.yarnpkg.com/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz#c75297087c851b9a578bd217dd59a92f59fe546e"
|
||||
integrity sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==
|
||||
|
||||
glob@^7.0.0, glob@^7.0.3, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4, glob@^7.1.6, glob@^7.2.0:
|
||||
glob@^7.0.0, glob@^7.0.3, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4, glob@^7.1.6, glob@^7.1.7, glob@^7.2.0:
|
||||
version "7.2.0"
|
||||
resolved "https://registry.yarnpkg.com/glob/-/glob-7.2.0.tgz#d15535af7732e02e948f4c41628bd910293f6023"
|
||||
integrity sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q==
|
||||
|
Loading…
Reference in New Issue
Block a user