@dative-gpi/foundation-core-components 1.0.110 → 1.0.112

package/components/autocompletes/FSAutocompleteChart.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.chart.label', 'Chart')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -116,6 +117,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update", "update:modelValue", "update:type"],
@@ -144,7 +150,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-chart.placeholder", "{0} chart(s) selected", props.modelValue.length);
+        return $tr("autocomplete.chart.placeholder", "{0} chart(s) selected", props.modelValue.length);
       }
       return null;
     });

package/components/autocompletes/FSAutocompleteDashboard.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.dashboard.label', 'Dashboard')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -123,6 +124,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update", "update:modelValue", "update:type"],
@@ -157,7 +163,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-dashboard.placeholder", "{0} dashboard(s) selected", props.modelValue.length);
+        return $tr("autocomplete.dashboard.placeholder", "{0} dashboard(s) selected", props.modelValue.length);
       }
       return null;
     });

package/components/autocompletes/FSAutocompleteDashboardOrganisation.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.dashboard.label', 'Dashboard')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :items="dashboardOrganisations"
     :multiple="$props.multiple"
@@ -59,6 +60,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update:modelValue"],
@@ -72,7 +78,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-dashboard-organisation.placeholder", "{0} dashboard(s) selected", props.modelValue.length);
+        return $tr("autocomplete.dashboard.placeholder", "{0} dashboard(s) selected", props.modelValue.length);
       }
       return null;
     });

package/components/autocompletes/FSAutocompleteDataCategory.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.data-category.label', 'Data category')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -15,13 +16,13 @@
       <FSChip
         v-if="item.correlated"
         prependIcon="mdi-link"
-        :label="$tr('ui.autocomplete-data-category.linked','Linked')"
+        :label="$tr('autocomplete.data-category.linked','Linked')"
         :color="ColorEnum.Success"
       />
       <FSChip
         v-else
         prependIcon="mdi-link-off"
-        :label="$tr('ui.autocomplete-data-category.not-linked','Not linked')"
+        :label="$tr('autocomplete.data-category.not-linked','Not linked')"
         :color="ColorEnum.Warning"
       />
     </template>
@@ -41,13 +42,13 @@
           <FSChip
             v-if="props.item.correlated"
             prependIcon="mdi-link"
-            :label="$tr('ui.autocomplete-data-category.linked','Linked')"
+            :label="$tr('autocomplete.data-category.linked','Linked')"
             :color="ColorEnum.Success"
           />
           <FSChip
             v-else
             prependIcon="mdi-link-off"
-            :label="$tr('ui.autocomplete-data-category.not-linked','Not linked')"
+            :label="$tr('autocomplete.data-category.not-linked','Not linked')"
             :color="ColorEnum.Warning"
           />
         </template>
@@ -96,6 +97,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update:modelValue"],
@@ -109,7 +115,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-data-category.placeholder", "{0} data category(ies) selected", props.modelValue.length);
+        return $tr("autocomplete.data-category.placeholder", "{0} data category(ies) selected", props.modelValue.length);
       }
       return null;
     });

package/components/autocompletes/FSAutocompleteDataDefinition.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.data-definition.label', 'Data')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -79,6 +80,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update:modelValue"],
@@ -92,7 +98,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-data-definition.placeholder", "{0} data definition(s) selected", props.modelValue.length);
+        return $tr("autocomplete.data-definition.placeholder", "{0} data definition(s) selected", props.modelValue.length);
       }
       return null;
     });

package/components/autocompletes/FSAutocompleteGroup.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.group.label', 'Group')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -58,6 +59,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update:modelValue"],
@@ -71,7 +77,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-group.placeholder", "{0} group(s) selected", props.modelValue.length);
+        return $tr("autocomplete.group.placeholder", "{0} group(s) selected", props.modelValue.length);
       }
       return null;
     });

package/components/autocompletes/FSAutocompleteLocation.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.location.label', 'Location')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -58,6 +59,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update:modelValue"],

package/components/autocompletes/FSAutocompleteManufacturer.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.manufacturer.label', 'Manufacturer')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -86,6 +87,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update:modelValue"],

package/components/autocompletes/FSAutocompleteModel.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.model.label', 'Model')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -86,6 +87,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update:modelValue"],
@@ -99,7 +105,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-model.placeholder", "{0} model(s) selected", props.modelValue.length);
+        return $tr("autocomplete.model.placeholder", "{0} model(s) selected", props.modelValue.length);
       }
       return null;
     });

