feat: add in-app update notification banner to sidebar

Subscribe to auto-update status at the App level and render a compact
UpdateBanner in the sidebar footer when an update is available,
downloading, or downloaded:

- Available/downloading: subtle banner with progress bar, dismissable
- Downloaded: prominent 'Restart to update' action with glow effect

Clicking the banner opens Settings directly on the Troubleshooting
section via a new initialSection prop on SettingsPanel.

New files:
- src/renderer/components/ui/UpdateBanner.tsx

Modified files:
- App.tsx: subscribe to onUpdateStatus, wire props
- Sidebar.tsx: accept and render UpdateBanner
- SettingsPanel.tsx: add initialSection prop + export SettingsSection type
- styles.css: add update-banner-enter slide-up animation

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
David Kaya
2026-03-30 17:15:38 +02:00
co-authored by Copilot
parent 9647b5fdb5
commit 772c84fed3
6 changed files with 169 additions and 4 deletions
+14
View File
@@ -626,6 +626,19 @@ body {
animation: banner-slide-in 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
/* ── Update banner slide-up ──────────────────────────────────── */
@keyframes update-banner-in {
from {
opacity: 0;
transform: translateY(100%);
}
}
.update-banner-enter {
animation: update-banner-in 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
/* ── Thinking process section ────────────────────────────────── */
@keyframes thinking-process-in {
@@ -651,6 +664,7 @@ body {
.msg-actions-enter,
.session-item-enter,
.banner-slide-enter,
.update-banner-enter,
.thinking-process-enter {
animation: none;
}