Skip to content

Commit

Permalink
UI: Enable dataset download icon and download CSV by default (#685)
Browse files Browse the repository at this point in the history
* Enable dataset download icon and download CSV by default
  • Loading branch information
peteski22 authored Jan 20, 2025
1 parent c319f7c commit 09799ee
Show file tree
Hide file tree
Showing 5 changed files with 49 additions and 4 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
severity="secondary"
variant="text"
rounded
@click="emit('l-download-dataset')"
/>
<Button
severity="secondary"
Expand Down Expand Up @@ -94,6 +95,7 @@ const isCopied = ref(false);
const emit = defineEmits([
'l-delete-dataset',
'l-download-dataset',
'l-details-closed',
'l-experiment'
])
Expand Down
6 changes: 6 additions & 0 deletions lumigator/frontend/src/components/pages/LDatasets.vue
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@
@l-experiment="onExperimentDataset($event)"
@l-details-closed="onClearSelection()"
@l-delete-dataset="deleteConfirmation($event)"
@l-download-dataset="onDownloadDataset()"
/>
</Teleport>
</div>
Expand All @@ -61,6 +62,8 @@ import LDatasetEmpty from '@/components/molecules/LDatasetEmpty.vue';
import LDatasetDetails from '@/components/organisms/LDatasetDetails.vue';
import { useConfirm } from "primevue/useconfirm";
import { useToast } from "primevue/usetoast";
import datasetsService from "@/services/datasets/datasetsService.js";
import {downloadContent} from "@/helpers/index.js";
const datasetStore = useDatasetStore();
const { datasets, selectedDataset } = storeToRefs(datasetStore);
Expand Down Expand Up @@ -107,6 +110,9 @@ function deleteConfirmation(dataset) {
});
}
function onDownloadDataset() {
datasetStore.loadDatasetFile();
}
const onDatasetAdded = () => { datasetInput.value.input.click() }
Expand Down
1 change: 1 addition & 0 deletions lumigator/frontend/src/services/datasets/api.js
Original file line number Diff line number Diff line change
@@ -1,2 +1,3 @@
export const PATH_DATASETS_ROOT = () => `datasets/`
export const PATH_SINGLE_DATASET = (id) => `datasets/${id}`
export const PATH_SINGLE_DATASET_DOWNLOAD = (id) => `datasets/${id}/download`
35 changes: 32 additions & 3 deletions lumigator/frontend/src/services/datasets/datasetsService.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import http from '@/services/http';
import { PATH_DATASETS_ROOT, PATH_SINGLE_DATASET } from './api';
import {PATH_DATASETS_ROOT, PATH_SINGLE_DATASET, PATH_SINGLE_DATASET_DOWNLOAD} from './api';

async function fetchDatasets() {
try {
Expand Down Expand Up @@ -48,9 +48,38 @@ async function deleteDataset(id) {
}
}

async function downloadDataset(id) {
try {
const url = `${PATH_SINGLE_DATASET_DOWNLOAD(id)}?extension=csv`;
const response = await http.get(url);
if (response.status !== 200) {
console.error("Error getting dataset download URLs: ", response.status);
return;
}

const { download_urls } = response.data;
if (!download_urls) {
console.error("No download URLs found in the response: ", response.data);
return;
} else if (download_urls.length > 1) {
console.error("Expected a single dataset CSV URL: ", download_urls);
return;
}

const fileResponse = await http.get(download_urls[0], {
responseType: 'blob', // Important: Receive the file as a binary blob
});
return fileResponse.data;

} catch (error) {
console.error("Error downloading dataset: ", error.message || error);
}
}

export default {
fetchDatasets,
fetchDatasetInfo,
postDataset,
deleteDataset
}
deleteDataset,
downloadDataset
}
9 changes: 8 additions & 1 deletion lumigator/frontend/src/stores/datasets/store.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { ref } from 'vue';
import { defineStore } from 'pinia'
import datasetsService from "@/services/datasets/datasetsService";
import {downloadContent} from "@/helpers/index.js";

export const useDatasetStore = defineStore('dataset', () => {
const datasets = ref([]);
Expand Down Expand Up @@ -41,13 +42,19 @@ export const useDatasetStore = defineStore('dataset', () => {
await loadDatasets();
}

async function loadDatasetFile() {
const blob = await datasetsService.downloadDataset(selectedDataset.value.id);
downloadContent(blob, selectedDataset.value.filename)
}

return {
datasets,
loadDatasets,
selectedDataset,
loadDatasetInfo,
resetSelection,
uploadDataset,
deleteDataset
deleteDataset,
loadDatasetFile
}
})

0 comments on commit 09799ee

Please sign in to comment.