Refactor drag and drop logic to use getDragItems

This commit refactors the drag and drop logic in the HistoryPanel.vue and MultipleViewList.vue components to use the newly added getDragItems function in the eventStore. This function retrieves the drag items and filters out any non-history items, ensuring that only valid history items are processed during the drop event. This change improves code readability and reduces duplication.
This commit is contained in:
davelopez
2024-06-03 17:18:35 +02:00
parent a9bc8c41ae
commit ba01c12bfa
3 changed files with 18 additions and 47 deletions
+4
View File
@@ -211,6 +211,10 @@ export function isHistorySummaryExtended(history: AnyHistory): history is Histor
return "contents_active" in history && "user_id" in history;
}
export function isHistoryItem(item: object): item is HistoryItemSummary {
return item && "history_content_type" in item;
}
type QuotaUsageResponse = components["schemas"]["UserQuotaUsage"];
/** Represents a registered user.**/
@@ -3,7 +3,7 @@ import { BAlert } from "bootstrap-vue";
import { storeToRefs } from "pinia";
import { computed, onMounted, type Ref, ref, set as VueSet, unref, watch } from "vue";
import { type HistoryItemSummary, type HistorySummaryExtended, userOwnsHistory } from "@/api";
import { type HistoryItemSummary, type HistorySummaryExtended, isHistoryItem, userOwnsHistory } from "@/api";
import { copyDataset } from "@/api/datasets";
import ExpandedItems from "@/components/History/Content/ExpandedItems";
import SelectedItems from "@/components/History/Content/SelectedItems";
@@ -225,28 +225,11 @@ function dragSameHistory() {
function getDragData() {
const eventStore = useEventStore();
const multiple = eventStore.multipleDragData;
let data: HistoryItemSummary[] | undefined;
let historyId: string | undefined;
try {
if (multiple) {
const dragData = eventStore.getDragData() as Record<string, HistoryItemSummary>;
// set historyId to the first history_id in the multiple drag data
const firstItem = Object.values(dragData)[0];
if (firstItem) {
historyId = firstItem.history_id;
}
data = Object.values(dragData);
} else {
data = [eventStore.getDragData() as HistoryItemSummary];
if (data[0]) {
historyId = data[0].history_id;
}
}
} catch (error) {
// this was not a valid object for this dropzone, ignore
}
return { data, sameHistory: historyId === props.history.id, multiple };
const dragItems = eventStore.getDragItems();
// Filter out any non-history items
const historyItems = dragItems?.filter((item: any) => isHistoryItem(item)) as HistoryItemSummary[];
const historyId = historyItems?.[0]?.history_id;
return { data: historyItems, sameHistory: historyId === props.history.id, multiple: historyItems?.length > 1 };
}
function getHighlight(item: HistoryItemSummary) {
@@ -6,7 +6,7 @@ import { computed, type Ref, ref } from "vue";
//@ts-ignore missing typedefs
import VirtualList from "vue-virtual-scroll-list";
import { HistoryItemSummary } from "@/api";
import { HistoryItemSummary, isHistoryItem } from "@/api";
import { copyDataset } from "@/api/datasets";
import { useAnimationFrameResizeObserver } from "@/composables/sensors/animationFrameResizeObserver";
import { useAnimationFrameScroll } from "@/composables/sensors/animationFrameScroll";
@@ -75,29 +75,13 @@ async function onDrop(evt: any) {
}
processingDrop.value = true;
showDropZone.value = false;
let data: HistoryItemSummary[] | undefined;
let originalHistoryId: string | undefined;
const multiple = eventStore.multipleDragData;
try {
if (multiple) {
const dragData = eventStore.getDragData() as Record<string, HistoryItemSummary>;
// set originalHistoryId to the first history_id in the multiple drag data
const firstItem = Object.values(dragData)[0];
if (firstItem) {
originalHistoryId = firstItem.history_id;
}
data = Object.values(dragData);
} else {
data = [eventStore.getDragData() as HistoryItemSummary];
if (data[0]) {
originalHistoryId = data[0].history_id;
}
}
} catch (error) {
// this was not a valid object for this dropzone, ignore
}
const dragItems = eventStore.getDragItems();
// Filter out any non-history items
const historyItems = dragItems?.filter((item: any) => isHistoryItem(item)) as HistoryItemSummary[];
const multiple = historyItems.length > 1;
const originalHistoryId = historyItems?.[0]?.history_id;
if (data && originalHistoryId) {
if (historyItems && originalHistoryId) {
await historyStore.createNewHistory();
const currentHistoryId = historyStore.currentHistoryId;
@@ -105,7 +89,7 @@ async function onDrop(evt: any) {
let collectionCount = 0;
if (currentHistoryId) {
// iterate over the data array and copy each item to the new history
for (const item of data) {
for (const item of historyItems) {
const dataSource = item.history_content_type === "dataset" ? "hda" : "hdca";
await copyDataset(item.id, currentHistoryId, item.history_content_type, dataSource)
.then(() => {