package/components/autocompletes/FSAutocompleteOrganisationType.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.organisation-type.label', 'Organisation type')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -46,6 +47,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update:modelValue"],
@@ -59,7 +65,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-organisation-type.placeholder", "{0} organisation type(s) selected", props.modelValue.length);
+        return $tr("autocomplete.organisation-type.placeholder", "{0} organisation type(s) selected", props.modelValue.length);
       }
       return null;
     });

package/components/autocompletes/FSAutocompleteRole.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.role.label', 'Role')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -117,6 +118,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update", "update:modelValue", "update:type"],
@@ -145,7 +151,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-role.placeholder", "{0} role(s) selected", props.modelValue.length);
+        return $tr("autocomplete.role.placeholder", "{0} role(s) selected", props.modelValue.length);
       }
       return null;
     });

package/components/autocompletes/FSAutocompleteServiceAccountRoleOrganisation.vue

@@ -1,5 +1,6 @@
 <template>
   <FSAutocompleteField
+    :label="$props.label ?? $tr('autocomplete.service-account-role.label', 'Service account role')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :items="serviceAccountRoleOrganisations"
     :multiple="$props.multiple"
@@ -58,6 +59,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update:modelValue"],
@@ -71,7 +77,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-service-account-role-organisation.placeholder", "{0} role(s) selected", props.modelValue.length);
+        return $tr("autocomplete.service-account-role.placeholder", "{0} role(s) selected", props.modelValue.length);
       }
       return null;
     });

package/components/autocompletes/FSAutocompleteUserOrganisation.vue

@@ -1,6 +1,7 @@
 <template>
   <FSAutocompleteField
     itemTitle="name"
+    :label="$props.label ?? $tr('autocomplete.user.label', 'User')"
     :toggleSet="!$props.toggleSetDisabled && toggleSet"
     :multiple="$props.multiple"
     :placeholder="placeholder"
@@ -87,6 +88,11 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
     }
   },
   emits: ["update:modelValue"],
