jupyterlab-chat 0.10.1 → 0.12.0

package/lib/factory.d.ts

@@ -1,4 +1,4 @@
-import { IAttachmentOpenerRegistry, IChatCommandRegistry, IInputToolbarRegistry } from '@jupyter/chat';
+import { IAttachmentOpenerRegistry, IChatCommandRegistry, IInputToolbarRegistry, IMessageFooterRegistry } from '@jupyter/chat';
 import { IThemeManager } from '@jupyterlab/apputils';
 import { IDocumentManager } from '@jupyterlab/docmanager';
 import { ABCWidgetFactory, DocumentRegistry } from '@jupyterlab/docregistry';
@@ -53,6 +53,8 @@ export declare class ChatWidgetFactory extends ABCWidgetFactory<LabChatPanel, La
     private _chatCommandRegistry?;
     private _attachmentOpenerRegistry?;
     private _inputToolbarFactory?;
+    private _messageFooterRegistry?;
+    private _welcomeMessage?;
 }
 export declare namespace ChatWidgetFactory {
     interface IContext extends DocumentRegistry.IContext<LabChatModel> {
@@ -62,6 +64,8 @@ export declare namespace ChatWidgetFactory {
         chatCommandRegistry?: IChatCommandRegistry;
         attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
         inputToolbarRegistry?: IInputToolbarRegistry;
+        messageFooterRegistry?: IMessageFooterRegistry;
+        welcomeMessage?: string;
     }
     interface IOptions<T extends LabChatPanel> extends DocumentRegistry.IWidgetFactoryOptions<T> {
         themeManager: IThemeManager | null;
@@ -69,6 +73,8 @@ export declare namespace ChatWidgetFactory {
         chatCommandRegistry?: IChatCommandRegistry;
         attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
         inputToolbarFactory?: IInputToolbarRegistryFactory;
+        messageFooterRegistry?: IMessageFooterRegistry;
+        welcomeMessage?: string;
     }
 }
 export declare class LabChatModelFactory implements DocumentRegistry.IModelFactory<LabChatModel> {

package/lib/factory.js

@@ -53,6 +53,8 @@ export class ChatWidgetFactory extends ABCWidgetFactory {
         this._chatCommandRegistry = options.chatCommandRegistry;
         this._attachmentOpenerRegistry = options.attachmentOpenerRegistry;
         this._inputToolbarFactory = options.inputToolbarFactory;
+        this._messageFooterRegistry = options.messageFooterRegistry;
+        this._welcomeMessage = options.welcomeMessage;
     }
     /**
      * Create a new widget given a context.
@@ -65,6 +67,8 @@ export class ChatWidgetFactory extends ABCWidgetFactory {
         context.themeManager = this._themeManager;
         context.chatCommandRegistry = this._chatCommandRegistry;
         context.attachmentOpenerRegistry = this._attachmentOpenerRegistry;
+        context.messageFooterRegistry = this._messageFooterRegistry;
+        context.welcomeMessage = this._welcomeMessage;
         if (this._inputToolbarFactory) {
             context.inputToolbarRegistry = this._inputToolbarFactory.create();
         }

package/lib/model.d.ts

@@ -1,4 +1,4 @@
-import { AbstractChatModel, AbstractChatContext, IChatContext, IChatMessage, IChatModel, IInputModel, INewMessage, IUser } from '@jupyter/chat';
+import { AbstractChatModel, AbstractChatContext, IChatContext, IChatMessage, IChatModel, INewMessage, IUser } from '@jupyter/chat';
 import { IChangedArgs } from '@jupyterlab/coreutils';
 import { DocumentRegistry } from '@jupyterlab/docregistry';
 import { User } from '@jupyterlab/services';
@@ -48,9 +48,16 @@ export declare class LabChatModel extends AbstractChatModel implements DocumentR
     updateMessage(id: string, updatedMessage: IChatMessage): Promise<boolean | void> | boolean | void;
     deleteMessage(id: string): Promise<boolean | void> | boolean | void;
     /**
-     * Function called by the input on key pressed.
+     * Function called when the input content changed.
+     *
+     * @param value - The whole input content.
+     * @param messageID - The ID of the message being edited, if any.
      */
-    onInputChanged: (_: IInputModel, value: string) => void;
+    onInputChanged: (value: string, messageID?: string) => void;
+    /**
+     * Listen to the message edition input.
+     */
+    onMessageEditionAdded: (_: IChatModel, edition: IChatModel.IMessageEdition) => void;
     /**
      * Triggered when an awareness state changes.
      * Used to populate the writers list.

package/lib/model.js

@@ -15,9 +15,12 @@ export class LabChatModel extends AbstractChatModel {
         super(options);
         this.collaborative = true;
         /**
-         * Function called by the input on key pressed.
+         * Function called when the input content changed.
+         *
+         * @param value - The whole input content.
+         * @param messageID - The ID of the message being edited, if any.
          */
-        this.onInputChanged = (_, value) => {
+        this.onInputChanged = (value, messageID) => {
             if (!value || !this.config.sendTypingNotification) {
                 return;
             }
@@ -25,11 +28,22 @@ export class LabChatModel extends AbstractChatModel {
             if (this._timeoutWriting !== null) {
                 window.clearTimeout(this._timeoutWriting);
             }
-            awareness.setLocalStateField('isWriting', true);
+            awareness.setLocalStateField('isWriting', messageID !== null && messageID !== void 0 ? messageID : true);
             this._timeoutWriting = window.setTimeout(() => {
                 this._resetWritingStatus();
             }, WRITING_DELAY);
         };
+        /**
+         * Listen to the message edition input.
+         */
+        this.onMessageEditionAdded = (_, edition) => {
+            if (edition !== null) {
+                const _onInputChanged = (_, value) => {
+                    this.onInputChanged(value, edition.id);
+                };
+                edition.model.valueChanged.connect(_onInputChanged);
+            }
+        };
         /**
          * Triggered when an awareness state changes.
          * Used to populate the writers list.
@@ -42,8 +56,12 @@ export class LabChatModel extends AbstractChatModel {
                 if (!state || !state.user || state.user.username === this.user.username) {
                     continue;
                 }
-                if (state.isWriting) {
-                    writers.push(state.user);
+                if (state.isWriting !== undefined && state.isWriting !== false) {
+                    const writer = {
+                        user: state.user,
+                        messageID: state.isWriting === true ? undefined : state.isWriting
+                    };
+                    writers.push(writer);
                 }
             }
             this.updateWriters(writers);
@@ -136,7 +154,8 @@ export class LabChatModel extends AbstractChatModel {
             this.config = config;
         });
         this.sharedModel.awareness.on('change', this.onAwarenessChange);
-        this.input.valueChanged.connect(this.onInputChanged);
+        this.input.valueChanged.connect((_, value) => this.onInputChanged(value));
+        this.messageEditionAdded.connect(this.onMessageEditionAdded);
     }
     get user() {
         return this._user;

package/lib/token.d.ts

@@ -102,3 +102,9 @@ export interface IInputToolbarRegistryFactory {
  * The token of the factory to create an input toolbar registry.
  */
 export declare const IInputToolbarRegistryFactory: Token<IInputToolbarRegistryFactory>;
+/**
+ * The token to add a welcome message to the chat.
+ * This token is not provided by default, but can be provided by third party extensions
+ * willing to add a welcome message to the chat.
+ */
+export declare const IWelcomeMessage: Token<string>;

package/lib/token.js

@@ -61,3 +61,9 @@ export const ISelectionWatcherToken = new Token('jupyterlab-chat:ISelectionWatch
  * The token of the factory to create an input toolbar registry.
  */
 export const IInputToolbarRegistryFactory = new Token('jupyterlab-chat:IInputToolbarRegistryFactory');
+/**
+ * The token to add a welcome message to the chat.
+ * This token is not provided by default, but can be provided by third party extensions
+ * willing to add a welcome message to the chat.
+ */
+export const IWelcomeMessage = new Token('jupyterlab-chat:IWelcomeMessage');

package/lib/widget.d.ts

@@ -1,4 +1,4 @@
-import { ChatWidget, IAttachmentOpenerRegistry, IChatCommandRegistry, IChatModel } from '@jupyter/chat';
+import { ChatWidget, IAttachmentOpenerRegistry, IChatCommandRegistry, IChatModel, IMessageFooterRegistry } from '@jupyter/chat';
 import { ICollaborativeDrive } from '@jupyter/collaborative-drive';
 import { IThemeManager } from '@jupyterlab/apputils';
 import { DocumentWidget } from '@jupyterlab/docregistry';
@@ -91,6 +91,8 @@ export declare class ChatPanel extends SidePanel {
     private _chatCommandRegistry?;
     private _attachmentOpenerRegistry?;
     private _inputToolbarFactory?;
+    private _messageFooterRegistry?;
+    private _welcomeMessage?;
 }
 /**
  * The chat panel namespace.
@@ -108,6 +110,8 @@ export declare namespace ChatPanel {
         chatCommandRegistry?: IChatCommandRegistry;
         attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
         inputToolbarFactory?: IInputToolbarRegistryFactory;
+        messageFooterRegistry?: IMessageFooterRegistry;
+        welcomeMessage?: string;
     }
 }
 /**

package/lib/widget.js

@@ -108,6 +108,8 @@ export class ChatPanel extends SidePanel {
         this._chatCommandRegistry = options.chatCommandRegistry;
         this._attachmentOpenerRegistry = options.attachmentOpenerRegistry;
         this._inputToolbarFactory = options.inputToolbarFactory;
+        this._messageFooterRegistry = options.messageFooterRegistry;
+        this._welcomeMessage = options.welcomeMessage;
         const addChat = new CommandToolbarButton({
             commands: this._commands,
             id: CommandIDs.createChat,
@@ -164,7 +166,9 @@ export class ChatPanel extends SidePanel {
             themeManager: this._themeManager,
             chatCommandRegistry: this._chatCommandRegistry,
             attachmentOpenerRegistry: this._attachmentOpenerRegistry,
-            inputToolbarRegistry
+            inputToolbarRegistry,
+            messageFooterRegistry: this._messageFooterRegistry,
+            welcomeMessage: this._welcomeMessage
         });
         this.addWidget(new ChatSection({
             widget,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jupyterlab-chat",
-  "version": "0.10.1",
+  "version": "0.12.0",
   "description": "The library to build a chat based on shared document",
   "keywords": [
     "jupyter",
@@ -42,7 +42,7 @@
     "watch:src": "tsc -w --sourceMap"
   },
   "dependencies": {
-    "@jupyter/chat": "^0.10.1",
+    "@jupyter/chat": "^0.12.0",
     "@jupyter/collaborative-drive": "^3.0.0",
     "@jupyter/ydoc": "^2.0.0 || ^3.0.0",
     "@jupyterlab/application": "^4.2.0",

package/src/factory.ts

@@ -9,6 +9,7 @@ import {
   IAttachmentOpenerRegistry,
   IChatCommandRegistry,
   IInputToolbarRegistry,
+  IMessageFooterRegistry,
   ISelectionWatcher
 } from '@jupyter/chat';
 import { IThemeManager } from '@jupyterlab/apputils';
@@ -84,6 +85,8 @@ export class ChatWidgetFactory extends ABCWidgetFactory<
     this._chatCommandRegistry = options.chatCommandRegistry;
     this._attachmentOpenerRegistry = options.attachmentOpenerRegistry;
     this._inputToolbarFactory = options.inputToolbarFactory;
+    this._messageFooterRegistry = options.messageFooterRegistry;
+    this._welcomeMessage = options.welcomeMessage;
   }
 
   /**
@@ -97,6 +100,8 @@ export class ChatWidgetFactory extends ABCWidgetFactory<
     context.themeManager = this._themeManager;
     context.chatCommandRegistry = this._chatCommandRegistry;
     context.attachmentOpenerRegistry = this._attachmentOpenerRegistry;
+    context.messageFooterRegistry = this._messageFooterRegistry;
+    context.welcomeMessage = this._welcomeMessage;
     if (this._inputToolbarFactory) {
       context.inputToolbarRegistry = this._inputToolbarFactory.create();
     }
@@ -111,6 +116,8 @@ export class ChatWidgetFactory extends ABCWidgetFactory<
   private _chatCommandRegistry?: IChatCommandRegistry;
   private _attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
   private _inputToolbarFactory?: IInputToolbarRegistryFactory;
+  private _messageFooterRegistry?: IMessageFooterRegistry;
+  private _welcomeMessage?: string;
 }
 
 export namespace ChatWidgetFactory {
@@ -121,6 +128,8 @@ export namespace ChatWidgetFactory {
     chatCommandRegistry?: IChatCommandRegistry;
     attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
     inputToolbarRegistry?: IInputToolbarRegistry;
+    messageFooterRegistry?: IMessageFooterRegistry;
+    welcomeMessage?: string;
   }
 
   export interface IOptions<T extends LabChatPanel>
@@ -130,6 +139,8 @@ export namespace ChatWidgetFactory {
     chatCommandRegistry?: IChatCommandRegistry;
     attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
     inputToolbarFactory?: IInputToolbarRegistryFactory;
+    messageFooterRegistry?: IMessageFooterRegistry;
+    welcomeMessage?: string;
   }
 }
 

package/src/model.ts

@@ -67,7 +67,8 @@ export class LabChatModel
 
     this.sharedModel.awareness.on('change', this.onAwarenessChange);
 
-    this.input.valueChanged.connect(this.onInputChanged);
+    this.input.valueChanged.connect((_, value) => this.onInputChanged(value));
+    this.messageEditionAdded.connect(this.onMessageEditionAdded);
   }
 
   readonly collaborative = true;
@@ -259,9 +260,12 @@ export class LabChatModel
   }
 
   /**
-   * Function called by the input on key pressed.
+   * Function called when the input content changed.
+   *
+   * @param value - The whole input content.
+   * @param messageID - The ID of the message being edited, if any.
    */
-  onInputChanged = (_: IInputModel, value: string): void => {
+  onInputChanged = (value: string, messageID?: string): void => {
     if (!value || !this.config.sendTypingNotification) {
       return;
     }
@@ -269,26 +273,46 @@ export class LabChatModel
     if (this._timeoutWriting !== null) {
       window.clearTimeout(this._timeoutWriting);
     }
-    awareness.setLocalStateField('isWriting', true);
+    awareness.setLocalStateField('isWriting', messageID ?? true);
     this._timeoutWriting = window.setTimeout(() => {
       this._resetWritingStatus();
     }, WRITING_DELAY);
   };
 
+  /**
+   * Listen to the message edition input.
+   */
+  onMessageEditionAdded = (
+    _: IChatModel,
+    edition: IChatModel.IMessageEdition
+  ) => {
+    if (edition !== null) {
+      const _onInputChanged = (_: IInputModel, value: string) => {
+        this.onInputChanged(value, edition.id);
+      };
+
+      edition.model.valueChanged.connect(_onInputChanged);
+    }
+  };
+
   /**
    * Triggered when an awareness state changes.
    * Used to populate the writers list.
    */
   onAwarenessChange = () => {
-    const writers: IUser[] = [];
+    const writers: IChatModel.IWriter[] = [];
     const states = this.sharedModel.awareness.getStates();
     for (const stateID of states.keys()) {
       const state = states.get(stateID);
       if (!state || !state.user || state.user.username === this.user.username) {
         continue;
       }
-      if (state.isWriting) {
-        writers.push(state.user);
+      if (state.isWriting !== undefined && state.isWriting !== false) {
+        const writer: IChatModel.IWriter = {
+          user: state.user,
+          messageID: state.isWriting === true ? undefined : state.isWriting
+        };
+        writers.push(writer);
       }
     }
     this.updateWriters(writers);

package/src/token.ts

@@ -144,3 +144,12 @@ export const IInputToolbarRegistryFactory =
   new Token<IInputToolbarRegistryFactory>(
     'jupyterlab-chat:IInputToolbarRegistryFactory'
   );
+
+/**
+ * The token to add a welcome message to the chat.
+ * This token is not provided by default, but can be provided by third party extensions
+ * willing to add a welcome message to the chat.
+ */
+export const IWelcomeMessage = new Token<string>(
+  'jupyterlab-chat:IWelcomeMessage'
+);

package/src/widget.tsx

@@ -9,6 +9,7 @@ import {
   IChatCommandRegistry,
   IChatModel,
   IInputToolbarRegistry,
+  IMessageFooterRegistry,
   readIcon
 } from '@jupyter/chat';
 import { ICollaborativeDrive } from '@jupyter/collaborative-drive';
@@ -111,6 +112,8 @@ export class ChatPanel extends SidePanel {
     this._chatCommandRegistry = options.chatCommandRegistry;
     this._attachmentOpenerRegistry = options.attachmentOpenerRegistry;
     this._inputToolbarFactory = options.inputToolbarFactory;
+    this._messageFooterRegistry = options.messageFooterRegistry;
+    this._welcomeMessage = options.welcomeMessage;
 
     const addChat = new CommandToolbarButton({
       commands: this._commands,
@@ -180,7 +183,9 @@ export class ChatPanel extends SidePanel {
       themeManager: this._themeManager,
       chatCommandRegistry: this._chatCommandRegistry,
       attachmentOpenerRegistry: this._attachmentOpenerRegistry,
-      inputToolbarRegistry
+      inputToolbarRegistry,
+      messageFooterRegistry: this._messageFooterRegistry,
+      welcomeMessage: this._welcomeMessage
     });
 
     this.addWidget(
@@ -302,6 +307,8 @@ export class ChatPanel extends SidePanel {
   private _chatCommandRegistry?: IChatCommandRegistry;
   private _attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
   private _inputToolbarFactory?: IInputToolbarRegistryFactory;
+  private _messageFooterRegistry?: IMessageFooterRegistry;
+  private _welcomeMessage?: string;
 }
 
 /**
@@ -320,6 +327,8 @@ export namespace ChatPanel {
     chatCommandRegistry?: IChatCommandRegistry;
     attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
     inputToolbarFactory?: IInputToolbarRegistryFactory;
+    messageFooterRegistry?: IMessageFooterRegistry;
+    welcomeMessage?: string;
   }
 }