From 13261667dfb47689de8e3ff2822ce23077104e7a Mon Sep 17 00:00:00 2001
From: Alessandro Venturini <ales.ventus21@gmail.com>
Date: Sun, 31 Aug 2025 19:05:04 +0200
Subject: [PATCH 1/4] chore: removed loading overlay for reg.req. badge

---
 src/components/NavbarLayout.vue | 13 ++++---------
 1 file changed, 4 insertions(+), 9 deletions(-)

diff --git a/src/components/NavbarLayout.vue b/src/components/NavbarLayout.vue
index 5848c78..6c5e1ba 100644
--- a/src/components/NavbarLayout.vue
+++ b/src/components/NavbarLayout.vue
@@ -1,5 +1,7 @@
 <template>
-  <div class="navbar py-0 mb-4 bg-base-200/70 shadow backdrop-blur sticky top-0 z-30 lg:rounded-xl md:mt-1">
+  <div
+    class="navbar py-0 mb-4 bg-base-200/70 shadow backdrop-blur sticky top-0 z-30 lg:rounded-xl md:mt-1"
+  >
     <div class="navbar-start w-full md:w-[50%]">
       <template v-if="showBackButton">
         <button
@@ -145,7 +147,6 @@ import { useNotificationsStore } from '@/stores/notifications'
 import type { RegistrationRequest } from '@/model/users-management/RegistrationRequest'
 import { onMounted, ref } from 'vue'
 import { getAllRegistrationRequests } from '@/api/users-management/requests/users'
