feat(#93): notification bell with upload progress
Replace the floating upload toast with a notification bell in the top bar
(between language selector and user avatar). All upload progress, completion,
and quota errors now flow through the bell dropdown panel.
- Add notification bell button with animated badge counter
- Dropdown panel shows per-file upload progress bars and overall batch progress
- Bell rings on new notifications when panel is closed
- Upload success/error states with color-coded icons
- Quota exceeded errors shown as notification items
- Clear all button to dismiss notifications
- Panel auto-opens when upload starts
- Full dark mode support
- Mutual exclusion with user menu (opening one closes the other)
- i18n keys for en/es (notifications.title, notifications.empty)
- SW cache bump to v10
Files:
- static/js/notifications.js (new module)
- static/index.html: bell markup + remove old toast
- static/css/style.css: bell + panel styles + dark mode
- static/js/fileOperations.js: redirect upload progress to notification bell
- static/js/app.js: close bell when user menu opens
- static/locales/{en,es}.json: i18n keys
- static/sw.js: cache v10 + notifications.js asset
This commit is contained in:
@@ -161,6 +161,13 @@ function setupUserMenu() {
|
||||
e.stopPropagation();
|
||||
const isOpen = wrapper.classList.contains('open');
|
||||
wrapper.classList.toggle('open');
|
||||
|
||||
// Close notification bell if open
|
||||
const notifWrapper = document.getElementById('notif-wrapper');
|
||||
const notifBtn = document.getElementById('notif-bell-btn');
|
||||
if (notifWrapper) notifWrapper.classList.remove('open');
|
||||
if (notifBtn) notifBtn.classList.remove('active');
|
||||
|
||||
if (!isOpen) {
|
||||
updateUserMenuData();
|
||||
// Show/hide admin panel button based on user role
|
||||
|
||||
Reference in New Issue
Block a user