@@ -100,7 +106,7 @@ export default defineComponent({
 
     const placeholder = computed((): string | null => {
       if (props.multiple && props.modelValue) {
-        return $tr("ui.autocomplete-user-organisation.placeholder", "{0} user(s) selected", props.modelValue.length);
+        return $tr("autocomplete.user.placeholder", "{0} user(s) selected", props.modelValue.length);
       }
       return null;
     });

package/components/explorers/FSBaseDevicesExplorer.vue

@@ -0,0 +1,280 @@
+<template>
+  <FSDataTable
+    defaultMode="iterator"
+    :loading="fetchingDeviceExplorerElements"
+    :singleSelect="$props.singleSelect"
+    :items="deviceExplorerElements"
+    :showSelect="$props.editable"
+    :tableCode="$props.tableCode"
+    :itemTo="$props.itemTo"
+    :noSearch="true"
+    :modelValue="$props.modelValue"
+    @update:modelValue="$emit('update:modelValue', $event)"
+    v-model:search="search"
+    v-bind="$attrs"
+  >
+    <template
+      v-for="(_, name) in $slots"
+      v-slot:[name]="slotData"
+    >
+      <slot
+        :name="name"
+        v-bind="slotData"
+      />
+    </template>
+    <template
+      #header.imageId-title
+    >
+      <FSIcon>
+        mdi-panorama-variant-outline
+      </FSIcon>
+    </template>
+    <template
+      #header.connectivity-title
+    >
+      <FSIcon>
+        mdi-wifi
+      </FSIcon>
+    </template>
+    <template
+      #item.imageId="{ item }"
+    >
+      <FSImage
+        v-if="item.imageId"
+        height="32px"
+        width="32px"
+        :imageId="item.imageId"
+        :thumbnail="true"
+      />
+    </template>
+    <template
+      #item.tags="{ item }"
+    >
+      <FSTagGroup
+        variant="slide"
+        :editable="false"
+        :tags="item.tags"
+      />
+    </template>
+    <template
+      #item.type="{ item }"
+    >
+      <FSIcon
+        v-if="item.type === DeviceExplorerElementType.Group"
+      >
+        mdi-folder-outline
+      </FSIcon>
+      <FSIcon
+        v-else
+      >
+        mdi-widgets-outline
+      </FSIcon>
+    </template>
+
+    <template
+      #item.icon="{ item }"
+    >
+      <FSIcon
+        v-if="item.type === DeviceExplorerElementType.Group"
+      >
+        {{ item.icon }}
+      </FSIcon>
+    </template>
+    <template
+      #item.connectivity="{ item }"
+    >
+      <FSCol
+        v-if="item.type === DeviceExplorerElementType.DeviceOrganisation"
+      >
+        <FSConnectivity
+          v-if="item.connectivity.status != ConnectivityStatus.None"
+          :deviceConnectivity="item.connectivity"
+        />
+      </FSCol>
+    </template>
+    <template
+      #item.worstAlert="{ item }"
+    >
+      <FSWorstAlert
+        v-if="item.worstAlert"
+        :deviceWorstAlert="item.worstAlert"
+        :deviceAlerts="item.alerts"
+        :alertTo="$props.alertTo"
+      />
+      <div
+        v-else
+      />
+    </template>
+    <template
+      #item.alerts="{ item }"
+    >
+      <FSWorstAlert
+        v-if="item.worstAlert"
+        :deviceWorstAlert="item.worstAlert"
+        :deviceAlerts="item.alerts"
+        :alertTo="$props.alertTo"
+      />
+      <div
+        v-else
+      />
+    </template>
+    <template
+      #item.status="{ item }"
+    >
+      <FSStatusesCarousel
+        v-if="item.type === DeviceExplorerElementType.DeviceOrganisation"
+        :modelStatuses="item.modelStatuses"
+        :deviceStatuses="item.status.statuses"
+      />
+    </template>
+
+    <template
+      #item.tile="{ item, toggleSelect }"
+    >
+      <FSGroupTileUI
+        v-if="item.type === DeviceExplorerElementType.Group"
+        :to="$props.itemTo && $props.itemTo(item)"
+        :modelValue="isSelected(item.id)"
+        @update:modelValue="toggleSelect(item)"
+        v-bind="item"
+      />
+      <FSDeviceOrganisationTileUI
+        v-if="item.type === DeviceExplorerElementType.DeviceOrganisation"
+        :to="$props.itemTo && $props.itemTo(item)"
+        :deviceConnectivity="item.connectivity"
+        :deviceStatuses="item.status.statuses"
+        :deviceWorstAlert="item.worstAlert"
+        :deviceAlerts="item.alerts"
+        :alertTo="$props.alertTo"
+        :modelValue="isSelected(item.id)"
+        @update:modelValue="toggleSelect(item)"
+        v-bind="item"
+      />
+    </template>
+  </FSDataTable>
+</template>
+  
+<script lang="ts">
+import { computed, defineComponent, type PropType, ref, watch } from "vue";
+import { type RouteLocation } from "vue-router";
+import _ from "lodash";
+  
+import { type DeviceExplorerElementFilters, type DeviceExplorerElementInfos} from "@dative-gpi/foundation-core-domain/models";
+import { ConnectivityStatus, DeviceExplorerElementType } from "@dative-gpi/foundation-shared-domain/enums";
+import { useDeviceExplorerElements } from "@dative-gpi/foundation-core-services/composables";
+import { useDebounce } from "@dative-gpi/foundation-shared-components/composables";
+
+import FSDeviceOrganisationTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSDeviceOrganisationTileUI.vue";
+import FSStatusesCarousel from "@dative-gpi/foundation-shared-components/components/deviceOrganisations/FSStatusesCarousel.vue";
+import FSConnectivity from "@dative-gpi/foundation-shared-components/components/deviceOrganisations/FSConnectivity.vue";
+import FSWorstAlert from "@dative-gpi/foundation-shared-components/components/deviceOrganisations/FSWorstAlert.vue";
+import FSGroupTileUI from "@dative-gpi/foundation-shared-components/components/tiles/FSGroupTileUI.vue";
+import FSTagGroup from "@dative-gpi/foundation-shared-components/components/FSTagGroup.vue";
+import FSImage from "@dative-gpi/foundation-shared-components/components/FSImage.vue";
+
+import FSDataTable from "../lists/FSDataTable.vue";
+
+export default defineComponent({
+  name: "FSBaseDevicesExplorer",
+  components: {
+    FSDeviceOrganisationTileUI,
+    FSStatusesCarousel,
+    FSConnectivity,
+    FSGroupTileUI,
+    FSWorstAlert,
+    FSDataTable,
+    FSTagGroup,
+    FSImage
+  },
+  props: {
+    tableCode: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
+    },
+    deviceExplorerElementFilters: {
+      type: Object as PropType<DeviceExplorerElementFilters>,
+      required: false,
+      default: null
+    },
+    connectedOnly: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    itemTo: {
+      type: Function as PropType<(item: DeviceExplorerElementInfos) => Partial<RouteLocation>>,
+      required: false
+    },
+    alertTo: {
+      type: Function,
+      required: false,
+      default: null
+    },
+    editable: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    singleSelect: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    modelValue: {
+      type: Array as PropType<string[]>,
+      default: () => [],
+      required: false
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(props) {
+    const { entities, fetching: fetchingDeviceExplorerElements, getMany: getManyDeviceExplorerElements } = useDeviceExplorerElements();
+    const { debounce } = useDebounce();
+
+    const search = ref("");
+
+    const deviceExplorerElements = computed((): DeviceExplorerElementInfos[] => {
+      if (props.connectedOnly) {
+        return entities.value.filter(dee => 
+          dee.type === DeviceExplorerElementType.Group ||
+          (dee.connectivity != null && dee.connectivity.status != ConnectivityStatus.None)
+        );
+      }
+      return entities.value;
+    });
+
+    const isSelected = (id: string): boolean => {
+      return props.modelValue.includes(id);
+    };
+
+    const fetch = () => {
+      getManyDeviceExplorerElements({ ...props.deviceExplorerElementFilters, search: search.value });
+    }
+
+    // Delay to wait before fetching after a search change
+    const debounceFetch = (): void => debounce(fetch, 1500);
+  
+    watch(() => props.deviceExplorerElementFilters, (next, previous) => {
+      if ((!next && !previous) || !_.isEqual(next, previous)) {
+        fetch();
+      }
+    }, { immediate: true });
+
+    watch(search, (next, previous) => {
+      if (next !== previous && next.length === 0 || next.length >= 3) {
+        debounceFetch();
+      }
+    });
+
+    return {
+      fetchingDeviceExplorerElements,
+      DeviceExplorerElementType,
+      deviceExplorerElements,
+      ConnectivityStatus,
+      search,
+      isSelected
+    };
+  }
+});
+</script>

package/components/lists/alerts/FSBaseAlertsList.vue

@@ -23,12 +23,12 @@
       #toolbar
     >
       <FSButtonCheckbox
-        :label="$tr('page.alerts.not-acknowledged-only', 'Not acknowledged only')"
+        :label="$tr('ui.alert.not-acknowledged-only', 'Not acknowledged only')"
         :color="ColorEnum.Warning"
         v-model="innerNotTreatedOnly"
       />
       <FSButtonCheckbox
-        :label="$tr('page.alerts.hide-pending', 'Hide pending')"
+        :label="$tr('ui.alert.hide-pending', 'Hide pending')"
         :color="ColorEnum.Light"
         variant="full"
         v-model="innerHidePending"

package/components/lists/alerts/FSButtonAcknowledgeAlert.vue

@@ -1,11 +1,11 @@
 <template>
   <FSButton
     prependIcon="mdi-checkbox-blank-outline"
-    :label="$tr('page.alert.acknowledge', 'Acknowledge')"
+    :label="$tr('ui.alert.acknowledge', 'Acknowledge')"
     @click="dialog = true"
   />
   <FSDialogSubmit
-    :title="$tr('page.alert.acknowledge', 'Acknowledge')"
+    :title="$tr('ui.alert.acknowledge', 'Acknowledge')"
     :load="acknowledgingAlert"
     @click:submitButton="onAcknowledge"
     v-model="dialog"
@@ -26,12 +26,12 @@
             gap="2px"
           >
             <FSSpan>
-              {{ $tr("page.alert.acknowledge-warning", "Do you want to acknowledge this alert?") }}
+              {{ $tr("ui.alert.acknowledge-warning", "Do you want to acknowledge this alert?") }}
             </FSSpan>
           </FSRow>
         </FSRow>
         <FSSpan>
-          {{ $tr("page.alert.acknowledge-final-warning", "This action is definitive") }}
+          {{ $tr("ui.alert.acknowledge-final-warning", "This action is definitive") }}
         </FSSpan>
         <FSErrorToast
           v-if="error"

package/components/lists/deviceOrganisations/FSBaseDeviceOrganisationsList.vue

@@ -28,13 +28,6 @@
         mdi-panorama-variant-outline
       </FSIcon>
     </template>
-    <template
-      #header.connectable-title
-    >
-      <FSIcon>
-        mdi-wifi
-      </FSIcon>
-    </template>
     <template
       #header.connectivity-title
     >
@@ -53,16 +46,6 @@
         :thumbnail="true"
       />
     </template>
-    <template
-      #item.connectable="{ item }"
-    >
-      <FSCol>
-        <FSConnectivity
-          v-if="item.connectivity.status != ConnectivityStatus.None"
-          :deviceConnectivity="item.connectivity"
-        />
-      </FSCol>
-    </template>
     <template
       #item.connectivity="{ item }"
     >
@@ -262,33 +245,6 @@ export default defineComponent({
     });
 
     const headersOptions = computed(() => ({
-      connectable: {
-        fixedFilters: [{
-          value: ConnectivityStatus.None,
-          text: "—"
-        }, {
-          value: ConnectivityStatus.Offline,
-          text: connectivityLabel(ConnectivityStatus.Offline)
-        }, {
-          value: ConnectivityStatus.AlmostOffline,
-          text: connectivityLabel(ConnectivityStatus.AlmostOffline)
-        }, {
-          value: ConnectivityStatus.PartiallyConnected,
-          text: connectivityLabel(ConnectivityStatus.PartiallyConnected)
-        }, {
-          value: ConnectivityStatus.Connected,
-          text: connectivityLabel(ConnectivityStatus.Connected)
-        }],
-        methodFilter: (value: ConnectivityStatus, item: DeviceConnectivityDetails) => {
-          switch(value) {
-            case ConnectivityStatus.None:
-              return !item.status;
-            default:
-              return item.status == value;
-          }
-        },
-        sort: (a: DeviceConnectivityDetails, b: DeviceConnectivityDetails) => alphanumericSort(a?.status, b?.status)
-      },
       connectivity: {
         fixedFilters: [{
           value: ConnectivityStatus.None,

package/components/treeviews/FSTreeViewGroup.vue

@@ -1,5 +1,6 @@
 <template>
   <FSTreeViewField
+    :label="$props.label ?? $tr('tree-view.group.label', 'Group')"
     :multiple="$props.multiple"
     :loading="fetchingGroups"
     :items="groups"
@@ -55,7 +56,12 @@ export default defineComponent({
       type: Boolean,
       required: false,
       default: false
-    }
+    },
+    label: {
+      type: String as PropType<string | null>,
+      required: false,
+      default: null
+    } 
   },
   emits: ["update:modelValue"],
   setup(props, { emit }) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dative-gpi/foundation-core-components",
   "sideEffects": false,
-  "version": "1.0.110",
+  "version": "1.0.112",
   "description": "",
   "publishConfig": {
     "access": "public"
@@ -10,11 +10,11 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@dative-gpi/foundation-core-domain": "1.0.110",
-    "@dative-gpi/foundation-core-services": "1.0.110",
-    "@dative-gpi/foundation-shared-components": "1.0.110",
-    "@dative-gpi/foundation-shared-domain": "1.0.110",
-    "@dative-gpi/foundation-shared-services": "1.0.110"
+    "@dative-gpi/foundation-core-domain": "1.0.112",
+    "@dative-gpi/foundation-core-services": "1.0.112",
+    "@dative-gpi/foundation-shared-components": "1.0.112",
+    "@dative-gpi/foundation-shared-domain": "1.0.112",
+    "@dative-gpi/foundation-shared-services": "1.0.112"
   },
   "peerDependencies": {
     "@dative-gpi/bones-ui": "^1.0.0",
@@ -26,5 +26,5 @@
     "sass": "1.71.1",
     "sass-loader": "13.3.2"
   },
-  "gitHead": "ce27d3542d6a82946127e9004d82ff2f401d7242"
+  "gitHead": "459a258053b4f0a24eede34e8278c7e2b6a218cf"
 }