Merge pull request #334 from Geode-solutions/feat/is_active

feat(isActive): adds is_active mesh_components  objects

Author: BotellaA

app/components/Viewer/TreeComponent.vue

@@ -123,9 +123,21 @@ async function onSelectionChange(current) {
     <template #title="{ item }">
       <span
         class="treeview-item"
+        :class="{ 'inactive-item': item.is_active === false }"
         @contextmenu.prevent.stop="emit('show-menu', { event: $event, itemId: item })"
       >
         {{ item.title }}
+        <v-tooltip v-if="item.category" activator="parent" location="right">
+          <div class="d-flex flex-column pa-1">
+            <span class="text-caption"><strong>ID:</strong> {{ item.id }}</span>
+            <span v-if="item.title" class="text-caption"
+              ><strong>Name:</strong> {{ item.title }}</span
+            >
+            <span class="text-caption font-italic border-t-sm d-flex align-center">
+              <strong class="mr-1">Status:</strong> {{ item.is_active ? "Active" : "Inactive" }}
+            </span>
+          </div>
+        </v-tooltip>
       </span>
     </template>
   </v-treeview>
@@ -139,6 +151,10 @@ async function onSelectionChange(current) {
   max-width: 100%;
   display: inline-block;
 }
+.inactive-item {
+  opacity: 0.4;
+  font-style: italic;
+}
 
 .transparent-treeview {
   background-color: transparent;

app/stores/data.js

@@ -62,6 +62,7 @@ export const useDataStore = defineStore("data", () => {
           id: meshComponent.geode_id,
           title: meshComponent.name,
           category: meshComponent.type,
+          is_active: meshComponent.is_active,
         })),
       }));
   }
@@ -115,6 +116,7 @@ export const useDataStore = defineStore("data", () => {
           type: component.type,
           viewer_id: component.viewer_id,
           name: component.name,
+          is_active: component.is_active,
         });
       }
     }