feat: Group and household deletion tooltips (#4414)

frontend/lang/messages/en-US.json

@@ -1271,7 +1271,9 @@
     "debug-openai-services": "Debug OpenAI Services",
     "debug-openai-services-description": "Use this page to debug OpenAI services. You can test your OpenAI connection and see the results here. If you have image services enabled, you can also provide an image.",
     "run-test": "Run Test",
-    "test-results": "Test Results"
+    "test-results": "Test Results",
+    "group-delete-note": "Groups with users or households cannot be deleted",
+    "household-delete-note": "Households with users cannot be deleted"
   },
   "profile": {
     "welcome-user": "👋 Welcome, {0}!",

frontend/pages/admin/manage/groups/index.vue

@@ -47,6 +47,9 @@
           {{ item.users.length }}
         </template>
         <template #item.actions="{ item }">
+          <v-tooltip bottom :disabled="!(item && (item.households.length > 0 || item.users.length > 0))">
+            <template #activator="{ on, attrs }">
+              <div v-bind="attrs" v-on="on" >
                 <v-btn
                   :disabled="item && (item.households.length > 0 || item.users.length > 0)"
                   class="mr-1"
@@ -61,6 +64,10 @@
                     {{ $globals.icons.delete }}
                   </v-icon>
                 </v-btn>
+              </div>
+            </template>
+            <span>{{ $tc("admin.group-delete-note") }}</span>
+          </v-tooltip>
         </template>
       </v-data-table>
       <v-divider></v-divider>

frontend/pages/admin/manage/households/index.vue

@@ -63,6 +63,9 @@
           {{ item.webhooks.length > 0 ? $t("general.yes") : $t("general.no") }}
         </template>
         <template #item.actions="{ item }">
+          <v-tooltip bottom :disabled="!(item && item.users.length > 0)">
+            <template #activator="{ on, attrs }">
+              <div v-bind="attrs" v-on="on" >
                 <v-btn
                   :disabled="item && item.users.length > 0"
                   class="mr-1"
@@ -77,6 +80,10 @@
                     {{ $globals.icons.delete }}
                   </v-icon>
                 </v-btn>
+              </div>
+            </template>
+            <span>{{ $tc("admin.household-delete-note") }}</span>
+          </v-tooltip>
         </template>
       </v-data-table>
       <v-divider></v-divider>