From ceb40a25983c49b7f2330033098e9ebccdce37b9 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Tue, 9 Jul 2024 15:10:03 +0200
Subject: [PATCH 01/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20refactor=20`Sele?=
 =?UTF-8?q?ctionDialog/selectionTypes.ts`=20to=20use=20TypeScript=20litera?=
 =?UTF-8?q?l=20types=20for=20selection=20states=20and=20rename=20`selectAl?=
 =?UTF-8?q?lIcon`=20prop=20to=20`selectAllVariant`=20in=20`SelectionDialog?=
 =?UTF-8?q?`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/FilesDialog/FilesDialog.test.ts    | 6 +++---
 client/src/components/FilesDialog/FilesDialog.vue        | 5 +++--
 .../src/components/SelectionDialog/SelectionDialog.vue   | 6 +++---
 client/src/components/SelectionDialog/selectionTypes.ts  | 9 ++++++---
 4 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/client/src/components/FilesDialog/FilesDialog.test.ts b/client/src/components/FilesDialog/FilesDialog.test.ts
index c158f71a21bb..54cd7dcddf8f 100644
--- a/client/src/components/FilesDialog/FilesDialog.test.ts
+++ b/client/src/components/FilesDialog/FilesDialog.test.ts
@@ -4,7 +4,7 @@ import flushPromises from "flush-promises";
 import { getLocalVue } from "tests/jest/helpers";
 
 import { useServerMock } from "@/api/client/__mocks__";
-import { SELECTION_STATES, type SelectionItem } from "@/components/SelectionDialog/selectionTypes";
+import { SELECTION_STATES, type SelectionItem, type SelectionState } from "@/components/SelectionDialog/selectionTypes";
 
 /**
  * The following imports mock a remote file resource directory structure,
@@ -57,7 +57,7 @@ jest.mock("@/composables/config", () => ({
 const { server, http } = useServerMock();
 
 interface RowElement extends SelectionItem, Element {
-    _rowVariant: string;
+    _rowVariant: SelectionState;
 }
 
 function paramsToKey(query: { target?: string | null; recursive?: string | null; writeable?: string | null }): string {
@@ -392,7 +392,7 @@ class Utils {
     }
 
     expectSelectAllIconStatusToBe(status: string) {
-        expect(this.getSelectionDialog().props("selectAllIcon")).toBe(status);
+        expect(this.getSelectionDialog().props("selectAllVariant")).toBe(status);
     }
 
     expectNoErrorMessage() {
diff --git a/client/src/components/FilesDialog/FilesDialog.vue b/client/src/components/FilesDialog/FilesDialog.vue
index f61c7c372c85..74c0647e3680 100644
--- a/client/src/components/FilesDialog/FilesDialog.vue
+++ b/client/src/components/FilesDialog/FilesDialog.vue
@@ -16,6 +16,7 @@ import {
     type ItemsProviderContext,
     SELECTION_STATES,
     type SelectionItem,
+    type SelectionState,
 } from "@/components/SelectionDialog/selectionTypes";
 import { useConfig } from "@/composables/config";
 import { useFileSources } from "@/composables/fileSources";
@@ -73,7 +74,7 @@ const showDetails = ref(true);
 const isBusy = ref(false);
 const currentDirectory = ref<SelectionItem>();
 const showFTPHelper = ref(false);
-const selectAllIcon = ref(SELECTION_STATES.UNSELECTED);
+const selectAllIcon = ref<SelectionState>(SELECTION_STATES.UNSELECTED);
 const urlTracker = ref(new UrlTracker(""));
 const totalItems = ref(0);
 
@@ -415,7 +416,7 @@ onMounted(() => {
         :modal-static="modalStatic"
         :multiple="multiple"
         :options-show="optionsShow"
-        :select-all-icon="selectAllIcon"
+        :select-all-variant="selectAllIcon"
         :show-select-icon="undoShow && multiple"
         :undo-show="undoShow"
         @onCancel="() => (modalShow = false)"
diff --git a/client/src/components/SelectionDialog/SelectionDialog.vue b/client/src/components/SelectionDialog/SelectionDialog.vue
index 7a9c08ebaa0d..b0a9ebd60eac 100644
--- a/client/src/components/SelectionDialog/SelectionDialog.vue
+++ b/client/src/components/SelectionDialog/SelectionDialog.vue
@@ -35,7 +35,7 @@ interface Props {
     multiple?: boolean;
     optionsShow?: boolean;
     undoShow?: boolean;
-    selectAllIcon?: string;
+    selectAllVariant?: SelectionState;
     showSelectIcon?: boolean;
     title?: string;
 }
@@ -57,7 +57,7 @@ const props = withDefaults(defineProps<Props>(), {
     multiple: false,
     optionsShow: false,
     undoShow: false,
-    selectAllIcon: SELECTION_STATES.UNSELECTED,
+    selectAllVariant: SELECTION_STATES.UNSELECTED,
     showSelectIcon: false,
     title: "",
 });
@@ -174,7 +174,7 @@ watch(
                         <FontAwesomeIcon
                             class="select-checkbox cursor-pointer"
                             title="Check to select all datasets"
-                            :icon="selectionIcon(selectAllIcon)"
+                            :icon="selectionIcon(selectAllVariant)"
                             @click="$emit('onSelectAll')" />
                     </template>
                     <template v-slot:cell(__select_icon__)="data">
diff --git a/client/src/components/SelectionDialog/selectionTypes.ts b/client/src/components/SelectionDialog/selectionTypes.ts
index 894030920918..ef31438d22fa 100644
--- a/client/src/components/SelectionDialog/selectionTypes.ts
+++ b/client/src/components/SelectionDialog/selectionTypes.ts
@@ -1,9 +1,11 @@
 export const SELECTION_STATES = {
-    SELECTED: "success",
-    UNSELECTED: "default",
-    MIXED: "secondary",
+    SELECTED: "success" as const,
+    UNSELECTED: "default" as const,
+    MIXED: "secondary" as const,
 };
 
+export type SelectionState = (typeof SELECTION_STATES)[keyof typeof SELECTION_STATES];
+
 export interface FieldEntry {
     key: string;
     label?: string;
@@ -16,6 +18,7 @@ export interface SelectionItem {
     details: string;
     isLeaf: boolean;
     url: string;
+    _rowVariant?: SelectionState;
 }
 
 export interface ItemsProviderContext {

From 5101d0fffa3d67bc5dc2352aa7c94614279b78da Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Tue, 9 Jul 2024 15:12:03 +0200
Subject: [PATCH 02/33] =?UTF-8?q?=E2=9C=A8:=20add=20`FilterMenu`,=20folder?=
 =?UTF-8?q?Icon=20and=20`okButtonText`=20and=20`searchTitle`=20props=20=20?=
 =?UTF-8?q?to=20`SelectionDialog`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../SelectionDialog/SelectionDialog.vue       | 40 +++++++++++++++++--
 1 file changed, 36 insertions(+), 4 deletions(-)

diff --git a/client/src/components/SelectionDialog/SelectionDialog.vue b/client/src/components/SelectionDialog/SelectionDialog.vue
index b0a9ebd60eac..c67f203b6560 100644
--- a/client/src/components/SelectionDialog/SelectionDialog.vue
+++ b/client/src/components/SelectionDialog/SelectionDialog.vue
@@ -6,10 +6,13 @@ import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { BAlert, BButton, BLink, BModal, BPagination, BSpinner, BTable } from "bootstrap-vue";
 import { computed, ref, watch } from "vue";
 
-import { type ItemsProvider, SELECTION_STATES } from "@/components/SelectionDialog/selectionTypes";
+import { type ItemsProvider, SELECTION_STATES, type SelectionState } from "@/components/SelectionDialog/selectionTypes";
+import type Filtering from "@/utils/filtering";
 
 import { type FieldEntry, type SelectionItem } from "./selectionTypes";
 
+import FilterMenu from "@/components/Common/FilterMenu.vue";
+import Heading from "@/components/Common/Heading.vue";
 import DataDialogSearch from "@/components/SelectionDialog/DataDialogSearch.vue";
 import StatelessTags from "@/components/TagsMultiselect/StatelessTags.vue";
 
@@ -30,6 +33,7 @@ interface Props {
     providerUrl?: string;
     totalItems?: number;
     leafIcon?: string;
+    folderIcon?: string | object;
     modalShow?: boolean;
     modalStatic?: boolean;
     multiple?: boolean;
@@ -38,6 +42,9 @@ interface Props {
     selectAllVariant?: SelectionState;
     showSelectIcon?: boolean;
     title?: string;
+    searchTitle?: string;
+    okButtonText?: string;
+    filterClass?: Filtering<any>;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -52,6 +59,7 @@ const props = withDefaults(defineProps<Props>(), {
     providerUrl: undefined,
     totalItems: 0,
     leafIcon: "fa fa-file-o",
+    folderIcon: () => faFolder,
     modalShow: true,
     modalStatic: false,
     multiple: false,
@@ -60,6 +68,9 @@ const props = withDefaults(defineProps<Props>(), {
     selectAllVariant: SELECTION_STATES.UNSELECTED,
     showSelectIcon: false,
     title: "",
+    searchTitle: undefined,
+    okButtonText: "Select",
+    filterClass: undefined,
 });
 
 const emit = defineEmits<{
@@ -74,6 +85,11 @@ const emit = defineEmits<{
 const filter = ref("");
 const currentPage = ref(1);
 const perPage = ref(25);
+const showAdvancedSearch = ref(false);
+
+const okButtonText = computed(() => {
+    return props.okButtonText ? props.okButtonText : props.fileMode ? "Select" : "Select this folder";
+});
 
 const fieldDetails = computed(() => {
     const fields = props.fields.slice().map((x) => {
@@ -145,11 +161,27 @@ watch(
     <BModal
         v-if="modalShow"
         modal-class="selection-dialog-modal"
+        header-class="flex-column"
         visible
         :static="modalStatic"
+        :title="title"
         @hide="emit('onCancel')">
         <template v-slot:modal-header>
-            <DataDialogSearch v-model="filter" :title="title" />
+            <slot name="header">
+                <Heading v-if="props.title" h2> {{ props.title }} </Heading>
+
+                <FilterMenu
+                    v-if="props.filterClass"
+                    :name="props.title"
+                    class="w-100"
+                    :placeholder="props.searchTitle || props.title"
+                    :filter-class="props.filterClass"
+                    :filter-text.sync="filter"
+                    :loading="props.isBusy"
+                    :show-advanced.sync="showAdvancedSearch" />
+
+                <DataDialogSearch v-else v-model="filter" :title="props.searchTitle || props.title" />
+            </slot>
         </template>
         <slot name="helper" />
         <BAlert v-if="errorMessage" variant="danger" show>
@@ -191,7 +223,7 @@ watch(
                                     <span :title="`label-${data.item.url}`">{{ data.value ? data.value : "-" }}</span>
                                 </div>
                                 <div v-else @click.stop="emit('onOpen', data.item)">
-                                    <FontAwesomeIcon :icon="faFolder" />
+                                    <FontAwesomeIcon :icon="props.folderIcon" />
                                     <BLink :title="`label-${data.item.url}`">{{ data.value ? data.value : "-" }}</BLink>
                                 </div>
                             </span>
@@ -262,7 +294,7 @@ watch(
                         :disabled="disableOk"
                         @click="emit('onOk')">
                         <FontAwesomeIcon :icon="faCheck" />
-                        {{ fileMode ? "Ok" : "Select this folder" }}
+                        {{ okButtonText }}
                     </BButton>
                 </div>
             </div>

From 504ccbba60c81380b0c0f12c070aed8babe1c336 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Tue, 9 Jul 2024 15:16:29 +0200
Subject: [PATCH 03/33] =?UTF-8?q?=E2=9C=A8:=20create=20`api/folders`=20wit?=
 =?UTF-8?q?h=20`postFolderContent`=20endpoint?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/api/folders.ts | 3 +++
 1 file changed, 3 insertions(+)
 create mode 100644 client/src/api/folders.ts

diff --git a/client/src/api/folders.ts b/client/src/api/folders.ts
new file mode 100644
index 000000000000..521c1649a0ad
--- /dev/null
+++ b/client/src/api/folders.ts
@@ -0,0 +1,3 @@
+import { fetcher } from "@/api/schema";
+
+export const postFolderContent = fetcher.path("/api/folders/{folder_id}/contents").method("post").create();

From ef6c289a95c47a15a9436234c55fa570d0fddb52 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Tue, 9 Jul 2024 15:20:00 +0200
Subject: [PATCH 04/33] =?UTF-8?q?=F0=9F=8E=89:=20create=20`HistoryDatasetP?=
 =?UTF-8?q?icker`=20in=20Library?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../TopToolbar/HistoryDatasetPicker.vue       | 297 ++++++++++++++++++
 1 file changed, 297 insertions(+)
 create mode 100644 client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
new file mode 100644
index 000000000000..02f8384934d5
--- /dev/null
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -0,0 +1,297 @@
+<script setup lang="ts">
+import { library } from "@fortawesome/fontawesome-svg-core";
+import { faHdd } from "@fortawesome/free-solid-svg-icons";
+import { computed, ref } from "vue";
+
+import { HDASummary, HistorySummary } from "@/api";
+import { getDatasets } from "@/api/datasets";
+import { postFolderContent } from "@/api/folders";
+import { historiesFetcher } from "@/api/histories";
+import { HistoriesFilters } from "@/components/History/HistoriesFilters";
+import {
+    ItemsProvider,
+    ItemsProviderContext,
+    SELECTION_STATES,
+    SelectionItem,
+} from "@/components/SelectionDialog/selectionTypes";
+import { errorMessageAsString } from "@/utils/simple-error";
+
+import SelectionDialog from "@/components/SelectionDialog/SelectionDialog.vue";
+
+library.add(faHdd);
+
+type HistorySortKeys = "create_time" | "name" | "update_time" | undefined;
+
+interface HistoryRecord extends SelectionItem {
+    size: number;
+}
+
+interface Props {
+    folderId: string;
+}
+
+const props = defineProps<Props>();
+
+const emit = defineEmits<{
+    (e: "reload"): void;
+    (e: "onClose"): void;
+}>();
+
+const totalItems = ref(0);
+const loading = ref(false);
+const hasValue = ref(false);
+const modalShow = ref(true);
+const errorMessage = ref("");
+const allSelected = ref(false);
+const datasetsVisible = ref(false);
+
+const items = ref<SelectionItem[]>([]);
+const selected = ref<SelectionItem[]>([]);
+
+const itemsProvider = ref<ItemsProvider>(historiesProvider);
+
+const searchTitle = computed(() => {
+    if (datasetsVisible.value) {
+        return "datasets";
+    } else {
+        return "search histories";
+    }
+});
+const okButtonText = computed(() => {
+    if (selected.value.length === 0) {
+        return "Add";
+    }
+
+    return `Add ${selected.value.length} dataset${selected.value.length > 1 ? "s" : ""}`;
+});
+const fields = computed(() => {
+    if (datasetsVisible.value) {
+        return [
+            { key: "label", label: "Name", sortable: true },
+            { key: "update_time", label: "Last Updated", sortable: true },
+        ];
+    } else {
+        return [
+            { key: "label", label: "History Name" },
+            { key: "size", label: "Datasets", sortable: false },
+            { key: "update_time", label: "Last Updated" },
+        ];
+    }
+});
+const selectAllIcon = computed(() => {
+    if (allSelected.value) {
+        return SELECTION_STATES.SELECTED;
+    } else if (selected.value.length > 0) {
+        return SELECTION_STATES.MIXED;
+    } else {
+        return SELECTION_STATES.UNSELECTED;
+    }
+});
+
+function historyEntryToRecord(entry: HistorySummary): HistoryRecord {
+    const result = {
+        id: entry.id,
+        label: entry.name,
+        details: entry.annotation || "",
+        isLeaf: false,
+        url: entry.url,
+        size: entry.count,
+        update_time: entry.update_time,
+    };
+
+    return result;
+}
+
+function datasetEntryToRecord(entry: HDASummary): SelectionItem {
+    const result = {
+        id: entry.id,
+        label: entry.name || "",
+        details: "",
+        isLeaf: true,
+        url: entry.url,
+        update_time: entry.update_time,
+    };
+
+    return result;
+}
+
+function formatRows() {
+    hasValue.value = selected.value.length > 0;
+
+    for (const item of items.value) {
+        if (item.isLeaf) {
+            item._rowVariant =
+                selected.value.findIndex((i) => i.id === item.id) !== -1
+                    ? SELECTION_STATES.SELECTED
+                    : SELECTION_STATES.UNSELECTED;
+        }
+    }
+
+    allSelected.value = checkIfAllSelected();
+}
+
+function checkIfAllSelected(): boolean {
+    return Boolean(
+        items.value.length &&
+            items.value.every((item) => {
+                return selected.value.findIndex((i) => i.id === item.id) !== -1;
+            })
+    );
+}
+
+async function historiesProvider(ctx: ItemsProviderContext, url?: string): Promise<SelectionItem[]> {
+    loading.value = true;
+
+    try {
+        const limit = ctx.perPage;
+        const offset = (ctx.currentPage - 1) * ctx.perPage;
+        const sortDesc = ctx.sortDesc;
+        const sortBy = ctx.sortBy === "label" ? "name" : ctx.sortBy || "update_time";
+        const queryDict = HistoriesFilters.getQueryDict(ctx.filter);
+
+        const { data, headers } = await historiesFetcher({
+            search: "",
+            view: "summary",
+            keys: "create_time",
+            offset: offset,
+            limit: limit,
+            q: Object.keys(queryDict),
+            qv: Object.values(queryDict),
+            sort_by: sortBy as HistorySortKeys,
+            sort_desc: sortDesc,
+        });
+
+        totalItems.value = parseInt(headers.get("total_matches") ?? "0");
+
+        items.value = data.map(historyEntryToRecord as any);
+
+        formatRows();
+
+        return items.value;
+    } catch (error) {
+        errorMessage.value = errorMessageAsString(error);
+        return [];
+    } finally {
+        loading.value = false;
+    }
+}
+
+async function datasetsProvider(ctx: ItemsProviderContext, selectedHistory: HistoryRecord) {
+    loading.value = true;
+
+    try {
+        const limit = ctx.perPage;
+        const offset = (ctx.currentPage - 1) * ctx.perPage;
+        const query = ctx.filter;
+
+        const data = await getDatasets({
+            history_id: selectedHistory.id,
+            query: query,
+            sortBy: ctx.sortBy === "time" ? "update_time" : "name",
+            sortDesc: ctx.sortDesc,
+            offset: offset,
+            limit: limit,
+        });
+
+        items.value = (data as HDASummary[]).map(datasetEntryToRecord);
+
+        if (query) {
+            totalItems.value = items.value.length;
+        } else {
+            totalItems.value = selectedHistory.size;
+        }
+
+        formatRows();
+
+        return items.value;
+    } catch (error) {
+        errorMessage.value = errorMessageAsString(error);
+
+        return [];
+    } finally {
+        loading.value = false;
+    }
+}
+
+function onHistoryClick(item: SelectionItem) {
+    if (!item.isLeaf) {
+        datasetsVisible.value = true;
+        itemsProvider.value = (ctx: ItemsProviderContext) => datasetsProvider(ctx, item as HistoryRecord);
+    }
+}
+
+async function onDatasetClick(item: SelectionItem) {
+    if (item.isLeaf) {
+        if (selected.value.findIndex((i) => i.id === item.id) !== -1) {
+            selected.value = selected.value.filter((i) => i.id !== item.id);
+        } else {
+            selected.value.push(item);
+        }
+
+        formatRows();
+    }
+}
+
+function selectAll() {
+    if (allSelected.value) {
+        selected.value = [];
+    } else {
+        for (const item of items.value) {
+            if (selected.value.findIndex((i) => i.id === item.id) === -1) {
+                selected.value.push(item);
+            }
+        }
+    }
+
+    formatRows();
+}
+
+async function onUndo() {
+    selected.value = [];
+    datasetsVisible.value = false;
+    itemsProvider.value = historiesProvider;
+}
+
+async function onOk() {
+    for (const item of selected.value) {
+        await postFolderContent({ folder_id: props.folderId, from_hda_id: item.id });
+    }
+
+    emit("reload");
+    emit("onClose");
+}
+
+function onCancel() {
+    modalShow.value = false;
+
+    emit("onClose");
+}
+</script>
+
+<template>
+    <SelectionDialog
+        options-show
+        :disable-ok="!hasValue"
+        :fields="fields"
+        :ok-button-text="okButtonText"
+        :modal-show="modalShow"
+        :file-mode="false"
+        :multiple="true"
+        :select-all-variant="selectAllIcon"
+        :items="items"
+        :undo-show="datasetsVisible"
+        :total-items="totalItems"
+        :items-provider="itemsProvider"
+        :show-select-icon="datasetsVisible"
+        :folder-icon="faHdd"
+        :is-busy="loading"
+        :search-title="searchTitle"
+        title="Add datasets from your histories"
+        :filter-class="datasetsVisible ? undefined : HistoriesFilters"
+        @onOk="onOk"
+        @onUndo="onUndo"
+        @onCancel="onCancel"
+        @onSelectAll="selectAll"
+        @onOpen="onHistoryClick"
+        @onClick="onDatasetClick" />
+</template>

From 57f43c786024eca50ef3b3eb9311141aad4d0fb3 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Tue, 9 Jul 2024 15:21:28 +0200
Subject: [PATCH 05/33] =?UTF-8?q?=F0=9F=8E=A8:=20use=20`HistoryDatasetPick?=
 =?UTF-8?q?er`=20in=20`FolderTopBar`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LibraryFolder/TopToolbar/FolderTopBar.vue      | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
index bd1f6434f1e9..115799b46e6d 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
@@ -21,6 +21,7 @@ import { useUserStore } from "@/stores/userStore";
 import FolderDetails from "@/components/Libraries/LibraryFolder/FolderDetails/FolderDetails.vue";
 import LibraryBreadcrumb from "@/components/Libraries/LibraryFolder/LibraryBreadcrumb.vue";
 import SearchField from "@/components/Libraries/LibraryFolder/SearchField.vue";
+import HistoryDatasetPicker from "@/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue";
 
 library.add(faBook, faCaretDown, faDownload, faHome, faPlus, faTrash);
 
@@ -58,6 +59,7 @@ const { datatypes } = useDetailedDatatypes();
 
 const dbKeyStore = useDbKeyStore();
 
+const modalShow = ref("");
 const libraryImportDir = ref(false);
 const allowLibraryPathPaste = ref(false);
 const genomesList = ref<GenomesList>([]);
@@ -201,6 +203,10 @@ async function importToHistoryModal(isCollection: boolean) {
     }
 }
 
+function onAddDatasets(source: string = "") {
+    modalShow.value = source;
+}
+
 // TODO: after replacing the selection dialog with the new component that is not using jquery
 async function addDatasets(source: string) {
     await fetchExtAndGenomes();
@@ -285,7 +291,7 @@ onMounted(async () => {
                             <FontAwesomeIcon :icon="faCaretDown" />
                         </template>
 
-                        <BDropdownItem @click="addDatasets('history')"> from History </BDropdownItem>
+                        <BDropdownItem @click="onAddDatasets('history')"> from History </BDropdownItem>
 
                         <BDropdownItem v-if="userLibraryImportDirAvailable" @click="addDatasets('userdir')">
                             from User Directory
@@ -356,5 +362,11 @@ onMounted(async () => {
             v-if="props.metadata && props.metadata.full_path"
             :full_path="props.metadata.full_path"
             :current-id="props.folderId" />
+
+        <HistoryDatasetPicker
+            v-if="modalShow === 'history'"
+            :folder-id="props.folderId"
+            @onClose="onAddDatasets"
+            @reload="emit('fetchFolderContents')" />
     </div>
 </template>

From d6eba5a635e61e16be70acf9fe10920d3a582148 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 19 Jul 2024 14:30:22 +0200
Subject: [PATCH 06/33] =?UTF-8?q?=E2=9C=A8:=20add=20and=20expose=20`resetP?=
 =?UTF-8?q?agination`=20method=20to=20`SelectDialog`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/SelectionDialog/SelectionDialog.vue | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/client/src/components/SelectionDialog/SelectionDialog.vue b/client/src/components/SelectionDialog/SelectionDialog.vue
index c67f203b6560..d829e4d82c94 100644
--- a/client/src/components/SelectionDialog/SelectionDialog.vue
+++ b/client/src/components/SelectionDialog/SelectionDialog.vue
@@ -117,9 +117,9 @@ function selectionIcon(variant: string) {
 }
 
 /** Resets pagination when a filter/search word is entered **/
-function filtered(items: Array<SelectionItem>) {
+function filtered(items: SelectionItem[]) {
     if (props.itemsProvider === undefined) {
-        currentPage.value = 1;
+        resetPagination();
     }
 }
 
@@ -139,6 +139,14 @@ function formatTime(value: string) {
     }
 }
 
+function resetPagination() {
+    currentPage.value = 1;
+}
+
+defineExpose({
+    resetPagination,
+});
+
 watch(
     () => props.items,
     () => {
@@ -151,7 +159,7 @@ watch(
     () => {
         // We need to reset the current page when drilling down sub-folders
         if (props.itemsProvider !== undefined) {
-            currentPage.value = 1;
+            resetPagination();
         }
     }
 );

From a950dd7ad468aab4910c490b05528a4cadd52777 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 19 Jul 2024 14:53:56 +0200
Subject: [PATCH 07/33] =?UTF-8?q?=F0=9F=90=9B:=20fix=20reactivity=20issue?=
 =?UTF-8?q?=20when=20selecting=20an=20item=20in=20`HistoryDatasetPicker`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LibraryFolder/TopToolbar/HistoryDatasetPicker.vue       | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index 02f8384934d5..d52e8a985291 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { library } from "@fortawesome/fontawesome-svg-core";
 import { faHdd } from "@fortawesome/free-solid-svg-icons";
-import { computed, ref } from "vue";
+import { computed, ref, set } from "vue";
 
 import { HDASummary, HistorySummary } from "@/api";
 import { getDatasets } from "@/api/datasets";
@@ -120,10 +120,12 @@ function formatRows() {
 
     for (const item of items.value) {
         if (item.isLeaf) {
-            item._rowVariant =
+            const _rowVariant =
                 selected.value.findIndex((i) => i.id === item.id) !== -1
                     ? SELECTION_STATES.SELECTED
                     : SELECTION_STATES.UNSELECTED;
+
+            set(item, "_rowVariant", _rowVariant);
         }
     }
 

From 2684bf74f2d03947461ef024e8c9ccb275d50b10 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 19 Jul 2024 14:55:02 +0200
Subject: [PATCH 08/33] =?UTF-8?q?=F0=9F=90=9B:=20fix=20filter=20and=20pagi?=
 =?UTF-8?q?nation=20issues=20in=20`HistoryDatasetPicker`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../TopToolbar/HistoryDatasetPicker.vue            | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index d52e8a985291..7ce68d4e4b63 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -37,6 +37,8 @@ const emit = defineEmits<{
     (e: "onClose"): void;
 }>();
 
+const selectionDialog = ref();
+
 const totalItems = ref(0);
 const loading = ref(false);
 const hasValue = ref(false);
@@ -145,6 +147,12 @@ async function historiesProvider(ctx: ItemsProviderContext, url?: string): Promi
     loading.value = true;
 
     try {
+        const filter = ctx.filter;
+
+        if (filter) {
+            selectionDialog.value?.resetPagination();
+        }
+
         const limit = ctx.perPage;
         const offset = (ctx.currentPage - 1) * ctx.perPage;
         const sortDesc = ctx.sortDesc;
@@ -152,9 +160,10 @@ async function historiesProvider(ctx: ItemsProviderContext, url?: string): Promi
         const queryDict = HistoriesFilters.getQueryDict(ctx.filter);
 
         const { data, headers } = await historiesFetcher({
-            search: "",
+            search: filter,
             view: "summary",
             keys: "create_time",
+            show_own: true,
             offset: offset,
             limit: limit,
             q: Object.keys(queryDict),
@@ -217,6 +226,7 @@ async function datasetsProvider(ctx: ItemsProviderContext, selectedHistory: Hist
 
 function onHistoryClick(item: SelectionItem) {
     if (!item.isLeaf) {
+        selectionDialog.value?.resetPagination();
         datasetsVisible.value = true;
         itemsProvider.value = (ctx: ItemsProviderContext) => datasetsProvider(ctx, item as HistoryRecord);
     }
@@ -249,6 +259,7 @@ function selectAll() {
 }
 
 async function onUndo() {
+    selectionDialog.value?.resetPagination();
     selected.value = [];
     datasetsVisible.value = false;
     itemsProvider.value = historiesProvider;
@@ -272,6 +283,7 @@ function onCancel() {
 
 <template>
     <SelectionDialog
+        ref="selectionDialog"
         options-show
         :disable-ok="!hasValue"
         :fields="fields"

From e951cdd0248748f783e57e5ee0c3d1a233542565 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Wed, 24 Jul 2024 09:32:18 +0200
Subject: [PATCH 09/33] =?UTF-8?q?=E2=9C=A8:=20add=20and=20expose=20`resetF?=
 =?UTF-8?q?ilter`=20method=20to=20`SelectDialog`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/SelectionDialog/SelectionDialog.vue | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/client/src/components/SelectionDialog/SelectionDialog.vue b/client/src/components/SelectionDialog/SelectionDialog.vue
index d829e4d82c94..01dd15746cf8 100644
--- a/client/src/components/SelectionDialog/SelectionDialog.vue
+++ b/client/src/components/SelectionDialog/SelectionDialog.vue
@@ -139,11 +139,16 @@ function formatTime(value: string) {
     }
 }
 
+function resetFilter() {
+    filter.value = "";
+}
+
 function resetPagination() {
     currentPage.value = 1;
 }
 
 defineExpose({
+    resetFilter,
     resetPagination,
 });
 

From 669a695e6f9faef5d98c4916dca9eb7f4aeb7b54 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Wed, 24 Jul 2024 09:32:48 +0200
Subject: [PATCH 10/33] =?UTF-8?q?=F0=9F=90=9B:=20fix=20filter=20reset=20is?=
 =?UTF-8?q?sue=20in=20`HistoryDatasetPicker`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue  | 1 +
 1 file changed, 1 insertion(+)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index 7ce68d4e4b63..481f3b2b096d 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -226,6 +226,7 @@ async function datasetsProvider(ctx: ItemsProviderContext, selectedHistory: Hist
 
 function onHistoryClick(item: SelectionItem) {
     if (!item.isLeaf) {
+        selectionDialog.value?.resetFilter();
         selectionDialog.value?.resetPagination();
         datasetsVisible.value = true;
         itemsProvider.value = (ctx: ItemsProviderContext) => datasetsProvider(ctx, item as HistoryRecord);

From ae1169c1d351985f26b02296b31c6a6ce1d8ac21 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Wed, 24 Jul 2024 09:35:21 +0200
Subject: [PATCH 11/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20update=20`naviga?=
 =?UTF-8?q?tion.yml`=20selectors=20for=20`HistoryDatasetPicker`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/utils/navigation/navigation.yml | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/client/src/utils/navigation/navigation.yml b/client/src/utils/navigation/navigation.yml
index 2bee6af8fa2d..69e06bdb21e3 100644
--- a/client/src/utils/navigation/navigation.yml
+++ b/client/src/utils/navigation/navigation.yml
@@ -1032,6 +1032,14 @@ libraries:
       # TODO: Most of these aren't very good selectors but the same DOM elements
       # are reused without adding specific classes, IDs, or roles to anything.
       import_modal: '.modal'
+      import_datasets_from_history_modal: '.selection-dialog-modal'
+      import_datasets_from_history_modal_history_search: '.selection-dialog-modal .search-query'
+      import_datasets_from_history_modal_dataset_search: '.selection-dialog-modal input[placeholder="search datasets"]'
+      import_datasets_from_history_modal_list_is_ready: '.selection-dialog-modal .selection-dialog-table[aria-busy="false"]'
+      import_datasets_from_history_modal_select_list_items: '.selection-dialog-modal table tbody tr'
+      import_datasets_from_history_modal_select_list_item_by_index: '.selection-dialog-modal table tbody tr[aria-rowindex="${row_index}"] td[aria-colindex="1"]'
+      import_datasets_from_history_modal_ok: '.selection-dialog-modal [data-description="selection dialog ok"]'
+      import_datasets_from_history_modal_cancel: '.selection-dialog-modal [data-description="selection dialog cancel"]'
       import_datasets_ok_button: '.modal-footer .buttons #button-0'
       import_datasets_cancel_button: '.modal-footer .buttons #button-1'
       export_to_history_options: '#library-collection-type-select'
@@ -1040,8 +1048,6 @@ libraries:
       export_to_history_new_history: 'input[name=history_name]'
       clear_filters: '.clear-filters-link'
       import_progress_bar: '.progress-bar-import'
-      import_history_content: '.library_selected_history_content'
-      import_history_contents_items: '.library_selected_history_content tbody > tr'
       import_from_path_textarea: '#import_paths'
       select_all: '#select-all-checkboxes'
       select_one: '.lib-folder-checkbox'
@@ -1070,7 +1076,6 @@ libraries:
       private_dataset_icon: '.fa-key'
       open_location_details_btn: '.details-btn'
       location_details_ok_btn: '#details-modal .btn-primary'
-      add_history_items: '#dataset_add_bulk'
 
     labels:
       from_history: 'from History'

From 03f50f542ecbfb5b1f5c2ef07c6fca01a142cb6c Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Wed, 24 Jul 2024 09:39:47 +0200
Subject: [PATCH 12/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20add=20`libraries?=
 =?UTF-8?q?=5Fdataset=5Fimport=5Ffrom=5Fhistory=5Fsearch=5Ffor`=20in=20`na?=
 =?UTF-8?q?vigates=5Fgalaxy`=20and=20update=20`libraries=5Fdataset=5Fimpor?=
 =?UTF-8?q?t=5Ffrom=5Fhistory=5Fselect`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lib/galaxy/selenium/navigates_galaxy.py | 35 ++++++++++++++++---------
 1 file changed, 23 insertions(+), 12 deletions(-)

diff --git a/lib/galaxy/selenium/navigates_galaxy.py b/lib/galaxy/selenium/navigates_galaxy.py
index 95e70392029c..c26e035dc159 100644
--- a/lib/galaxy/selenium/navigates_galaxy.py
+++ b/lib/galaxy/selenium/navigates_galaxy.py
@@ -1395,25 +1395,36 @@ def libraries_dataset_import(self, btn):
         self.libraries_click_dataset_import()
         self.wait_for_and_click(btn)
 
+    def libraries_dataset_import_from_history_search_for(self, search_term=None):
+        return self._inline_search_for(
+            self.navigation.libraries.folder.selectors.import_datasets_from_history_modal_history_search,
+            search_term,
+        )
+
     def libraries_dataset_import_from_history_select(self, to_select_items):
-        self.wait_for_visible(self.navigation.libraries.folder.selectors.import_history_content)
-        history_elements = self.find_elements(self.navigation.libraries.folder.selectors.import_history_contents_items)
+        self.wait_for_visible(
+            self.navigation.libraries.folder.selectors.import_datasets_from_history_modal_list_is_ready
+        )
         for to_select_item in to_select_items:
             found = False
-            for history_element in history_elements:
-                if to_select_item in history_element.text:
-                    history_element.find_element(By.CSS_SELECTOR, "input").click()
-                    found = True
-                    break
-
-            if not found:
-                raise Exception(f"Failed to find history item [{to_select_item}] to select")
+            self._inline_search_for(
+                self.navigation.libraries.folder.selectors.import_datasets_from_history_modal_dataset_search,
+                to_select_item,
+            )
+            self.components.libraries.folder.import_datasets_from_history_modal_select_list_item_by_index(
+                row_index=1
+            ).wait_for_and_click()
+            found = True
+        if not found:
+            raise Exception(f"Failed to find history item [{to_select_item}] to select")
 
     def libraries_dataset_import_from_history_click_ok(self, wait=True):
-        self.wait_for_and_click(self.navigation.libraries.folder.selectors.import_datasets_ok_button)
+        self.wait_for_and_click(self.navigation.libraries.folder.selectors.import_datasets_from_history_modal_ok)
         if wait:
             # Let the progress bar disappear...
-            self.wait_for_absent_or_hidden(self.navigation.libraries.folder.selectors.import_progress_bar)
+            self.wait_for_absent_or_hidden(
+                self.navigation.libraries.folder.selectors.import_datasets_from_history_modal
+            )
 
     def libraries_table_elements(self):
         tbody_element = self.wait_for_selector_visible("#folder_list_body > tbody")

From 9fd716f0629c04913b621b35320727d421a77a0b Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Wed, 24 Jul 2024 09:42:09 +0200
Subject: [PATCH 13/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20update=20`test?=
 =?UTF-8?q?=5Flibrary=5Fcontents`=20to=20work=20with=20`HistoryDatasetPick?=
 =?UTF-8?q?er`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../selenium/test_library_contents.py         | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/lib/galaxy_test/selenium/test_library_contents.py b/lib/galaxy_test/selenium/test_library_contents.py
index 19b26825e1ce..a2b9511f6f6d 100644
--- a/lib/galaxy_test/selenium/test_library_contents.py
+++ b/lib/galaxy_test/selenium/test_library_contents.py
@@ -69,14 +69,14 @@ def test_import_dataset_from_history(self):
         self.sleep_for(self.wait_types.UX_RENDER)
         self.libraries_dataset_import(self.navigation.libraries.folder.labels.from_history)
         # Click the cancel button, make sure modal is hidden.
-        self.wait_for_visible(self.navigation.libraries.folder.selectors.import_modal)
-        self.wait_for_and_click(self.navigation.libraries.folder.selectors.import_datasets_cancel_button)
-        self.wait_for_absent_or_hidden(self.navigation.libraries.folder.selectors.import_modal)
+        self.wait_for_visible(self.navigation.libraries.folder.selectors.import_datasets_from_history_modal)
+        self.wait_for_and_click(self.navigation.libraries.folder.selectors.import_datasets_from_history_modal_cancel)
+        self.wait_for_absent_or_hidden(self.navigation.libraries.folder.selectors.import_datasets_from_history_modal)
 
         self.libraries_dataset_import(self.navigation.libraries.folder.labels.from_history)
-        # Need to select the right item on the dropdown
+        # Need to search for the history and select it before we can select datasets.
         self.sleep_for(self.wait_types.UX_RENDER)
-        self._select_history_option("Unnamed history")
+        self._search_and_select_history(1, "Unnamed history")
         self.sleep_for(self.wait_types.UX_RENDER)
         self.libraries_dataset_import_from_history_select(["1.txt"])
         # Add
@@ -186,6 +186,9 @@ def test_show_details(self):
         self.screenshot("libraries_show_details_done")
 
     @retry_during_transitions
-    def _select_history_option(self, label_text):
-        select = self.components.libraries.folder.add_history_items.wait_for_select()
-        select.select_by_visible_text(label_text)
+    def _search_and_select_history(self, row_index=1, label_text="Unnamed history"):
+        self.libraries_dataset_import_from_history_search_for(label_text)
+        self.sleep_for(self.wait_types.UX_RENDER)
+        self.components.libraries.folder.import_datasets_from_history_modal_select_list_item_by_index(
+            row_index=row_index
+        ).wait_for_and_click()

From be3779844182efa419404354bbc97486ece63d75 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Wed, 24 Jul 2024 09:51:13 +0200
Subject: [PATCH 14/33] =?UTF-8?q?=F0=9F=8E=A8:=20add=20submitting=20state?=
 =?UTF-8?q?=20and=20success=20toast=20to=20`HistoryDatasetPicker`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../TopToolbar/HistoryDatasetPicker.vue       | 30 ++++++++++++++-----
 1 file changed, 22 insertions(+), 8 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index 481f3b2b096d..8861891ce0e1 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -14,6 +14,7 @@ import {
     SELECTION_STATES,
     SelectionItem,
 } from "@/components/SelectionDialog/selectionTypes";
+import { Toast } from "@/composables/toast";
 import { errorMessageAsString } from "@/utils/simple-error";
 
 import SelectionDialog from "@/components/SelectionDialog/SelectionDialog.vue";
@@ -44,6 +45,7 @@ const loading = ref(false);
 const hasValue = ref(false);
 const modalShow = ref(true);
 const errorMessage = ref("");
+const submitting = ref(false);
 const allSelected = ref(false);
 const datasetsVisible = ref(false);
 
@@ -62,9 +64,11 @@ const searchTitle = computed(() => {
 const okButtonText = computed(() => {
     if (selected.value.length === 0) {
         return "Add";
+    } else if (submitting.value) {
+        return "Adding...";
+    } else {
+        return `Add ${selected.value.length} dataset${selected.value.length > 1 ? "s" : ""}`;
     }
-
-    return `Add ${selected.value.length} dataset${selected.value.length > 1 ? "s" : ""}`;
 });
 const fields = computed(() => {
     if (datasetsVisible.value) {
@@ -267,12 +271,22 @@ async function onUndo() {
 }
 
 async function onOk() {
-    for (const item of selected.value) {
-        await postFolderContent({ folder_id: props.folderId, from_hda_id: item.id });
-    }
+    try {
+        submitting.value = true;
 
-    emit("reload");
-    emit("onClose");
+        for (const item of selected.value) {
+            await postFolderContent({ folder_id: props.folderId, from_hda_id: item.id });
+        }
+
+        Toast.success(`Added ${selected.value.length} dataset${selected.value.length > 1 ? "s" : ""} to the folder`);
+
+        emit("reload");
+        emit("onClose");
+    } catch (error) {
+        errorMessage.value = errorMessageAsString(error);
+    } finally {
+        submitting.value = false;
+    }
 }
 
 function onCancel() {
@@ -286,7 +300,7 @@ function onCancel() {
     <SelectionDialog
         ref="selectionDialog"
         options-show
-        :disable-ok="!hasValue"
+        :disable-ok="!hasValue || submitting"
         :fields="fields"
         :ok-button-text="okButtonText"
         :modal-show="modalShow"

From 45205f5f22d845d9b6f57e9aa7187cf0649902e0 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Thu, 25 Jul 2024 11:40:29 +0200
Subject: [PATCH 15/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20update=20`Folder?=
 =?UTF-8?q?TopBar`=20to=20use=20`useConfig`=20composable?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LibraryFolder/TopToolbar/FolderTopBar.vue | 22 +++++++------------
 1 file changed, 8 insertions(+), 14 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
index 115799b46e6d..f7765de17208 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
@@ -4,15 +4,15 @@ import { faBook, faCaretDown, faDownload, faHome, faPlus, faTrash } from "@forta
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { BButton, BDropdown, BDropdownDivider, BDropdownGroup, BDropdownItem, BFormCheckbox } from "bootstrap-vue";
 import { storeToRefs } from "pinia";
-import { computed, onMounted, ref } from "vue";
+import { computed, ref } from "vue";
 
-import { getGalaxyInstance } from "@/app";
 import { Services } from "@/components/Libraries/LibraryFolder/services";
 import mod_add_datasets from "@/components/Libraries/LibraryFolder/TopToolbar/add-datasets";
 import { deleteSelectedItems } from "@/components/Libraries/LibraryFolder/TopToolbar/delete-selected";
 import download from "@/components/Libraries/LibraryFolder/TopToolbar/download";
 import mod_import_collection from "@/components/Libraries/LibraryFolder/TopToolbar/import-to-history/import-collection";
 import mod_import_dataset from "@/components/Libraries/LibraryFolder/TopToolbar/import-to-history/import-dataset";
+import { useConfig } from "@/composables/config";
 import { type DetailedDatatypes, useDetailedDatatypes } from "@/composables/datatypes";
 import { Toast } from "@/composables/toast";
 import { useDbKeyStore } from "@/stores/dbKeyStore";
@@ -52,6 +52,8 @@ const emit = defineEmits<{
     (e: "update:includeDeleted", value: boolean): void;
 }>();
 
+const { config, isConfigLoaded } = useConfig();
+
 const userStore = useUserStore();
 const { isAdmin } = storeToRefs(userStore);
 
@@ -60,11 +62,8 @@ const { datatypes } = useDetailedDatatypes();
 const dbKeyStore = useDbKeyStore();
 
 const modalShow = ref("");
-const libraryImportDir = ref(false);
-const allowLibraryPathPaste = ref(false);
 const genomesList = ref<GenomesList>([]);
 const extensionsList = ref<DetailedDatatypes[]>([]);
-const userLibraryImportDirAvailable = ref(false);
 const auto = ref({
     id: "auto",
     extension: "auto",
@@ -78,10 +77,11 @@ const auto = ref({
     description_url: "",
 });
 
-const Galaxy = getGalaxyInstance();
-
 const services = new Services();
 
+const libraryImportDir = computed(() => isConfigLoaded && config.value?.library_import_dir);
+const allowLibraryPathPaste = computed(() => isConfigLoaded && config.value?.allow_library_path_paste);
+const userLibraryImportDirAvailable = computed(() => isConfigLoaded && config.value?.user_library_import_dir_available);
 const containsFileOrFolder = computed(() => {
     return props.folderContents.find((el) => el.type === "folder" || el.type === "file");
 });
@@ -89,7 +89,7 @@ const canDelete = computed(() => {
     return !!(containsFileOrFolder.value && isAdmin.value);
 });
 const datasetManipulation = computed(() => {
-    return !!(containsFileOrFolder.value && Galaxy.user);
+    return !!(containsFileOrFolder.value && userStore.currentUser);
 });
 const totalRows = computed(() => {
     return props.metadata?.total_rows ?? 0;
@@ -246,12 +246,6 @@ async function fetchExtAndGenomes() {
         console.error(err);
     }
 }
-
-onMounted(async () => {
-    libraryImportDir.value = Galaxy.config.library_import_dir;
-    allowLibraryPathPaste.value = Galaxy.config.allow_library_path_paste;
-    userLibraryImportDirAvailable.value = Galaxy.config.user_library_import_dir_available;
-});
 </script>
 
 <template>

From 5aac94b1e43faa5c03e6eb7504c26496a4f7af22 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Thu, 25 Jul 2024 11:42:31 +0200
Subject: [PATCH 16/33] =?UTF-8?q?=F0=9F=90=9B:=20reset=20filter=20in=20His?=
 =?UTF-8?q?toryDatasetPicker=20on=20onUndo?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue  | 1 +
 1 file changed, 1 insertion(+)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index 8861891ce0e1..d183a3c3a6cc 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -264,6 +264,7 @@ function selectAll() {
 }
 
 async function onUndo() {
+    selectionDialog.value?.resetFilter();
     selectionDialog.value?.resetPagination();
     selected.value = [];
     datasetsVisible.value = false;

From 617c3b6a5f6d3e30fc34356788671d7bad32d11d Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Thu, 25 Jul 2024 11:48:12 +0200
Subject: [PATCH 17/33] =?UTF-8?q?=E2=9C=A8:=20add=20`total=5Fmatches`=20to?=
 =?UTF-8?q?=20GET=20"/api/datasets"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Arash Kadkhodaei <arash77.kad@gmail.com>
---
 lib/galaxy/webapps/galaxy/api/datasets.py     |  5 ++++-
 .../webapps/galaxy/services/datasets.py       | 22 +++++++++++++------
 2 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/lib/galaxy/webapps/galaxy/api/datasets.py b/lib/galaxy/webapps/galaxy/api/datasets.py
index fdc790d9fd96..73a06eaf0d66 100644
--- a/lib/galaxy/webapps/galaxy/api/datasets.py
+++ b/lib/galaxy/webapps/galaxy/api/datasets.py
@@ -143,6 +143,7 @@ class FastAPIDatasets:
     )
     def index(
         self,
+        response: Response,
         trans=DependsOnTrans,
         history_id: Optional[DecodedDatabaseIdField] = Query(
             default=None,
@@ -151,7 +152,9 @@ def index(
         serialization_params: SerializationParams = Depends(query_serialization_params),
         filter_query_params: FilterQueryParams = Depends(get_filter_query_params),
     ) -> List[AnyHistoryContentItem]:
-        return self.service.index(trans, history_id, serialization_params, filter_query_params)
+        entries, total_matches = self.service.index(trans, history_id, serialization_params, filter_query_params)
+        response.headers["total_matches"] = str(total_matches)
+        return entries
 
     @router.get(
         "/api/datasets/{dataset_id}/storage",
diff --git a/lib/galaxy/webapps/galaxy/services/datasets.py b/lib/galaxy/webapps/galaxy/services/datasets.py
index 6d4598bf30d2..0496a8cad822 100644
--- a/lib/galaxy/webapps/galaxy/services/datasets.py
+++ b/lib/galaxy/webapps/galaxy/services/datasets.py
@@ -325,7 +325,7 @@ def index(
         history_id: Optional[DecodedDatabaseIdField],
         serialization_params: SerializationParams,
         filter_query_params: FilterQueryParams,
-    ) -> List[AnyHistoryContentItem]:
+    ) -> Tuple[List[AnyHistoryContentItem], int]:
         """
         Search datasets or collections using a query system and returns a list
         containing summary of dataset or dataset_collection information.
@@ -345,12 +345,20 @@ def index(
             order_by=order_by,
             user_id=user.id,
         )
-        return [
-            self.serializer_by_type[content.history_content_type].serialize_to_view(
-                content, user=user, trans=trans, encode_id=False, **serialization_params.model_dump()
-            )
-            for content in contents
-        ]
+        total_matches = self.history_contents_manager.contents_count(
+            container=container,
+            filters=filters,
+            user_id=user.id,
+        )
+        return (
+            [
+                self.serializer_by_type[content.history_content_type].serialize_to_view(
+                    content, user=user, trans=trans, encode_id=False, **serialization_params.model_dump()
+                )
+                for content in contents
+            ],
+            total_matches,
+        )
 
     def show(
         self,

From 68597697005eff802790e7d54abaa91be1295f7b Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Thu, 25 Jul 2024 12:06:36 +0200
Subject: [PATCH 18/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20update=20`getDat?=
 =?UTF-8?q?asets`=20to=20return=20`total=5Fmatches`=20and=20update=20the?=
 =?UTF-8?q?=20usage=20accordingly?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LibraryFolder/TopToolbar/HistoryDatasetPicker.vue  | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index d183a3c3a6cc..bdbcf689ff97 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -199,7 +199,7 @@ async function datasetsProvider(ctx: ItemsProviderContext, selectedHistory: Hist
         const offset = (ctx.currentPage - 1) * ctx.perPage;
         const query = ctx.filter;
 
-        const data = await getDatasets({
+        const { data, total_matches } = await getDatasets({
             history_id: selectedHistory.id,
             query: query,
             sortBy: ctx.sortBy === "time" ? "update_time" : "name",
@@ -208,13 +208,9 @@ async function datasetsProvider(ctx: ItemsProviderContext, selectedHistory: Hist
             limit: limit,
         });
 
-        items.value = (data as HDASummary[]).map(datasetEntryToRecord);
+        totalItems.value = total_matches;
 
-        if (query) {
-            totalItems.value = items.value.length;
-        } else {
-            totalItems.value = selectedHistory.size;
-        }
+        items.value = (data as HDASummary[]).map(datasetEntryToRecord);
 
         formatRows();
 

From 489af1075c7ef01caa36d88d8c19086223195497 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 26 Jul 2024 18:06:09 +0200
Subject: [PATCH 19/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20import=20missing?=
 =?UTF-8?q?=20types=20in=20`HistoryDatasetPicker`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LibraryFolder/TopToolbar/HistoryDatasetPicker.vue     | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index bdbcf689ff97..f1a17d1ee0ce 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -3,16 +3,16 @@ import { library } from "@fortawesome/fontawesome-svg-core";
 import { faHdd } from "@fortawesome/free-solid-svg-icons";
 import { computed, ref, set } from "vue";
 
-import { HDASummary, HistorySummary } from "@/api";
+import { type HDASummary, type HistorySummary } from "@/api";
 import { getDatasets } from "@/api/datasets";
 import { postFolderContent } from "@/api/folders";
 import { historiesFetcher } from "@/api/histories";
 import { HistoriesFilters } from "@/components/History/HistoriesFilters";
 import {
-    ItemsProvider,
-    ItemsProviderContext,
+    type ItemsProvider,
+    type ItemsProviderContext,
     SELECTION_STATES,
-    SelectionItem,
+    type SelectionItem,
 } from "@/components/SelectionDialog/selectionTypes";
 import { Toast } from "@/composables/toast";
 import { errorMessageAsString } from "@/utils/simple-error";

From 73c1f499656304c1aef5d81867f9884c86a72510 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Mon, 29 Jul 2024 15:34:47 +0200
Subject: [PATCH 20/33] =?UTF-8?q?=F0=9F=94=A5:=20remove=20`addFilesFromHis?=
 =?UTF-8?q?toryModal`=20and=20related=20methods=20from=20`add-datasets.js`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LibraryFolder/TopToolbar/add-datasets.js  | 260 ------------------
 1 file changed, 260 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/add-datasets.js b/client/src/components/Libraries/LibraryFolder/TopToolbar/add-datasets.js
index 5733e40d4957..42e5db51eb4b 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/add-datasets.js
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/add-datasets.js
@@ -32,9 +32,6 @@ var AddDatasets = Backbone.View.extend({
      */
     showImportModal: function (options) {
         switch (options.source) {
-            case "history":
-                this.addFilesFromHistoryModal();
-                break;
             case "importdir":
                 this.importFilesFromGalaxyFolderModal({
                     source: "importdir",
@@ -176,46 +173,6 @@ var AddDatasets = Backbone.View.extend({
             value: "auto",
         });
     },
-    addFilesFromHistoryModal: function () {
-        const Galaxy = getGalaxyInstance();
-        this.histories = new mod_library_model.GalaxyHistories();
-        this.histories
-            .fetch()
-            .done(() => {
-                this.modal = Galaxy.modal;
-                var template_modal = this.templateAddFilesFromHistory();
-                this.modal.show({
-                    closing_events: true,
-                    title: _l("Adding datasets from your history"),
-                    body: template_modal({
-                        histories: this.histories.models,
-                    }),
-                    buttons: {
-                        Add: () => {
-                            this.addAllDatasetsFromHistory();
-                        },
-                        Close: () => {
-                            Galaxy.modal.hide();
-                        },
-                    },
-                    closing_callback: () => {
-                        // TODO update table without fetching new content from the server
-                        // Galaxy.libraries.library_router.navigate(`folders/${this.id}`, { trigger: true });
-                    },
-                });
-                this.fetchAndDisplayHistoryContents(this.histories.models[0].id);
-                $("#dataset_add_bulk").change((event) => {
-                    this.fetchAndDisplayHistoryContents(event.target.value);
-                });
-            })
-            .fail((model, response) => {
-                if (typeof response.responseJSON !== "undefined") {
-                    Toast.error(response.responseJSON.err_msg);
-                } else {
-                    Toast.error("An error occurred.");
-                }
-            });
-    },
     /**
      * Create modal for importing from given directory
      * on Galaxy. Bind jQuery events.
@@ -546,49 +503,6 @@ var AddDatasets = Backbone.View.extend({
                 this.chainCallImportingFolders(options);
             });
     },
-
-    fetchAndDisplayHistoryContents: function (history_id) {
-        var history_contents = new mod_library_model.HistoryContents({
-            id: history_id,
-        });
-        history_contents.fetch({
-            success: (history_contents) => {
-                var history_contents_template = this.templateHistoryContents();
-
-                if (history_contents.length > 0) {
-                    this.histories.get(history_id).set({ contents: history_contents });
-                    this.modal.$el.find(".library_selected_history_content").html(
-                        history_contents_template({
-                            history_contents: history_contents.models.reverse(),
-                        })
-                    );
-                    this.modal.$el.find(".history-import-select-all").bind("click", () => {
-                        $(".library_selected_history_content [type=checkbox]").prop("checked", true);
-                    });
-                    this.modal.$el.find(".history-import-unselect-all").bind("click", () => {
-                        $(".library_selected_history_content [type=checkbox]").prop("checked", false);
-                    });
-
-                    this.modal.$el.find(".history-import-toggle-all").bind("click", (e) => {
-                        this.selectAll(e);
-                    });
-
-                    this.modal.$el.find(".dataset_row").bind("click", (e) => {
-                        this.selectClickedRow(e);
-                    });
-                } else {
-                    this.modal.$el.find(".library_selected_history_content").html(`<p>Selected history is empty.</p>`);
-                }
-            },
-            error: (model, response) => {
-                if (typeof response.responseJSON !== "undefined") {
-                    Toast.error(response.responseJSON.err_msg);
-                } else {
-                    Toast.error("An error occurred.");
-                }
-            },
-        });
-    },
     templateAddingDatasetsProgressBar: function () {
         return _.template(
             `<div class="import_text">
@@ -602,180 +516,6 @@ var AddDatasets = Backbone.View.extend({
             </div>`
         );
     },
-    templateAddFilesFromHistory: function () {
-        return _.template(
-            `<div id="add_files_modal">
-                <div class="form-group">
-                    <label>1. Select history:</label>
-                    <select id="dataset_add_bulk" name="dataset_add_bulk" class="form-control">
-                        <% _.each(histories, function(history) { %> <!-- history select box -->
-                            <option value="<%= _.escape(history.get("id")) %>">
-                                <%= _.escape(history.get("name")) %>
-                            </option>
-                        <% }); %>
-                    </select>
-                </div>
-                <div class="library_selected_history_content">
-                </div>
-            </div>`
-        );
-    },
-    templateHistoryContents: function () {
-        return _.template(
-            `<div class="form-group">
-                <label>2. Choose the datasets to import:</label>
-                <div class="library_style_container" style="width: 100%;" id="dataset_list">
-                    <table class="grid table table-hover table-sm">
-                        <thead>
-                            <tr>
-                                <th style="width: 30px;" class="mid" title="Check to select all datasets">
-                                    <input class="history-import-toggle-all" style="margin: 0;" type="checkbox" />
-                                </th>
-                                <th style="width: 30px;"></th>
-                                <th>Name</th>
-                            </tr>
-                        </thead>
-                        <tbody>
-                            <% _.each(history_contents, function(history_item) { %>
-                                <% if (history_item.get("deleted") != true ) { %>
-                                    <% var item_name = history_item.get("name") %>
-                                    <% if (history_item.get("type") === "collection") { %>
-                                        <% var collection_type = history_item.get("collection_type") %>
-                                        <% if (collection_type === "list") { %>
-                                            <tr class="dataset_row" data-id="<%= _.escape(history_item.get("id")) %>"
-                                                data-name="<%= _.escape(history_item.get("type")) %>">
-                                                <td><input style="margin: 0;" type="checkbox"></td>
-                                                <td><%= _.escape(history_item.get("hid")) %></td>
-                                                <td>
-                                                    <%= item_name.length > 75 ? _.escape("...".concat(item_name.substr(-75))) : _.escape(item_name) %>
-                                                    (Dataset Collection)
-                                                </td>
-                                            </tr>
-                                        <% } else { %>
-                                            <tr class="dataset_row" title="You can convert this collection into a collection of type list using the Collection Tools">
-                                                <td><input style="margin: 0;" type="checkbox" onclick="return false;" disabled="disabled" /></td>
-                                                <td><%= _.escape(history_item.get("hid")) %></td>
-                                                <td>
-                                                    <%= item_name.length > 75 ? _.escape("...".concat(item_name.substr(-75))) : _.escape(item_name) %>
-                                                    (Dataset Collection of type <%= _.escape(collection_type) %> not supported.)
-                                                </td>
-                                            </tr>
-                                        <% } %>
-                                    <% } else if (history_item.get("visible") === true && history_item.get("state") === "ok") { %>
-                                        <tr class="dataset_row" data-id="<%= _.escape(history_item.get("id")) %>"
-                                            data-name="<%= _.escape(history_item.get("type")) %>">
-                                            <td><input style="margin: 0;" type="checkbox"></td>
-                                            <td><%= _.escape(history_item.get("hid")) %></td>
-                                            <td>
-                                                <%= item_name.length > 75 ? _.escape("...".concat(item_name.substr(-75))) : _.escape(item_name) %>
-                                            </td>
-                                        </tr>
-                                    <% } %>
-                                <% } %>
-                            <% }); %>
-                        </tbody>
-                    </table>
-                </div>
-            </div>`
-        );
-    },
-    /**
-     * Check checkbox if user clicks on the whole row or
-     *  on the checkbox itself
-     */
-    selectClickedRow: function (event) {
-        var checkbox = "";
-        var $row;
-        var source;
-        $row = $(event.target).closest("tr");
-        if (event.target.localName === "input") {
-            checkbox = event.target;
-            source = "input";
-        } else if (event.target.localName === "td") {
-            checkbox = $row.find(":checkbox")[0];
-            source = "td";
-        }
-        if (checkbox.checked) {
-            if (source === "td") {
-                checkbox.checked = "";
-                this.makeWhiteRow($row);
-            } else if (source === "input") {
-                this.makeDarkRow($row);
-            }
-        } else {
-            if (source === "td") {
-                checkbox.checked = "selected";
-                this.makeDarkRow($row);
-            } else if (source === "input") {
-                this.makeWhiteRow($row);
-            }
-        }
-    },
-
-    /**
-     * User clicked the checkbox in the table heading
-     * @param  {context} event
-     */
-    selectAll: function (event) {
-        var selected = event.target.checked;
-        var self = this;
-        // Iterate each checkbox
-        $(":checkbox", "#dataset_list tbody").each(function () {
-            this.checked = selected;
-            var $row = $(this).closest("tr");
-            // Change color of selected/unselected
-            if (selected) {
-                self.makeDarkRow($row);
-            } else {
-                self.makeWhiteRow($row);
-            }
-        });
-    },
-
-    makeDarkRow: function ($row) {
-        $row.addClass("table-primary");
-    },
-
-    makeWhiteRow: function ($row) {
-        $row.removeClass("table-primary");
-    },
-    /**
-     * Import all selected datasets from history into the current folder.
-     */
-    addAllDatasetsFromHistory: function () {
-        var checked_hdas = this.modal.$el.find(".library_selected_history_content").find(":checked");
-        var history_item_ids = []; // can be hda or hdca
-        var history_item_types = [];
-        var items_to_add = [];
-        if (checked_hdas.length < 1) {
-            Toast.info("You must select some datasets first.");
-        } else {
-            this.modal.disableButton("Add");
-            checked_hdas.each(function () {
-                var hid = $(this).closest("tr").data("id");
-                if (hid) {
-                    var item_type = $(this).closest("tr").data("name");
-                    history_item_ids.push(hid);
-                    history_item_types.push(item_type);
-                }
-            });
-            for (let i = history_item_ids.length - 1; i >= 0; i--) {
-                var history_item_id = history_item_ids[i];
-                var folder_item = new mod_library_model.Item();
-                folder_item.url = `${getAppRoot()}api/folders/${this.options.id}/contents`;
-                if (history_item_types[i] === "collection") {
-                    folder_item.set({ from_hdca_id: history_item_id });
-                } else {
-                    folder_item.set({ from_hda_id: history_item_id });
-                }
-                items_to_add.push(folder_item);
-            }
-            this.initChainCallControlAddingDatasets({
-                length: items_to_add.length,
-            });
-            this.chainCallAddingHdas(items_to_add);
-        }
-    },
     initChainCallControlAddingDatasets: function (options) {
         var template;
         template = this.templateAddingDatasetsProgressBar();

From a39494478e6faab4945aebe010cb50c0dcebf868 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Wed, 11 Sep 2024 16:43:33 +0200
Subject: [PATCH 21/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20refactor=20`Hist?=
 =?UTF-8?q?oryDatasetPicker`=20to=20use=20`GalaxyApi`=20for=20fetching=20h?=
 =?UTF-8?q?istories=20and=20datasets=20and=20post=20folder=20contents?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../TopToolbar/HistoryDatasetPicker.vue       | 75 ++++++++++++-------
 1 file changed, 49 insertions(+), 26 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index f1a17d1ee0ce..3f544132b961 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -3,10 +3,7 @@ import { library } from "@fortawesome/fontawesome-svg-core";
 import { faHdd } from "@fortawesome/free-solid-svg-icons";
 import { computed, ref, set } from "vue";
 
-import { type HDASummary, type HistorySummary } from "@/api";
-import { getDatasets } from "@/api/datasets";
-import { postFolderContent } from "@/api/folders";
-import { historiesFetcher } from "@/api/histories";
+import { GalaxyApi, type HDASummary, type HistorySummary } from "@/api";
 import { HistoriesFilters } from "@/components/History/HistoriesFilters";
 import {
     type ItemsProvider,
@@ -163,22 +160,31 @@ async function historiesProvider(ctx: ItemsProviderContext, url?: string): Promi
         const sortBy = ctx.sortBy === "label" ? "name" : ctx.sortBy || "update_time";
         const queryDict = HistoriesFilters.getQueryDict(ctx.filter);
 
-        const { data, headers } = await historiesFetcher({
-            search: filter,
-            view: "summary",
-            keys: "create_time",
-            show_own: true,
-            offset: offset,
-            limit: limit,
-            q: Object.keys(queryDict),
-            qv: Object.values(queryDict),
-            sort_by: sortBy as HistorySortKeys,
-            sort_desc: sortDesc,
+        const { response, data, error } = await GalaxyApi().GET("/api/histories", {
+            params: {
+                query: {
+                    search: filter,
+                    view: "summary",
+                    keys: "create_time",
+                    show_own: true,
+                    offset: offset,
+                    limit: limit,
+                    q: Object.keys(queryDict),
+                    qv: Object.values(queryDict),
+                    sort_by: sortBy as HistorySortKeys,
+                    sort_desc: sortDesc,
+                },
+            },
         });
 
-        totalItems.value = parseInt(headers.get("total_matches") ?? "0");
+        if (error) {
+            errorMessage.value = errorMessageAsString(error);
+            return [];
+        }
+
+        totalItems.value = parseInt(response.headers.get("total_matches") ?? "0");
 
-        items.value = data.map(historyEntryToRecord as any);
+        items.value = (data as HistorySummary[]).map(historyEntryToRecord);
 
         formatRows();
 
@@ -199,16 +205,25 @@ async function datasetsProvider(ctx: ItemsProviderContext, selectedHistory: Hist
         const offset = (ctx.currentPage - 1) * ctx.perPage;
         const query = ctx.filter;
 
-        const { data, total_matches } = await getDatasets({
-            history_id: selectedHistory.id,
-            query: query,
-            sortBy: ctx.sortBy === "time" ? "update_time" : "name",
-            sortDesc: ctx.sortDesc,
-            offset: offset,
-            limit: limit,
+        const { response, data, error } = await GalaxyApi().GET("/api/datasets", {
+            params: {
+                query: {
+                    history_id: selectedHistory.id,
+                    query: query,
+                    sortBy: ctx.sortBy === "time" ? "update_time" : "name",
+                    sortDesc: ctx.sortDesc,
+                    offset: offset,
+                    limit: limit,
+                },
+            },
         });
 
-        totalItems.value = total_matches;
+        if (error) {
+            errorMessage.value = errorMessageAsString(error);
+            return [];
+        }
+
+        totalItems.value = parseInt(response.headers.get("total_matches") ?? "0");
 
         items.value = (data as HDASummary[]).map(datasetEntryToRecord);
 
@@ -272,7 +287,15 @@ async function onOk() {
         submitting.value = true;
 
         for (const item of selected.value) {
-            await postFolderContent({ folder_id: props.folderId, from_hda_id: item.id });
+            await GalaxyApi().POST("/api/folders/{folder_id}/contents", {
+                params: {
+                    path: { folder_id: props.folderId },
+                },
+                body: {
+                    ldda_message: null,
+                    from_hda_id: item.id,
+                },
+            });
         }
 
         Toast.success(`Added ${selected.value.length} dataset${selected.value.length > 1 ? "s" : ""} to the folder`);

From cd702b86ab7c155826a2f6fa9bd427a944d478e0 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Wed, 11 Sep 2024 16:44:09 +0200
Subject: [PATCH 22/33] =?UTF-8?q?=F0=9F=94=A5:=20drop=20`api/folders`=20fi?=
 =?UTF-8?q?le?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/api/folders.ts | 3 ---
 1 file changed, 3 deletions(-)
 delete mode 100644 client/src/api/folders.ts

diff --git a/client/src/api/folders.ts b/client/src/api/folders.ts
deleted file mode 100644
index 521c1649a0ad..000000000000
--- a/client/src/api/folders.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-import { fetcher } from "@/api/schema";
-
-export const postFolderContent = fetcher.path("/api/folders/{folder_id}/contents").method("post").create();

From 4b9c768f19b6b1350076efa6a91b83eccaf5dd75 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 13:08:56 +0200
Subject: [PATCH 23/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20refactor=20use?=
 =?UTF-8?q?=20const=20assertion=20for=20`SELECTION=5FSTATES`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/SelectionDialog/selectionTypes.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/client/src/components/SelectionDialog/selectionTypes.ts b/client/src/components/SelectionDialog/selectionTypes.ts
index ef31438d22fa..aac6ebb4e0da 100644
--- a/client/src/components/SelectionDialog/selectionTypes.ts
+++ b/client/src/components/SelectionDialog/selectionTypes.ts
@@ -1,8 +1,8 @@
 export const SELECTION_STATES = {
-    SELECTED: "success" as const,
-    UNSELECTED: "default" as const,
-    MIXED: "secondary" as const,
-};
+    SELECTED: "success",
+    UNSELECTED: "default",
+    MIXED: "secondary",
+} as const;
 
 export type SelectionState = (typeof SELECTION_STATES)[keyof typeof SELECTION_STATES];
 

From e5738fa71c0d0bc1da7f4d5c6ca3908aef464263 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 13:09:53 +0200
Subject: [PATCH 24/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20use=20`IconDefin?=
 =?UTF-8?q?ition`=20for=20`folderIcon`=20in=20SelectionDialog`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/SelectionDialog/SelectionDialog.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/client/src/components/SelectionDialog/SelectionDialog.vue b/client/src/components/SelectionDialog/SelectionDialog.vue
index 01dd15746cf8..ca931c21b050 100644
--- a/client/src/components/SelectionDialog/SelectionDialog.vue
+++ b/client/src/components/SelectionDialog/SelectionDialog.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { library } from "@fortawesome/fontawesome-svg-core";
+import { type IconDefinition, library } from "@fortawesome/fontawesome-svg-core";
 import { faCheckSquare, faMinusSquare, faSquare } from "@fortawesome/free-regular-svg-icons";
 import { faCaretLeft, faCheck, faFolder, faSpinner, faTimes } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
@@ -33,7 +33,7 @@ interface Props {
     providerUrl?: string;
     totalItems?: number;
     leafIcon?: string;
-    folderIcon?: string | object;
+    folderIcon?: IconDefinition;
     modalShow?: boolean;
     modalStatic?: boolean;
     multiple?: boolean;

From 86c2be26e4dd3529f16a8694d7d923f56926b497 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 13:13:16 +0200
Subject: [PATCH 25/33] =?UTF-8?q?=F0=9F=8E=A8:=20fix=20no=20items=20condit?=
 =?UTF-8?q?ion=20in=20`SelectionDialog`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/SelectionDialog/SelectionDialog.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/components/SelectionDialog/SelectionDialog.vue b/client/src/components/SelectionDialog/SelectionDialog.vue
index ca931c21b050..b05d8d1ee08c 100644
--- a/client/src/components/SelectionDialog/SelectionDialog.vue
+++ b/client/src/components/SelectionDialog/SelectionDialog.vue
@@ -261,7 +261,7 @@ watch(
                     <BSpinner small type="grow" />
                     <BSpinner small type="grow" />
                 </div>
-                <div v-if="totalItems === 0">
+                <div v-else-if="totalItems === 0">
                     <div v-if="filter">
                         No search results found for: <b>{{ filter }}</b
                         >.

From 561a635de5f90d9dfbdca938cb806fbe6eb29f8c Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 13:14:17 +0200
Subject: [PATCH 26/33] =?UTF-8?q?=E2=9C=A8:=20=20add=20`HistorySortByLiter?=
 =?UTF-8?q?al`=20type=20definition=20to=20`api/index`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/api/index.ts | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/client/src/api/index.ts b/client/src/api/index.ts
index bfbda047abde..24ebdb666137 100644
--- a/client/src/api/index.ts
+++ b/client/src/api/index.ts
@@ -10,6 +10,13 @@ export { type components, GalaxyApi, type GalaxyApiPaths };
  */
 export type HistorySummary = components["schemas"]["HistorySummary"];
 
+/**
+ * Represents the possible values for the `sort_by` parameter when querying histories.
+ * We can not extract this from the schema for an unknown reason.
+ * The desired solution would be: `GalaxyApiPaths["/api/histories"]["get"]["parameters"]["query"]["sort_by"]`.
+ */
+export type HistorySortByLiteral = "create_time" | "name" | "update_time" | "username" | undefined;
+
 /**
  * Contains minimal information about a History with additional content stats.
  * This is a subset of information that can be relatively frequently updated after

From afa9cf9487866806a448560354c332e41e84786e Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 13:18:06 +0200
Subject: [PATCH 27/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20refactor=20sorti?=
 =?UTF-8?q?ng=20in=20history=20grids=20and=20`HistoryDatasetPicker`=20to?=
 =?UTF-8?q?=20use=20`HistorySortByLiteral`=20type?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/Grid/configs/histories.ts          | 4 ++--
 client/src/components/Grid/configs/historiesShared.ts    | 4 ++--
 .../LibraryFolder/TopToolbar/HistoryDatasetPicker.vue    | 9 ++++-----
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/client/src/components/Grid/configs/histories.ts b/client/src/components/Grid/configs/histories.ts
index c50dc108b267..cee19089ade9 100644
--- a/client/src/components/Grid/configs/histories.ts
+++ b/client/src/components/Grid/configs/histories.ts
@@ -12,6 +12,7 @@ import {
 import { useEventBus } from "@vueuse/core";
 
 import { GalaxyApi } from "@/api";
+import { type HistorySortByLiteral } from "@/api";
 import { updateTags } from "@/api/tags";
 import { useHistoryStore } from "@/stores/historyStore";
 import Filtering, { contains, equals, expandNameTag, toBool, type ValidFilter } from "@/utils/filtering";
@@ -26,7 +27,6 @@ const { emit } = useEventBus<string>("grid-router-push");
  * Local types
  */
 type HistoryEntry = Record<string, unknown>;
-type SortKeyLiteral = "create_time" | "name" | "update_time" | undefined;
 
 /**
  * Request and return data from server
@@ -40,7 +40,7 @@ async function getData(offset: number, limit: number, search: string, sort_by: s
                 limit,
                 offset,
                 search,
-                sort_by: sort_by as SortKeyLiteral,
+                sort_by: sort_by as HistorySortByLiteral,
                 sort_desc,
                 show_own: true,
                 show_published: false,
diff --git a/client/src/components/Grid/configs/historiesShared.ts b/client/src/components/Grid/configs/historiesShared.ts
index 667ef220a338..6baab4a2ece5 100644
--- a/client/src/components/Grid/configs/historiesShared.ts
+++ b/client/src/components/Grid/configs/historiesShared.ts
@@ -2,6 +2,7 @@ import { faEye } from "@fortawesome/free-solid-svg-icons";
 import { useEventBus } from "@vueuse/core";
 
 import { GalaxyApi } from "@/api";
+import { type HistorySortByLiteral } from "@/api";
 import { updateTags } from "@/api/tags";
 import Filtering, { contains, expandNameTag, type ValidFilter } from "@/utils/filtering";
 import _l from "@/utils/localization";
@@ -15,7 +16,6 @@ const { emit } = useEventBus<string>("grid-router-push");
  * Local types
  */
 type HistoryEntry = Record<string, unknown>;
-type SortKeyLiteral = "create_time" | "name" | "update_time" | undefined;
 
 /**
  * Request and return data from server
@@ -29,7 +29,7 @@ async function getData(offset: number, limit: number, search: string, sort_by: s
                 limit,
                 offset,
                 search,
-                sort_by: sort_by as SortKeyLiteral,
+                sort_by: sort_by as HistorySortByLiteral,
                 sort_desc,
                 show_own: false,
                 show_published: false,
diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index 3f544132b961..4f1101ded339 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -3,7 +3,7 @@ import { library } from "@fortawesome/fontawesome-svg-core";
 import { faHdd } from "@fortawesome/free-solid-svg-icons";
 import { computed, ref, set } from "vue";
 
-import { GalaxyApi, type HDASummary, type HistorySummary } from "@/api";
+import { GalaxyApi, type HDASummary, type HistorySortByLiteral, type HistorySummary } from "@/api";
 import { HistoriesFilters } from "@/components/History/HistoriesFilters";
 import {
     type ItemsProvider,
@@ -18,8 +18,6 @@ import SelectionDialog from "@/components/SelectionDialog/SelectionDialog.vue";
 
 library.add(faHdd);
 
-type HistorySortKeys = "create_time" | "name" | "update_time" | undefined;
-
 interface HistoryRecord extends SelectionItem {
     size: number;
 }
@@ -157,7 +155,8 @@ async function historiesProvider(ctx: ItemsProviderContext, url?: string): Promi
         const limit = ctx.perPage;
         const offset = (ctx.currentPage - 1) * ctx.perPage;
         const sortDesc = ctx.sortDesc;
-        const sortBy = ctx.sortBy === "label" ? "name" : ctx.sortBy || "update_time";
+        const sortBy: HistorySortByLiteral =
+            ctx.sortBy === "label" ? "name" : (ctx.sortBy as HistorySortByLiteral) || "update_time";
         const queryDict = HistoriesFilters.getQueryDict(ctx.filter);
 
         const { response, data, error } = await GalaxyApi().GET("/api/histories", {
@@ -171,7 +170,7 @@ async function historiesProvider(ctx: ItemsProviderContext, url?: string): Promi
                     limit: limit,
                     q: Object.keys(queryDict),
                     qv: Object.values(queryDict),
-                    sort_by: sortBy as HistorySortKeys,
+                    sort_by: sortBy,
                     sort_desc: sortDesc,
                 },
             },

From bce8051d253e93c34dbd93dd0c562e692958c117 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 13:19:13 +0200
Subject: [PATCH 28/33] =?UTF-8?q?=F0=9F=90=9B:=20fix=20`datasetsProvider`?=
 =?UTF-8?q?=20sorting=20and=20filtering=20in=20`HistoryDatasetPicker`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LibraryFolder/TopToolbar/HistoryDatasetPicker.vue  | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index 4f1101ded339..6985638a484f 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -202,15 +202,17 @@ async function datasetsProvider(ctx: ItemsProviderContext, selectedHistory: Hist
     try {
         const limit = ctx.perPage;
         const offset = (ctx.currentPage - 1) * ctx.perPage;
-        const query = ctx.filter;
+        const query = ctx.filter || "";
+        const querySortBy = ctx.sortBy === "time" ? "update_time" : "name";
+        const sortPrefix = ctx.sortDesc ? "-dsc" : "-asc";
 
         const { response, data, error } = await GalaxyApi().GET("/api/datasets", {
             params: {
                 query: {
                     history_id: selectedHistory.id,
-                    query: query,
-                    sortBy: ctx.sortBy === "time" ? "update_time" : "name",
-                    sortDesc: ctx.sortDesc,
+                    q: ["name-contains"],
+                    qv: [query],
+                    order: `${querySortBy}${sortPrefix}`,
                     offset: offset,
                     limit: limit,
                 },

From 224bf2e81768da46c152347fc5a639c42d5fab30 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 14:28:56 +0200
Subject: [PATCH 29/33] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F:=20refactor=20FontA?=
 =?UTF-8?q?wesome=20icon=20import=20in=20`HistoryDatasetPicker`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LibraryFolder/TopToolbar/HistoryDatasetPicker.vue          | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index 6985638a484f..ed9fd7d68e9a 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { library } from "@fortawesome/fontawesome-svg-core";
 import { faHdd } from "@fortawesome/free-solid-svg-icons";
 import { computed, ref, set } from "vue";
 
@@ -16,8 +15,6 @@ import { errorMessageAsString } from "@/utils/simple-error";
 
 import SelectionDialog from "@/components/SelectionDialog/SelectionDialog.vue";
 
-library.add(faHdd);
-
 interface HistoryRecord extends SelectionItem {
     size: number;
 }

From 22fb14d363733478e45b13229148ef7d576749d3 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 17:03:12 +0200
Subject: [PATCH 30/33] =?UTF-8?q?=E2=9C=A8:=20=20adding=20progress=20bar?=
 =?UTF-8?q?=20on=20import=20datasets=20from=20history=20and=20make=20`Hist?=
 =?UTF-8?q?oryDatasetPicker`=20a=20generic=20component?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../LibraryFolder/TopToolbar/FolderTopBar.vue | 95 ++++++++++++++++++-
 .../TopToolbar/HistoryDatasetPicker.vue       | 30 +-----
 2 files changed, 95 insertions(+), 30 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
index f7765de17208..d6f453065068 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
@@ -2,16 +2,26 @@
 import { library } from "@fortawesome/fontawesome-svg-core";
 import { faBook, faCaretDown, faDownload, faHome, faPlus, faTrash } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
-import { BButton, BDropdown, BDropdownDivider, BDropdownGroup, BDropdownItem, BFormCheckbox } from "bootstrap-vue";
+import {
+    BAlert,
+    BButton,
+    BDropdown,
+    BDropdownDivider,
+    BDropdownGroup,
+    BDropdownItem,
+    BFormCheckbox,
+} from "bootstrap-vue";
 import { storeToRefs } from "pinia";
-import { computed, ref } from "vue";
+import { computed, reactive, ref } from "vue";
 
+import { GalaxyApi } from "@/api";
 import { Services } from "@/components/Libraries/LibraryFolder/services";
 import mod_add_datasets from "@/components/Libraries/LibraryFolder/TopToolbar/add-datasets";
 import { deleteSelectedItems } from "@/components/Libraries/LibraryFolder/TopToolbar/delete-selected";
 import download from "@/components/Libraries/LibraryFolder/TopToolbar/download";
 import mod_import_collection from "@/components/Libraries/LibraryFolder/TopToolbar/import-to-history/import-collection";
 import mod_import_dataset from "@/components/Libraries/LibraryFolder/TopToolbar/import-to-history/import-dataset";
+import { type SelectionItem } from "@/components/SelectionDialog/selectionTypes";
 import { useConfig } from "@/composables/config";
 import { type DetailedDatatypes, useDetailedDatatypes } from "@/composables/datatypes";
 import { Toast } from "@/composables/toast";
@@ -22,6 +32,7 @@ import FolderDetails from "@/components/Libraries/LibraryFolder/FolderDetails/Fo
 import LibraryBreadcrumb from "@/components/Libraries/LibraryFolder/LibraryBreadcrumb.vue";
 import SearchField from "@/components/Libraries/LibraryFolder/SearchField.vue";
 import HistoryDatasetPicker from "@/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue";
+import ProgressBar from "@/components/ProgressBar.vue";
 
 library.add(faBook, faCaretDown, faDownload, faHome, faPlus, faTrash);
 
@@ -64,6 +75,14 @@ const dbKeyStore = useDbKeyStore();
 const modalShow = ref("");
 const genomesList = ref<GenomesList>([]);
 const extensionsList = ref<DetailedDatatypes[]>([]);
+const progress = ref(false);
+const progressNote = ref("");
+const progressStatus = reactive({
+    total: 0,
+    okCount: 0,
+    errorCount: 0,
+    runningCount: 0,
+});
 const auto = ref({
     id: "auto",
     extension: "auto",
@@ -246,6 +265,64 @@ async function fetchExtAndGenomes() {
         console.error(err);
     }
 }
+
+function resetProgress() {
+    progressStatus.total = 0;
+    progressStatus.okCount = 0;
+    progressStatus.errorCount = 0;
+    progressStatus.runningCount = 0;
+}
+
+async function onAddDatasetsFromHistory(selectedDatasets: SelectionItem[]) {
+    resetProgress();
+
+    progress.value = true;
+    progressStatus.total = selectedDatasets.length;
+    progressNote.value = "Adding datasets to the folder";
+
+    emit("setBusy", true);
+
+    for (const dataset of selectedDatasets) {
+        try {
+            progressStatus.runningCount++;
+
+            const { error } = await GalaxyApi().POST("/api/folders/{folder_id}/contents", {
+                params: {
+                    path: { folder_id: props.folderId },
+                },
+                body: {
+                    ldda_message: null,
+                    from_hda_id: dataset.id,
+                },
+            });
+
+            if (error) {
+                throw new Error(error.err_msg);
+            }
+
+            progressStatus.okCount++;
+        } catch (err) {
+            progressStatus.errorCount++;
+        } finally {
+            progressStatus.runningCount--;
+        }
+    }
+
+    if (progressStatus.errorCount > 0) {
+        progressNote.value = `Added ${progressStatus.okCount} dataset${
+            progressStatus.okCount > 1 ? "s" : ""
+        }, but failed to add ${progressStatus.errorCount} dataset${
+            progressStatus.errorCount > 1 ? "s" : ""
+        } to the folder`;
+    } else {
+        progressNote.value = `Added ${progressStatus.okCount} dataset${
+            progressStatus.okCount > 1 ? "s" : ""
+        } to the folder`;
+    }
+
+    emit("setBusy", false);
+    emit("fetchFolderContents");
+}
 </script>
 
 <template>
@@ -352,6 +429,16 @@ async function fetchExtAndGenomes() {
             </div>
         </div>
 
+        <BAlert v-model="progress" dismissible variant="info" class="mb-1">
+            <ProgressBar
+                :loading="progressStatus.runningCount > 0"
+                :note="progressNote"
+                :total="progressStatus.total"
+                :ok-count="progressStatus.okCount"
+                :error-count="progressStatus.errorCount"
+                :running-count="progressStatus.runningCount" />
+        </BAlert>
+
         <LibraryBreadcrumb
             v-if="props.metadata && props.metadata.full_path"
             :full_path="props.metadata.full_path"
@@ -360,7 +447,7 @@ async function fetchExtAndGenomes() {
         <HistoryDatasetPicker
             v-if="modalShow === 'history'"
             :folder-id="props.folderId"
-            @onClose="onAddDatasets"
-            @reload="emit('fetchFolderContents')" />
+            @onSelect="onAddDatasetsFromHistory"
+            @onClose="onAddDatasets" />
     </div>
 </template>
diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index ed9fd7d68e9a..61423531d340 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -10,7 +10,6 @@ import {
     SELECTION_STATES,
     type SelectionItem,
 } from "@/components/SelectionDialog/selectionTypes";
-import { Toast } from "@/composables/toast";
 import { errorMessageAsString } from "@/utils/simple-error";
 
 import SelectionDialog from "@/components/SelectionDialog/SelectionDialog.vue";
@@ -28,6 +27,7 @@ const props = defineProps<Props>();
 const emit = defineEmits<{
     (e: "reload"): void;
     (e: "onClose"): void;
+    (e: "onSelect", datasets: SelectionItem[]): void;
 }>();
 
 const selectionDialog = ref();
@@ -280,31 +280,9 @@ async function onUndo() {
     itemsProvider.value = historiesProvider;
 }
 
-async function onOk() {
-    try {
-        submitting.value = true;
-
-        for (const item of selected.value) {
-            await GalaxyApi().POST("/api/folders/{folder_id}/contents", {
-                params: {
-                    path: { folder_id: props.folderId },
-                },
-                body: {
-                    ldda_message: null,
-                    from_hda_id: item.id,
-                },
-            });
-        }
-
-        Toast.success(`Added ${selected.value.length} dataset${selected.value.length > 1 ? "s" : ""} to the folder`);
-
-        emit("reload");
-        emit("onClose");
-    } catch (error) {
-        errorMessage.value = errorMessageAsString(error);
-    } finally {
-        submitting.value = false;
-    }
+function onOk() {
+    emit("onSelect", selected.value);
+    emit("onClose");
 }
 
 function onCancel() {

From 3125bba07fb5f18adc187e06737432907d1f620d Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 17:04:35 +0200
Subject: [PATCH 31/33] =?UTF-8?q?=E2=9C=A8:=20=20add=20customizable=20titl?=
 =?UTF-8?q?e=20and=20action=20button=20text=20to=20`HistoryDatasetPicker`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../TopToolbar/HistoryDatasetPicker.vue           | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 deletions(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
index 61423531d340..598146cb699e 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
@@ -20,9 +20,14 @@ interface HistoryRecord extends SelectionItem {
 
 interface Props {
     folderId: string;
+    title?: string;
+    actionButtonText?: string;
 }
 
-const props = defineProps<Props>();
+const props = withDefaults(defineProps<Props>(), {
+    title: "Select datasets from your histories",
+    actionButtonText: "Select",
+});
 
 const emit = defineEmits<{
     (e: "reload"): void;
@@ -55,11 +60,9 @@ const searchTitle = computed(() => {
 });
 const okButtonText = computed(() => {
     if (selected.value.length === 0) {
-        return "Add";
-    } else if (submitting.value) {
-        return "Adding...";
+        return props.actionButtonText;
     } else {
-        return `Add ${selected.value.length} dataset${selected.value.length > 1 ? "s" : ""}`;
+        return `${props.actionButtonText} ${selected.value.length} dataset${selected.value.length > 1 ? "s" : ""}`;
     }
 });
 const fields = computed(() => {
@@ -311,7 +314,7 @@ function onCancel() {
         :folder-icon="faHdd"
         :is-busy="loading"
         :search-title="searchTitle"
-        title="Add datasets from your histories"
+        :title="title"
         :filter-class="datasetsVisible ? undefined : HistoriesFilters"
         @onOk="onOk"
         @onUndo="onUndo"

From b728a495a83315a60bd8593aa3e2bd41c5fa5e12 Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 17:08:14 +0200
Subject: [PATCH 32/33] =?UTF-8?q?=F0=9F=9A=9A:=20moved=20`HistoryDatasetPi?=
 =?UTF-8?q?cker`=20from=20the=20`libraries`=20to=20the=20`SelectionDialog`?=
 =?UTF-8?q?=20directory=20and=20updated=20import=20paths=20accordingly?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue         | 2 +-
 .../TopToolbar => SelectionDialog}/HistoryDatasetPicker.vue     | 0
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename client/src/components/{Libraries/LibraryFolder/TopToolbar => SelectionDialog}/HistoryDatasetPicker.vue (100%)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
index d6f453065068..9d1d8df0f269 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
@@ -31,8 +31,8 @@ import { useUserStore } from "@/stores/userStore";
 import FolderDetails from "@/components/Libraries/LibraryFolder/FolderDetails/FolderDetails.vue";
 import LibraryBreadcrumb from "@/components/Libraries/LibraryFolder/LibraryBreadcrumb.vue";
 import SearchField from "@/components/Libraries/LibraryFolder/SearchField.vue";
-import HistoryDatasetPicker from "@/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue";
 import ProgressBar from "@/components/ProgressBar.vue";
+import HistoryDatasetPicker from "@/components/SelectionDialog/HistoryDatasetPicker.vue";
 
 library.add(faBook, faCaretDown, faDownload, faHome, faPlus, faTrash);
 
diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue b/client/src/components/SelectionDialog/HistoryDatasetPicker.vue
similarity index 100%
rename from client/src/components/Libraries/LibraryFolder/TopToolbar/HistoryDatasetPicker.vue
rename to client/src/components/SelectionDialog/HistoryDatasetPicker.vue

From 4b36af55256542a2a381c750bc0ecc169a97ebfc Mon Sep 17 00:00:00 2001
From: Alireza Heidari <itisalirh@gmail.com>
Date: Fri, 13 Sep 2024 17:40:37 +0200
Subject: [PATCH 33/33] =?UTF-8?q?=F0=9F=8E=A8:=20=20changing=20progress=20?=
 =?UTF-8?q?bar=20in=20`FolderTopBar`=20to=20be=20dismissible=20only=20when?=
 =?UTF-8?q?=20there=20are=20no=20running=20progress?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue         | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue b/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
index 9d1d8df0f269..bb023fdc3ca2 100644
--- a/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
+++ b/client/src/components/Libraries/LibraryFolder/TopToolbar/FolderTopBar.vue
@@ -429,7 +429,7 @@ async function onAddDatasetsFromHistory(selectedDatasets: SelectionItem[]) {
             </div>
         </div>
 
-        <BAlert v-model="progress" dismissible variant="info" class="mb-1">
+        <BAlert v-model="progress" :dismissible="progressStatus.runningCount === 0" variant="info" class="mb-1">
             <ProgressBar
                 :loading="progressStatus.runningCount > 0"
                 :note="progressNote"