chore(deps): update dependency eslint to v8 (#32501)

* chore(deps): update dependency eslint to v8

* fix eslint errors

* fix eslint errors

Co-authored-by: Renovate Bot <bot@renovateapp.com>
Co-authored-by: afc163 <afc163@gmail.com>

.eslintrc.js

@@ -70,6 +70,7 @@ module.exports = {
         'no-script-url': 0,
         'prefer-rest-params': 0,
         'compat/compat': 0,
+        'class-methods-use-this': 0,
         'react/no-access-state-in-setstate': 0,
         'react/destructuring-assignment': 0,
         'react/no-multi-comp': 0,

components/_util/__tests__/util.test.js

@@ -1,3 +1,4 @@
+/* eslint-disable class-methods-use-this */
 import raf from 'rc-util/lib/raf';
 import React from 'react';
 import { mount } from 'enzyme';
@@ -43,7 +44,6 @@ describe('Test utils function', () => {
       const callbackFn = jest.fn();
       class Test {
         @throttleByAnimationFrameDecorator()
-        // eslint-disable-next-line class-methods-use-this
         callback() {
           callbackFn();
         }

components/config-provider/__tests__/locale.test.js

@@ -37,6 +37,7 @@ describe('ConfigProvider.Locale', () => {
         });
       }
 
+      // eslint-disable-next-line class-methods-use-this
       openConfirm = () => {
         jest.useFakeTimers();
         Modal.confirm({

components/statistic/Countdown.tsx

@@ -80,6 +80,7 @@ class Countdown extends React.Component<CountdownProps, {}> {
   };
 
   // Countdown do not need display the timestamp
+  // eslint-disable-next-line class-methods-use-this
   valueRender = (node: React.ReactElement<HTMLDivElement>) =>
     cloneElement(node, {
       title: undefined,

components/transfer/index.tsx

@@ -300,6 +300,7 @@ class Transfer<RecordType extends TransferItem = TransferItem> extends React.Com
     }
   }
 
+  // eslint-disable-next-line class-methods-use-this
   handleListStyle = (
     listStyle: TransferProps<RecordType>['listStyle'],
     direction: TransferDirection,

components/transfer/list.tsx

@@ -163,8 +163,6 @@ export default class TransferList<
     return text.indexOf(filterValue) >= 0;
   };
 
-  getCurrentPageItems = () => {};
-
   // =============================== Render ===============================
   renderListBody = (
     renderList: RenderListFunction<RecordType> | undefined,

package.json

@@ -198,7 +198,7 @@
     "enzyme": "^3.10.0",
     "enzyme-to-json": "^3.6.0",
     "esbuild-loader": "^2.13.1",
-    "eslint": "^7.9.0",
+    "eslint": "^8.0.0",
     "eslint-config-airbnb": "^18.0.0",
     "eslint-config-prettier": "^8.0.0",
     "eslint-plugin-babel": "^5.3.0",

site/theme/template/Content/Article.tsx

@@ -45,8 +45,9 @@ class Article extends React.Component<ArticleProps> {
     return true;
   }
 
+  // eslint-disable-next-line class-methods-use-this
   onResourceClick: React.MouseEventHandler<HTMLAnchorElement> = event => {
-    const { target } = (event as unknown) as { target: HTMLAnchorElement };
+    const { target } = event as unknown as { target: HTMLAnchorElement };
     if (!window.gtag) {
       return;
     }
@@ -166,4 +167,4 @@ class Article extends React.Component<ArticleProps> {
   }
 }
 
-export default (injectIntl(Article as any) as any) as React.ComponentClass<ArticleProps>;
+export default injectIntl(Article as any) as any as React.ComponentClass<ArticleProps>;

site/theme/template/IconDisplay/IconPicSearcher.tsx

@@ -95,6 +95,7 @@ class PicSearcher extends Component<PicSearcherProps, PicSearcherState> {
     reader.readAsDataURL(file);
   };
 
+  // eslint-disable-next-line class-methods-use-this
   toImage = (url: any) =>
     new Promise(resolve => {
       const img = new Image();
@@ -133,6 +134,7 @@ class PicSearcher extends Component<PicSearcherProps, PicSearcherState> {
     }
   };
 
+  // eslint-disable-next-line class-methods-use-this
   onCopied = (text: string) => {
     message.success(
       <span>
@@ -145,15 +147,8 @@ class PicSearcher extends Component<PicSearcherProps, PicSearcherState> {
     const {
       intl: { messages },
     } = this.props;
-    const {
+    const { modalVisible, popoverVisible, icons, fileList, loading, modelLoaded, error } =
-      modalVisible,
+      this.state;
-      popoverVisible,
-      icons,
-      fileList,
-      loading,
-      modelLoaded,
-      error,
-    } = this.state;
     return (
       <div className="icon-pic-searcher">
         <Popover

site/theme/template/Layout/Header/index.tsx

@@ -173,6 +173,7 @@ class Header extends React.Component<HeaderProps, HeaderState> {
     });
   };
 
+  // eslint-disable-next-line class-methods-use-this
   handleVersionChange = (url: string) => {
     const currentUrl = window.location.href;
     const currentPathname = window.location.pathname;