views: Allow toggling views visibility

Author: rafaellehmkuhl

src/components/EditMenu.vue

@@ -76,6 +76,11 @@
             >
               <p class="overflow-hidden text-sm text-ellipsis ml-7 whitespace-nowrap">{{ view.name }}</p>
               <div class="grow" />
+              <div
+                class="icon-btn mdi mdi-eye"
+                :class="{ 'mdi-eye-closed': !view.visible }"
+                @click.stop="toggleViewVisibility(view)"
+              />
               <div class="icon-btn mdi mdi-download" @click.stop="store.exportView(view)" />
               <div class="icon-btn mdi mdi-content-copy" @click.stop="store.duplicateView(view)" />
               <div class="icon-btn mdi mdi-cog" @click.stop="renameView(view)" />
@@ -347,6 +352,14 @@ const renameView = (view: View): void => {
   viewRenameDialogRevealed.value = true
 }
 
+const toggleViewVisibility = (view: View): void => {
+  if (view.visible && view === store.currentView) {
+    Swal.fire({ text: 'You cannot hide the current view.', icon: 'error' })
+    return
+  }
+  view.visible = !view.visible
+}
+
 const renameProfile = (profile: Profile): void => {
   profileBeingRenamed.value = profile
   newProfileName.value = profile.name

src/components/mini-widgets/ViewSelector.vue

@@ -3,7 +3,7 @@
     <Dropdown
       name-key="name"
       :model-value="widgetStore.currentView"
-      :options="widgetStore.currentProfile.views"
+      :options="widgetStore.viewsToShow"
       class="min-w-[128px]"
       @update:model-value="widgetStore.selectView"
     />

src/stores/widgetManager.ts

@@ -66,7 +66,7 @@ export const useWidgetManagerStore = defineStore('widget-manager', () => {
     const viewsOnShowOrder = currentProfile.value.views.slice()
     viewsOnShowOrder.splice(currentViewIndex.value, 1)
     viewsOnShowOrder.push(currentProfile.value.views[currentViewIndex.value])
-    return viewsOnShowOrder
+    return viewsOnShowOrder.filter((v) => v.visible)
   })
 
   const miniWidgetContainersInCurrentView = computed(() => {
@@ -299,6 +299,10 @@ export const useWidgetManagerStore = defineStore('widget-manager', () => {
    * @param { View } view - View
    */
   const selectView = (view: View): void => {
+    if (!view.visible) {
+      Swal.fire({ icon: 'error', text: 'Cannot select a view that is not visible.', timer: 5000 })
+      return
+    }
     const index = currentProfile.value.views.indexOf(view)
     currentViewIndex.value = index
   }