From b10b45f67c8401c0244d3c56e5735d7c70d03aad Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Tue, 21 Mar 2023 22:06:13 +0100
Subject: [PATCH 1/9] Display a (localized) toast on SSE disconnection with
 option to reload

Follow-up for #1499.

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../web/src/assets/i18n/common/en.json        |  8 ++++---
 .../org.openhab.ui/web/src/components/app.vue | 21 ++++++++++++++++++-
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json b/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
index 8043f5ef20..87597b523e 100644
--- a/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
+++ b/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
@@ -7,10 +7,11 @@
   "dialogs.close": "Close",
   "dialogs.copy": "Copy",
   "dialogs.delete": "Delete",
+  "dialogs.reload": "Reload",
   "dialogs.search": "Search",
   "dialogs.search.items": "Search items",
-  "dialogs.search.things": "Search things",  
-  "dialogs.search.rules": "Search rules",  
+  "dialogs.search.things": "Search things",
+  "dialogs.search.rules": "Search rules",
   "dialogs.search.nothingFound": "Nothing found",
   "home.overview.title": "Overview",
   "home.overview.tab": "Overview",
@@ -39,5 +40,6 @@
   "sidebar.tip.signIn": "Sign in as an administrator to access settings",
   "page.navbar.back": "Back",
   "page.navbar.edit": "Edit",
-  "admin.notTranslatedYet": "The administration area is not translated yet."
+  "admin.notTranslatedYet": "The administration area is not translated yet.",
+  "server.sseConnectionFailed": "Server connection (SSE) failed!"
 }
diff --git a/bundles/org.openhab.ui/web/src/components/app.vue b/bundles/org.openhab.ui/web/src/components/app.vue
index 209d34e44e..f786151c97 100644
--- a/bundles/org.openhab.ui/web/src/components/app.vue
+++ b/bundles/org.openhab.ui/web/src/components/app.vue
@@ -380,7 +380,9 @@ export default {
       showSettingsSubmenu: false,
       showDeveloperSubmenu: false,
       showDeveloperSidebar: false,
-      currentUrl: ''
+      currentUrl: '',
+
+      sseFailureToast: null
     }
   },
   computed: {
@@ -400,6 +402,23 @@ export default {
           try {
             window.OHApp.sseConnected(connected)
           } catch {}
+        } else if (this.$f7) {
+          if (connected === false) {
+            this.sseFailureToast = this.$f7.toast.create({
+              text: this.$t('server.sseConnectionFailed'),
+              closeButton: true,
+              closeButtonText: this.$t('dialogs.reload'),
+              destroyOnClose: true
+            }).open()
+            this.sseFailureToast.on('closed', () => {
+              window.location.reload()
+            })
+          } else if (connected === true) {
+            if (this.sseFailureToast !== null) {
+              this.sseFailureToast.off('closed')
+              this.sseFailureToast.close()
+            }
+          }
         }
       },
       immediate: true // provides initial (not changed yet) state

From 38c60c74c86b7614af7a2388b12d1b9dedb38ecd Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Tue, 21 Mar 2023 23:12:25 +0100
Subject: [PATCH 2/9] Add style for toast

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../org.openhab.ui/web/src/assets/i18n/common/en.json    | 2 +-
 bundles/org.openhab.ui/web/src/components/app.vue        | 9 ++++++---
 bundles/org.openhab.ui/web/src/css/app.styl              | 6 ++++++
 3 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json b/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
index 87597b523e..56c132594b 100644
--- a/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
+++ b/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
@@ -41,5 +41,5 @@
   "page.navbar.back": "Back",
   "page.navbar.edit": "Edit",
   "admin.notTranslatedYet": "The administration area is not translated yet.",
-  "server.sseConnectionFailed": "Server connection (SSE) failed!"
+  "server.sseConnectionFailed": "SSE connection failed!"
 }
diff --git a/bundles/org.openhab.ui/web/src/components/app.vue b/bundles/org.openhab.ui/web/src/components/app.vue
index f786151c97..3aabfc9982 100644
--- a/bundles/org.openhab.ui/web/src/components/app.vue
+++ b/bundles/org.openhab.ui/web/src/components/app.vue
@@ -408,14 +408,17 @@ export default {
               text: this.$t('server.sseConnectionFailed'),
               closeButton: true,
               closeButtonText: this.$t('dialogs.reload'),
-              destroyOnClose: true
+              destroyOnClose: true,
+              position: 'bottom',
+              horizontalPosition: 'bottom',
+              cssClass: 'toast-sse-connection-failed button-outline'
             }).open()
