cleanup @theia/messages

eclipse-theia · Aug 8, 2019 · 4766828 · 4766828
1 parent f8cc4e4
commit 4766828
Show file tree

Hide file tree

Showing 3 changed files with 44 additions and 40 deletions.
diff --git a/packages/messages/src/browser/messages-frontend-module.ts b/packages/messages/src/browser/messages-frontend-module.ts
@@ -18,7 +18,7 @@ import '../../src/browser/style/index.css';
 
 import { ContainerModule } from 'inversify';
 import { MessageClient } from '@theia/core/lib/common';
-import { NotificationManager, NotificationManagerImpl } from './notifications-manager';
+import { NotificationManager } from './notifications-manager';
 import { bindNotificationPreferences } from './notification-preferences';
 import { NotificationCenter } from './notification-center';
 import { StatusBarProgress } from './status-bar-progress';
@@ -35,8 +35,7 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
     bind(KeybindingContribution).toService(NotificationsContribution);
     bind(NotificationsKeybindingContext).toSelf().inSingletonScope();
     bind(KeybindingContext).toService(NotificationsKeybindingContext);
-    bind(NotificationManagerImpl).toSelf().inSingletonScope();
-    bind(NotificationManager).toService(NotificationManagerImpl);
-    rebind(MessageClient).toService(NotificationManagerImpl);
+    bind(NotificationManager).toSelf().inSingletonScope();
+    rebind(MessageClient).toService(NotificationManager);
     bindNotificationPreferences(bind);
 });
diff --git a/packages/messages/src/browser/notification-center-component.tsx b/packages/messages/src/browser/notification-center-component.tsx
@@ -16,15 +16,15 @@
 
 import * as React from 'react';
 import { DisposableCollection } from '@theia/core';
-import { NotificationManager, Notification } from './notifications-manager';
+import { NotificationManager, Notification, NotificationUpdateEvent } from './notifications-manager';
 
 const PerfectScrollbar = require('react-perfect-scrollbar');
 
 export interface NotificationCenterComponentProps {
     readonly manager: NotificationManager;
 }
 
-interface NotificationCenterComponentState extends NotificationManager.UpdateEvent { }
+interface NotificationCenterComponentState extends NotificationUpdateEvent { }
 
 export class NotificationCenterComponent extends React.Component<NotificationCenterComponentProps, NotificationCenterComponentState> {
 
@@ -62,8 +62,8 @@ export class NotificationCenterComponent extends React.Component<NotificationCen
                     <div className='theia-notification-center-header-title'>{title}</div>
                     <div className='theia-notification-center-header-actions'>
                         <ul className='theia-notification-actions'>
-                            <li className='collapse' title='Hide' onClick={this.onHide.bind(this)} />
-                            <li className='clear' title='Clear All' onClick={this.onClearAll.bind(this)} />
+                            <li className='collapse' title='Hide' onClick={this.onHide} />
+                            <li className='clear' title='Clear All' onClick={this.onClearAll} />
                         </ul>
                     </div>
                 </div>
@@ -76,27 +76,44 @@ export class NotificationCenterComponent extends React.Component<NotificationCen
         );
     }
 
