refactor(Message): fix eslint

alibaba-fusion · May 13, 2024 · 88d6f6d · 88d6f6d
1 parent 65a9b87
commit 88d6f6d
Show file tree

Hide file tree

Showing 7 changed files with 47 additions and 56 deletions.
diff --git a/components/message/__docs__/demo/withContext/index.tsx b/components/message/__docs__/demo/withContext/index.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
+
 ReactDOM.render(
  <a target="_blank" rel="noopener noreferrer" href="https://codepen.io/acejerry/pen/ZEOQjzr">
  点击查看 Message.withContext Demo

diff --git a/components/message/__docs__/theme/index.tsx b/components/message/__docs__/theme/index.tsx
@@ -10,6 +10,7 @@ import {
  type DemoFunctionDefineForObject,
 } from '../../../demo-helper';
 import Message from '../../index';
+
 const i18nMap = {
  'en-us': {
  title: 'Title',
@@ -85,11 +86,6 @@ class FunctionDemo extends React.Component<Props, State> {
  const title = demoFunction.hasTitle.value === 'true' ? i18n.title : null;
  const closeable = demoFunction.closeable.value === 'true';
 
- const style = {
- lineHeight: 1.7,
- margin: 0,
- };
-
  const newChildren = shapes.map(shape => {
  const content = types.map(type => {
  const children = (['large', 'medium'] as const).map(size => (

diff --git a/components/message/__tests__/index-spec.tsx b/components/message/__tests__/index-spec.tsx
@@ -1,5 +1,5 @@
-import React, { ReactElement } from 'react';
-import { MountReturn } from 'cypress/react';
+import React, { type ReactElement } from 'react';
+import { type MountReturn } from 'cypress/react';
 import Button from '../../button';
 import ConfigProvider from '../../config-provider';
 import { env } from '../../util';
@@ -321,8 +321,8 @@ describe('toast quick-calling', () => {
 describe('Message v2', () => {
  it('should support config to open multiple instance', done => {
  Message.config({});
- const instance1 = Message.show('content');
- const instance2 = Message.success('content');
+ Message.show('content');
+ Message.success('content');
  cy.get('.next-message-wrapper-v2 .next-message').should('have.length', 2);
  cy.clock();
  Message.destory();

diff --git a/components/message/message.tsx b/components/message/message.tsx
@@ -7,9 +7,9 @@ import Icon from '../icon';
 import Animate from '../animate';
 import ConfigProvider from '../config-provider';
 import { obj } from '../util';
-import { MessageProps } from './types';
-import toast, { withContext } from './toast';
-import toast2 from './toast2';
+import type { MessageProps } from './types';
+import toast, { type withContext } from './toast';
+import type toast2 from './toast2';
 
 type Toast = typeof toast;
 type Toast2 = typeof toast2;
@@ -97,19 +97,15 @@ class Message extends Component<MessageProps> {
  render() {
  const {
  prefix,
- pure,
  className,
  style,
  type,
  shape,
  size,
  title,
  children,
- defaultVisible,
- visible: propsVisible,
  iconType: icon,
  closeable,
- onClose,
  afterClose,
  animation,
  rtl,

diff --git a/components/message/toast.tsx b/components/message/toast.tsx
@@ -5,8 +5,8 @@ import Overlay from '../overlay';
 import ConfigProvider from '../config-provider';
 import { guid } from '../util';
 import Message from './message';
-import { OpenProps, MessageQuickProps } from './types';
-import { ConfiguredComponent } from '../config-provider/types';
+import type { OpenProps, MessageQuickProps } from './types';
+import type { ConfiguredComponent } from '../config-provider/types';
 
 type ConfigMask = ConfiguredComponent<OpenProps, Mask> | null;
 
@@ -125,11 +125,10 @@ const NewMask = config(Mask);
 
 const create = (props: MessageQuickProps) => {
  const { duration, afterClose, contextConfig, ...others } = props;
- /* eslint-enable no-unused-vars */
-
  const div = document.createElement('div');
  document.body.appendChild(div);
  const closeChain = function () {
+ // eslint-disable-next-line react/no-deprecated
  ReactDOM.unmountComponentAtNode(div);
  document.body.removeChild(div);
  afterClose && afterClose();
@@ -146,6 +145,7 @@ const create = (props: MessageQuickProps) => {
  destroyed = true;
  };
 
+ // eslint-disable-next-line react/no-deprecated
  ReactDOM.render(
  <ConfigProvider {...newContext}>
  <NewMask
@@ -171,6 +171,10 @@ const create = (props: MessageQuickProps) => {
  };
 };
 
+function isObject(obj: unknown) {
+ return {}.toString.call(obj) === '[object Object]';
+}
+
 function handleConfig(config: OpenProps, type?: MessageQuickProps['type']) {
  let newConfig: MessageQuickProps = {};
 
@@ -189,8 +193,11 @@ function handleConfig(config: OpenProps, type?: MessageQuickProps['type']) {
  return newConfig;
 }
 
-function isObject(obj: unknown) {
- return {}.toString.call(obj) === '[object Object]';
+function close() {
+ if (instance) {
+ instance.destroy();
+ instance = null;
+ }
 }
 
 function open(config: OpenProps, type?: MessageQuickProps['type']) {
@@ -205,79 +212,64 @@ function open(config: OpenProps, type?: MessageQuickProps['type']) {
  }
 }
 
-function close() {
- if (instance) {
- instance.destroy();
- instance = null;
- }
-}
-
 /**
  * 创建提示弹层
- * @exportName show
- * @param {Object} props 属性对象
+ * @param config - 属性对象
  */
 function show(config: OpenProps) {
  open(config);
 }
 
 /**
  * 关闭提示弹层
- * @exportName hide
  */
 function hide() {
  close();
 }
 
 /**
  * 创建成功提示弹层
- * @exportName success
- * @param {Object} props 属性对象
+ * @param config - 属性对象
  */
 function success(config: OpenProps) {
  open(config, 'success');
 }
 
 /**
  * 创建警告提示弹层
- * @exportName warning
- * @param {Object} props 属性对象
+ * @param config - 属性对象
  */
 function warning(config: OpenProps) {
  open(config, 'warning');
 }
 
 /**
  * 创建错误提示弹层
- * @exportName error
- * @param {Object} props 属性对象
+ * @param config - 属性对象
  */
 function error(config: OpenProps) {
  open(config, 'error');
 }
 
 /**
  * 创建帮助提示弹层
- * @exportName help
- * @param {Object} props 属性对象
+ * @param config - 属性对象
  */
 function help(config: OpenProps) {
  open(config, 'help');
 }
 
 /**
  * 创建加载中提示弹层
- * @exportName loading
- * @param {Object} props 属性对象
+ * @param config - 属性对象
  */
 function loading(config: OpenProps) {
  open(config, 'loading');
 }
 
 /**
  * 创建通知提示弹层
- * @exportName notice
- * @param {Object} props 属性对象
+ * @param config - 属性对象
  */
 function notice(config: OpenProps) {
  open(config, 'notice');
@@ -294,9 +286,7 @@ export default {
  notice,
 };
 
-export const withContext = <T extends { [key: string]: any }>(
- WrappedComponent: React.ComponentType<T>
-) => {
+export const withContext = <T extends object>(WrappedComponent: React.ComponentType<T>) => {
  const HOC = (props: T) => {
  return (
  <ConfigProvider.Consumer>

diff --git a/components/message/toast2.tsx b/components/message/toast2.tsx
@@ -4,7 +4,12 @@ import ConfigProvider from '../config-provider';
 import Animate from '../animate';
 import Message from './message';
 import { obj, log, guid } from '../util';
-import { OpenProps, MessageQuickProps, MessageWrapperProps, MessageWrapperItem } from './types';
+import type {
+ OpenProps,
+ MessageQuickProps,
+ MessageWrapperProps,
+ MessageWrapperItem,
+} from './types';
 
 const config = {
  top: 8,
@@ -92,6 +97,7 @@ const createMessage = (props: MessageQuickProps & { key?: string }) => {
  messageList.shift();
  }
 
+ // eslint-disable-next-line react/no-deprecated
  ReactDOM.render(
  <ConfigProvider {...ConfigProvider.getContext()}>
  <ConfigedMessages dataSource={messageList} />
@@ -110,6 +116,7 @@ const createMessage = (props: MessageQuickProps & { key?: string }) => {
  typeof item.onClose === 'function' && item.onClose();
  messageList.splice(idx, 1);
 
+ // eslint-disable-next-line react/no-deprecated
  ReactDOM.render(
  <ConfigProvider {...ConfigProvider.getContext()}>
  <ConfigedMessages dataSource={messageList} />
@@ -130,6 +137,7 @@ function close(key?: string) {
  }
 
  if (messageRootNode) {
+ // eslint-disable-next-line react/no-deprecated
  ReactDOM.render(
  <ConfigProvider {...ConfigProvider.getContext()}>
  <ConfigedMessages dataSource={messageList} />
@@ -165,6 +173,7 @@ function open(type?: MessageQuickProps['type']) {
 function destory() {
  if (!messageRootNode) return;
  if (messageRootNode) {
+ // eslint-disable-next-line react/no-deprecated
  ReactDOM.unmountComponentAtNode(messageRootNode);
  messageRootNode.parentNode!.removeChild(messageRootNode);
  messageRootNode = null;

diff --git a/components/message/types.ts b/components/message/types.ts
@@ -1,10 +1,9 @@
-import React from 'react';
-import { CommonProps } from '../util';
-import { OverlayProps } from '../overlay';
-import { ConsumerState } from '../config-provider/consumer';
-interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
- title?: any;
-}
+import type React from 'react';
+import type { CommonProps } from '../util';
+import type { OverlayProps } from '../overlay';
+import type { ConsumerState } from '../config-provider/consumer';
+
+type HTMLAttributesWeak = Omit<React.HTMLAttributes<HTMLElement>, 'title'>;
 
 /**
  * @api Message
@@ -118,7 +117,7 @@ export interface MessageQuickProps extends Omit<HTMLAttributesWeak, 'content'>,
  /**
  * 弹层相对于参照元素定位的微调
  */
- offset?: Array<any>;
+ offset?: Array<number>;
  /**
  * 是否显示遮罩
  */