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

mobx-6: replacing @autobind() as method-decorator to @boundMethod

Browse Source 
Signed-off-by: Roman <ixrock@gmail.com>
This commit is contained in:
Roman 2021-05-06 17:24:11 +03:00
parent 884f8ae523
commit 4a9178e8ea
46 changed files with 140 additions and 131 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -184,6 +184,7 @@
"abort-controller": "^3.0.0", "abort-controller": "^3.0.0",
"array-move": "^3.0.0", "array-move": "^3.0.0",
"auto-bind": "^4.0.0", "auto-bind": "^4.0.0",
"autobind-decorator": "^2.4.0",
"await-lock": "^2.1.0", "await-lock": "^2.1.0",
"byline": "^5.0.0", "byline": "^5.0.0",
"chalk": "^4.1.0", "chalk": "^4.1.0",

8
src/common/search-store.ts
View File

@ -1,6 +1,6 @@
import { action, computed, observable, reaction, makeObservable } from "mobx"; import { action, computed, observable, reaction, makeObservable } from "mobx";
import { dockStore } from "../renderer/components/dock/dock.store"; import { dockStore } from "../renderer/components/dock/dock.store";
import { autobind } from "../renderer/utils"; import { boundMethod } from "../renderer/utils";
export class SearchStore { export class SearchStore {
/** /**
@ -108,12 +108,12 @@ export class SearchStore {
return prev; return prev;
} }
@autobind() @boundMethod
public setNextOverlayActive(): void { public setNextOverlayActive(): void {
this.activeOverlayIndex = this.getNextOverlay(true); this.activeOverlayIndex = this.getNextOverlay(true);
} }
@autobind() @boundMethod
public setPrevOverlayActive(): void { public setPrevOverlayActive(): void {
this.activeOverlayIndex = this.getPrevOverlay(true); this.activeOverlayIndex = this.getPrevOverlay(true);
} }
@ -139,7 +139,7 @@ export class SearchStore {
* @param line Index of the line where overlay is located * @param line Index of the line where overlay is located
* @param occurrence Number of the overlay within one line * @param occurrence Number of the overlay within one line
*/ */
@autobind() @boundMethod
public isActiveOverlay(line: number, occurrence: number): boolean { public isActiveOverlay(line: number, occurrence: number): boolean {
const firstLineIndex = this.occurrences.findIndex(item => item === line); const firstLineIndex = this.occurrences.findIndex(item => item === line);

13
src/common/utils/autobind.ts
View File

@ -1,8 +1,8 @@
// Automatically bind methods to their class instance import {boundMethod, boundClass} from "autobind-decorator";
// API: https://github.com/sindresorhus/auto-bind
import autoBindClass, { Options } from "auto-bind"; import autoBindClass, { Options } from "auto-bind";
import autoBindReactClass from "auto-bind/react"; import autoBindReactClass from "auto-bind/react";
// Automatically bind methods to their class instance
export function autoBind<T extends object>(obj: T, opts?: Options): T { export function autoBind<T extends object>(obj: T, opts?: Options): T {
if ("componentWillUnmount" in obj) { if ("componentWillUnmount" in obj) {
return autoBindReactClass(obj as any, opts); return autoBindReactClass(obj as any, opts);
@ -11,6 +11,9 @@ export function autoBind<T extends object>(obj: T, opts?: Options): T {
return autoBindClass(obj, opts); return autoBindClass(obj, opts);
} }
export function autobind(): any { // Class/method decorators
return (): void => undefined; // noop // Note: @boundClass doesn't work with mobx-6.x/@action decorator
} export {
boundClass,
boundMethod,
};

4
src/renderer/api/terminal-api.ts
View File

@ -1,5 +1,5 @@
import { stringify } from "querystring"; import { stringify } from "querystring";
import { autobind, base64, EventEmitter } from "../utils"; import { boundMethod, base64, EventEmitter } from "../utils";
import { WebSocketApi } from "./websocket-api"; import { WebSocketApi } from "./websocket-api";
import isEqual from "lodash/isEqual"; import isEqual from "lodash/isEqual";
import { isDevelopment } from "../../common/vars"; import { isDevelopment } from "../../common/vars";
@ -85,7 +85,7 @@ export class TerminalApi extends WebSocketApi {
this.onReady.removeAllListeners(); this.onReady.removeAllListeners();
} }
@autobind() @boundMethod
protected _onReady(data: string) { protected _onReady(data: string) {
if (!data) return; if (!data) return;
this.isReady = true; this.isReady = true;

6
src/renderer/components/+apps-helm-charts/helm-chart-details.tsx
View File

@ -5,7 +5,7 @@ import { getChartDetails, HelmChart } from "../../api/endpoints/helm-charts.api"
import { observable, autorun, makeObservable } from "mobx"; import { observable, autorun, makeObservable } from "mobx";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { Drawer, DrawerItem } from "../drawer"; import { Drawer, DrawerItem } from "../drawer";
import { autobind, stopPropagation } from "../../utils"; import { boundMethod, stopPropagation } from "../../utils";
import { MarkdownViewer } from "../markdown-viewer"; import { MarkdownViewer } from "../markdown-viewer";
import { Spinner } from "../spinner"; import { Spinner } from "../spinner";
import { Button } from "../button"; import { Button } from "../button";
@ -51,7 +51,7 @@ export class HelmChartDetails extends Component<Props> {
}); });
}); });
@autobind() @boundMethod
async onVersionChange({ value: version }: SelectOption<string>) { async onVersionChange({ value: version }: SelectOption<string>) {
this.selectedChart = this.chartVersions.find(chart => chart.version === version); this.selectedChart = this.chartVersions.find(chart => chart.version === version);
this.readme = null; this.readme = null;
@ -68,7 +68,7 @@ export class HelmChartDetails extends Component<Props> {
} }
} }
@autobind() @boundMethod
install() { install() {
createInstallChartTab(this.selectedChart); createInstallChartTab(this.selectedChart);
this.props.hideDetails(); this.props.hideDetails();

8
src/renderer/components/+apps-releases/release-menu.tsx
View File

@ -1,6 +1,6 @@
import React from "react"; import React from "react";
import { HelmRelease } from "../../api/endpoints/helm-releases.api"; import { HelmRelease } from "../../api/endpoints/helm-releases.api";
import { autobind, cssNames } from "../../utils"; import { boundMethod, cssNames } from "../../utils";
import { releaseStore } from "./release.store"; import { releaseStore } from "./release.store";
import { MenuActions, MenuActionsProps } from "../menu/menu-actions"; import { MenuActions, MenuActionsProps } from "../menu/menu-actions";
import { MenuItem } from "../menu"; import { MenuItem } from "../menu";
@ -14,12 +14,12 @@ interface Props extends MenuActionsProps {
} }
export class HelmReleaseMenu extends React.Component<Props> { export class HelmReleaseMenu extends React.Component<Props> {
@autobind() @boundMethod
remove() { remove() {
return releaseStore.remove(this.props.release); return releaseStore.remove(this.props.release);
} }
@autobind() @boundMethod
upgrade() { upgrade() {
const { release, hideDetails } = this.props; const { release, hideDetails } = this.props;
@ -27,7 +27,7 @@ export class HelmReleaseMenu extends React.Component<Props> {
hideDetails && hideDetails(); hideDetails && hideDetails();
} }
@autobind() @boundMethod
rollback() { rollback() {
ReleaseRollbackDialog.open(this.props.release); ReleaseRollbackDialog.open(this.props.release);
} }

8
src/renderer/components/+catalog/catalog-add-button.tsx
View File

@ -4,7 +4,7 @@ import { SpeedDial, SpeedDialAction } from "@material-ui/lab";
import { Icon } from "../icon"; import { Icon } from "../icon";
import { disposeOnUnmount, observer } from "mobx-react"; import { disposeOnUnmount, observer } from "mobx-react";
import { observable, reaction, makeObservable } from "mobx"; import { observable, reaction, makeObservable } from "mobx";
import { autobind } from "../../../common/utils"; import { boundMethod } from "../../../common/utils";
import { CatalogCategory, CatalogEntityAddMenuContext, CatalogEntityContextMenu } from "../../api/catalog-entity"; import { CatalogCategory, CatalogEntityAddMenuContext, CatalogEntityContextMenu } from "../../api/catalog-entity";
import { EventEmitter } from "events"; import { EventEmitter } from "events";
import { navigate } from "../../navigation"; import { navigate } from "../../navigation";
@ -40,17 +40,17 @@ export class CatalogAddButton extends React.Component<CatalogAddButtonProps> {
]); ]);
} }
@autobind() @boundMethod
onOpen() { onOpen() {
this.isOpen = true; this.isOpen = true;
} }
@autobind() @boundMethod
onClose() { onClose() {
this.isOpen = false; this.isOpen = false;
} }
@autobind() @boundMethod
onButtonClick() { onButtonClick() {
if (this.menuItems.length == 1) { if (this.menuItems.length == 1) {
this.menuItems[0].onClick(); this.menuItems[0].onClick();

4
src/renderer/components/+catalog/catalog.tsx
View File

@ -12,7 +12,7 @@ import { Icon } from "../icon";
import { CatalogEntityContextMenu, CatalogEntityContextMenuContext, catalogEntityRunContext } from "../../api/catalog-entity"; import { CatalogEntityContextMenu, CatalogEntityContextMenuContext, catalogEntityRunContext } from "../../api/catalog-entity";
import { Badge } from "../badge"; import { Badge } from "../badge";
import { HotbarStore } from "../../../common/hotbar-store"; import { HotbarStore } from "../../../common/hotbar-store";
import { autobind } from "../../utils"; import { boundMethod } from "../../utils";
import { ConfirmDialog } from "../confirm-dialog"; import { ConfirmDialog } from "../confirm-dialog";
import { Tab, Tabs } from "../tabs"; import { Tab, Tabs } from "../tabs";
import { catalogCategoryRegistry } from "../../../common/catalog"; import { catalogCategoryRegistry } from "../../../common/catalog";
@ -114,7 +114,7 @@ export class Catalog extends React.Component {
); );
} }
@autobind() @boundMethod
renderItemMenu(item: CatalogEntityItem) { renderItemMenu(item: CatalogEntityItem) {
const menuItems = this.contextMenu.menuItems.filter((menuItem) => !menuItem.onlyVisibleForSource || menuItem.onlyVisibleForSource === item.entity.metadata.source); const menuItems = this.contextMenu.menuItems.filter((menuItem) => !menuItem.onlyVisibleForSource || menuItem.onlyVisibleForSource === item.entity.metadata.source);

4
src/renderer/components/+cluster/cluster-issues.tsx
View File

@ -8,7 +8,7 @@ import { SubHeader } from "../layout/sub-header";
import { Table, TableCell, TableHead, TableRow } from "../table"; import { Table, TableCell, TableHead, TableRow } from "../table";
import { nodesStore } from "../+nodes/nodes.store"; import { nodesStore } from "../+nodes/nodes.store";
import { eventStore } from "../+events/event.store"; import { eventStore } from "../+events/event.store";
import { autobind, cssNames, prevDefault } from "../../utils"; import { boundMethod, cssNames, prevDefault } from "../../utils";
import { ItemObject } from "../../item.store"; import { ItemObject } from "../../item.store";
import { Spinner } from "../spinner"; import { Spinner } from "../spinner";
import { ThemeStore } from "../../theme.store"; import { ThemeStore } from "../../theme.store";
@ -87,7 +87,7 @@ export class ClusterIssues extends React.Component<Props> {
return warnings; return warnings;
} }
@autobind() @boundMethod
getTableRow(uid: string) { getTableRow(uid: string) {
const { warnings } = this; const { warnings } = this;
const warning = warnings.find(warn => warn.getId() == uid); const warning = warnings.find(warn => warn.getId() == uid);

4
src/renderer/components/+extensions/extensions.tsx
View File

@ -6,7 +6,7 @@ import { disposeOnUnmount, observer } from "mobx-react";
import os from "os"; import os from "os";
import path from "path"; import path from "path";
import React from "react"; import React from "react";
import { autobind, disposer, Disposer, downloadFile, downloadJson, ExtendableDisposer, extractTar, listTarEntries, noop, readFileFromTar } from "../../../common/utils"; import { boundMethod, disposer, Disposer, downloadFile, downloadJson, ExtendableDisposer, extractTar, listTarEntries, noop, readFileFromTar } from "../../../common/utils";
import { docsUrl } from "../../../common/vars"; import { docsUrl } from "../../../common/vars";
import { ExtensionDiscovery, InstalledExtension, manifestFilename } from "../../../extensions/extension-discovery"; import { ExtensionDiscovery, InstalledExtension, manifestFilename } from "../../../extensions/extension-discovery";
import { ExtensionLoader } from "../../../extensions/extension-loader"; import { ExtensionLoader } from "../../../extensions/extension-loader";
@ -519,7 +519,7 @@ export class Extensions extends React.Component {
); );
} }
@autobind() @boundMethod
renderExtension(extension: InstalledExtension) { renderExtension(extension: InstalledExtension) {
const { id, isEnabled, manifest } = extension; const { id, isEnabled, manifest } = extension;
const { name, description, version } = manifest; const { name, description, version } = manifest;

8
src/renderer/components/+network-endpoints/endpoint-subset-list.tsx
View File

@ -4,7 +4,7 @@ import React from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { EndpointSubset, Endpoint, EndpointAddress} from "../../api/endpoints"; import { EndpointSubset, Endpoint, EndpointAddress} from "../../api/endpoints";
import { Table, TableCell, TableHead, TableRow } from "../table"; import { Table, TableCell, TableHead, TableRow } from "../table";
import { autobind } from "../../utils"; import { boundMethod } from "../../utils";
import { lookupApiLink } from "../../api/kube-api"; import { lookupApiLink } from "../../api/kube-api";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import { getDetailsUrl } from "../kube-object"; import { getDetailsUrl } from "../kube-object";
@ -24,7 +24,7 @@ export class EndpointSubsetList extends React.Component<Props> {
return this.renderAddressTableRow(address); return this.renderAddressTableRow(address);
} }
@autobind() @boundMethod
getNotReadyAddressTableRow(ip: string) { getNotReadyAddressTableRow(ip: string) {
const { subset} = this.props; const { subset} = this.props;
const address = subset.getNotReadyAddresses().find(address => address.getId() == ip); const address = subset.getNotReadyAddresses().find(address => address.getId() == ip);
@ -32,7 +32,7 @@ export class EndpointSubsetList extends React.Component<Props> {
return this.renderAddressTableRow(address); return this.renderAddressTableRow(address);
} }
@autobind() @boundMethod
renderAddressTable(addresses: EndpointAddress[], virtual: boolean) { renderAddressTable(addresses: EndpointAddress[], virtual: boolean) {
return ( return (
<div> <div>
@ -58,7 +58,7 @@ export class EndpointSubsetList extends React.Component<Props> {
); );
} }
@autobind() @boundMethod
renderAddressTableRow(address: EndpointAddress) { renderAddressTableRow(address: EndpointAddress) {
const { endpoint } = this.props; const { endpoint } = this.props;

4
src/renderer/components/+storage-volumes/volume-details-list.tsx
View File

@ -3,7 +3,7 @@ import "./volume-details-list.scss";
import React from "react"; import React from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { PersistentVolume } from "../../api/endpoints/persistent-volume.api"; import { PersistentVolume } from "../../api/endpoints/persistent-volume.api";
import { autobind } from "../../../common/utils/autobind"; import { boundMethod } from "../../../common/utils/autobind";
import { TableRow } from "../table/table-row"; import { TableRow } from "../table/table-row";
import { cssNames, prevDefault } from "../../utils"; import { cssNames, prevDefault } from "../../utils";
import { showDetails } from "../kube-object/kube-object-details"; import { showDetails } from "../kube-object/kube-object-details";
@ -33,7 +33,7 @@ export class VolumeDetailsList extends React.Component<Props> {
[sortBy.status]: (volume: PersistentVolume) => volume.getStatus(), [sortBy.status]: (volume: PersistentVolume) => volume.getStatus(),
}; };
@autobind() @boundMethod
getTableRow(uid: string) { getTableRow(uid: string) {
const { persistentVolumes } = this.props; const { persistentVolumes } = this.props;
const volume = persistentVolumes.find(volume => volume.getId() === uid); const volume = persistentVolumes.find(volume => volume.getId() === uid);

4
src/renderer/components/+user-management-roles-bindings/role-binding-details.tsx
View File

@ -3,7 +3,7 @@ import "./role-binding-details.scss";
import React from "react"; import React from "react";
import { AddRemoveButtons } from "../add-remove-buttons"; import { AddRemoveButtons } from "../add-remove-buttons";
import { IRoleBindingSubject, RoleBinding } from "../../api/endpoints"; import { IRoleBindingSubject, RoleBinding } from "../../api/endpoints";
import { autobind, prevDefault } from "../../utils"; import { boundMethod, prevDefault } from "../../utils";
import { Table, TableCell, TableHead, TableRow } from "../table"; import { Table, TableCell, TableHead, TableRow } from "../table";
import { ConfirmDialog } from "../confirm-dialog"; import { ConfirmDialog } from "../confirm-dialog";
import { DrawerTitle } from "../drawer"; import { DrawerTitle } from "../drawer";
@ -47,7 +47,7 @@ export class RoleBindingDetails extends React.Component<Props> {
); );
} }
@autobind() @boundMethod
removeSelectedSubjects() { removeSelectedSubjects() {
const { object: roleBinding } = this.props; const { object: roleBinding } = this.props;
const { selectedSubjects } = this; const { selectedSubjects } = this;

4
src/renderer/components/+workloads-overview/overview-statuses.tsx
View File

@ -9,7 +9,7 @@ import { namespaceStore } from "../+namespaces/namespace.store";
import { NamespaceSelectFilter } from "../+namespaces/namespace-select-filter"; import { NamespaceSelectFilter } from "../+namespaces/namespace-select-filter";
import { isAllowedResource, KubeResource } from "../../../common/rbac"; import { isAllowedResource, KubeResource } from "../../../common/rbac";
import { ResourceNames } from "../../utils/rbac"; import { ResourceNames } from "../../utils/rbac";
import { autobind } from "../../utils"; import { boundMethod } from "../../utils";
const resources: KubeResource[] = [ const resources: KubeResource[] = [
"pods", "pods",
@ -23,7 +23,7 @@ const resources: KubeResource[] = [
@observer @observer
export class OverviewStatuses extends React.Component { export class OverviewStatuses extends React.Component {
@autobind() @boundMethod
renderWorkload(resource: KubeResource): React.ReactElement { renderWorkload(resource: KubeResource): React.ReactElement {
const store = workloadStores[resource]; const store = workloadStores[resource];
const items = store.getAllByNs(namespaceStore.contextNamespaces); const items = store.getAllByNs(namespaceStore.contextNamespaces);

4
src/renderer/components/+workloads-pods/pod-details-list.tsx
View File

@ -6,7 +6,7 @@ import { reaction, makeObservable } from "mobx";
import { disposeOnUnmount, observer } from "mobx-react"; import { disposeOnUnmount, observer } from "mobx-react";
import { podsStore } from "./pods.store"; import { podsStore } from "./pods.store";
import { Pod } from "../../api/endpoints"; import { Pod } from "../../api/endpoints";
import { autobind, bytesToUnits, cssNames, interval, prevDefault } from "../../utils"; import { boundMethod, bytesToUnits, cssNames, interval, prevDefault } from "../../utils";
import { LineProgress } from "../line-progress"; import { LineProgress } from "../line-progress";
import { KubeObject } from "../../api/kube-object"; import { KubeObject } from "../../api/kube-object";
import { Table, TableCell, TableHead, TableRow } from "../table"; import { Table, TableCell, TableHead, TableRow } from "../table";
@ -103,7 +103,7 @@ export class PodDetailsList extends React.Component<Props> {
); );
} }
@autobind() @boundMethod
getTableRow(uid: string) { getTableRow(uid: string) {
const { pods } = this.props; const { pods } = this.props;
const pod = pods.find(pod => pod.getId() == uid); const pod = pods.find(pod => pod.getId() == uid);

4
src/renderer/components/+workloads-pods/pod-details.tsx
View File

@ -8,7 +8,7 @@ import { autorun, observable, reaction, toJS, makeObservable } from "mobx";
import { IPodMetrics, nodesApi, Pod, pvcApi, configMapApi } from "../../api/endpoints"; import { IPodMetrics, nodesApi, Pod, pvcApi, configMapApi } from "../../api/endpoints";
import { DrawerItem, DrawerTitle } from "../drawer"; import { DrawerItem, DrawerTitle } from "../drawer";
import { Badge } from "../badge"; import { Badge } from "../badge";
import { autobind, cssNames, interval } from "../../utils"; import { boundMethod, cssNames, interval } from "../../utils";
import { PodDetailsContainer } from "./pod-details-container"; import { PodDetailsContainer } from "./pod-details-container";
import { PodDetailsAffinities } from "./pod-details-affinities"; import { PodDetailsAffinities } from "./pod-details-affinities";
import { PodDetailsTolerations } from "./pod-details-tolerations"; import { PodDetailsTolerations } from "./pod-details-tolerations";
@ -56,7 +56,7 @@ export class PodDetails extends React.Component<Props> {
podsStore.reset(); podsStore.reset();
} }
@autobind() @boundMethod
async loadMetrics() { async loadMetrics() {
const { object: pod } = this.props; const { object: pod } = this.props;

6
src/renderer/components/ace-editor/ace-editor.tsx
View File

@ -5,7 +5,7 @@ import "./ace-editor.scss";
import React from "react"; import React from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import AceBuild, { Ace } from "ace-builds"; import AceBuild, { Ace } from "ace-builds";
import { autobind, cssNames, noop } from "../../utils"; import { boundMethod, cssNames, noop } from "../../utils";
interface Props extends Partial<Ace.EditorOptions> { interface Props extends Partial<Ace.EditorOptions> {
className?: string; className?: string;
@ -128,7 +128,7 @@ export class AceEditor extends React.Component<Props, State> {
}); });
} }
@autobind() @boundMethod
onCursorPosChange() { onCursorPosChange() {
const { onCursorPosChange } = this.props; const { onCursorPosChange } = this.props;
@ -137,7 +137,7 @@ export class AceEditor extends React.Component<Props, State> {
} }
} }
@autobind() @boundMethod
onChange(delta: Ace.Delta) { onChange(delta: Ace.Delta) {
const { onChange } = this.props; const { onChange } = this.props;

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

@ -2,7 +2,7 @@ import "./animate.scss";
import React from "react"; import React from "react";
import { observable, reaction, makeObservable } from "mobx"; import { observable, reaction, makeObservable } from "mobx";
import { disposeOnUnmount, observer } from "mobx-react"; import { disposeOnUnmount, observer } from "mobx-react";
import { autobind, cssNames, noop } from "../../utils"; import { boundMethod, cssNames, noop } from "../../utils";
export type AnimateName = "opacity" | "slide-right" | "opacity-scale" | string; export type AnimateName = "opacity" | "slide-right" | "opacity-scale" | string;
@ -71,7 +71,7 @@ export class Animate extends React.Component<AnimateProps> {
this.statusClassName.leave = false; this.statusClassName.leave = false;
} }
@autobind() @boundMethod
onTransitionEnd(evt: React.TransitionEvent) { onTransitionEnd(evt: React.TransitionEvent) {
const { enter, leave } = this.statusClassName; const { enter, leave } = this.statusClassName;
const { onTransitionEnd } = this.contentElem.props; const { onTransitionEnd } = this.contentElem.props;

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

@ -1,6 +1,6 @@
import "./checkbox.scss"; import "./checkbox.scss";
import React from "react"; import React from "react";
import { autobind, cssNames } from "../../utils"; import { boundMethod, cssNames } from "../../utils";
export interface CheckboxProps<T = boolean> { export interface CheckboxProps<T = boolean> {
theme?: "dark" | "light"; theme?: "dark" | "light";
@ -15,7 +15,7 @@ export interface CheckboxProps<T = boolean> {
export class Checkbox extends React.PureComponent<CheckboxProps> { export class Checkbox extends React.PureComponent<CheckboxProps> {
private input: HTMLInputElement; private input: HTMLInputElement;
@autobind() @boundMethod
onChange(evt: React.ChangeEvent<HTMLInputElement>) { onChange(evt: React.ChangeEvent<HTMLInputElement>) {
if (this.props.onChange) { if (this.props.onChange) {
this.props.onChange(this.input.checked, evt); this.props.onChange(this.input.checked, evt);

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

@ -1,7 +1,7 @@
import "./clipboard.scss"; import "./clipboard.scss";
import React from "react"; import React from "react";
import { findDOMNode } from "react-dom"; import { findDOMNode } from "react-dom";
import { autobind } from "../../../common/utils"; import { boundMethod } from "../../../common/utils";
import { Notifications } from "../notifications"; import { Notifications } from "../notifications";
import { copyToClipboard } from "../../utils/copyToClipboard"; import { copyToClipboard } from "../../utils/copyToClipboard";
import logger from "../../../main/logger"; import logger from "../../../main/logger";
@ -33,7 +33,7 @@ export class Clipboard extends React.Component<CopyToClipboardProps> {
return React.Children.only(this.props.children) as React.ReactElement; return React.Children.only(this.props.children) as React.ReactElement;
} }
@autobind() @boundMethod
onClick(evt: React.MouseEvent) { onClick(evt: React.MouseEvent) {
if (this.rootReactElem.props.onClick) { if (this.rootReactElem.props.onClick) {
this.rootReactElem.props.onClick(evt); // pass event to children-root-element if any this.rootReactElem.props.onClick(evt); // pass event to children-root-element if any

4
src/renderer/components/cluster-settings/components/cluster-kubeconfig.tsx
View File

@ -2,7 +2,7 @@ import React from "react";
import { Cluster } from "../../../../main/cluster"; import { Cluster } from "../../../../main/cluster";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { SubTitle } from "../../layout/sub-title"; import { SubTitle } from "../../layout/sub-title";
import { autobind } from "../../../../common/utils"; import { boundMethod } from "../../../../common/utils";
import { shell } from "electron"; import { shell } from "electron";
interface Props { interface Props {
@ -12,7 +12,7 @@ interface Props {
@observer @observer
export class ClusterKubeconfig extends React.Component<Props> { export class ClusterKubeconfig extends React.Component<Props> {
@autobind() @boundMethod
openKubeconfig() { openKubeconfig() {
const { cluster } = this.props; const { cluster } = this.props;

4
src/renderer/components/cluster-settings/components/remove-cluster-button.tsx
View File

@ -2,7 +2,7 @@ import React from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { ClusterStore } from "../../../../common/cluster-store"; import { ClusterStore } from "../../../../common/cluster-store";
import { Cluster } from "../../../../main/cluster"; import { Cluster } from "../../../../main/cluster";
import { autobind } from "../../../utils"; import { boundMethod } from "../../../utils";
import { Button } from "../../button"; import { Button } from "../../button";
import { ConfirmDialog } from "../../confirm-dialog"; import { ConfirmDialog } from "../../confirm-dialog";
@ -12,7 +12,7 @@ interface Props {
@observer @observer
export class RemoveClusterButton extends React.Component<Props> { export class RemoveClusterButton extends React.Component<Props> {
@autobind() @boundMethod
confirmRemoveCluster() { confirmRemoveCluster() {
const { cluster } = this.props; const { cluster } = this.props;

4
src/renderer/components/dock/dock-tab.tsx
View File

@ -2,7 +2,7 @@ import "./dock-tab.scss";
import React from "react"; import React from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { autobind, cssNames, prevDefault } from "../../utils"; import { boundMethod, cssNames, prevDefault } from "../../utils";
import { dockStore, IDockTab } from "./dock.store"; import { dockStore, IDockTab } from "./dock.store";
import { Tab, TabProps } from "../tabs"; import { Tab, TabProps } from "../tabs";
import { Icon } from "../icon"; import { Icon } from "../icon";
@ -26,7 +26,7 @@ export class DockTab extends React.Component<DockTabProps> {
return this.props.value.id; return this.props.value.id;
} }
@autobind() @boundMethod
close() { close() {
dockStore.closeTab(this.tabId); dockStore.closeTab(this.tabId);
} }

14
src/renderer/components/dock/install-chart.tsx
View File

@ -7,7 +7,7 @@ import { dockStore, IDockTab } from "./dock.store";
import { InfoPanel } from "./info-panel"; import { InfoPanel } from "./info-panel";
import { Badge } from "../badge"; import { Badge } from "../badge";
import { NamespaceSelect } from "../+namespaces/namespace-select"; import { NamespaceSelect } from "../+namespaces/namespace-select";
import { autobind, prevDefault } from "../../utils"; import { boundMethod, prevDefault } from "../../utils";
import { IChartInstallData, installChartStore } from "./install-chart.store"; import { IChartInstallData, installChartStore } from "./install-chart.store";
import { Spinner } from "../spinner"; import { Spinner } from "../spinner";
import { Icon } from "../icon"; import { Icon } from "../icon";
@ -54,7 +54,7 @@ export class InstallChart extends Component<Props> {
return installChartStore.details.getData(this.tabId); return installChartStore.details.getData(this.tabId);
} }
@autobind() @boundMethod
viewRelease() { viewRelease() {
const { release } = this.releaseDetails; const { release } = this.releaseDetails;
@ -67,14 +67,14 @@ export class InstallChart extends Component<Props> {
dockStore.closeTab(this.tabId); dockStore.closeTab(this.tabId);
} }
@autobind() @boundMethod
save(data: Partial<IChartInstallData>) { save(data: Partial<IChartInstallData>) {
const chart = { ...this.chartData, ...data }; const chart = { ...this.chartData, ...data };
installChartStore.setData(this.tabId, chart); installChartStore.setData(this.tabId, chart);
} }
@autobind() @boundMethod
onVersionChange(option: SelectOption) { onVersionChange(option: SelectOption) {
const version = option.value; const version = option.value;
@ -82,18 +82,18 @@ export class InstallChart extends Component<Props> {
installChartStore.loadValues(this.tabId); installChartStore.loadValues(this.tabId);
} }
@autobind() @boundMethod
onValuesChange(values: string, error?: string) { onValuesChange(values: string, error?: string) {
this.error = error; this.error = error;
this.save({ values }); this.save({ values });
} }
@autobind() @boundMethod
onNamespaceChange(opt: SelectOption) { onNamespaceChange(opt: SelectOption) {
this.save({ namespace: opt.value }); this.save({ namespace: opt.value });
} }
@autobind() @boundMethod
onReleaseNameChange(name: string) { onReleaseNameChange(name: string) {
this.save({ releaseName: name }); this.save({ releaseName: name });
} }

6
src/renderer/components/dock/logs.tsx
View File

@ -3,7 +3,7 @@ import { observable, reaction, makeObservable } from "mobx";
import { disposeOnUnmount, observer } from "mobx-react"; import { disposeOnUnmount, observer } from "mobx-react";
import { searchStore } from "../../../common/search-store"; import { searchStore } from "../../../common/search-store";
import { autobind } from "../../utils"; import { boundMethod } from "../../utils";
import { IDockTab } from "./dock.store"; import { IDockTab } from "./dock.store";
import { InfoPanel } from "./info-panel"; import { InfoPanel } from "./info-panel";
import { LogResourceSelector } from "./log-resource-selector"; import { LogResourceSelector } from "./log-resource-selector";
@ -54,7 +54,7 @@ export class Logs extends React.Component<Props> {
* A function for various actions after search is happened * A function for various actions after search is happened
* @param query {string} A text from search field * @param query {string} A text from search field
*/ */
@autobind() @boundMethod
onSearch() { onSearch() {
this.toOverlay(); this.toOverlay();
} }
@ -62,7 +62,7 @@ export class Logs extends React.Component<Props> {
/** /**
* Scrolling to active overlay (search word highlight) * Scrolling to active overlay (search word highlight)
*/ */
@autobind() @boundMethod
toOverlay() { toOverlay() {
const { activeOverlayLine } = searchStore; const { activeOverlayLine } = searchStore;

4
src/renderer/components/dock/terminal-tab.tsx
View File

@ -2,7 +2,7 @@ import "./terminal-tab.scss";
import React from "react"; import React from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { autobind, cssNames } from "../../utils"; import { boundMethod, cssNames } from "../../utils";
import { DockTab, DockTabProps } from "./dock-tab"; import { DockTab, DockTabProps } from "./dock-tab";
import { Icon } from "../icon"; import { Icon } from "../icon";
import { terminalStore } from "./terminal.store"; import { terminalStore } from "./terminal.store";
@ -33,7 +33,7 @@ export class TerminalTab extends React.Component<Props> {
return terminalStore.isDisconnected(this.tabId); return terminalStore.isDisconnected(this.tabId);
} }
@autobind() @boundMethod
reconnect() { reconnect() {
terminalStore.reconnect(this.tabId); terminalStore.reconnect(this.tabId);
} }

4
src/renderer/components/dock/terminal.ts
View File

@ -5,7 +5,7 @@ import { FitAddon } from "xterm-addon-fit";
import { dockStore, TabId } from "./dock.store"; import { dockStore, TabId } from "./dock.store";
import { TerminalApi } from "../../api/terminal-api"; import { TerminalApi } from "../../api/terminal-api";
import { ThemeStore } from "../../theme.store"; import { ThemeStore } from "../../theme.store";
import { autobind } from "../../utils"; import { boundMethod } from "../../utils";
import { isMac } from "../../../common/vars"; import { isMac } from "../../../common/vars";
import { camelCase } from "lodash"; import { camelCase } from "lodash";
@ -36,7 +36,7 @@ export class Terminal {
public scrollPos = 0; public scrollPos = 0;
public disposers: Function[] = []; public disposers: Function[] = [];
@autobind() @boundMethod
protected setTheme(colors: Record<string, string>) { protected setTheme(colors: Record<string, string>) {
// Replacing keys stored in styles to format accepted by terminal // Replacing keys stored in styles to format accepted by terminal
// E.g. terminalBrightBlack -> brightBlack // E.g. terminalBrightBlack -> brightBlack

4
src/renderer/components/editable-list/editable-list.tsx
View File

@ -5,7 +5,7 @@ import { Icon } from "../icon";
import { Input } from "../input"; import { Input } from "../input";
import { observable, makeObservable } from "mobx"; import { observable, makeObservable } from "mobx";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { autobind } from "../../utils"; import { boundMethod } from "../../utils";
export interface Props<T> { export interface Props<T> {
items: T[], items: T[],
@ -33,7 +33,7 @@ export class EditableList<T> extends React.Component<Props<T>> {
makeObservable(this); makeObservable(this);
} }
@autobind() @boundMethod
onSubmit(val: string) { onSubmit(val: string) {
const { add } = this.props; const { add } = this.props;

6
src/renderer/components/icon/icon.tsx
View File

@ -4,7 +4,7 @@ import React, { ReactNode } from "react";
import { findDOMNode } from "react-dom"; import { findDOMNode } from "react-dom";
import { NavLink } from "react-router-dom"; import { NavLink } from "react-router-dom";
import { LocationDescriptor } from "history"; import { LocationDescriptor } from "history";
import { autobind, cssNames } from "../../utils"; import { boundMethod, cssNames } from "../../utils";
import { TooltipDecoratorProps, withTooltip } from "../tooltip"; import { TooltipDecoratorProps, withTooltip } from "../tooltip";
import isNumber from "lodash/isNumber"; import isNumber from "lodash/isNumber";
@ -36,7 +36,7 @@ export class Icon extends React.PureComponent<IconProps> {
return interactive ?? !!(onClick || href || link); return interactive ?? !!(onClick || href || link);
} }
@autobind() @boundMethod
onClick(evt: React.MouseEvent) { onClick(evt: React.MouseEvent) {
if (this.props.disabled) { if (this.props.disabled) {
return; return;
@ -47,7 +47,7 @@ export class Icon extends React.PureComponent<IconProps> {
} }
} }
@autobind() @boundMethod
onKeyDown(evt: React.KeyboardEvent<any>) { onKeyDown(evt: React.KeyboardEvent<any>) {
switch (evt.nativeEvent.code) { switch (evt.nativeEvent.code) {
case "Space": case "Space":

10
src/renderer/components/input/drop-file-input.tsx
View File

@ -1,6 +1,6 @@
import "./drop-file-input.scss"; import "./drop-file-input.scss";
import React from "react"; import React from "react";
import { autobind, cssNames, IClassName } from "../../utils"; import { boundMethod, cssNames, IClassName } from "../../utils";
import { observable, makeObservable } from "mobx"; import { observable, makeObservable } from "mobx";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import logger from "../../../main/logger"; import logger from "../../../main/logger";
@ -24,17 +24,17 @@ export class DropFileInput<T extends HTMLElement = any> extends React.Component<
makeObservable(this); makeObservable(this);
} }
@autobind() @boundMethod
onDragEnter() { onDragEnter() {
this.dropAreaActive = true; this.dropAreaActive = true;
} }
@autobind() @boundMethod
onDragLeave() { onDragLeave() {
this.dropAreaActive = false; this.dropAreaActive = false;
} }
@autobind() @boundMethod
onDragOver(evt: React.DragEvent<T>) { onDragOver(evt: React.DragEvent<T>) {
if (this.props.onDragOver) { if (this.props.onDragOver) {
this.props.onDragOver(evt); this.props.onDragOver(evt);
@ -43,7 +43,7 @@ export class DropFileInput<T extends HTMLElement = any> extends React.Component<
evt.dataTransfer.dropEffect = "move"; evt.dataTransfer.dropEffect = "move";
} }
@autobind() @boundMethod
onDrop(evt: React.DragEvent<T>) { onDrop(evt: React.DragEvent<T>) {
if (this.props.onDrop) { if (this.props.onDrop) {
this.props.onDrop(evt); this.props.onDrop(evt);

12
src/renderer/components/input/input.tsx
View File

@ -1,7 +1,7 @@
import "./input.scss"; import "./input.scss";
import React, { DOMAttributes, InputHTMLAttributes, TextareaHTMLAttributes } from "react"; import React, { DOMAttributes, InputHTMLAttributes, TextareaHTMLAttributes } from "react";
import { autobind, cssNames, debouncePromise, getRandId } from "../../utils"; import { boundMethod, cssNames, debouncePromise, getRandId } from "../../utils";
import { Icon } from "../icon"; import { Icon } from "../icon";
import { Tooltip, TooltipProps } from "../tooltip"; import { Tooltip, TooltipProps } from "../tooltip";
import * as Validators from "./input_validators"; import * as Validators from "./input_validators";
@ -195,7 +195,7 @@ export class Input extends React.Component<InputProps, State> {
this.setState({ dirty }); this.setState({ dirty });
} }
@autobind() @boundMethod
onFocus(evt: React.FocusEvent<InputElement>) { onFocus(evt: React.FocusEvent<InputElement>) {
const { onFocus, autoSelectOnFocus } = this.props; const { onFocus, autoSelectOnFocus } = this.props;
@ -204,7 +204,7 @@ export class Input extends React.Component<InputProps, State> {
this.setState({ focused: true }); this.setState({ focused: true });
} }
@autobind() @boundMethod
onBlur(evt: React.FocusEvent<InputElement>) { onBlur(evt: React.FocusEvent<InputElement>) {
const { onBlur } = this.props; const { onBlur } = this.props;
@ -213,7 +213,7 @@ export class Input extends React.Component<InputProps, State> {
this.setState({ focused: false }); this.setState({ focused: false });
} }
@autobind() @boundMethod
onChange(evt: React.ChangeEvent<any>) { onChange(evt: React.ChangeEvent<any>) {
if (this.props.onChange) { if (this.props.onChange) {
this.props.onChange(evt.currentTarget.value, evt); this.props.onChange(evt.currentTarget.value, evt);
@ -232,7 +232,7 @@ export class Input extends React.Component<InputProps, State> {
} }
} }
@autobind() @boundMethod
onKeyDown(evt: React.KeyboardEvent<any>) { onKeyDown(evt: React.KeyboardEvent<any>) {
const modified = evt.shiftKey || evt.metaKey || evt.altKey || evt.ctrlKey; const modified = evt.shiftKey || evt.metaKey || evt.altKey || evt.ctrlKey;
@ -281,7 +281,7 @@ export class Input extends React.Component<InputProps, State> {
} }
} }
@autobind() @boundMethod
bindRef(elem: InputElement) { bindRef(elem: InputElement) {
this.input = elem; this.input = elem;
} }

8
src/renderer/components/input/search-input.tsx
View File

@ -2,7 +2,7 @@ import "./search-input.scss";
import React, { createRef } from "react"; import React, { createRef } from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { autobind, cssNames } from "../../utils"; import { boundMethod, cssNames } from "../../utils";
import { Icon } from "../icon"; import { Icon } from "../icon";
import { Input, InputProps } from "./input"; import { Input, InputProps } from "./input";
@ -37,7 +37,7 @@ export class SearchInput extends React.Component<Props> {
window.removeEventListener("keydown", this.onGlobalKey); window.removeEventListener("keydown", this.onGlobalKey);
} }
@autobind() @boundMethod
onGlobalKey(evt: KeyboardEvent) { onGlobalKey(evt: KeyboardEvent) {
const meta = evt.metaKey || evt.ctrlKey; const meta = evt.metaKey || evt.ctrlKey;
@ -46,7 +46,7 @@ export class SearchInput extends React.Component<Props> {
} }
} }
@autobind() @boundMethod
onKeyDown(evt: React.KeyboardEvent<any>) { onKeyDown(evt: React.KeyboardEvent<any>) {
if (this.props.onKeyDown) { if (this.props.onKeyDown) {
this.props.onKeyDown(evt); this.props.onKeyDown(evt);
@ -60,7 +60,7 @@ export class SearchInput extends React.Component<Props> {
} }
} }
@autobind() @boundMethod
clear() { clear() {
if (this.props.onClear) { if (this.props.onClear) {
this.props.onClear(); this.props.onClear();

8
src/renderer/components/item-object-list/item-list-layout.tsx
View File

@ -6,7 +6,7 @@ import { computed, makeObservable } from "mobx";
import { disposeOnUnmount, observer } from "mobx-react"; import { disposeOnUnmount, observer } from "mobx-react";
import { ConfirmDialog, ConfirmDialogParams } from "../confirm-dialog"; import { ConfirmDialog, ConfirmDialogParams } from "../confirm-dialog";
import { Table, TableCell, TableCellProps, TableHead, TableProps, TableRow, TableRowProps, TableSortCallback } from "../table"; import { Table, TableCell, TableCellProps, TableHead, TableProps, TableRow, TableRowProps, TableSortCallback } from "../table";
import { autobind, createStorage, cssNames, IClassName, isReactNode, noop, ObservableToggleSet, prevDefault, stopPropagation } from "../../utils"; import { boundMethod, createStorage, cssNames, IClassName, isReactNode, noop, ObservableToggleSet, prevDefault, stopPropagation } from "../../utils";
import { AddRemoveButtons, AddRemoveButtonsProps } from "../add-remove-buttons"; import { AddRemoveButtons, AddRemoveButtonsProps } from "../add-remove-buttons";
import { NoItems } from "../no-items"; import { NoItems } from "../no-items";
import { Spinner } from "../spinner"; import { Spinner } from "../spinner";
@ -221,7 +221,7 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
return this.applyFilters(filterItems.concat(this.props.filterItems), items); return this.applyFilters(filterItems.concat(this.props.filterItems), items);
} }
@autobind() @boundMethod
getRow(uid: string) { getRow(uid: string) {
const { const {
isSelectable, renderTableHeader, renderTableContents, renderItemMenu, isSelectable, renderTableHeader, renderTableContents, renderItemMenu,
@ -274,7 +274,7 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
); );
} }
@autobind() @boundMethod
removeItemsDialog() { removeItemsDialog() {
const { customizeRemoveDialog, store } = this.props; const { customizeRemoveDialog, store } = this.props;
const { selectedItems, removeSelectedItems } = store; const { selectedItems, removeSelectedItems } = store;
@ -294,7 +294,7 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps> {
}); });
} }
@autobind() @boundMethod
toggleFilters() { toggleFilters() {
this.showFilters = !this.showFilters; this.showFilters = !this.showFilters;
} }

8
src/renderer/components/kube-object/kube-object-menu.tsx
View File

@ -1,5 +1,5 @@
import React from "react"; import React from "react";
import { autobind, cssNames } from "../../utils"; import { boundMethod, cssNames } from "../../utils";
import { KubeObject } from "../../api/kube-object"; import { KubeObject } from "../../api/kube-object";
import { editResourceTab } from "../dock/edit-resource.store"; import { editResourceTab } from "../dock/edit-resource.store";
import { MenuActions, MenuActionsProps } from "../menu/menu-actions"; import { MenuActions, MenuActionsProps } from "../menu/menu-actions";
@ -34,13 +34,13 @@ export class KubeObjectMenu<T extends KubeObject> extends React.Component<KubeOb
return removable !== undefined ? removable : !!(this.store && this.store.remove); return removable !== undefined ? removable : !!(this.store && this.store.remove);
} }
@autobind() @boundMethod
async update() { async update() {
hideDetails(); hideDetails();
editResourceTab(this.props.object); editResourceTab(this.props.object);
} }
@autobind() @boundMethod
async remove() { async remove() {
hideDetails(); hideDetails();
const { object, removeAction } = this.props; const { object, removeAction } = this.props;
@ -49,7 +49,7 @@ export class KubeObjectMenu<T extends KubeObject> extends React.Component<KubeOb
else await this.store.remove(object); else await this.store.remove(object);
} }
@autobind() @boundMethod
renderRemoveMessage() { renderRemoveMessage() {
const { object } = this.props; const { object } = this.props;

4
src/renderer/components/layout/page-layout.tsx
View File

@ -2,7 +2,7 @@ import "./page-layout.scss";
import React from "react"; import React from "react";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { autobind, cssNames, IClassName } from "../../utils"; import { boundMethod, cssNames, IClassName } from "../../utils";
import { navigation } from "../../navigation"; import { navigation } from "../../navigation";
import { Icon } from "../icon"; import { Icon } from "../icon";
@ -25,7 +25,7 @@ const defaultProps: Partial<PageLayoutProps> = {
export class PageLayout extends React.Component<PageLayoutProps> { export class PageLayout extends React.Component<PageLayoutProps> {
static defaultProps = defaultProps as object; static defaultProps = defaultProps as object;
@autobind() @boundMethod
back(evt?: React.MouseEvent | KeyboardEvent) { back(evt?: React.MouseEvent | KeyboardEvent) {
if (this.props.back) { if (this.props.back) {
this.props.back(evt); this.props.back(evt);

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

@ -3,7 +3,7 @@ import "./menu-actions.scss";
import React, { isValidElement } from "react"; import React, { isValidElement } from "react";
import { observable, makeObservable } from "mobx"; import { observable, makeObservable } from "mobx";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { autobind, cssNames } from "../../utils"; import { boundMethod, cssNames } from "../../utils";
import { ConfirmDialog } from "../confirm-dialog"; import { ConfirmDialog } from "../confirm-dialog";
import { Icon, IconProps } from "../icon"; import { Icon, IconProps } from "../icon";
import { Menu, MenuItem, MenuProps } from "../menu"; import { Menu, MenuItem, MenuProps } from "../menu";
@ -43,7 +43,7 @@ export class MenuActions extends React.Component<MenuActionsProps> {
makeObservable(this); makeObservable(this);
} }
@autobind() @boundMethod
remove() { remove() {
const { removeAction } = this.props; const { removeAction } = this.props;
let { removeConfirmationMessage } = this.props; let { removeConfirmationMessage } = this.props;

6
src/renderer/components/select/select.tsx
View File

@ -5,7 +5,7 @@ import "./select.scss";
import React, { ReactNode } from "react"; import React, { ReactNode } from "react";
import { computed, makeObservable } from "mobx"; import { computed, makeObservable } from "mobx";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { autobind, cssNames } from "../../utils"; import { boundMethod, cssNames } from "../../utils";
import ReactSelect, { ActionMeta, components, Props as ReactSelectProps, Styles } from "react-select"; import ReactSelect, { ActionMeta, components, Props as ReactSelectProps, Styles } from "react-select";
import Creatable, { CreatableProps } from "react-select/creatable"; import Creatable, { CreatableProps } from "react-select/creatable";
import { ThemeStore } from "../../theme.store"; import { ThemeStore } from "../../theme.store";
@ -85,14 +85,14 @@ export class Select extends React.Component<SelectProps> {
return options as SelectOption[]; return options as SelectOption[];
} }
@autobind() @boundMethod
onChange(value: SelectOption, meta: ActionMeta<any>) { onChange(value: SelectOption, meta: ActionMeta<any>) {
if (this.props.onChange) { if (this.props.onChange) {
this.props.onChange(value, meta); this.props.onChange(value, meta);
} }
} }
@autobind() @boundMethod
onKeyDown(evt: React.KeyboardEvent<HTMLElement>) { onKeyDown(evt: React.KeyboardEvent<HTMLElement>) {
if (this.props.onKeyDown) { if (this.props.onKeyDown) {
this.props.onKeyDown(evt); this.props.onKeyDown(evt);

4
src/renderer/components/table/table-cell.tsx
View File

@ -2,7 +2,7 @@ import "./table-cell.scss";
import type { TableSortBy, TableSortParams } from "./table"; import type { TableSortBy, TableSortParams } from "./table";
import React, { ReactNode } from "react"; import React, { ReactNode } from "react";
import { autobind, cssNames, displayBooleans } from "../../utils"; import { boundMethod, cssNames, displayBooleans } from "../../utils";
import { Icon } from "../icon"; import { Icon } from "../icon";
import { Checkbox } from "../checkbox"; import { Checkbox } from "../checkbox";
@ -23,7 +23,7 @@ export interface TableCellProps extends React.DOMAttributes<HTMLDivElement> {
} }
export class TableCell extends React.Component<TableCellProps> { export class TableCell extends React.Component<TableCellProps> {
@autobind() @boundMethod
onClick(evt: React.MouseEvent<HTMLDivElement>) { onClick(evt: React.MouseEvent<HTMLDivElement>) {
if (this.props.onClick) { if (this.props.onClick) {
this.props.onClick(evt); this.props.onClick(evt);

6
src/renderer/components/table/table.tsx
View File

@ -3,7 +3,7 @@ import "./table.scss";
import React from "react"; import React from "react";
import { orderBy } from "lodash"; import { orderBy } from "lodash";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { autobind, cssNames, noop } from "../../utils"; import { boundMethod, cssNames, noop } from "../../utils";
import { TableRow, TableRowElem, TableRowProps } from "./table-row"; import { TableRow, TableRowElem, TableRowProps } from "./table-row";
import { TableHead, TableHeadElem, TableHeadProps } from "./table-head"; import { TableHead, TableHeadElem, TableHeadProps } from "./table-head";
import { TableCellElem } from "./table-cell"; import { TableCellElem } from "./table-cell";
@ -120,7 +120,7 @@ export class Table extends React.Component<TableProps> {
return orderBy(items, sortingCallback, order as any); return orderBy(items, sortingCallback, order as any);
} }
@autobind() @boundMethod
protected onSort({ sortBy, orderBy }: TableSortParams) { protected onSort({ sortBy, orderBy }: TableSortParams) {
setSortParams(this.props.tableId, { sortBy, orderBy }); setSortParams(this.props.tableId, { sortBy, orderBy });
const { sortSyncWithUrl, onSort } = this.props; const { sortSyncWithUrl, onSort } = this.props;
@ -135,7 +135,7 @@ export class Table extends React.Component<TableProps> {
} }
} }
@autobind() @boundMethod
sort(colName: TableSortBy) { sort(colName: TableSortBy) {
const { sortBy, orderBy } = this.sortParams; const { sortBy, orderBy } = this.sortParams;
const sameColumn = sortBy == colName; const sameColumn = sortBy == colName;

12
src/renderer/components/tabs/tabs.tsx
View File

@ -1,6 +1,6 @@
import "./tabs.scss"; import "./tabs.scss";
import React, { DOMAttributes } from "react"; import React, { DOMAttributes } from "react";
import { autobind, cssNames } from "../../utils"; import { boundMethod, cssNames } from "../../utils";
import { Icon } from "../icon"; import { Icon } from "../icon";
const TabsContext = React.createContext<TabsContextValue>({}); const TabsContext = React.createContext<TabsContextValue>({});
@ -24,7 +24,7 @@ export interface TabsProps<D = any> extends TabsContextValue<D>, Omit<DOMAttribu
export class Tabs extends React.PureComponent<TabsProps> { export class Tabs extends React.PureComponent<TabsProps> {
public elem: HTMLElement; public elem: HTMLElement;
@autobind() @boundMethod
protected bindRef(elem: HTMLElement) { protected bindRef(elem: HTMLElement) {
this.elem = elem; this.elem = elem;
} }
@ -82,7 +82,7 @@ export class Tab extends React.PureComponent<TabProps> {
}); });
} }
@autobind() @boundMethod
onClick(evt: React.MouseEvent<HTMLElement>) { onClick(evt: React.MouseEvent<HTMLElement>) {
const { value, active, disabled, onClick } = this.props; const { value, active, disabled, onClick } = this.props;
const { onChange } = this.context; const { onChange } = this.context;
@ -92,7 +92,7 @@ export class Tab extends React.PureComponent<TabProps> {
if (onChange) onChange(value); if (onChange) onChange(value);
} }
@autobind() @boundMethod
onFocus(evt: React.FocusEvent<HTMLElement>) { onFocus(evt: React.FocusEvent<HTMLElement>) {
const { onFocus } = this.props; const { onFocus } = this.props;
@ -100,7 +100,7 @@ export class Tab extends React.PureComponent<TabProps> {
this.scrollIntoView(); this.scrollIntoView();
} }
@autobind() @boundMethod
onKeyDown(evt: React.KeyboardEvent<HTMLElement>) { onKeyDown(evt: React.KeyboardEvent<HTMLElement>) {
const ENTER_KEY = evt.keyCode === 13; const ENTER_KEY = evt.keyCode === 13;
const SPACE_KEY = evt.keyCode === 32; const SPACE_KEY = evt.keyCode === 32;
@ -117,7 +117,7 @@ export class Tab extends React.PureComponent<TabProps> {
} }
} }
@autobind() @boundMethod
protected bindRef(elem: HTMLElement) { protected bindRef(elem: HTMLElement) {
this.elem = elem; this.elem = elem;
} }

10
src/renderer/components/tooltip/tooltip.tsx
View File

@ -3,7 +3,7 @@ import "./tooltip.scss";
import React from "react"; import React from "react";
import { createPortal } from "react-dom"; import { createPortal } from "react-dom";
import { observer } from "mobx-react"; import { observer } from "mobx-react";
import { autobind, cssNames, IClassName } from "../../utils"; import { boundMethod, cssNames, IClassName } from "../../utils";
import { observable, makeObservable } from "mobx"; import { observable, makeObservable } from "mobx";
export enum TooltipPosition { export enum TooltipPosition {
@ -78,18 +78,18 @@ export class Tooltip extends React.Component<TooltipProps> {
this.hoverTarget.removeEventListener("mouseleave", this.onLeaveTarget); this.hoverTarget.removeEventListener("mouseleave", this.onLeaveTarget);
} }
@autobind() @boundMethod
protected onEnterTarget() { protected onEnterTarget() {
this.isVisible = true; this.isVisible = true;
this.refreshPosition(); this.refreshPosition();
} }
@autobind() @boundMethod
protected onLeaveTarget() { protected onLeaveTarget() {
this.isVisible = false; this.isVisible = false;
} }
@autobind() @boundMethod
refreshPosition() { refreshPosition() {
const { preferredPositions } = this.props; const { preferredPositions } = this.props;
const { elem, targetElem } = this; const { elem, targetElem } = this;
@ -199,7 +199,7 @@ export class Tooltip extends React.Component<TooltipProps> {
}; };
} }
@autobind() @boundMethod
bindRef(elem: HTMLElement) { bindRef(elem: HTMLElement) {
this.elem = elem; this.elem = elem;
} }

4
src/renderer/item.store.ts
View File

@ -1,5 +1,5 @@
import orderBy from "lodash/orderBy"; import orderBy from "lodash/orderBy";
import { autobind, noop } from "./utils"; import { autoBind, noop } from "./utils";
import { action, computed, observable, when, makeObservable } from "mobx"; import { action, computed, observable, when, makeObservable } from "mobx";
export interface ItemObject { export interface ItemObject {
@ -7,7 +7,6 @@ export interface ItemObject {
getName(): string; getName(): string;
} }
@autobind()
export abstract class ItemStore<T extends ItemObject = ItemObject> { export abstract class ItemStore<T extends ItemObject = ItemObject> {
abstract loadAll(...args: any[]): Promise<void | T[]>; abstract loadAll(...args: any[]): Promise<void | T[]>;
@ -21,6 +20,7 @@ export abstract class ItemStore<T extends ItemObject = ItemObject> {
constructor() { constructor() {
makeObservable(this); makeObservable(this);
autoBind(this);
} }
@computed get selectedItems(): T[] { @computed get selectedItems(): T[] {

4
src/renderer/kube-object.store.ts
View File

@ -1,7 +1,7 @@
import type { ClusterContext } from "./components/context"; import type { ClusterContext } from "./components/context";
import { action, computed, observable, reaction, when, makeObservable } from "mobx"; import { action, computed, observable, reaction, when, makeObservable } from "mobx";
import { autobind, noop, rejectPromiseBy } from "./utils"; import { autoBind, noop, rejectPromiseBy } from "./utils";
import { KubeObject, KubeStatus } from "./api/kube-object"; import { KubeObject, KubeStatus } from "./api/kube-object";
import { IKubeWatchEvent } from "./api/kube-watch-api"; import { IKubeWatchEvent } from "./api/kube-watch-api";
import { ItemStore } from "./item.store"; import { ItemStore } from "./item.store";
@ -16,7 +16,6 @@ export interface KubeObjectStoreLoadingParams {
reqInit?: RequestInit; reqInit?: RequestInit;
} }
@autobind()
export abstract class KubeObjectStore<T extends KubeObject = any> extends ItemStore<T> { export abstract class KubeObjectStore<T extends KubeObject = any> extends ItemStore<T> {
static defaultContext = observable.box<ClusterContext>(); // TODO: support multiple cluster contexts static defaultContext = observable.box<ClusterContext>(); // TODO: support multiple cluster contexts
@ -31,6 +30,7 @@ export abstract class KubeObjectStore<T extends KubeObject = any> extends ItemSt
constructor() { constructor() {
super(); super();
makeObservable(this); makeObservable(this);
autoBind(this);
this.bindWatchEventsUpdater(); this.bindWatchEventsUpdater();
} }

6
src/renderer/protocol-handler/router.ts
View File

@ -2,7 +2,7 @@ import { ipcRenderer } from "electron";
import * as proto from "../../common/protocol-handler"; import * as proto from "../../common/protocol-handler";
import logger from "../../main/logger"; import logger from "../../main/logger";
import Url from "url-parse"; import Url from "url-parse";
import { autobind } from "../utils"; import { boundMethod } from "../utils";
export class LensProtocolRouterRenderer extends proto.LensProtocolRouter { export class LensProtocolRouterRenderer extends proto.LensProtocolRouter {
/** /**
@ -14,7 +14,7 @@ export class LensProtocolRouterRenderer extends proto.LensProtocolRouter {
.on(proto.ProtocolHandlerExtension, this.ipcExtensionHandler); .on(proto.ProtocolHandlerExtension, this.ipcExtensionHandler);
} }
@autobind() @boundMethod
private ipcInternalHandler(event: Electron.IpcRendererEvent, ...args: any[]): void { private ipcInternalHandler(event: Electron.IpcRendererEvent, ...args: any[]): void {
if (args.length !== 1) { if (args.length !== 1) {
return void logger.warn(`${proto.LensProtocolRouter.LoggingPrefix}: unexpected number of args`, { args }); return void logger.warn(`${proto.LensProtocolRouter.LoggingPrefix}: unexpected number of args`, { args });
@ -26,7 +26,7 @@ export class LensProtocolRouterRenderer extends proto.LensProtocolRouter {
this._routeToInternal(url); this._routeToInternal(url);
} }
@autobind() @boundMethod
private ipcExtensionHandler(event: Electron.IpcRendererEvent, ...args: any[]): void { private ipcExtensionHandler(event: Electron.IpcRendererEvent, ...args: any[]): void {
if (args.length !== 1) { if (args.length !== 1) {
return void logger.warn(`${proto.LensProtocolRouter.LoggingPrefix}: unexpected number of args`, { args }); return void logger.warn(`${proto.LensProtocolRouter.LoggingPrefix}: unexpected number of args`, { args });

4
src/renderer/theme.store.ts
View File

@ -1,5 +1,5 @@
import { computed, observable, reaction, makeObservable } from "mobx"; import { computed, observable, reaction, makeObservable } from "mobx";
import { autoBind, autobind, Singleton } from "./utils"; import { autoBind, boundMethod, Singleton } from "./utils";
import { UserStore } from "../common/user-store"; import { UserStore } from "../common/user-store";
import logger from "../main/logger"; import logger from "../main/logger";
@ -77,7 +77,7 @@ export class ThemeStore extends Singleton {
return this.allThemes.get(themeId); return this.allThemes.get(themeId);
} }
@autobind() @boundMethod
protected async loadTheme(themeId: ThemeId): Promise<Theme> { protected async loadTheme(themeId: ThemeId): Promise<Theme> {
try { try {
const existingTheme = this.getThemeById(themeId); const existingTheme = this.getThemeById(themeId);

5
yarn.lock
View File

@ -2713,6 +2713,11 @@ auto-bind@^4.0.0:
resolved "https://registry.yarnpkg.com/auto-bind/-/auto-bind-4.0.0.tgz#e3589fc6c2da8f7ca43ba9f84fa52a744fc997fb" resolved "https://registry.yarnpkg.com/auto-bind/-/auto-bind-4.0.0.tgz#e3589fc6c2da8f7ca43ba9f84fa52a744fc997fb"
integrity sha512-Hdw8qdNiqdJ8LqT0iK0sVzkFbzg6fhnQqqfWhBDxcHZvU75+B+ayzTy8x+k5Ix0Y92XOhOUlx74ps+bA6BeYMQ== integrity sha512-Hdw8qdNiqdJ8LqT0iK0sVzkFbzg6fhnQqqfWhBDxcHZvU75+B+ayzTy8x+k5Ix0Y92XOhOUlx74ps+bA6BeYMQ==
autobind-decorator@^2.4.0:
version "2.4.0"
resolved "https://registry.yarnpkg.com/autobind-decorator/-/autobind-decorator-2.4.0.tgz#ea9e1c98708cf3b5b356f7cf9f10f265ff18239c"
integrity sha512-OGYhWUO72V6DafbF8PM8rm3EPbfuyMZcJhtm5/n26IDwO18pohE4eNazLoCGhPiXOCD0gEGmrbU3849QvM8bbw==
await-lock@^2.1.0: await-lock@^2.1.0:
version "2.1.0" version "2.1.0"
resolved "https://registry.yarnpkg.com/await-lock/-/await-lock-2.1.0.tgz#bc78c51d229a34d5d90965a1c94770e772c6145e" resolved "https://registry.yarnpkg.com/await-lock/-/await-lock-2.1.0.tgz#bc78c51d229a34d5d90965a1c94770e772c6145e"