-    protected onHide(): void {
+    protected onHide = () => {
         this.props.manager.hide();
     }
 
-    protected onClearAll(): void {
+    protected onClearAll = () => {
         this.props.manager.clearAll();
     }
 
-    protected onClear(messageId: string): void {
-        this.props.manager.clear(messageId);
+    protected onClear = (event: React.MouseEvent) => {
+        if (event.target instanceof HTMLElement) {
+            const messageId = event.target.dataset.messageId;
+            if (messageId) {
+                this.props.manager.clear(messageId);
+            }
+        }
     }
 
-    protected onToggleExpansion(messageId: string): void {
-        this.props.manager.toggleExpansion(messageId);
+    protected onToggleExpansion = (event: React.MouseEvent) => {
+        if (event.target instanceof HTMLElement) {
+            const messageId = event.target.dataset.messageId;
+            if (messageId) {
+                this.props.manager.toggleExpansion(messageId);
+            }
+        }
     }
 
-    protected onAction(messageId: string, action: string): void {
-        this.props.manager.accept(messageId, action);
+    protected onAction = (event: React.MouseEvent) => {
+        if (event.target instanceof HTMLElement) {
+            const messageId = event.target.dataset.messageId;
+            const action = event.target.dataset.action;
+            if (messageId && action) {
+                this.props.manager.accept(messageId, action);
+                this.props.manager.toggleExpansion(messageId);
+            }
+        }
     }
 
-    protected messageClickeHandler(event: React.MouseEvent): void {
+    protected messageClickeHandler = (event: React.MouseEvent) => {
         if (event.target instanceof HTMLAnchorElement) {
             event.stopPropagation();
             event.preventDefault();
@@ -112,13 +129,14 @@ export class NotificationCenterComponent extends React.Component<NotificationCen
                 <div className='theia-notification-list-item-content-main'>
                     <div className={`theia-notification-icon theia-notification-icon-${type}`} />
                     <div className='theia-notification-message'>
-                        <span dangerouslySetInnerHTML={{ __html: message }} onClick={this.messageClickeHandler.bind(this)} />
+                        <span dangerouslySetInnerHTML={{ __html: message }} onClick={this.messageClickeHandler} />
                     </div>
                     <ul className='theia-notification-actions'>
                         {expandable && (
-                            <li className={collapsed ? 'expand' : 'collapse'} title={collapsed ? 'Expand' : 'Collapse'} onClick={() => this.onToggleExpansion(messageId)} />
+                            <li className={collapsed ? 'expand' : 'collapse'} title={collapsed ? 'Expand' : 'Collapse'}
+                                data-message-id={messageId} onClick={this.onToggleExpansion} />
                         )}
-                        <li className='clear' title='Clear' onClick={() => this.onClear(messageId)} />
+                        <li className='clear' title='Clear' data-message-id={messageId} onClick={this.onClear} />
                     </ul>
                 </div>
                 <div className='theia-notification-list-item-content-bottom'>
@@ -128,7 +146,8 @@ export class NotificationCenterComponent extends React.Component<NotificationCen
                     <div className='theia-notification-buttons'>
                         {notification.actions && notification.actions.map((action, index) => (
                             <button key={messageId + `-action-${index}`} className='theia-button'
-                                onClick={() => this.onAction(messageId, action)}>
+                                data-message-id={messageId} data-action={action}
+                                onClick={this.onAction}>
                                 {action}
                             </button>
                         ))}

diff --git a/packages/messages/src/browser/notifications-manager.ts b/packages/messages/src/browser/notifications-manager.ts
@@ -17,7 +17,7 @@
 import { injectable, inject, postConstruct } from 'inversify';
 import { MessageClient, MessageType, Message as PlainMessage, ProgressMessage, ProgressUpdate, CancellationToken } from '@theia/core/lib/common';
 import { deepClone } from '@theia/core/lib/common/objects';
-import { Event, Emitter } from '@theia/core';
+import { Emitter } from '@theia/core';
 import { Deferred } from '@theia/core/lib/common/promise-util';
 import { Md5 } from 'ts-md5';
 import * as markdownit from 'markdown-it';
@@ -27,23 +27,9 @@ import { ContextKeyService, ContextKey } from '@theia/core/lib/browser/context-k
 import { OpenerService } from '@theia/core/lib/browser';
 import URI from '@theia/core/lib/common/uri';
 
-export const NotificationManager = Symbol('NotificationManager');
-export interface NotificationManager {
+export interface NotificationUpdateEvent {
+    readonly notifications: Notification[];
     readonly open: boolean;
-    readonly onUpdate: Event<NotificationManager.UpdateEvent>;
-    accept(notification: Notification | string, action: string): void;
-    hide(): void;
-    toggle(): void;
-    clear(notification: Notification | string): void;
-    clearAll(): void;
-    toggleExpansion(notification: string): void;
-    openLink(link: string): Promise<void>;
-}
-export namespace NotificationManager {
-    export interface UpdateEvent {
-        readonly notifications: Notification[];
-        readonly open: boolean;
-    }
 }
 
 export interface Notification {
@@ -63,7 +49,7 @@ export namespace Notification {
 }
 
 @injectable()
-export class NotificationManagerImpl extends MessageClient implements NotificationManager {
+export class NotificationManager extends MessageClient {
 
     @inject(NotificationPreferences)
     protected readonly preferences: NotificationPreferences;
@@ -74,7 +60,7 @@ export class NotificationManagerImpl extends MessageClient implements Notificati
     @inject(OpenerService)
     protected readonly openerService: OpenerService;
 
-    protected readonly onUpdateEmitter = new Emitter<NotificationManager.UpdateEvent>();
+    protected readonly onUpdateEmitter = new Emitter<NotificationUpdateEvent>();
     protected readonly fireUpdateEvent = throttle(() => {
         const notifications = deepClone(Array.from(this.notifications.values()));
         this.onUpdateEmitter.fire({ notifications, open: this.open });