From eb7700097fe1dfddc3100bdde1b098d6efeb96a3 Mon Sep 17 00:00:00 2001 From: davelopez <46503462+davelopez@users.noreply.github.com> Date: Wed, 10 Jul 2024 14:20:29 +0200 Subject: [PATCH 1/7] Add getObjectStoreNameById to objectStoreStore --- client/src/stores/objectStoreStore.ts | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/client/src/stores/objectStoreStore.ts b/client/src/stores/objectStoreStore.ts index 8b0723edd8f0..09f9657667c9 100644 --- a/client/src/stores/objectStoreStore.ts +++ b/client/src/stores/objectStoreStore.ts @@ -27,6 +27,11 @@ export const useObjectStoreStore = defineStore("objectStoreStore", () => { } } + function getObjectStoreNameById(objectStoreId: string): string | null { + const objectStore = selectableObjectStores.value?.find((store) => store.object_store_id === objectStoreId); + return objectStore?.name ?? null; + } + loadObjectStores(); return { @@ -34,5 +39,6 @@ export const useObjectStoreStore = defineStore("objectStoreStore", () => { isLoading, loadErrorMessage, selectableObjectStores, + getObjectStoreNameById, }; }); From 3c88ec955aa7370033c9c891d4fa17128a2cbe40 Mon Sep 17 00:00:00 2001 From: davelopez <46503462+davelopez@users.noreply.github.com> Date: Wed, 10 Jul 2024 14:21:16 +0200 Subject: [PATCH 2/7] Fix object store name in overview chart --- .../DiskUsage/Visualizations/ObjectStoresStorageOverview.vue | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/client/src/components/User/DiskUsage/Visualizations/ObjectStoresStorageOverview.vue b/client/src/components/User/DiskUsage/Visualizations/ObjectStoresStorageOverview.vue index 03401c48b6ee..0bd23cae19b5 100644 --- a/client/src/components/User/DiskUsage/Visualizations/ObjectStoresStorageOverview.vue +++ b/client/src/components/User/DiskUsage/Visualizations/ObjectStoresStorageOverview.vue @@ -3,6 +3,7 @@ import { ref } from "vue"; import { useRouter } from "vue-router/composables"; import { fetchObjectStoreUsages } from "@/api/users"; +import { useObjectStoreStore } from "@/stores/objectStoreStore"; import localize from "@/utils/localization"; import type { DataValuePoint } from "./Charts"; @@ -21,12 +22,14 @@ const objectStoresBySizeData = ref(null); const { isLoading, loadDataOnMount } = useDataLoading(); +const { getObjectStoreNameById } = useObjectStoreStore(); + loadDataOnMount(async () => { const { data } = await fetchObjectStoreUsages({ user_id: "current" }); const objectStoresBySize = data.sort((a, b) => b.total_disk_usage - a.total_disk_usage); objectStoresBySizeData.value = objectStoresBySize.map((objectStore) => ({ id: objectStore.object_store_id, - label: objectStore.object_store_id, + label: getObjectStoreNameById(objectStore.object_store_id) ?? objectStore.object_store_id, value: objectStore.total_disk_usage, })); }); From 8572bec2b94aa0ac6dbd467d45a90cad1a2131b1 Mon Sep 17 00:00:00 2001 From: davelopez <46503462+davelopez@users.noreply.github.com> Date: Wed, 10 Jul 2024 15:24:49 +0200 Subject: [PATCH 3/7] Fix use object store name instead of id in selector --- .../src/components/Common/FilterObjectStoreLink.vue | 13 ++++++++----- .../Visualizations/HistoryStorageOverview.vue | 6 +++--- 2 files changed, 11 insertions(+), 8 deletions(-) diff --git a/client/src/components/Common/FilterObjectStoreLink.vue b/client/src/components/Common/FilterObjectStoreLink.vue index 65860cd057cc..c68aeb6a8011 100644 --- a/client/src/components/Common/FilterObjectStoreLink.vue +++ b/client/src/components/Common/FilterObjectStoreLink.vue @@ -5,6 +5,7 @@ import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"; import { computed, ref } from "vue"; import { ConcreteObjectStoreModel } from "@/api"; +import { useObjectStoreStore } from "@/stores/objectStoreStore"; import ObjectStoreSelect from "./ObjectStoreSelect.vue"; import SelectModal from "@/components/Dataset/DatasetStorage/SelectModal.vue"; @@ -12,26 +13,28 @@ import SelectModal from "@/components/Dataset/DatasetStorage/SelectModal.vue"; library.add(faTimes); interface FilterObjectStoreLinkProps { - value: String | null; + value?: string; objectStores: ConcreteObjectStoreModel[]; } const props = defineProps(); +const { getObjectStoreNameById } = useObjectStoreStore(); + const showModal = ref(false); const emit = defineEmits<{ - (e: "change", objectStoreId: string | null): void; + (e: "change", objectStoreId?: string): void; }>(); -function onSelect(objectStoreId: string | null) { +function onSelect(objectStoreId?: string) { emit("change", objectStoreId); showModal.value = false; } const selectionText = computed(() => { if (props.value) { - return props.value; + return getObjectStoreNameById(props.value); } else { return "(any)"; } @@ -45,7 +48,7 @@ const selectionText = computed(() => { {{ selectionText }} - + diff --git a/client/src/components/User/DiskUsage/Visualizations/HistoryStorageOverview.vue b/client/src/components/User/DiskUsage/Visualizations/HistoryStorageOverview.vue index d3ca05932077..ca8b718f4560 100644 --- a/client/src/components/User/DiskUsage/Visualizations/HistoryStorageOverview.vue +++ b/client/src/components/User/DiskUsage/Visualizations/HistoryStorageOverview.vue @@ -51,14 +51,14 @@ const { isLoading, loadDataOnMount } = useDataLoading(); const { isAdvanced, toggleAdvanced, inputGroupClasses, faAngleDoubleDown, faAngleDoubleUp } = useAdvancedFiltering(); const { selectableObjectStores, hasSelectableObjectStores } = useSelectableObjectStores(); -const objectStore = ref(null); +const objectStore = ref(); const canEditHistory = computed(() => { const history = getHistoryById(props.historyId); return (history && !history.purged && !history.archived) ?? false; }); -function onChangeObjectStore(value: string | null) { +function onChangeObjectStore(value?: string) { objectStore.value = value; reloadDataFromServer(); } @@ -190,7 +190,7 @@ function onUndelete(datasetId: string) { Date: Wed, 10 Jul 2024 15:25:56 +0200 Subject: [PATCH 4/7] Revise user-facing language for object stores Similar to #17763 --- .../components/FileSources/FileSourceTypeSpan.vue | 2 +- .../ObjectStore/Instances/ManageIndex.vue | 4 ++-- .../components/ObjectStore/ObjectStoreTypeSpan.vue | 10 +++++----- .../components/User/DiskUsage/StorageDashboard.vue | 4 ++-- .../Visualizations/HistoryStorageOverview.vue | 2 +- .../DiskUsage/Visualizations/ObjectStoreActions.vue | 2 +- .../Visualizations/ObjectStoreStorageOverview.vue | 13 +++++++++---- .../Visualizations/ObjectStoresStorageOverview.vue | 10 +++++----- .../DiskUsage/Visualizations/ShowObjectStore.vue | 6 +++--- 9 files changed, 29 insertions(+), 24 deletions(-) diff --git a/client/src/components/FileSources/FileSourceTypeSpan.vue b/client/src/components/FileSources/FileSourceTypeSpan.vue index 538b635c4a42..95129c85a085 100644 --- a/client/src/components/FileSources/FileSourceTypeSpan.vue +++ b/client/src/components/FileSources/FileSourceTypeSpan.vue @@ -2,7 +2,7 @@ import { computed } from "vue"; const MESSAGES = { - posix: "This is a simple path based object store that assumes the all the relevant paths are already mounted on the Galaxy server and target worker nodes.", + posix: "This is a simple path based storage location that assumes the all the relevant paths are already mounted on the Galaxy server and target worker nodes.", s3fs: "This is an remote file source plugin based on the Amazon Simple Storage Service (S3) interface. The AWS interface has become an industry standard and many storage vendors support it and use it to expose 'object' based storage.", }; diff --git a/client/src/components/ObjectStore/Instances/ManageIndex.vue b/client/src/components/ObjectStore/Instances/ManageIndex.vue index 7f45d1907211..c30d1def5210 100644 --- a/client/src/components/ObjectStore/Instances/ManageIndex.vue +++ b/client/src/components/ObjectStore/Instances/ManageIndex.vue @@ -59,9 +59,9 @@ function reload() { :fixed="true" :show-empty="true">