Add notification queue and display using toast #12959

telamonian · 2022-08-17T14:49:55Z

Adds toast ui to jupyterlab. I've taken @fcollonval's code from jupyterlab_toastify and merged it into ui-components. Currently non-functional draft.

References

Fixes #689
#7980
#12827

Code changes

Add NotificationManager; aka a notification queue with a changed signal to be notified
Add a namespace Notification to access to the manager (discourage for final user) and helper functions to emit notifications of various type (success, warning, error, info, in-progress or default) and helpers to update and dismiss a notification.
This is accessible globally from @jupyterlab/apputils - it does not require to request token in plugins.
Add a new plugin @jupyterlab/apputils-extension:notification that
- o Add commands apputils:notify to emit a notification and apputils:dismiss to dismiss a notification
- o Add a status bar widget to display the number of notifications
- o If a autoClose option is set to a positive number, a toast will be emitted. Otherwise the notification will be accessible by the user when clicking on the status bar widget (the goal is to limit disturbance of pop ups to the user)
- When clicked on the status bar widget, all notifications are displayed
- Allow for markdown in message
- Add a settings to force all notification to be silent

To have an idea of the toast style, you can look at the newly uploaded test snapshots in the Files changed tab.

User-facing changes

New bell icon in the status bar
User may be notified via toast

Backwards-incompatible changes

N/A

jupyterlab-probot · 2022-08-17T14:49:57Z

Thanks for making a pull request to jupyterlab!
To try out this branch on binder, follow this link:

krassowski · 2022-08-17T16:41:14Z

API: re-surfacing a comment from #689 (comment) and re-phrasing it to: should we use the same buttons API as in IDialog, or have a separate definition as in the initial draft?

jupyterlab/packages/apputils/src/dialog.tsx

Line 524 in 758c00c

buttons: ReadonlyArray<IButton>;

telamonian · 2022-08-17T16:47:47Z

@krassowski I do like the idea of standardizing our many button interfaces

ellisonbg · 2022-08-17T18:54:16Z

@telamonian Thanks for the PR. I am fine with us implementing the full notification system incrementally, and I think this capability is a good start. At the same time, APIs are difficult to change. Have you (or can you) sync with @afshin and @andrii-i about the work they have done on the broader notification system and the API requirements therein? Best case scenario, any additional APIs needed could be added during the 4.0 release cycle without breaking anything. I think they were using parts of jupyterlab_toastify so hopefully it will be easy to align.

fcollonval · 2022-08-18T08:55:06Z

Notes for the integration:

We should not use font awesome but prefer to bring the needed icons in core.
We should remove notify L337 to avoid binding us to much with the underlying library
It will be nice to be able to provide a custom renderer as available for dialog for example.

I am fine with us implementing the full notification system incrementally

👍 for example a follow-up could be to add a manager as middle-man between the notification interface and the display (to allow for history or for filtering).

API: re-surfacing a comment from #689 (comment) and re-phrasing it to: should we use the same buttons API as in IDialog, or have a separate definition as in the initial draft?

Although it will be nice to avoid separating those definitions, I don't think it will be possible. The main reason is the behavior difference between a dialog and a notification. In the dialog case, it prompts the user to do immediate action blocking other UI elements. For that our API uses a promise returning the result of the dialog. This will not fit for a toast that has a behavior emit a message and go-on. Hence the use of callback in the notification button interface.
We could change the dialog logic to use callback. But that will have a high impact for downstream extensions (and lots work in core itself).

fcollonval · 2022-09-21T10:16:43Z

@telamonian I have taken the freedom to push this one to be able to get it into 3.5.

fcollonval · 2022-09-26T07:29:51Z

bot please update snapshots

fcollonval · 2022-09-26T11:08:43Z

bot please update documentation snapshots

Co-authored-by: Michał Krassowski <5832902+krassowski@users.noreply.github.com>

fcollonval · 2022-10-12T10:13:20Z

bot please update galata snapshots

fcollonval · 2022-10-12T11:29:43Z

bot please update galata snapshots

fcollonval · 2022-10-12T12:15:10Z

Kicking CI

krassowski

We discussed this at the team meeting today, the question of returning a string vs an IDisposable was deferred to a follow up PR with good arguments for having a string (allowing other actors to act on notification e.g. in RTC context) and for IDisposable (type safety, developer convenience).

This PR currently uses a string with ID but it can be changed in a follow up PR before 4.0 release if needed.