-            this.sseFailureToast.on('closed', () => {
+            this.sseFailureToast.on('closeButtonClick', () => {
               window.location.reload()
             })
           } else if (connected === true) {
             if (this.sseFailureToast !== null) {
-              this.sseFailureToast.off('closed')
+              this.sseFailureToast.off('closeButtonClick')
               this.sseFailureToast.close()
             }
           }
diff --git a/bundles/org.openhab.ui/web/src/css/app.styl b/bundles/org.openhab.ui/web/src/css/app.styl
index 480f3ffba2..8f36ae49da 100644
--- a/bundles/org.openhab.ui/web/src/css/app.styl
+++ b/bundles/org.openhab.ui/web/src/css/app.styl
@@ -285,3 +285,9 @@ html
 // Disable user dragging of background images in canvas layouts
 .disable-user-drag
   user-drag none
+
+.toast-sse-connection-failed
+  --f7-toast-bg-color var(--f7-theme-color)
+  --f7-toast-text-color white
+  --f7-button-text-color white
+  --f7-button-border-color white

From 68d63ce2881ca05c50238c622a267bd93a8baf5c Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Tue, 21 Mar 2023 23:38:12 +0100
Subject: [PATCH 3/9] Use Floating Action Button (FAB) instead of toast

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../org.openhab.ui/web/src/components/app.vue | 28 +++++--------------
 bundles/org.openhab.ui/web/src/css/app.styl   |  6 ----
 2 files changed, 7 insertions(+), 27 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/app.vue b/bundles/org.openhab.ui/web/src/components/app.vue
index 3aabfc9982..5282bc1364 100644
--- a/bundles/org.openhab.ui/web/src/components/app.vue
+++ b/bundles/org.openhab.ui/web/src/components/app.vue
@@ -136,7 +136,11 @@
       <developer-sidebar />
     </f7-panel>
 
-    <f7-view main v-show="ready" class="safe-areas" url="/" :master-detail-breakpoint="960" :animate="themeOptions.pageTransitionAnimation !== 'disabled'" />
+    <f7-view main v-show="ready" class="safe-areas" url="/" :master-detail-breakpoint="960" :animate="themeOptions.pageTransitionAnimation !== 'disabled'">
+      <f7-fab v-if="sseFailure" position="center-bottom" href="javascript:window.location.reload()" :text="$t('server.sseConnectionFailed')">
+        <f7-icon f7="wifi_exclamationmark" />
+      </f7-fab>
+    </f7-view>
 
   <!-- <f7-login-screen id="my-login-screen" :opened="loginScreenOpened">
     <f7-view name="login" v-if="$device.cordova">
@@ -382,7 +386,7 @@ export default {
       showDeveloperSidebar: false,
       currentUrl: '',
 
-      sseFailureToast: null
+      sseFailure: false
     }
   },
   computed: {
@@ -403,25 +407,7 @@ export default {
             window.OHApp.sseConnected(connected)
           } catch {}
         } else if (this.$f7) {
-          if (connected === false) {
-            this.sseFailureToast = this.$f7.toast.create({
-              text: this.$t('server.sseConnectionFailed'),
-              closeButton: true,
-              closeButtonText: this.$t('dialogs.reload'),
-              destroyOnClose: true,
-              position: 'bottom',
-              horizontalPosition: 'bottom',
-              cssClass: 'toast-sse-connection-failed button-outline'
-            }).open()
-            this.sseFailureToast.on('closeButtonClick', () => {
-              window.location.reload()
-            })
-          } else if (connected === true) {
-            if (this.sseFailureToast !== null) {
-              this.sseFailureToast.off('closeButtonClick')
-              this.sseFailureToast.close()
-            }
-          }
+          this.sseFailure = !connected
         }
       },
       immediate: true // provides initial (not changed yet) state
diff --git a/bundles/org.openhab.ui/web/src/css/app.styl b/bundles/org.openhab.ui/web/src/css/app.styl
index 8f36ae49da..480f3ffba2 100644
--- a/bundles/org.openhab.ui/web/src/css/app.styl
+++ b/bundles/org.openhab.ui/web/src/css/app.styl
@@ -285,9 +285,3 @@ html
 // Disable user dragging of background images in canvas layouts
 .disable-user-drag
   user-drag none
