From 7d474c2087611fe556b8fc8277620c8a63a69ca8 Mon Sep 17 00:00:00 2001 From: Ahmed Awan <qe66653@umbc.edu> Date: Fri, 4 Oct 2024 17:42:43 -0500 Subject: [PATCH] add history name to modal header --- .../components/Collections/common/modal.js | 8 ++++- .../Form/Elements/FormData/FormData.vue | 33 ++++++++----------- .../History/adapters/buildCollectionModal.ts | 2 ++ client/src/style/scss/ui.scss | 3 ++ 4 files changed, 25 insertions(+), 21 deletions(-) diff --git a/client/src/components/Collections/common/modal.js b/client/src/components/Collections/common/modal.js index a823d1c27657..eaf90715aa3e 100644 --- a/client/src/components/Collections/common/modal.js +++ b/client/src/components/Collections/common/modal.js @@ -17,8 +17,14 @@ export function collectionCreatorModalSetup(options, Galaxy = null) { }); const showEl = function (el) { const close_event = options.closing_events === undefined || options.closing_events; + const title = options.title || _l("Create a collection"); + const titleSuffix = options.historyName ? `From history: <b>${options.historyName}</b>` : ""; + const titleHtml = `<div class='d-flex justify-content-between unselectable'> + <span>${title}</span> + <span>${titleSuffix}</span> + </div>`; modal.show({ - title: options.title || _l("Create a collection"), + title: titleHtml, body: el, width: "85%", height: "100%", diff --git a/client/src/components/Form/Elements/FormData/FormData.vue b/client/src/components/Form/Elements/FormData/FormData.vue index e0c2994909c7..f027eb7e6a37 100644 --- a/client/src/components/Form/Elements/FormData/FormData.vue +++ b/client/src/components/Form/Elements/FormData/FormData.vue @@ -10,6 +10,7 @@ import { } from "@fortawesome/free-solid-svg-icons"; import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"; import { BAlert, BButton, BButtonGroup, BCollapse, BFormCheckbox, BTooltip } from "bootstrap-vue"; +import { storeToRefs } from "pinia"; import { computed, onMounted, type Ref, ref, watch } from "vue"; import { isDatasetElement, isDCE } from "@/api"; @@ -18,9 +19,10 @@ import { buildCollectionModal } from "@/components/History/adapters/buildCollect import { createDatasetCollection } from "@/components/History/model/queries"; import { useDatatypesMapper } from "@/composables/datatypesMapper"; import { useHistoryItemsForType } from "@/composables/useHistoryItemsForType"; +import { useUserHistories } from "@/composables/userHistories"; import { useUid } from "@/composables/utils/uid"; import { type EventData, useEventStore } from "@/stores/eventStore"; -import { useHistoryStore } from "@/stores/historyStore"; +import { useUserStore } from "@/stores/userStore"; import { orList } from "@/utils/strings"; import type { DataOption } from "./types"; @@ -486,36 +488,27 @@ function canAcceptSrc(historyContentType: "dataset" | "dataset_collection", coll } } -const historyStore = useHistoryStore(); +const { currentUser } = storeToRefs(useUserStore()); +const { currentHistoryId, currentHistory } = useUserHistories(currentUser); -const idToFetchFor = computed(() => historyStore.currentHistoryId); -const { historyItems, isFetchingItems, errorMessage: historyItemsError } = useHistoryItemsForType(idToFetchFor); +const { historyItems, isFetchingItems, errorMessage: historyItemsError } = useHistoryItemsForType(currentHistoryId); /** Excludes the `paired` collection type for now */ const effectiveCollectionTypes = props.collectionTypes?.filter((collectionType) => collectionType !== "paired"); /** Build a new collection and set it as the current value if valid */ async function buildNewCollection(collectionType: string) { - if ( - !historyStore.currentHistoryId || - !historyStore.currentHistory || - isFetchingItems.value || - historyItemsError.value - ) { + if (!currentHistoryId.value || !currentHistory.value || isFetchingItems.value || historyItemsError.value) { return; } if (collectionType === "list" || collectionType === "list:paired") { - const modalResult = await buildCollectionModal( - collectionType, - historyItems.value, - historyStore.currentHistoryId, - { - extensions: props.extensions?.filter((ext) => ext !== "data"), - defaultHideSourceItems: false, - } - ); - const collection = await createDatasetCollection(historyStore.currentHistory, modalResult); + const modalResult = await buildCollectionModal(collectionType, historyItems.value, currentHistoryId.value, { + extensions: props.extensions?.filter((ext) => ext !== "data"), + defaultHideSourceItems: false, + historyName: currentHistory.value?.name, + }); + const collection = await createDatasetCollection(currentHistory.value, modalResult); if (collection) { // TODO: Commenting this out; should we allow `handleIncoming` to handle this or not? // // remove the `elements` and `elements_datatypes` keys from the collection diff --git a/client/src/components/History/adapters/buildCollectionModal.ts b/client/src/components/History/adapters/buildCollectionModal.ts index 06be87275012..e3947d184420 100644 --- a/client/src/components/History/adapters/buildCollectionModal.ts +++ b/client/src/components/History/adapters/buildCollectionModal.ts @@ -24,6 +24,7 @@ export interface BuildCollectionOptions { title?: string; defaultHideSourceItems?: boolean; historyId?: string; + historyName?: string; } // stand-in for buildCollection from history-view-edit.js @@ -82,5 +83,6 @@ const createBackboneContent = (historyId: string, selection: HistoryItemSummary[ fromSelection: options.fromSelection, extensions: options.extensions, defaultHideSourceItems: options.defaultHideSourceItems === undefined ? true : options.defaultHideSourceItems, + historyName: options.historyName, }; }; diff --git a/client/src/style/scss/ui.scss b/client/src/style/scss/ui.scss index d29d05759050..916d98d12c99 100644 --- a/client/src/style/scss/ui.scss +++ b/client/src/style/scss/ui.scss @@ -71,6 +71,9 @@ $ui-margin-horizontal-large: $margin-v * 2; .ui-modal { display: none; overflow: auto; + .title { + width: 100%; + } .modal-header.no-separator { border: none !important; padding-bottom: 0px !important;