fcollonval

Thanks all for the reviews

jtpio · 2022-10-13T08:09:15Z

packages/apputils-extension/src/notificationplugin.tsx

+export const notificationPlugin: JupyterFrontEndPlugin<void> = {
+  id: '@jupyterlab/apputils-extension:notification',
+  autoStart: true,
+  requires: [IStatusBar],


Is IStatusBar really required for this plugin? Or could it also be made optional?

Or move the status bar related logic to a separate plugin so the commands are still available.

The only UI entry point for the notification is a status bar widget - as for the log console.

I don't know what would be the best solution for Notebook v7 - as we should promote not disturbing the user with many toasts.

This definitely needs to be discussed for notebook v7 (including the log console that I guess is not loaded neither for now).

If the status bar is the only part of the UI where notifications are displayed for now then Notebook 7 can just ignore for now.

Although it would be great to have to leverage announcements features in nb7 like #13365

fcollonval · 2022-10-31T15:32:39Z

@meeseeksdev please backport to 3.6.x

lumberbot-app · 2022-10-31T15:33:00Z

Owee, I'm MrMeeseeks, Look at me.

There seem to be a conflict, please backport manually. Here are approximate instructions:

Checkout backport branch and update it.

git checkout 3.6.x
git pull

Cherry pick the first parent branch of the this PR on top of the older branch:

git cherry-pick -x -m1 8c93347cdd57c0ca20197a2f4eabbc43f2ab959e

You will likely have some merge/cherry-pick conflict here, fix them and commit:

git commit -am 'Backport PR #12959: Add notification queue and display using toast'

Push to a named branch:

git push YOURFORK 3.6.x:auto-backport-of-pr-12959-on-3.6.x

Create a PR against branch 3.6.x, I would have named this PR:

"Backport PR #12959 on branch 3.6.x (Add notification queue and display using toast)"

And apply the correct labels and milestones.

Congratulations — you did some good work! Hopefully your backport PR will be tested by the continuous integration and merged soon!

Remember to remove the Still Needs Manual Backport label once the PR gets merged.

If these instructions are inaccurate, feel free to suggest an improvement.

…g toast

…y using toast) (#13360) * Backport PR #12959: Add notification queue and display using toast * Update Playwright Snapshots * Fix button styles * Update Playwright Snapshots * markedparser-extension does not exists in 3.x Co-authored-by: Max Klein <telamonian@users.noreply.github.com> Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

github-actions bot assigned telamonian Aug 17, 2022

github-actions bot added the pkg:ui-components label Aug 17, 2022

krassowski added the feature label Aug 17, 2022

fcollonval mentioned this pull request Aug 18, 2022

Weekly Team Meetings: Jul-Dec 2022 jupyterlab/frontends-team-compass#152

Closed

fcollonval mentioned this pull request Sep 12, 2022

JupyterLab 3.5.0 Release #13064

Closed

8 tasks

fcollonval force-pushed the add-ui-toast branch from a7a1389 to 67b6ea3 Compare September 21, 2022 10:19

github-actions bot added Design System CSS pkg:application pkg:apputils tag:CSS For general CSS related issues and pecadilloes tag:Testing labels Sep 21, 2022

fcollonval added the enhancement label Sep 21, 2022

github-actions bot added the pkg:statusbar label Sep 22, 2022

fcollonval changed the title ~~pulled code from jupyterlab_toastify into ui-components~~ Add notification queue and display using toast Sep 23, 2022

github-actions bot added the documentation label Sep 23, 2022

fcollonval force-pushed the add-ui-toast branch from 2ad4e8d to 72f2136 Compare September 26, 2022 08:41

fcollonval added this to the 4.0.0 milestone Sep 26, 2022

fcollonval force-pushed the add-ui-toast branch from a3f54a4 to 4ee441f Compare September 26, 2022 14:13

fcollonval mentioned this pull request Sep 29, 2022

logger inaccessible externally. jupyterlab/jupyterlab-git#1171

Closed

fcollonval marked this pull request as ready for review September 29, 2022 09:34

fcollonval force-pushed the add-ui-toast branch from 4ee441f to 1bc6fa5 Compare September 29, 2022 09:34

fcollonval added the status:Needs Review label Sep 29, 2022

fcollonval and others added 4 commits October 12, 2022 12:11

[skip ci] Update snapshots

34f1d34

Apply suggestions from code review

802cbba

Co-authored-by: Michał Krassowski <5832902+krassowski@users.noreply.github.com>

Apply second review suggestions

1b84e37

Use relative width

7538f03

fcollonval force-pushed the add-ui-toast branch from 31c2cba to 7538f03 Compare October 12, 2022 10:13

Update Playwright Snapshots

11a7160

Update Playwright Snapshots

4551479

fcollonval closed this Oct 12, 2022

fcollonval reopened this Oct 12, 2022

krassowski approved these changes Oct 12, 2022

View reviewed changes

fcollonval reviewed Oct 13, 2022

View reviewed changes

fcollonval merged commit 8c93347 into jupyterlab:master Oct 13, 2022

jtpio reviewed Oct 13, 2022

View reviewed changes

jtpio mentioned this pull request Oct 14, 2022

Update to JupyterLab 4.0.0a31 jupyter/notebook#6577

Closed

8 tasks

fcollonval mentioned this pull request Oct 14, 2022

JupyterLab 3.6.0 Release #13221

Closed

23 tasks

fcollonval removed the status:Needs Review label Oct 31, 2022

lumberbot-app bot added the Still Needs Manual Backport label Oct 31, 2022

fcollonval pushed a commit to fcollonval/jupyterlab that referenced this pull request Oct 31, 2022

Backport PR jupyterlab#12959: Add notification queue and display usin…

81b28e1

…g toast

fcollonval mentioned this pull request Oct 31, 2022

Backport PR #12959 on branch 3.6.x (Add notification queue and display using toast) #13360

Merged

fcollonval pushed a commit to fcollonval/jupyterlab that referenced this pull request Nov 3, 2022

Backport PR jupyterlab#12959: Add notification queue and display usin…

114ff37

…g toast

fcollonval removed the Still Needs Manual Backport label Nov 4, 2022

jtpio mentioned this pull request Nov 18, 2022

Update to JupyterLab 4.0.0a31 jupyter/notebook#6627

Merged

11 tasks

jtpio mentioned this pull request Nov 26, 2022

Notification commands provided by apputils seem to not be available #13495

Closed

github-actions bot locked as resolved and limited conversation to collaborators Nov 19, 2023

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add notification queue and display using toast #12959

Add notification queue and display using toast #12959

telamonian commented Aug 17, 2022 •

edited by fcollonval

jupyterlab-probot bot commented Aug 17, 2022

krassowski commented Aug 17, 2022 •

edited

telamonian commented Aug 17, 2022

ellisonbg commented Aug 17, 2022

fcollonval commented Aug 18, 2022

fcollonval commented Sep 21, 2022

fcollonval commented Sep 26, 2022

fcollonval commented Sep 26, 2022

fcollonval commented Oct 12, 2022

fcollonval commented Oct 12, 2022

fcollonval commented Oct 12, 2022

krassowski left a comment

fcollonval left a comment

jtpio Oct 13, 2022

fcollonval Oct 13, 2022

jtpio Nov 18, 2022

jtpio Nov 18, 2022

fcollonval commented Oct 31, 2022

lumberbot-app bot commented Oct 31, 2022

Add notification queue and display using toast #12959

Add notification queue and display using toast #12959

Conversation

telamonian commented Aug 17, 2022 • edited by fcollonval

References

Code changes

User-facing changes

Backwards-incompatible changes

jupyterlab-probot bot commented Aug 17, 2022

krassowski commented Aug 17, 2022 • edited

telamonian commented Aug 17, 2022

ellisonbg commented Aug 17, 2022

fcollonval commented Aug 18, 2022

fcollonval commented Sep 21, 2022

fcollonval commented Sep 26, 2022

fcollonval commented Sep 26, 2022

fcollonval commented Oct 12, 2022

fcollonval commented Oct 12, 2022

fcollonval commented Oct 12, 2022

krassowski left a comment

Choose a reason for hiding this comment

fcollonval left a comment

Choose a reason for hiding this comment

jtpio Oct 13, 2022

Choose a reason for hiding this comment

fcollonval Oct 13, 2022

Choose a reason for hiding this comment

jtpio Nov 18, 2022

Choose a reason for hiding this comment

jtpio Nov 18, 2022

Choose a reason for hiding this comment

fcollonval commented Oct 31, 2022

lumberbot-app bot commented Oct 31, 2022

telamonian commented Aug 17, 2022 •

edited by fcollonval

krassowski commented Aug 17, 2022 •

edited