-
-.toast-sse-connection-failed
-  --f7-toast-bg-color var(--f7-theme-color)
-  --f7-toast-text-color white
-  --f7-button-text-color white
-  --f7-button-border-color white

From b267ef0d3d475286cb74d076fee277b23228a860 Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Mon, 27 Mar 2023 18:19:23 +0200
Subject: [PATCH 4/9] Revert "Use Floating Action Button (FAB) instead of
 toast"

This reverts commit ce201328b7edf1d36cc5f9167f717e415018d9c2.

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../org.openhab.ui/web/src/components/app.vue | 28 ++++++++++++++-----
 bundles/org.openhab.ui/web/src/css/app.styl   |  6 ++++
 2 files changed, 27 insertions(+), 7 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/app.vue b/bundles/org.openhab.ui/web/src/components/app.vue
index 5282bc1364..3aabfc9982 100644
--- a/bundles/org.openhab.ui/web/src/components/app.vue
+++ b/bundles/org.openhab.ui/web/src/components/app.vue
@@ -136,11 +136,7 @@
       <developer-sidebar />
     </f7-panel>
 
-    <f7-view main v-show="ready" class="safe-areas" url="/" :master-detail-breakpoint="960" :animate="themeOptions.pageTransitionAnimation !== 'disabled'">
-      <f7-fab v-if="sseFailure" position="center-bottom" href="javascript:window.location.reload()" :text="$t('server.sseConnectionFailed')">
-        <f7-icon f7="wifi_exclamationmark" />
-      </f7-fab>
-    </f7-view>
+    <f7-view main v-show="ready" class="safe-areas" url="/" :master-detail-breakpoint="960" :animate="themeOptions.pageTransitionAnimation !== 'disabled'" />
 
   <!-- <f7-login-screen id="my-login-screen" :opened="loginScreenOpened">
     <f7-view name="login" v-if="$device.cordova">
@@ -386,7 +382,7 @@ export default {
       showDeveloperSidebar: false,
       currentUrl: '',
 
-      sseFailure: false
+      sseFailureToast: null
     }
   },
   computed: {
@@ -407,7 +403,25 @@ export default {
             window.OHApp.sseConnected(connected)
           } catch {}
         } else if (this.$f7) {
-          this.sseFailure = !connected
+          if (connected === false) {
+            this.sseFailureToast = this.$f7.toast.create({
+              text: this.$t('server.sseConnectionFailed'),
+              closeButton: true,
+              closeButtonText: this.$t('dialogs.reload'),
+              destroyOnClose: true,
+              position: 'bottom',
+              horizontalPosition: 'bottom',
+              cssClass: 'toast-sse-connection-failed button-outline'
+            }).open()
+            this.sseFailureToast.on('closeButtonClick', () => {
+              window.location.reload()
+            })
+          } else if (connected === true) {
+            if (this.sseFailureToast !== null) {
+              this.sseFailureToast.off('closeButtonClick')
+              this.sseFailureToast.close()
+            }
+          }
         }
       },
       immediate: true // provides initial (not changed yet) state
diff --git a/bundles/org.openhab.ui/web/src/css/app.styl b/bundles/org.openhab.ui/web/src/css/app.styl
index 480f3ffba2..8f36ae49da 100644
--- a/bundles/org.openhab.ui/web/src/css/app.styl
+++ b/bundles/org.openhab.ui/web/src/css/app.styl
@@ -285,3 +285,9 @@ html
 // Disable user dragging of background images in canvas layouts
 .disable-user-drag
   user-drag none
+
+.toast-sse-connection-failed
+  --f7-toast-bg-color var(--f7-theme-color)
+  --f7-toast-text-color white
+  --f7-button-text-color white
+  --f7-button-border-color white

From b89181731e3ab4e2aba796cd6a374972e0534a3d Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Mon, 27 Mar 2023 19:40:44 +0200
Subject: [PATCH 5/9] Refactor SSE failure toast logic for simple reuse

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../org.openhab.ui/web/src/components/app.vue | 39 ++++++++++++-------
 bundles/org.openhab.ui/web/src/css/app.styl   |  2 +-
 2 files changed, 27 insertions(+), 14 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/app.vue b/bundles/org.openhab.ui/web/src/components/app.vue
