feat: Adding Attach button

[nakul-py]

Add a new Attach button that opens a file browser slider to select and inject file paths into the chat input.

Screencast.From.2025-07-18.17-01-09.mp4

Closes #103

[nakul-py]

Related to #103

[jtpio]

Thanks @nakul-py for working on this!

Wondering if we will also be available to leverage the change that was recently merged in jupyter-chat (jupyterlab/jupyter-chat#248)? This still needs a release of jupyter-chat before we can use it here.

[nakul-py]

Yes, @jtpio we can also work on drag and drop feature now as jupyter-chat publish release for the drag and drop feature. Will we add this drag and drop feature with this pr or with another?

[brichet]

Thanks @nakul-py.

First, I really like the UI of the file selector, maybe something similar could be ported upstream in Jupyterlab, instead of the current file selector.

About the current PR, I'm not sure about the user experience of it, since you have to “send” the message once to display the file dialog, and then send it again after selecting the file.

jupyter-chat already provides an attach button, that could be added to the current chat by providing an IDocumentManager to the model. It can be tried at https://jupyter-chat.readthedocs.io/en/latest/lite/lab/index.html.
One advantage of using the button is that it natively uses the attachments API of jupyter-chat, and adds the attachments to the messages.

Do you think that we should/could take advantage of the existing UI/UX of jupyter-chat ?

[nakul-py]

jupyter-chat already provides an attach button, that could be added to the current chat by providing an IDocumentManager to the model. It can be tried at jupyter-chat.readthedocs.io/en/latest/lite/lab/index.html.
One advantage of using the button is that it natively uses the attachments API of jupyter-chat, and adds the attachments to the messages.

Yes we can use the attach button instead of using /file command everytime to attach files as in jupyter-chat.

[nakul-py]

@jtpio and @brichet I have added the attach button, same as in jupyter-chat and updated the video.

[nakul-py]

First, I really like the UI of the file selector, maybe something similar could be ported upstream in Jupyterlab, instead of the current file selector.

Hey @brichet I am happy to contribute to JupyterLab, but as I am new to JupyterLab, I want your guidance.

[brichet]

Thanks again @nakul-py for working on this.

jupyter-chat already provides an attach button, that could be added to the current chat by providing an IDocumentManager to the model.

Did you try to add the IDocumentManager to the model (probably here) ?
It seems to me that this PR redoes what already exists in jupyter-chat. An attach button is already in the default toolbar registry, but not enabled because of the missing IDocumentManager in the model. And the attach button already uses the filebrowser modal from jupyterlab.

[nakul-py]

Did you try to add the IDocumentManager to the model (probably here) ?

Now it's done with IDocumentManager and help me if you want better Filebrowser UI and where in (jupyterlite/ai or jupyterlab)

[brichet]

@nakul-py thanks again for working on this and updating the PR quickly.
I'll review it at the end of the week, I can't do it before.

[brichet]

Thanks, this looks good.

I wonder now what should we do with that attachment, currently it is not used when sending the message.

We should probably send the file content (and name/path probably) with the message, for the LLM to be able to access it. It could be an additional message when the attachment is provided.

Since the file content can be huge (and use a lot of token), I would suggest making this attachment as optional in the settings (default to not used for now), with a warning about the amount of data that can be sent.

[nakul-py]

@brichet How this looks.

Screencast.From.2025-07-24.17-30-15.mp4