Allow extensions to override chat panel icon and location

[dlqqq]

Problem

I've gotten some requests from users who want to want to configure the chat icon and its location.

Proposed Solution

Create a new plugin that provides an object that looks something like this:

interface JupyterChatConfig {
  placement: 'left' | 'right';
  icon: LabIcon;
}

Then have Jupyter Chat read from this plugin to get the side panel placement and icon.

Developers can disable the default plugin providing this token and override it with a custom one in a labextension.

Additional context

[krassowski]

placement

Do you mean like this:

This can be set via json overrides of @jupyterlab/application-extension:shell with:

"JupyterlabChat:sidepanel": {
  "area": "right"
}

Swapping icons is easy as you can override them in extensions by redefining it with the same identifier (last one wins). I presume you would want to swap this one too:

The downside of swapping icons is that all usages get swapped, so the ask here could be to have an alias for the tile and sidebar usage which is distinct from other chat icon usages.

[dlqqq]

@krassowski Thank you! I didn't know about the icon override. I think that'll be fine for now and we can easily create a different icon for filebrowser entries if needed.

Regarding the side panel override, are you talking about the overrides.json file that JupyterLab supports? I've never used this file before. Should the content look like this?

{
  "@jupyterlab/application-extension:shell": {
    "JupyterlabChat:sidepanel": {
      "area": "right"
    }
  }
}

[brichet]

@dlqqq, users can also set the position (left or right) from the UI, and it is persistent.

record-2026-02-20_08.48.44.webm

[krassowski]

@dlqqq you are missing one level nesting for "multiple" or "single" mode. But in general, you get overrides auto-generated rather than thinking about it -> you do what @brichet demonstrated then go to Settings → Settings Editor → click Export button and you get a correctly formatted overrides.json:

[krassowski]

@dlqqq would the below snippet work for you?

const chatPanelRightExtension: JupyterFrontEndPlugin<void> = {
  id: 'my-extension:chat-panel-right',
  description: 'Moves the chat panel to the right side and swaps its icon.',
  autoStart: true,
  requires: [IChatPanel],
  activate: (app: JupyterFrontEnd, chatPanel: MultiChatPanel) => {
    // Create a new icon
    const rightIcon = new LabIcon({
      name: 'my-extension:right-chat-icon',
      svgstr: rightIconSvg
    });

    // Swap icon
    chatPanel.title.icon = rightIcon;

    // Move the chat panel to the right by default
    app.shell.add(chatPanel, 'right', {
      rank: 2000
    });
  }
};

Adding the same panel with different settings to the shell just moves it do a different place. There is no need to redeclare the icon because chat panel is exposed as a token already.