fix: message service do not return disposable (#2155)

* fix: message service do not return disposable

* fix: expose identifiers

packages/design/src/components/message/Message.tsx

@@ -14,10 +14,13 @@
  * limitations under the License.
  */
 
+/* eslint-disable react-refresh/only-export-components */
+
 import { ErrorSingle, SuccessSingle, WarningSingle } from '@univerjs/icons';
 import { render } from 'rc-util/lib/React/render';
 import React from 'react';
 import { CSSTransition, TransitionGroup } from 'react-transition-group';
+import type { IDisposable } from '../../type';
 
 import styles from './index.module.less';
 
@@ -83,17 +86,18 @@ const MessageContainer = (props: { messages: IMessageProps[] }) => {
 };
 
 export class Message {
-    private _div: HTMLDivElement;
-    private _messages: IMessageProps[] = [];
+    protected _container: HTMLDivElement;
+
+    protected _messages: IMessageProps[] = [];
 
     constructor(container: HTMLElement) {
-        this._div = document.createElement('div');
-        container.appendChild(this._div);
+        this._container = document.createElement('div');
+        container.appendChild(this._container);
 
         this.render();
     }
 
-    append(type: MessageType, options: IMessageMethodOptions) {
+    append(type: MessageType, options: IMessageMethodOptions): IDisposable {
         const { content, delay = 3000 } = options;
         const key = Date.now();
 
@@ -103,11 +107,10 @@ export class Message {
             content,
         });
 
-        setTimeout(() => {
-            this.teardown(key);
-        }, delay);
-
         this.render();
+
+        setTimeout(() => this.teardown(key), delay);
+        return { dispose: () => this.teardown(key) };
     }
 
     teardown(key: number) {
@@ -117,18 +120,18 @@ export class Message {
     }
 
     render() {
-        render(<MessageContainer messages={this._messages} />, this._div);
+        render(<MessageContainer messages={this._messages} />, this._container);
     }
 
-    success(options: IMessageMethodOptions) {
-        this.append(MessageType.Success, options);
+    success(options: IMessageMethodOptions): IDisposable {
+        return this.append(MessageType.Success, options);
     }
 
-    warning(options: IMessageMethodOptions) {
-        this.append(MessageType.Warning, options);
+    warning(options: IMessageMethodOptions): IDisposable {
+        return this.append(MessageType.Warning, options);
     }
 
-    error(options: IMessageMethodOptions) {
-        this.append(MessageType.Error, options);
+    error(options: IMessageMethodOptions): IDisposable {
+        return this.append(MessageType.Error, options);
     }
 }

packages/design/src/type.ts

@@ -0,0 +1,19 @@
+/**
+ * Copyright 2023-present DreamNum Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export interface IDisposable {
+    dispose(): void;
+}

packages/ui/src/services/message/desktop-message.service.ts

@@ -14,7 +14,6 @@
  * limitations under the License.
  */
 
-import { toDisposable } from '@univerjs/core';
 import type { IMessageMethodOptions, IMessageProps } from '@univerjs/design';
 import { Message } from '@univerjs/design';
 import type { IDisposable } from '@wendellhu/redi';
@@ -31,10 +30,11 @@ export class DesktopMessageService implements IMessageService {
     }
 
     show(options: IMessageMethodOptions & Omit<IMessageProps, 'key'>): IDisposable {
-        const { type, ...rest } = options;
-
-        this.message && this.message[type](rest);
+        if (!this.message) {
+            throw new Error('[DesktopMessageService]: no message implementation!');
+        }
 
-        return toDisposable(() => {});
+        const { type, ...rest } = options;
+        return this.message[type](rest);
     }
 }