Add basic update notification mechanism

[Aivean]

Problem statement

Since we're using react router, when we navigate to any page, the html and js is not reloaded. Until user force-refreshes the page, the app and the backend versions will be divergent.

Solution

• FINGERPRINT=uuid is added during the build to .env
• Caddy returns this UUID as X-Fingerprint header for API responses
• UI tracks this header for /status request
• when the header value is changed, following most links will refresh the page once, transparently to the user

Testing

Tested on staging

Deploy action1: https://github.com/spaceshelter/orbitar/actions/runs/5096833950/jobs/9162954788

Deploy action2: https://github.com/spaceshelter/orbitar/actions/runs/5096844123

Added headers:

Checked that page is refreshed on link click after the deployment.

[Aivean]

@Lexy2 has a good point, it makes sense to reload the page transparently to the user (e.g. on certain navigation events). Marking as draft for now.

[Lexy2]

Testing changed fingerprint:

1. Add FINGERPRINT=xxx to your .env file
2. Load the pages, click links, observe that the pages do not reload. Keep the page open.
3. Check that the returned header from API calls is X-Fingerprint: xxx
4. Change the fingerprint value in the .env file to FINGERPRINT=yyy
5. Stop Caddy: docker stop orbitar-caddy-1
6. Kill Caddy: docker rm orbitar-caddy-1
7. Run docker-compose -f docker-compose.dev.yml up caddy to reload
8. Click any link on the orbitar page.
9. Observe that the page is reloaded.

[Lexy2]

Otherwise looks good, I like the new update mechanism way more than an explicit Reload button.

[Aivean]

Otherwise looks good, I like the new update mechanism way more than an explicit Reload button.

I thought more about it, there is a chance to simplify its implementation. Will try today.

[Aivean]

@Lexy2 , I simplified the reloading logic (and addressed your comment), please check.

[Lexy2]

If someone has a page open and a server update is deployed, then when this person clicks a link to open a post, for example, the link will open and then the page will reload. Which is not nice, but much better than attaching an observable to each link tag.