From 10746f1c81beeec8a8dab2a86d8553015f8c802d Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Sun, 7 Jul 2024 02:18:15 +0200
Subject: [PATCH] Health menu: Remove sidebar and settings entry, instead use
 FAB (#2652)

Closes #2644.

This removes the health check entry from the sidebar and the settings
menu and instead uses a floating action button (FAB) to allow access to
the health checks page if there are any actual issues.

---------

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 bundles/org.openhab.ui/web/src/components/app.vue |  4 ----
 .../pages/settings/health/health-orphanlinks.vue  |  2 +-
 .../src/pages/settings/health/health-overview.vue |  2 +-
 .../web/src/pages/settings/menu/settings-menu.vue | 15 ++++-----------
 4 files changed, 6 insertions(+), 17 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/app.vue b/bundles/org.openhab.ui/web/src/components/app.vue
index b596c3534..5d1db1d8e 100644
--- a/bundles/org.openhab.ui/web/src/components/app.vue
+++ b/bundles/org.openhab.ui/web/src/components/app.vue
@@ -39,10 +39,6 @@
           </f7-list-item>
           <li v-if="showSettingsSubmenu">
             <ul class="menu-sublinks">
-              <f7-list-item v-if="$store.getters.apiEndpoint('links')" link="/settings/health/" title="Health checks" view=".view-main" panel-close :animate="false" no-chevron
-                            :class="{ currentsection: currentUrl.indexOf('/settings/health') === 0 }">
-                <f7-icon slot="media" f7="heart" color="gray" />
-              </f7-list-item>
               <f7-list-item v-if="$store.getters.apiEndpoint('things')" link="/settings/things/" title="Things" view=".view-main" panel-close :animate="false" no-chevron
                             :class="{ currentsection: currentUrl.indexOf('/settings/things') === 0 }">
                 <f7-icon slot="media" f7="lightbulb" color="gray" />
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/health/health-orphanlinks.vue b/bundles/org.openhab.ui/web/src/pages/settings/health/health-orphanlinks.vue
index 83c56861c..ccc4bd3f3 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/health/health-orphanlinks.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/health/health-orphanlinks.vue
@@ -1,6 +1,6 @@
 <template>
   <f7-page @page:afterin="onPageAfterIn">
-    <f7-navbar title="Orphan links" back-link="Health checks" back-link-url="/settings/health/" back-link-force>
+    <f7-navbar title="Orphan Links" back-link="Health Checks" back-link-url="/settings/health/" back-link-force>
       <f7-nav-right>
         <developer-dock-icon />
       </f7-nav-right>
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/health/health-overview.vue b/bundles/org.openhab.ui/web/src/pages/settings/health/health-overview.vue
index 9cf6e145c..f956ecf44 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/health/health-overview.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/health/health-overview.vue
@@ -1,6 +1,6 @@
 <template>
   <f7-page @page:afterin="onPageAfterIn">
-    <f7-navbar title="Health checks" back-link="Settings" back-link-url="/settings/" back-link-force>
+    <f7-navbar title="Health Checks" back-link="Settings" back-link-url="/settings/" back-link-force>
       <f7-nav-right>
         <developer-dock-icon />
       </f7-nav-right>
diff --git a/bundles/org.openhab.ui/web/src/pages/settings/menu/settings-menu.vue b/bundles/org.openhab.ui/web/src/pages/settings/menu/settings-menu.vue
index bc8b5562a..47e87b35f 100644
--- a/bundles/org.openhab.ui/web/src/pages/settings/menu/settings-menu.vue
+++ b/bundles/org.openhab.ui/web/src/pages/settings/menu/settings-menu.vue
@@ -23,17 +23,6 @@
         <f7-col :class="!addonsLoaded || (addonsLoaded && addonsInstalled.length > 0) ? 'settings-col' : ''" width="100" medium="50">
           <f7-block-title>Configuration</f7-block-title>
           <f7-list media-list class="search-list">
-            <f7-list-item
-              v-if="$store.getters.apiEndpoint('links')"
-              media-item
-              link="health/"
-              title="Health check"
-              :badge="(healthCount > 0) ? healthCount : undefined"
-              :after="(healthCount > 0) ? undefined : 0"
-              badge-color="red"
-              :footer="objectsSubtitles.health">
-              <f7-icon slot="media" f7="heart" color="gray" />
-            </f7-list-item>
             <f7-list-item
               v-if="$store.getters.apiEndpoint('things')"
               media-item
@@ -199,6 +188,10 @@
         <small v-t="'admin.notTranslatedYet'" />
       </f7-block-footer>
     </f7-block>
+
+    <f7-fab v-if="healthCount > 0" position="center-bottom" :text="`Health Issues (${healthCount})`" slot="fixed" color="red" href="health/">
+      <f7-icon f7="heart" />
+    </f7-fab>
   </f7-page>
 </template>