-import { useLoadingOverlayStore } from '@/stores/loading-overlay'
 
 defineProps({
   title: { type: String },
@@ -156,18 +157,12 @@ defineProps({
 })
 
 const userInfo = useUserInfoStore()
-const loadingOverlay = useLoadingOverlayStore()
 const router = useRouter()
 const goBack = () => router.back()
 
 const registrationRequests = ref<RegistrationRequest[]>([])
 
 onMounted(async () => {
-  try {
-    loadingOverlay.startLoading()
-    registrationRequests.value = await getAllRegistrationRequests(userInfo.token)
-  } finally {
-    loadingOverlay.stopLoading()
-  }
+  registrationRequests.value = await getAllRegistrationRequests(userInfo.token)
 })
 </script>

From a9310acbf5978bfa7523383e86a44990adddddc2 Mon Sep 17 00:00:00 2001
From: Alessandro Venturini <ales.ventus21@gmail.com>
Date: Sun, 31 Aug 2025 19:20:35 +0200
Subject: [PATCH 2/4] chore: remove loadingOverlay if skeletons are used

---
 src/views/automations/AutomationsView.vue |  6 ++----
 src/views/devices/DevicesView.vue         | 14 ++------------
 src/views/tasks/TasksView.vue             |  7 +------
 3 files changed, 5 insertions(+), 22 deletions(-)

diff --git a/src/views/automations/AutomationsView.vue b/src/views/automations/AutomationsView.vue
index f288692..f6400dc 100644
--- a/src/views/automations/AutomationsView.vue
+++ b/src/views/automations/AutomationsView.vue
@@ -17,10 +17,8 @@ const loadingOverlay = useLoadingOverlayStore()
 
 onMounted(async () => {
   try {
-    loadingOverlay.startLoading()
     automations.value = await getAllAutomations(userInfo.token)
   } finally {
-    loadingOverlay.stopLoading()
   }
 })
 
@@ -96,8 +94,8 @@ async function toggle(automation: Automation) {
         </p>
         <ul class="list-disc list-inside">
           <li>
-            <span class="font-bold">Execution</span>: When enabled, an automation is executed automatically based
-            on a trigger. Can be disabled from the toggle next to it.
+            <span class="font-bold">Execution</span>: When enabled, an automation is executed
+            automatically based on a trigger. Can be disabled from the toggle next to it.
             <ul class="list-disc list-inside ml-4">
               <li>
                 <span class="font-bold">Device event trigger</span>: Execute the automation if a
diff --git a/src/views/devices/DevicesView.vue b/src/views/devices/DevicesView.vue
index 3d72373..31033f1 100644
--- a/src/views/devices/DevicesView.vue
+++ b/src/views/devices/DevicesView.vue
@@ -46,20 +46,10 @@ function closeDropdown() {
 }
 
 onMounted(async () => {
-  loadingOverlay.startLoading()
-  try {
-    groups.value = await getAllDeviceGroups(userInfo.token)
-  } finally {
-    loadingOverlay.stopLoading()
-  }
+  groups.value = await getAllDeviceGroups(userInfo.token)
 })
 onMounted(async () => {
-  loadingOverlay.startLoading()
-  try {
-    devices.value = await getAllDevices(userInfo.token)
-  } finally {
-    loadingOverlay.stopLoading()
-  }
+  devices.value = await getAllDevices(userInfo.token)
 })
 </script>
 
diff --git a/src/views/tasks/TasksView.vue b/src/views/tasks/TasksView.vue
index fc2e5cd..f3ce518 100644
--- a/src/views/tasks/TasksView.vue
+++ b/src/views/tasks/TasksView.vue
@@ -16,12 +16,7 @@ const tasks = ref<Task[]>()
 const loadingOverlay = useLoadingOverlayStore()
 
 onMounted(async () => {
-  try {
-    loadingOverlay.startLoading()
-    tasks.value = await getAllTasks(userInfo.token)
-  } finally {
-    loadingOverlay.stopLoading()
-  }
+  tasks.value = await getAllTasks(userInfo.token)
 })
 
 async function startTask(taskId: TaskId) {

From 5d1edb633c338ee54da5309ca11617d4cb2e4a07 Mon Sep 17 00:00:00 2001
From: Alessandro Venturini <ales.ventus21@gmail.com>
Date: Sun, 31 Aug 2025 19:21:04 +0200
Subject: [PATCH 3/4] chore: parallel fetching of data to load faster

---
 src/views/admin/ManageUsersView.vue | 23 ++++++++++++++++++-----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/src/views/admin/ManageUsersView.vue b/src/views/admin/ManageUsersView.vue
index 108af4b..fabe7e2 100644
--- a/src/views/admin/ManageUsersView.vue
+++ b/src/views/admin/ManageUsersView.vue
@@ -23,8 +23,10 @@ const unregisteredUsers = ref<RegistrationRequest[]>()
 onMounted(async () => {
   try {
     loadingOverlay.startLoading()
-    registeredUsers.value = await getAllUsers(userInfo.token)
-    unregisteredUsers.value = await getAllRegistrationRequests(userInfo.token)
+    Promise.all([
+      (registeredUsers.value = await getAllUsers(userInfo.token)),
+      (unregisteredUsers.value = await getAllRegistrationRequests(userInfo.token)),
+    ])
   } finally {
     loadingOverlay.stopLoading()
   }
@@ -81,7 +83,10 @@ function showToastMessage(msg: string) {
         <div>
           <ul class="list rounded-box">
             <li class="list-row" v-for="user in registeredUsers" :key="user.email">
-              <span v-if="user.role == Role.Admin" class="fa-solid fa-user-tie text-2xl self-center"></span>
+              <span
+                v-if="user.role == Role.Admin"
+                class="fa-solid fa-user-tie text-2xl self-center"
+              ></span>
               <span v-else class="fa-solid fa-user text-2xl self-center"></span>
               <div class="list-col-grow flex flex-col">
                 <div>{{ user.nickname }}</div>
@@ -103,7 +108,12 @@ function showToastMessage(msg: string) {
       </div>
       <div>
         <hr class="my-4 border-gray-300" />
-        <h1 class="text-2xl dark:text-white text-center" v-if="!!unregisteredUsers && unregisteredUsers?.length > 0">Registration requests</h1>
+        <h1
+          class="text-2xl dark:text-white text-center"
+          v-if="!!unregisteredUsers && unregisteredUsers?.length > 0"
+        >
+          Registration requests
+        </h1>
         <div>
           <ul class="list rounded-box">
             <li class="list-row" v-for="user in unregisteredUsers" :key="user.email">
@@ -128,7 +138,10 @@ function showToastMessage(msg: string) {
               </div>
             </li>
           </ul>
-          <div v-if="unregisteredUsers?.length === 0" class="flex text-center text-gray-500 justify-center items-center min-h-[20vh]">
+          <div
+            v-if="unregisteredUsers?.length === 0"
+            class="flex text-center text-gray-500 justify-center items-center min-h-[20vh]"
+          >
             <p class="text-2xl">No registration requests...</p>
           </div>
         </div>

From 379a4d913722b57a765b8d53cf31dc7bf5973fbb Mon Sep 17 00:00:00 2001
From: Alessandro Venturini <ales.ventus21@gmail.com>
Date: Sun, 31 Aug 2025 19:25:41 +0200
Subject: [PATCH 4/4] fix: linting issues

---
 src/views/devices/DevicesView.vue | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/views/devices/DevicesView.vue b/src/views/devices/DevicesView.vue
index 31033f1..0e7e8a5 100644
--- a/src/views/devices/DevicesView.vue
+++ b/src/views/devices/DevicesView.vue
@@ -7,13 +7,11 @@ import { DeviceGroupId, type DeviceGroup } from '@/model/devices-management/Devi
 import type { Device } from '@/model/devices-management/Device'
 import { getAllDeviceGroups } from '@/api/devices-management/requests/device-groups'
 import { getAllDevices } from '@/api/devices-management/requests/devices'
-import { useLoadingOverlayStore } from '@/stores/loading-overlay'
 import NavbarLayout from '@/components/NavbarLayout.vue'
 import router from '@/router'
 import DeviceGroupsButton from '@/components/DeviceGroupsButton.vue'
 
 const userInfo = useUserInfoStore()
-const loadingOverlay = useLoadingOverlayStore()
 const groups = ref<DeviceGroup[] | undefined>(undefined)
 const selectedGroupId = ref<DeviceGroupId | undefined>(getGroupQueryParam())
 const devices = ref<Device[] | undefined>(undefined)