index 3aabfc9982..b28193510c 100644
--- a/bundles/org.openhab.ui/web/src/components/app.vue
+++ b/bundles/org.openhab.ui/web/src/components/app.vue
@@ -404,22 +404,11 @@ export default {
           } catch {}
         } else if (this.$f7) {
           if (connected === false) {
-            this.sseFailureToast = this.$f7.toast.create({
-              text: this.$t('server.sseConnectionFailed'),
-              closeButton: true,
-              closeButtonText: this.$t('dialogs.reload'),
-              destroyOnClose: true,
-              position: 'bottom',
-              horizontalPosition: 'bottom',
-              cssClass: 'toast-sse-connection-failed button-outline'
-            }).open()
-            this.sseFailureToast.on('closeButtonClick', () => {
-              window.location.reload()
-            })
+            this.sseFailureToast = this.displayFailureToast(this.$t('error.sseConnectionFailed'), true, false)
           } else if (connected === true) {
             if (this.sseFailureToast !== null) {
-              this.sseFailureToast.off('closeButtonClick')
               this.sseFailureToast.close()
+              this.sseFailureToast = null
             }
           }
         }
@@ -677,6 +666,30 @@ export default {
         function unlock () { audioContext.resume().then(clean) }
         function clean () { events.forEach(e => b.removeEventListener(e, unlock)) }
       }
+    },
+    /**
+     * Creates and opens a toast message that indicates a failure, e.g. of SSE connection
+     * @param {string} message message to show
+     * @param {boolean} [reloadButton=false] displays a reload button
+     * @param {boolean} [autoClose=true] closes toast automatically
+     * @returns {Toast.Toast}
+     */
+    displayFailureToast (message, reloadButton = false, autoClose = true) {
+      const toast = this.$f7.toast.create({
+        text: message,
+        closeButton: reloadButton,
+        closeButtonText: this.$t('dialogs.reload'),
+        destroyOnClose: autoClose,
+        closeTimeout: (autoClose) ? 5000 : undefined,
+        position: 'bottom',
+        horizontalPosition: 'bottom',
+        cssClass: 'failure-toast button-outline'
+      })
+      toast.on('closeButtonClick', () => {
+        window.location.reload()
+      })
+      toast.open()
+      return toast
     }
   },
   created () {
diff --git a/bundles/org.openhab.ui/web/src/css/app.styl b/bundles/org.openhab.ui/web/src/css/app.styl
index 8f36ae49da..c43d099eb4 100644
--- a/bundles/org.openhab.ui/web/src/css/app.styl
+++ b/bundles/org.openhab.ui/web/src/css/app.styl
@@ -286,7 +286,7 @@ html
 .disable-user-drag
   user-drag none
 
-.toast-sse-connection-failed
+.failure-toast
   --f7-toast-bg-color var(--f7-theme-color)
   --f7-toast-text-color white
   --f7-button-text-color white

From 142ad248937806cda9bde561f29b6a1f71e37481 Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Mon, 27 Mar 2023 21:07:07 +0200
Subject: [PATCH 6/9] Display a (localized) toast on Item command failure

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../web/src/assets/i18n/common/en.json        |  5 ++++-
 .../org.openhab.ui/web/src/components/app.vue | 22 +++++++++++++++++++
 2 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json b/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
index 56c132594b..50e94e7d03 100644
--- a/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
+++ b/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
@@ -41,5 +41,8 @@
   "page.navbar.back": "Back",
   "page.navbar.edit": "Edit",
   "admin.notTranslatedYet": "The administration area is not translated yet.",
-  "server.sseConnectionFailed": "SSE connection failed!"
+  "error.sseConnectionFailed": "SSE connection failed!",
+  "error.itemNotFound": "Item not found",
+  "error.sendCommandFailed": "Sending command to {} failed:",
+  "error.reloadRecommended": "Reload recommended"
 }
diff --git a/bundles/org.openhab.ui/web/src/components/app.vue b/bundles/org.openhab.ui/web/src/components/app.vue
index b28193510c..30cd84b392 100644
--- a/bundles/org.openhab.ui/web/src/components/app.vue
+++ b/bundles/org.openhab.ui/web/src/components/app.vue
@@ -788,6 +788,28 @@ export default {
         }
       })
 
