update react version to 18.2.0 and it related changes

3 files changed, 6 insertions, 2 deletions

diff --git a/src/components/services/tabs/TabBarSortableList.tsx b/src/components/services/tabs/TabBarSortableList.tsx
index e04f6268d..bb889ebef 100644
--- a/src/components/services/tabs/TabBarSortableList.tsx
+++ b/src/components/services/tabs/TabBarSortableList.tsx
@@ -10,7 +10,6 @@ interface IProps {
   showServiceNameSetting: boolean;
   showMessageBadgesEvenWhenMuted: boolean;
   services: Service[];
-
   setActive: (args: { serviceId: string }) => void;
   openSettings: (args: { path: string }) => void;
   reload: (args: { serviceId: string }) => void;
@@ -50,6 +49,7 @@ class TabBarSortableList extends Component<IProps> {
         {services.map((service, index) => (
           <TabItem
             key={service.id}
+            // @ts-ignore
             clickHandler={() => setActive({ serviceId: service.id })}
             service={service}
             index={index}
diff --git a/src/components/services/tabs/TabItem.tsx b/src/components/services/tabs/TabItem.tsx
index fae788764..2ed595919 100644
--- a/src/components/services/tabs/TabItem.tsx
+++ b/src/components/services/tabs/TabItem.tsx
@@ -1,4 +1,5 @@
 import { app, dialog, Menu } from '@electron/remote';
+import { noop } from 'lodash';
 import { Component } from 'react';
 import { defineMessages, injectIntl, WrappedComponentProps } from 'react-intl';
 import { inject, observer } from 'mobx-react';
@@ -6,7 +7,6 @@ import classnames from 'classnames';
 import { SortableElement } from 'react-sortable-hoc';
 import injectSheet, { WithStylesProps } from 'react-jss';
 import ms from 'ms';
-
 import { autorun, makeObservable, observable, reaction } from 'mobx';
 import { mdiExclamation, mdiVolumeSource } from '@mdi/js';
 import Service from '../../../models/Service';
@@ -348,6 +348,8 @@ class TabItem extends Component<IProps, IState> {
           'is-label-enabled': showServiceNameSetting,
         })}
         onClick={clickHandler}
+        onKeyDown={noop}
+        role="presentation"
         onContextMenu={() => menu.popup()}
         data-tip={`${service.name} ${
           shortcutIndex <= 9
@@ -407,5 +409,6 @@ class TabItem extends Component<IProps, IState> {
 }
 
 export default injectIntl(
+  // @ts-ignore
   SortableElement(injectSheet(styles, { injectTheme: true })(TabItem)),
 );
diff --git a/src/components/services/tabs/Tabbar.tsx b/src/components/services/tabs/Tabbar.tsx
index 64541cc8f..e3b5a7ba9 100644
--- a/src/components/services/tabs/Tabbar.tsx
+++ b/src/components/services/tabs/Tabbar.tsx
@@ -97,6 +97,7 @@ class TabBar extends Component<IProps> {
     return (
       <div>
         <TabBarSortableList
+          // @ts-ignore
           services={services}
           setActive={setActive}
           onSortEnd={this.onSortEnd}