Removed package "autobind-decorator" and @boundMethod in favour of "auto-bind" util for constructors-only. (#5218)

src/renderer/components/input/drop-file-input.tsx

@@ -6,7 +6,7 @@
 import "./drop-file-input.scss";
 import React from "react";
 import type { IClassName } from "../../utils";
-import { boundMethod, cssNames } from "../../utils";
+import { autoBind, cssNames } from "../../utils";
 import { observable, makeObservable } from "mobx";
 import { observer } from "mobx-react";
 import logger from "../../../main/logger";
@@ -29,15 +29,14 @@ export class DropFileInput<T extends HTMLElement = any> extends React.Component<
   constructor(props: DropFileInputProps) {
     super(props);
     makeObservable(this);
+    autoBind(this);
   }
 
-  @boundMethod
   onDragEnter() {
     this.dragCounter++;
     this.dropAreaActive = true;
   }
 
-  @boundMethod
   onDragLeave() {
     this.dragCounter--;
 
@@ -46,7 +45,6 @@ export class DropFileInput<T extends HTMLElement = any> extends React.Component<
     }
   }
 
-  @boundMethod
   onDragOver(evt: React.DragEvent<T>) {
     if (this.props.onDragOver) {
       this.props.onDragOver(evt);
@@ -55,7 +53,6 @@ export class DropFileInput<T extends HTMLElement = any> extends React.Component<
     evt.dataTransfer.dropEffect = "move";
   }
 
-  @boundMethod
   onDrop(evt: React.DragEvent<T>) {
     if (this.props.onDrop) {
       this.props.onDrop(evt);

src/renderer/components/input/input.tsx

@@ -7,7 +7,7 @@ import "./input.scss";
 
 import type { DOMAttributes, InputHTMLAttributes, TextareaHTMLAttributes } from "react";
 import React from "react";
-import { boundMethod, cssNames, debouncePromise, getRandId } from "../../utils";
+import { autoBind, cssNames, debouncePromise, getRandId } from "../../utils";
 import { Icon } from "../icon";
 import type { TooltipProps } from "../tooltip";
 import { Tooltip } from "../tooltip";
@@ -91,6 +91,11 @@ export class Input extends React.Component<InputProps, State> {
     submitted: false,
   };
 
+  constructor(props: InputProps) {
+    super(props);
+    autoBind(this);
+  }
+
   componentWillUnmount(): void {
     this.setDirtyOnChange.cancel();
   }
@@ -220,7 +225,6 @@ export class Input extends React.Component<InputProps, State> {
     this.setState({ dirty });
   }
 
-  @boundMethod
   onFocus(evt: React.FocusEvent<InputElement>) {
     const { onFocus, autoSelectOnFocus } = this.props;
 
@@ -229,7 +233,6 @@ export class Input extends React.Component<InputProps, State> {
     this.setState({ focused: true });
   }
 
-  @boundMethod
   onBlur(evt: React.FocusEvent<InputElement>) {
     this.props.onBlur?.(evt);
     this.setState({ focused: false });
@@ -237,7 +240,6 @@ export class Input extends React.Component<InputProps, State> {
 
   setDirtyOnChange = debounce(() => this.setDirty(), 500);
 
-  @boundMethod
   onChange(evt: React.ChangeEvent<any>) {
     this.props.onChange?.(evt.currentTarget.value, evt);
     this.validate();
@@ -251,7 +253,6 @@ export class Input extends React.Component<InputProps, State> {
     }
   }
 
-  @boundMethod
   onKeyDown(evt: React.KeyboardEvent<InputElement>) {
     this.props.onKeyDown?.(evt);
 
@@ -329,7 +330,6 @@ export class Input extends React.Component<InputProps, State> {
     };
   }
 
-  @boundMethod
   bindRef(elem: InputElement) {
     this.input = elem;
   }

src/renderer/components/input/search-input.tsx

@@ -7,7 +7,7 @@ import "./search-input.scss";
 
 import React, { createRef } from "react";
 import { observer } from "mobx-react";
-import { boundMethod, cssNames } from "../../utils";
+import { cssNames, autoBind } from "../../utils";
 import { Icon } from "../icon";
 import type { InputProps } from "./input";
 import { Input } from "./input";
@@ -33,6 +33,11 @@ export class SearchInput extends React.Component<SearchInputProps> {
 
   private inputRef = createRef<Input>();
 
+  constructor(props: SearchInputProps) {
+    super(props);
+    autoBind(this);
+  }
+
   componentDidMount() {
     if (!this.props.bindGlobalFocusHotkey) return;
     window.addEventListener("keydown", this.onGlobalKey);
@@ -42,14 +47,12 @@ export class SearchInput extends React.Component<SearchInputProps> {
     window.removeEventListener("keydown", this.onGlobalKey);
   }
 
-  @boundMethod
   onGlobalKey(evt: KeyboardEvent) {
     if (evt.key === "f" && (isMac ? evt.metaKey : evt.ctrlKey)) {
       this.inputRef.current.focus();
     }
   }
 
-  @boundMethod
   onKeyDown(evt: React.KeyboardEvent<any>) {
     this.props.onKeyDown?.(evt);
 
@@ -59,7 +62,6 @@ export class SearchInput extends React.Component<SearchInputProps> {
     }
   }
 
-  @boundMethod
   clear() {
     if (this.props.onClear) {
       this.props.onClear();