Indicated when updated version is available

[colebemis]

Since we use service workers, users may be using a cached version of Lumen without realizing that there are updates available (You need to refresh a couple of times to clear the service worker cache).

We should indicate when updates are available and make updating to the latest version easy.

From rosebud.app:

[Pkcarreno]

why not use vitePWA? it provides a simple way to display the update prompt (and many other things).

[colebemis]

@Pkcarreno That sounds awesome. I hadn't heard of vitePWA. Are you interested in opening a PR?

[Pkcarreno]

Sure!

In order to make it work properly we have to migrate the manifest and the workbox to the vitePWA config and remove any reference to manual injection of SW, the config should look like this:

vitePWA({
  //...
  manifest: {
    //...
  },
  workbox: {
    //...
  }
})

vitePWA is responsible of generating the workbox and the injection process, so the execution of npm run build:service-worker should be removed from the workflow.

For the end user there shouldn't be any difference when using the app, but I would still do some testing before launching it.

After that migration we can start implementing the update prompt. For this do you have any idea of how it should look like?

In this app I worked 2 update flows, the first one is an alert with sonner where it shows suddenly that there is an update, if the user doesn't click during the seconds that it is shown it remains as a button in the menu with the action to update. The idea of these flows I took from Todoist.

Btw, I just discovered this app and I think it's great, good job 👍

[Pkcarreno]

Hi @colebemis, any news on the progress of the UI?

[colebemis]

@Pkcarreno Oh sorry, I didn't realize you were waiting on me for the design. Do you want to take a stab at the design and I can review?

[Pkcarreno]

@colebemis for sure! I'll take a look at it over the weekend.