+      this.$store.subscribeAction({
+        error: (action, state, error) => {
+          if (action.type === 'sendCommand') {
+            let reloadButton = true
+            let msg = error
+            switch (error) {
+              case 0:
+              case 302:
+              case 'Found':
+                msg = this.$t('error.reloadRecommended')
+                break
+              case 404:
+              case 'Not Found':
+                msg = this.$t('error.itemNotFound')
+                reloadButton = false
+                break
+            }
+            this.displayFailureToast(this.$t('error.sendCommandFailed').replace('{}', action.payload.itemName) + ' ' + msg, reloadButton)
+          }
+        }
+      })
+
       if (window) {
         window.addEventListener('keydown', this.keyDown)
       }

From 67a32c6c5c246a0d37c683d904003321d562972c Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Mon, 27 Mar 2023 21:18:05 +0200
Subject: [PATCH 7/9] Reshow SSE toast if reconnection attempt fails

Note that this commit only works correctly together with another PR.

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../org.openhab.ui/web/src/components/app.vue | 26 ++++++++++++-------
 1 file changed, 17 insertions(+), 9 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/app.vue b/bundles/org.openhab.ui/web/src/components/app.vue
index 30cd84b392..cf787a15fb 100644
--- a/bundles/org.openhab.ui/web/src/components/app.vue
+++ b/bundles/org.openhab.ui/web/src/components/app.vue
@@ -402,15 +402,6 @@ export default {
           try {
             window.OHApp.sseConnected(connected)
           } catch {}
-        } else if (this.$f7) {
-          if (connected === false) {
-            this.sseFailureToast = this.displayFailureToast(this.$t('error.sseConnectionFailed'), true, false)
-          } else if (connected === true) {
-            if (this.sseFailureToast !== null) {
-              this.sseFailureToast.close()
-              this.sseFailureToast = null
-            }
-          }
         }
       },
       immediate: true // provides initial (not changed yet) state
@@ -788,6 +779,23 @@ export default {
         }
       })
 
