jupyterlab-chat 0.11.0 → 0.13.0

package/lib/factory.d.ts

@@ -48,12 +48,20 @@ export declare class ChatWidgetFactory extends ABCWidgetFactory<LabChatPanel, La
      * @returns The widget
      */
     protected createNewWidget(context: ChatWidgetFactory.IContext): LabChatPanel;
+    /**
+     * IMPORTANT: this property must be defined to use the `RtcContentProvider`
+     * registered by `jupyter_collaboration`. Without this, the chat document
+     * widgets will not connect.
+     */
+    get contentProviderId(): string;
+    set contentProviderId(_value: string | undefined);
     private _themeManager;
     private _rmRegistry;
     private _chatCommandRegistry?;
     private _attachmentOpenerRegistry?;
     private _inputToolbarFactory?;
     private _messageFooterRegistry?;
+    private _welcomeMessage?;
 }
 export declare namespace ChatWidgetFactory {
     interface IContext extends DocumentRegistry.IContext<LabChatModel> {
@@ -64,6 +72,7 @@ export declare namespace ChatWidgetFactory {
         attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
         inputToolbarRegistry?: IInputToolbarRegistry;
         messageFooterRegistry?: IMessageFooterRegistry;
+        welcomeMessage?: string;
     }
     interface IOptions<T extends LabChatPanel> extends DocumentRegistry.IWidgetFactoryOptions<T> {
         themeManager: IThemeManager | null;
@@ -72,6 +81,7 @@ export declare namespace ChatWidgetFactory {
         attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
         inputToolbarFactory?: IInputToolbarRegistryFactory;
         messageFooterRegistry?: IMessageFooterRegistry;
+        welcomeMessage?: string;
     }
 }
 export declare class LabChatModelFactory implements DocumentRegistry.IModelFactory<LabChatModel> {

package/lib/factory.js

@@ -54,6 +54,7 @@ export class ChatWidgetFactory extends ABCWidgetFactory {
         this._attachmentOpenerRegistry = options.attachmentOpenerRegistry;
         this._inputToolbarFactory = options.inputToolbarFactory;
         this._messageFooterRegistry = options.messageFooterRegistry;
+        this._welcomeMessage = options.welcomeMessage;
     }
     /**
      * Create a new widget given a context.
@@ -67,6 +68,7 @@ export class ChatWidgetFactory extends ABCWidgetFactory {
         context.chatCommandRegistry = this._chatCommandRegistry;
         context.attachmentOpenerRegistry = this._attachmentOpenerRegistry;
         context.messageFooterRegistry = this._messageFooterRegistry;
+        context.welcomeMessage = this._welcomeMessage;
         if (this._inputToolbarFactory) {
             context.inputToolbarRegistry = this._inputToolbarFactory.create();
         }
@@ -75,6 +77,16 @@ export class ChatWidgetFactory extends ABCWidgetFactory {
             content: new ChatWidget(context)
         });
     }
+    /**
+     * IMPORTANT: this property must be defined to use the `RtcContentProvider`
+     * registered by `jupyter_collaboration`. Without this, the chat document
+     * widgets will not connect.
+     */
+    get contentProviderId() {
+        return 'rtc';
+    }
+    // Must override both getter and setter from ABCFactory for type compatibility.
+    set contentProviderId(_value) { }
 }
 export class LabChatModelFactory {
     constructor(options) {

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,5 +1,5 @@
 import { ChatWidget, IAttachmentOpenerRegistry, IChatCommandRegistry, IChatModel, IMessageFooterRegistry } from '@jupyter/chat';
-import { ICollaborativeDrive } from '@jupyter/collaborative-drive';
+import { Contents } from '@jupyterlab/services';
 import { IThemeManager } from '@jupyterlab/apputils';
 import { DocumentWidget } from '@jupyterlab/docregistry';
 import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
@@ -84,7 +84,7 @@ export declare class ChatPanel extends SidePanel {
     private _chatNamesChanged;
     private _commands;
     private _defaultDirectory;
-    private _drive;
+    private _contentsManager;
     private _openChat;
     private _rmRegistry;
     private _themeManager;
@@ -92,6 +92,7 @@ export declare class ChatPanel extends SidePanel {
     private _attachmentOpenerRegistry?;
     private _inputToolbarFactory?;
     private _messageFooterRegistry?;
+    private _welcomeMessage?;
 }
 /**
  * The chat panel namespace.
@@ -102,7 +103,7 @@ export declare namespace ChatPanel {
      */
     interface IOptions extends SidePanel.IOptions {
         commands: CommandRegistry;
-        drive: ICollaborativeDrive;
+        contentsManager: Contents.IManager;
         rmRegistry: IRenderMimeRegistry;
         themeManager: IThemeManager | null;
         defaultDirectory: string;
@@ -110,6 +111,7 @@ export declare namespace ChatPanel {
         attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
         inputToolbarFactory?: IInputToolbarRegistryFactory;
         messageFooterRegistry?: IMessageFooterRegistry;
+        welcomeMessage?: string;
     }
 }
 /**

package/lib/widget.js

@@ -69,9 +69,9 @@ export class ChatPanel extends SidePanel {
          */
         this.updateChatList = async () => {
             const extension = chatFileType.extensions[0];
-            this._drive
+            this._contentsManager
                 .get(this._defaultDirectory)
-                .then(contentModel => {
+                .then((contentModel) => {
                 const chatsNames = {};
                 contentModel.content
                     .filter(f => f.type === 'file' && f.name.endsWith(extension))
@@ -101,7 +101,7 @@ export class ChatPanel extends SidePanel {
         this._chatNamesChanged = new Signal(this);
         this.addClass(SIDEPANEL_CLASS);
         this._commands = options.commands;
-        this._drive = options.drive;
+        this._contentsManager = options.contentsManager;
         this._rmRegistry = options.rmRegistry;
         this._themeManager = options.themeManager;
         this._defaultDirectory = options.defaultDirectory;
@@ -109,6 +109,7 @@ export class ChatPanel extends SidePanel {
         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,
@@ -166,7 +167,8 @@ export class ChatPanel extends SidePanel {
             chatCommandRegistry: this._chatCommandRegistry,
             attachmentOpenerRegistry: this._attachmentOpenerRegistry,
             inputToolbarRegistry,
-            messageFooterRegistry: this._messageFooterRegistry
+            messageFooterRegistry: this._messageFooterRegistry,
+            welcomeMessage: this._welcomeMessage
         });
         this.addWidget(new ChatSection({
             widget,

package/package.json

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

package/src/factory.ts

@@ -86,6 +86,7 @@ export class ChatWidgetFactory extends ABCWidgetFactory<
     this._attachmentOpenerRegistry = options.attachmentOpenerRegistry;
     this._inputToolbarFactory = options.inputToolbarFactory;
     this._messageFooterRegistry = options.messageFooterRegistry;
+    this._welcomeMessage = options.welcomeMessage;
   }
 
   /**
@@ -100,6 +101,7 @@ export class ChatWidgetFactory extends ABCWidgetFactory<
     context.chatCommandRegistry = this._chatCommandRegistry;
     context.attachmentOpenerRegistry = this._attachmentOpenerRegistry;
     context.messageFooterRegistry = this._messageFooterRegistry;
+    context.welcomeMessage = this._welcomeMessage;
     if (this._inputToolbarFactory) {
       context.inputToolbarRegistry = this._inputToolbarFactory.create();
     }
@@ -109,12 +111,23 @@ export class ChatWidgetFactory extends ABCWidgetFactory<
     });
   }
 
+  /**
+   * IMPORTANT: this property must be defined to use the `RtcContentProvider`
+   * registered by `jupyter_collaboration`. Without this, the chat document
+   * widgets will not connect.
+   */
+  get contentProviderId(): string {
+    return 'rtc';
+  }
+  // Must override both getter and setter from ABCFactory for type compatibility.
+  set contentProviderId(_value: string | undefined) {}
   private _themeManager: IThemeManager | null;
   private _rmRegistry: IRenderMimeRegistry;
   private _chatCommandRegistry?: IChatCommandRegistry;
   private _attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
   private _inputToolbarFactory?: IInputToolbarRegistryFactory;
   private _messageFooterRegistry?: IMessageFooterRegistry;
+  private _welcomeMessage?: string;
 }
 
 export namespace ChatWidgetFactory {
@@ -126,6 +139,7 @@ export namespace ChatWidgetFactory {
     attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
     inputToolbarRegistry?: IInputToolbarRegistry;
     messageFooterRegistry?: IMessageFooterRegistry;
+    welcomeMessage?: string;
   }
 
   export interface IOptions<T extends LabChatPanel>
@@ -136,6 +150,7 @@ export namespace ChatWidgetFactory {
     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

@@ -12,7 +12,7 @@ import {
   IMessageFooterRegistry,
   readIcon
 } from '@jupyter/chat';
-import { ICollaborativeDrive } from '@jupyter/collaborative-drive';
+import { Contents } from '@jupyterlab/services';
 import { IThemeManager } from '@jupyterlab/apputils';
 import { PathExt } from '@jupyterlab/coreutils';
 import { DocumentWidget } from '@jupyterlab/docregistry';
@@ -105,7 +105,7 @@ export class ChatPanel extends SidePanel {
     super(options);
     this.addClass(SIDEPANEL_CLASS);
     this._commands = options.commands;
-    this._drive = options.drive;
+    this._contentsManager = options.contentsManager;
     this._rmRegistry = options.rmRegistry;
     this._themeManager = options.themeManager;
     this._defaultDirectory = options.defaultDirectory;
@@ -113,6 +113,7 @@ export class ChatPanel extends SidePanel {
     this._attachmentOpenerRegistry = options.attachmentOpenerRegistry;
     this._inputToolbarFactory = options.inputToolbarFactory;
     this._messageFooterRegistry = options.messageFooterRegistry;
+    this._welcomeMessage = options.welcomeMessage;
 
     const addChat = new CommandToolbarButton({
       commands: this._commands,
@@ -183,7 +184,8 @@ export class ChatPanel extends SidePanel {
       chatCommandRegistry: this._chatCommandRegistry,
       attachmentOpenerRegistry: this._attachmentOpenerRegistry,
       inputToolbarRegistry,
-      messageFooterRegistry: this._messageFooterRegistry
+      messageFooterRegistry: this._messageFooterRegistry,
+      welcomeMessage: this._welcomeMessage
     });
 
     this.addWidget(
@@ -203,9 +205,9 @@ export class ChatPanel extends SidePanel {
    */
   updateChatList = async (): Promise<void> => {
     const extension = chatFileType.extensions[0];
-    this._drive
+    this._contentsManager
       .get(this._defaultDirectory)
-      .then(contentModel => {
+      .then((contentModel: Contents.IModel) => {
         const chatsNames: { [name: string]: string } = {};
         (contentModel.content as any[])
           .filter(f => f.type === 'file' && f.name.endsWith(extension))
@@ -298,7 +300,7 @@ export class ChatPanel extends SidePanel {
   );
   private _commands: CommandRegistry;
   private _defaultDirectory: string;
-  private _drive: ICollaborativeDrive;
+  private _contentsManager: Contents.IManager;
   private _openChat: ReactWidget;
   private _rmRegistry: IRenderMimeRegistry;
   private _themeManager: IThemeManager | null;
@@ -306,6 +308,7 @@ export class ChatPanel extends SidePanel {
   private _attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
   private _inputToolbarFactory?: IInputToolbarRegistryFactory;
   private _messageFooterRegistry?: IMessageFooterRegistry;
+  private _welcomeMessage?: string;
 }
 
 /**
@@ -317,7 +320,7 @@ export namespace ChatPanel {
    */
   export interface IOptions extends SidePanel.IOptions {
     commands: CommandRegistry;
-    drive: ICollaborativeDrive;
+    contentsManager: Contents.IManager;
     rmRegistry: IRenderMimeRegistry;
     themeManager: IThemeManager | null;
     defaultDirectory: string;
@@ -325,6 +328,7 @@ export namespace ChatPanel {
     attachmentOpenerRegistry?: IAttachmentOpenerRegistry;
     inputToolbarFactory?: IInputToolbarRegistryFactory;
     messageFooterRegistry?: IMessageFooterRegistry;
+    welcomeMessage?: string;
   }
 }