refactor: more lint improvements

- set parserOptions.ecmaVersion to latest and env to es2024 in eslint config
- install missing types libraries
- install eslint-plugin-sonar
- enable eslint-plugin-sonar recommended rules and declare jsx-runtime for react in eslint config
- clean up disabled lint rules which don't inflict problems anymore
- disable various lint issues and fix others

3 files changed, 22 insertions, 21 deletions

diff --git a/src/components/ui/Tabs/TabItem.tsx b/src/components/ui/Tabs/TabItem.tsx
index 815dced8c..55dee42c6 100644
--- a/src/components/ui/Tabs/TabItem.tsx
+++ b/src/components/ui/Tabs/TabItem.tsx
@@ -12,8 +12,8 @@ export interface IProps {
   title?: string; // it is used on Tabs.tsx
 }
 
-function TabItem({ children, title = '' }: IProps): ReactElement {
+const TabItem = ({ children, title = '' }: IProps): ReactElement => {
   return <Fragment key={title}>{children}</Fragment>;
-}
+};
 
 export default TabItem;
diff --git a/src/components/ui/button/index.tsx b/src/components/ui/button/index.tsx
index 3c31ca952..c37a88afa 100644
--- a/src/components/ui/button/index.tsx
+++ b/src/components/ui/button/index.tsx
@@ -237,6 +237,7 @@ class ButtonComponent extends Component<IProps, IState> {
     ) : (
       <button
         id={id}
+        // eslint-disable-next-line react/button-has-type
         type={type}
         onClick={onClick}
         className={classnames({
diff --git a/src/components/ui/select/index.tsx b/src/components/ui/select/index.tsx
index 902eb7748..650600fb3 100644
--- a/src/components/ui/select/index.tsx
+++ b/src/components/ui/select/index.tsx
@@ -191,12 +191,23 @@ class SelectComponent extends Component<IProps, IState> {
     this.arrowKeysHandler = this.arrowKeysHandler.bind(this);
   }
 
-  componentDidUpdate(): void {
-    const { open } = this.state;
+  UNSAFE_componentWillMount(): void {
+    const { value } = this.props;
 
-    if (this.searchInputRef?.current && open) {
-      this.searchInputRef.current.focus();
+    if (this.componentRef?.current) {
+      this.componentRef.current.removeEventListener(
+        'keydown',
+        this.keyListener,
+      );
     }
+
+    if (value) {
+      this.setState({
+        value,
+      });
+    }
+
+    this.setFilter();
   }
 
   componentDidMount(): void {
@@ -212,23 +223,12 @@ class SelectComponent extends Component<IProps, IState> {
     window.addEventListener('keydown', this.arrowKeysHandler, false);
   }
 
-  UNSAFE_componentWillMount(): void {
-    const { value } = this.props;
-
-    if (this.componentRef?.current) {
-      this.componentRef.current.removeEventListener(
-        'keydown',
-        this.keyListener,
-      );
-    }
+  componentDidUpdate(): void {
+    const { open } = this.state;
 
-    if (value) {
-      this.setState({
-        value,
-      });
+    if (this.searchInputRef?.current && open) {
+      this.searchInputRef.current.focus();
     }
-
-    this.setFilter();
   }
 
   componentWillUnmount(): void {