Show warning if SSE connection or send command fails

[florian-h05]

Depends on #1807.

Currently, SSE connection and sending commands fail silently, which makes the user think that everything is fine, but instead outdated values are displayed and commands are not sent.

This implements user warnings for such cases, a large openHAB orange toast "Communication failure" with the option to reload is displayed at the bottom center:

• as long as SSE connection is broken
• when sending a command to an Item failed for 5 sec

If the Item does not exist (error code 404), " not found" is displayed for 5 sec

[florian-h05]

/cc @digitaldan WDYT? I've seen that you created #1441.

[relativeci]

Job #905: Bundle Size — 15.71MiB (+0.28%).

caf46e6(current) vs 591137e main#904(baseline)

⚠️ Bundle contains 16 duplicate packages

Metrics (4 changes)

	Current Job #905	Baseline Job #904
Initial JS	1.73MiB(+0.59%)	1.72MiB
Initial CSS	608.8KiB(+0.03%)	608.59KiB
Cache Invalidation	93.91%	93.91%
Chunks	219	219
Assets	689	689
Modules	1710(+0.23%)	1706
Duplicate Modules	82	82
Duplicate Code	1.71%(-0.58%)	1.72%
Packages	137	137
Duplicate Packages	15	15

Total size by type (3 changes)

	Current Job #905	Baseline Job #904
CSS	858.34KiB (+0.06%)	857.87KiB
Fonts	526.1KiB	526.1KiB
HTML	1.23KiB	1.23KiB
IMG	140.74KiB	140.74KiB
JS	9.22MiB (+0.36%)	9.18MiB
Media	295.6KiB	295.6KiB
Other	4.71MiB (+0.21%)	4.7MiB

---

View job #905 report View main branch activity

[digitaldan]

Hi @florian-h05 , thanks for picking this up! Sounds like a good approach, one thing i would want to check is to make sure the Mobile client is not also displaying an error message on top of this one. I'm fine either having the IOS not show something, or possibly have the UI check to see if a mobile client is handling this message (like we do for showing or not showing the top right "other apps" button) . I 'll find some time to play around as i have not really thought this through.

[florian-h05]

I’ve already thought of this, the SSE warning is not displayed if window.OHApp is available. The command warning is displayed, but if the iOS displays its own message due to no connection, the iOS toast is displayed on top, so I don’t see a problem there.

FYI #1807 is required to have this PR properly work (the SSE warning is only persistent if the reconnection mechanism is in place).

[florian-h05]

Screenshots:

[ghys]

I would really prefer finding a Framework7 CSS variable (https://v5.framework7.io/docs/css-variables) instead of hardcoding a color, also I'm not sure about this 22px font size 😅

There are other options for example a centered toast if the app is effectively unusable when the connection is broken (from https://v5.framework7.io/docs/toast#examples):

Or maybe a Notification (https://v5.framework7.io/docs/notification#examples)?

[florian-h05]

This color is the openHAB orange, I have switched to using the --f7-theme-color CSS variable instead of hard-coding it.
I have chosen the 22px font size to make the warning larger.

Regarding the centered toast: I really don‘t like its look without having an icon, and it seems that we can‘t have both icon and reload button. A toast at the bottom seemed the visually best solution to me.

I haven‘t really looked into the notifications, but IMO we should not use them and instead „reserve“ them for real notifications when MainUI supports Web Push one day.

[ghys]

Thanks for the answer, I don't mind your choices but had to express mine ;)