+      this.$store.subscribe((mutation, state) => {
+        if (mutation.type === 'sseConnected') {
+          if (!window.OHApp && this.$f7) {
+            if (mutation.payload === false) {
+              if (this.sseFailureToast === null) this.sseFailureToast = this.displayFailureToast(this.$t('error.sseConnectionFailed'), true, false)
+              this.sseFailureToast.open()
+            } else if (mutation.payload === true) {
+              if (this.sseFailureToast !== null) {
+                this.sseFailureToast.close()
+                this.sseFailureToast.destroy()
+                this.sseFailureToast = null
+              }
+            }
+          }
+        }
+      })
+
       this.$store.subscribeAction({
         error: (action, state, error) => {
           if (action.type === 'sendCommand') {

From 91d1c1b639a00a0c8a5a8abfe0685996dbae1a60 Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Tue, 28 Mar 2023 17:57:32 +0200
Subject: [PATCH 8/9] Fix/Update style & Adjust messages & Share "Communication
 failure" toast

Fixes background color of toast on iOS, enlarges font size and simplifies messages.
The "Communication failure" toast is shared across SSE and send command (REST) to avoid having the toast popping in and out.

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../web/src/assets/i18n/common/en.json        |  6 ++--
 .../org.openhab.ui/web/src/components/app.vue | 36 +++++++++----------
 bundles/org.openhab.ui/web/src/css/app.styl   |  3 +-
 3 files changed, 22 insertions(+), 23 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json b/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
index 50e94e7d03..49ccc313a1 100644
--- a/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
+++ b/bundles/org.openhab.ui/web/src/assets/i18n/common/en.json
@@ -41,8 +41,6 @@
   "page.navbar.back": "Back",
   "page.navbar.edit": "Edit",
   "admin.notTranslatedYet": "The administration area is not translated yet.",
-  "error.sseConnectionFailed": "SSE connection failed!",
-  "error.itemNotFound": "Item not found",
-  "error.sendCommandFailed": "Sending command to {} failed:",
-  "error.reloadRecommended": "Reload recommended"
+  "error.communicationFailure": "Communication failure",
+  "error.itemNotFound": "%s not found"
 }
diff --git a/bundles/org.openhab.ui/web/src/components/app.vue b/bundles/org.openhab.ui/web/src/components/app.vue
index cf787a15fb..1c9c42a6e3 100644
--- a/bundles/org.openhab.ui/web/src/components/app.vue
+++ b/bundles/org.openhab.ui/web/src/components/app.vue
@@ -382,7 +382,7 @@ export default {
       showDeveloperSidebar: false,
       currentUrl: '',
 
-      sseFailureToast: null
+      communicationFailureToast: null
     }
   },
   computed: {
@@ -672,9 +672,9 @@ export default {
         closeButtonText: this.$t('dialogs.reload'),
         destroyOnClose: autoClose,
         closeTimeout: (autoClose) ? 5000 : undefined,
+        cssClass: 'failure-toast button-outline',
         position: 'bottom',
-        horizontalPosition: 'bottom',
-        cssClass: 'failure-toast button-outline'
+        horizontalPosition: 'center'
       })
       toast.on('closeButtonClick', () => {
         window.location.reload()
@@ -783,13 +783,13 @@ export default {
         if (mutation.type === 'sseConnected') {
           if (!window.OHApp && this.$f7) {
             if (mutation.payload === false) {
-              if (this.sseFailureToast === null) this.sseFailureToast = this.displayFailureToast(this.$t('error.sseConnectionFailed'), true, false)
-              this.sseFailureToast.open()
+              if (this.communicationFailureToast === null) this.communicationFailureToast = this.displayFailureToast(this.$t('error.communicationFailure'), true, false)
+              this.communicationFailureToast.open()
             } else if (mutation.payload === true) {
-              if (this.sseFailureToast !== null) {
-                this.sseFailureToast.close()
-                this.sseFailureToast.destroy()
-                this.sseFailureToast = null
+              if (this.communicationFailureToast !== null) {
+                this.communicationFailureToast.close()
+                this.communicationFailureToast.destroy()
+                this.communicationFailureToast = null
               }
             }
           }
@@ -800,20 +800,20 @@ export default {
         error: (action, state, error) => {
           if (action.type === 'sendCommand') {
             let reloadButton = true
-            let msg = error
+            let msg = this.$t('error.communicationFailure')
             switch (error) {
-              case 0:
-              case 302:
-              case 'Found':
-                msg = this.$t('error.reloadRecommended')
-                break
               case 404:
               case 'Not Found':
-                msg = this.$t('error.itemNotFound')
+                msg = this.$t('error.itemNotFound').replace('%s', action.payload.itemName)
                 reloadButton = false
-                break
+                return this.displayFailureToast(msg, reloadButton)
+            }
+            if (this.communicationFailureToast === null) {
+              this.communicationFailureToast = this.displayFailureToast(this.$t('error.communicationFailure'), true, true)
+              this.communicationFailureToast.on('closed', () => {
+                this.communicationFailureToast = null
+              })
             }
-            this.displayFailureToast(this.$t('error.sendCommandFailed').replace('{}', action.payload.itemName) + ' ' + msg, reloadButton)
           }
         }
       })
diff --git a/bundles/org.openhab.ui/web/src/css/app.styl b/bundles/org.openhab.ui/web/src/css/app.styl
index c43d099eb4..8b5f573c84 100644
--- a/bundles/org.openhab.ui/web/src/css/app.styl
+++ b/bundles/org.openhab.ui/web/src/css/app.styl
@@ -287,7 +287,8 @@ html
   user-drag none
 
 .failure-toast
-  --f7-toast-bg-color var(--f7-theme-color)
+  background-color #e64a19 !important
+  font-size 22px !important
   --f7-toast-text-color white
   --f7-button-text-color white
   --f7-button-border-color white

From ad2ff487f53b4ef511354a385319ea060617f261 Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Wed, 5 Apr 2023 22:01:06 +0200
Subject: [PATCH 9/9] Use CSS var instead of hard-coded color

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 bundles/org.openhab.ui/web/src/css/app.styl | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/bundles/org.openhab.ui/web/src/css/app.styl b/bundles/org.openhab.ui/web/src/css/app.styl
index 8b5f573c84..2f7d7ca505 100644
--- a/bundles/org.openhab.ui/web/src/css/app.styl
+++ b/bundles/org.openhab.ui/web/src/css/app.styl
@@ -287,7 +287,7 @@ html
   user-drag none
 
 .failure-toast
-  background-color #e64a19 !important
+  background-color var(--f7-theme-color) !important
   font-size 22px !important
   --f7-toast-text-color white
   --f7-button-text-color white