diff --git a/jszip-dev/src/components/btn-dload.jsx b/jszip-dev/src/components/btn-dload.jsx new file mode 100644 index 0000000..81a36d2 --- /dev/null +++ b/jszip-dev/src/components/btn-dload.jsx @@ -0,0 +1,24 @@ +import React from 'react'; +import PropTypes from 'prop-types'; + +import {createDloadLinkByUrl} from '../utils/download'; + +/*destructure props object*/ +export default function BtnDLoad({url,file,name}) { + + const handleOnClick = () => { + createDloadLinkByUrl(url,file); + }; + + return ( + + ); +}; + +BtnDLoad.propTypes = { + url: PropTypes.string, + file: PropTypes.string, + name: PropTypes.string +}; diff --git a/jszip-dev/src/components/use-download.jsx b/jszip-dev/src/components/use-download.jsx index f593a93..1525267 100644 --- a/jszip-dev/src/components/use-download.jsx +++ b/jszip-dev/src/components/use-download.jsx @@ -1,30 +1,52 @@ import JSZip from "jszip"; +import {getBlob, getBlobAsync} from '../utils/download'; +import config from '../config'; + const useDownload = () => { - async function handleZip(images) { - const zip = new JSZip(); + async function handleZip(images) { + const zip = new JSZip(); - // Add Images to the zip file - for (let i = 0; i < images.length; i++) { - const response = await fetch(images[i]); - const blob = await response.blob(); - zip.file(images[i].split("/").pop(), blob); - } + //TODO Cleanup! + /* + let url = `${config.API}csv-fare-zones`; + let file = 'fare-zones.csv'; + const blobVersions = await getBlobAsync(url,file); + //file(name, data) + zip.file(file, blobVersions); - // Generate the zip file - const zipData = await zip.generateAsync({ - type: "blob", - streamFiles: true, - }); + url = `${config.API}csv-price-levels`; + file = 'price-levels.csv'; + const blobPriceLevels = await getBlobAsync(url,file); + //file(name, data) + zip.file(file, blobPriceLevels); + */ - // Create a download link for the zip file - const link = document.createElement("a"); - link.href = window.URL.createObjectURL(zipData); - link.download = "name-zip-folder.zip"; - link.click(); - } + //TODO Cleanup! + // Add Images to the zip file + for (let i = 0; i < images.length; i++) { + const url = images[i].url; + console.log('handleZip() url: ', url); + const file = images[i].file; + console.log('handleZip() file: ', file); + const response = await fetch(url); + const blob = await response.blob(); + zip.file(file, blob); + } + // Generate the zip file + const zipData = await zip.generateAsync({ + type: "blob", + streamFiles: true, + }); - return { handleZip }; + // Create a download link for the zip file + const link = document.createElement("a"); + link.href = window.URL.createObjectURL(zipData); + link.download = "name-zip-folder.zip"; + link.click(); + }; + + return { handleZip }; }; export { useDownload }; diff --git a/jszip-dev/src/config.js b/jszip-dev/src/config.js new file mode 100644 index 0000000..b6180c1 --- /dev/null +++ b/jszip-dev/src/config.js @@ -0,0 +1,3 @@ +export default { + API: 'https://test-api-data.vbn.de/data/', +}; diff --git a/jszip-dev/src/main.jsx b/jszip-dev/src/main.jsx index daa8c61..5eb1c62 100644 --- a/jszip-dev/src/main.jsx +++ b/jszip-dev/src/main.jsx @@ -2,12 +2,19 @@ import React from 'react'; import Home from './pages/home'; import Zipping from './pages/zipping'; +import BtnDLoad from './components/btn-dload'; +import config from './config'; export default function App() { return (