Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add updates downloading status and progress in UI and replace popups #3089

Open
wants to merge 3 commits into
base: clearnet
Choose a base branch
from

Conversation

VityaSchel
Copy link

First time contributor checklist:

Contributor checklist:

Description

Feature request: #1356

This PR introduces update indicator in left panel, which displays 3 states:

  1. Update is available — when clicked on it, app will start downloading update with electron-updater
  2. Update is being downloaded — when clicked on it, app will cancel downloading using CancellationToken
  3. Update is downloaded and ready to be installed — when clicked on it, app will use quitAndInstall method from autoUpdater
2024-04-30.05.31.00.mov

While in downloading state, circular component shows how much of file has been downloaded. Its spinning tells the user that app is actively working on update in background.

Additionally there is a tooltip verbally telling user exactly what this button means and what's gonna happen if they press it.

image

Why I think it's better than popups

While popups are great for capturing user's attention (this is important, since Session updates are also security patches), I think most of the time they just obstruct view and prevent user from doing some important things. Moreover, there is no way to delay update — to trigger update downloading you have to restart app or search in menus. And even if you do agree to update, as mentioned in #1356, you won't notice anything happens. My approach allows user to finish their tasks in conversations and then click download update button whenever they are ready. After that, the same applies to restart. Under the hood, it uses the same implementation with minor changes:

I removed update prompt popup and install prompt popup, but I didn't remove update error popup. Errors are somewhat extraordinary, so I think we can keep this popup.

I used electron-updater's update-downloaded and download-progress events to track states and send them to renderer process.

I've added appUpdates redux store reducer to store current status of this indicator's UI. Renderer and main processes communicate using ipcRenderer and webContents.send methods.

I've added close icon to Icons.tsx which is an X symbol that represents close, stop, delete, cancel actions.

I've added 2 translation keys: updateDownloadProgress (with progress variable — '%' suffix is added automatically), updateDownloadedRestart

@KeeJef
Copy link
Collaborator

KeeJef commented Apr 30, 2024

Great, will provide some more feedback on the UI of this shortly

@KeeJef
Copy link
Collaborator

KeeJef commented May 8, 2024

Provided a Figma link directly to @VityaSchel , has some slight design tweaks and some string changes

@VityaSchel
Copy link
Author

Provided a Figma link directly to @VityaSchel , has some slight design tweaks and some string changes

I updated 1 string, made prompt button with download arrow bigger, refactored structure (removed div and applied pointer events to buttons instead), fixed theming, added prompting tooltip that appears when update is available and hides after 5 seconds is user hasn't hovered over update button and added HTML button's pointer events props to SessionIconButton

@KeeJef KeeJef added the Jira This ticket is being tracked in Jira label Jun 3, 2024
@KeeJef
Copy link
Collaborator

KeeJef commented Jun 3, 2024

Tracking internally via SES-2060

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Jira This ticket is being tracked in Jira
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants