@sekmet/react-ipfs-uploader
Version:
React Components that enable you to upload file(Images,PDFs,Text,etc.) , multiple files or a folder to IPFS .
891 lines (780 loc) • 39.5 kB
JavaScript
import React, { useState } from 'react';
import { create } from 'ipfs-http-client';
// A type of promise-like that resolves synchronously and supports only one observer
const _iteratorSymbol = /*#__PURE__*/ typeof Symbol !== "undefined" ? (Symbol.iterator || (Symbol.iterator = Symbol("Symbol.iterator"))) : "@@iterator";
const _asyncIteratorSymbol = /*#__PURE__*/ typeof Symbol !== "undefined" ? (Symbol.asyncIterator || (Symbol.asyncIterator = Symbol("Symbol.asyncIterator"))) : "@@asyncIterator";
// Asynchronously call a function and send errors to recovery continuation
function _catch(body, recover) {
try {
var result = body();
} catch(e) {
return recover(e);
}
if (result && result.then) {
return result.then(void 0, recover);
}
return result;
}
var ipfs = create('https://ipfs.infura.io:5001/api/v0');
var FileUpload = function FileUpload(_ref) {
var setUrl = _ref.setUrl;
var _useState = useState({}),
file = _useState[0],
setFile = _useState[1];
var _useState2 = useState(''),
fileUrl = _useState2[0],
setFileUrl = _useState2[1];
var _useState3 = useState(false),
loading = _useState3[0],
setLoading = _useState3[1];
var _useState4 = useState(false),
uploaded = _useState4[0],
setUploaded = _useState4[1];
var uploadFile = function uploadFile(e) {
try {
var _temp3 = function _temp3() {
setLoading(false);
};
setLoading(true);
e.preventDefault();
var _temp4 = _catch(function () {
return Promise.resolve(ipfs.add(file)).then(function (added) {
var url = "https://ipfs.infura.io/ipfs/" + added.path;
setUrl(url);
setFileUrl(url);
setUploaded(true);
});
}, function (err) {
console.log('Error uploading the file : ', err);
});
return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
} catch (e) {
return Promise.reject(e);
}
};
var preUpload = function preUpload(e) {
if (e.target.value !== '') {
setFile(e.target.files[0]);
} else {
setFile({});
}
};
var fileAndUploadButton = function fileAndUploadButton() {
if (file.name) {
if (!loading) {
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("h5", null, file.name, " ", /*#__PURE__*/React.createElement("span", {
className: "bg-green-100 text-green-800 text-sm font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-green-200 dark:text-green-900"
}, file.size, " kb")), uploaded ? /*#__PURE__*/React.createElement("h5", null, "\u2705", ' ', /*#__PURE__*/React.createElement("a", {
href: fileUrl,
target: "_blank",
rel: "noopener noreferrer"
}, "File"), ' ', "Uploaded Successfully \u2705") : /*#__PURE__*/React.createElement("button", {
type: "submit",
className: "py-2 px-3 text-sm font-medium text-white bg-blue-700 hover:bg-blue-500 rounded-md border border-blue-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 shadow-sm"
}, "Upload File"));
} else {
return /*#__PURE__*/React.createElement("div", {
className: "grid grid-cols-1 gap-y-6 mt-4 sm:grid-cols-3 sm:gap-x-4"
}, /*#__PURE__*/React.createElement("h4", null, "Uploading File"), /*#__PURE__*/React.createElement("div", {
className: "w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700"
}, /*#__PURE__*/React.createElement("div", {
className: "bg-blue-600 h-2.5 rounded-full",
style: "width: 69%"
})), /*#__PURE__*/React.createElement("h4", null, "Please Wait ..."));
}
}
};
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("form", {
onSubmit: uploadFile
}, /*#__PURE__*/React.createElement("input", {
required: true,
type: "file",
onChange: function onChange(e) {
return preUpload(e);
},
className: "p-3 text-sm bg-white rounded border-0 focus:outline-none focus:ring shadow transition-all duration-150 ease-linear placeholder:text-blueGray-300 text-blueGray-600"
}), fileAndUploadButton()));
};
var ipfs$1 = create('https://ipfs.infura.io:5001/api/v0');
var all = require('it-all');
var MultipleFilesUpload = function MultipleFilesUpload(_ref) {
var setUrl = _ref.setUrl;
var _useState = useState([]),
files = _useState[0],
setFiles = _useState[1];
var _useState2 = useState(''),
filesUrl = _useState2[0],
setFilesUrl = _useState2[1];
var _useState3 = useState(false),
loading = _useState3[0],
setLoading = _useState3[1];
var _useState4 = useState(false),
uploaded = _useState4[0],
setUploaded = _useState4[1];
var uploadFiles = function uploadFiles() {
try {
var fileObjectsArray = Array.from(files).map(function (file) {
return {
path: file.name,
content: file
};
});
return Promise.resolve(all(ipfs$1.addAll(fileObjectsArray, {
wrapWithDirectory: true
}))).then(function (results) {
console.log(results);
return results;
});
} catch (e) {
return Promise.reject(e);
}
};
var returnFilesUrl = function returnFilesUrl(e) {
try {
setLoading(true);
e.preventDefault();
return Promise.resolve(uploadFiles(files)).then(function (results) {
var length = results.length;
var FilesHash = results[length - 1].cid._baseCache.get('z');
var FilesUrl = 'https://ipfs.infura.io/ipfs/' + FilesHash;
setUrl(FilesUrl);
setFilesUrl(FilesUrl);
setLoading(false);
setUploaded(true);
});
} catch (e) {
return Promise.reject(e);
}
};
var filesAndUploadButton = function filesAndUploadButton() {
if (files.length !== 0) {
if (!loading) {
return /*#__PURE__*/React.createElement("div", null, uploaded ? /*#__PURE__*/React.createElement("h5", null, "\u2705", ' ', /*#__PURE__*/React.createElement("a", {
href: filesUrl,
target: "_blank",
rel: "noopener noreferrer"
}, "Files"), ' ', "Uploaded Successfully \u2705") : /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
className: "py-2 px-3 text-sm font-medium text-white bg-blue-700 hover:bg-blue-500 rounded-md border border-blue-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 shadow-sm",
type: "submit"
}, "Upload Files"), /*#__PURE__*/React.createElement("ul", {
className: "mb-3"
}, Array.from(files).map(function (file) {
return /*#__PURE__*/React.createElement("li", {
className: "d-flex justify-content-between align-items-start"
}, /*#__PURE__*/React.createElement("div", {
className: "ms-2 me-auto"
}, file.name), /*#__PURE__*/React.createElement("span", {
className: "bg-green-100 text-green-800 text-sm font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-green-200 dark:text-green-900"
}, ">", file.size, " kb"));
}))));
} else {
return /*#__PURE__*/React.createElement("div", {
className: "grid grid-cols-1 gap-y-6 mt-4 sm:grid-cols-3 sm:gap-x-4"
}, /*#__PURE__*/React.createElement("h4", null, "Uploading Files"), /*#__PURE__*/React.createElement("div", {
className: "w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700"
}, /*#__PURE__*/React.createElement("div", {
className: "bg-blue-600 h-2.5 rounded-full",
style: "width: 69%"
})), /*#__PURE__*/React.createElement("h4", null, "Please Wait ..."));
}
}
};
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("form", {
onSubmit: returnFilesUrl
}, /*#__PURE__*/React.createElement("input", {
required: true,
type: "file",
multiple: true,
onChange: function onChange(e) {
return setFiles(e.target.files);
},
className: "p-3 text-sm bg-white rounded border-0 focus:outline-none focus:ring shadow transition-all duration-150 ease-linear placeholder:text-blueGray-300 text-blueGray-600"
}), filesAndUploadButton()));
};
var ipfs$2 = create('https://ipfs.infura.io:5001/api/v0');
var all$1 = require('it-all');
var FolderUpload = function FolderUpload(_ref) {
var setUrl = _ref.setUrl;
var _useState = useState([]),
files = _useState[0],
setFiles = _useState[1];
var _useState2 = useState(''),
folderUrl = _useState2[0],
setFolderUrl = _useState2[1];
var _useState3 = useState(false),
loading = _useState3[0],
setLoading = _useState3[1];
var _useState4 = useState(false),
uploaded = _useState4[0],
setUploaded = _useState4[1];
var uploadFiles = function uploadFiles() {
try {
var fileObjectsArray = Array.from(files).map(function (file) {
return {
path: file.name,
content: file
};
});
return Promise.resolve(all$1(ipfs$2.addAll(fileObjectsArray, {
wrapWithDirectory: true
}))).then(function (results) {
console.log(results);
return results;
});
} catch (e) {
return Promise.reject(e);
}
};
var returnFilesUrl = function returnFilesUrl(e) {
try {
setLoading(true);
e.preventDefault();
return Promise.resolve(uploadFiles(files)).then(function (results) {
var length = results.length;
var FilesHash = results[length - 1].cid._baseCache.get('z');
var FilesUrl = 'https://ipfs.infura.io/ipfs/' + FilesHash;
console.log(FilesUrl);
setUrl(FilesUrl);
setFolderUrl(FilesUrl);
setLoading(false);
setUploaded(true);
});
} catch (e) {
return Promise.reject(e);
}
};
var filesAndUploadButton = function filesAndUploadButton() {
if (files.length !== 0) {
if (!loading) {
return /*#__PURE__*/React.createElement("div", null, uploaded ? /*#__PURE__*/React.createElement("h5", null, "\u2705", ' ', /*#__PURE__*/React.createElement("a", {
href: folderUrl,
target: "_blank",
rel: "noopener noreferrer"
}, "Folder"), ' ', "Uploaded Successfully \u2705") : /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
type: "submit",
className: "py-2 px-3 text-sm font-medium text-white bg-blue-700 hover:bg-blue-500 rounded-md border border-blue-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 shadow-sm"
}, "Upload Folder"), /*#__PURE__*/React.createElement("ul", {
className: "mb-3"
}, Array.from(files).map(function (file) {
return /*#__PURE__*/React.createElement("li", {
className: "d-flex justify-content-between align-items-start"
}, /*#__PURE__*/React.createElement("div", {
className: "ms-2 me-auto"
}, file.name), /*#__PURE__*/React.createElement("span", {
className: "bg-green-100 text-green-800 text-sm font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-green-200 dark:text-green-900"
}, file.size, " kb"));
}))));
} else {
return /*#__PURE__*/React.createElement("div", {
className: "grid grid-cols-1 gap-y-6 mt-4 sm:grid-cols-3 sm:gap-x-4"
}, /*#__PURE__*/React.createElement("h4", null, "Uploading Folder"), /*#__PURE__*/React.createElement("div", {
className: "w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700"
}, /*#__PURE__*/React.createElement("div", {
className: "bg-blue-600 h-2.5 rounded-full",
style: "width: 69%"
})), /*#__PURE__*/React.createElement("h4", null, "Please Wait ..."));
}
}
};
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("form", {
onSubmit: returnFilesUrl
}, /*#__PURE__*/React.createElement("input", {
required: true,
type: "file",
webkitdirectory: "true",
multiple: true,
onChange: function onChange(e) {
return setFiles(e.target.files);
},
className: "p-3 text-sm bg-white rounded border-0 focus:outline-none focus:ring shadow transition-all duration-150 ease-linear placeholder:text-blueGray-300 text-blueGray-600"
}), filesAndUploadButton()));
};
var ipfs$3 = create('https://ipfs.infura.io:5001/api/v0');
var ImageUpload = function ImageUpload(_ref) {
var setUrl = _ref.setUrl,
prepareUpload = _ref.prepareUpload;
var _useState = useState({}),
image = _useState[0],
setImage = _useState[1];
var _useState2 = useState(''),
imagePreview = _useState2[0],
setImagePreview = _useState2[1];
var _useState3 = useState(false),
loading = _useState3[0],
setLoading = _useState3[1];
var _useState4 = useState(false),
uploaded = _useState4[0],
setUploaded = _useState4[1];
var createPreview = function createPreview(e) {
if (e.target.value !== '') {
setImage(e.target.files[0]);
var src = URL.createObjectURL(e.target.files[0]);
setImagePreview(src);
if (typeof prepareUpload === 'function') {
prepareUpload(true);
}
} else {
setImagePreview('');
}
};
var uploadFile = function uploadFile(e) {
try {
var _temp3 = function _temp3() {
setLoading(false);
};
setLoading(true);
e.preventDefault();
var _temp4 = _catch(function () {
return Promise.resolve(ipfs$3.add(image)).then(function (added) {
var url = "https://ipfs.infura.io/ipfs/" + added.path;
setUrl(url);
setImagePreview(url);
setUploaded(true);
});
}, function (err) {
console.log('Error uploading the file : ', err);
});
return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
} catch (e) {
return Promise.reject(e);
}
};
var previewAndUploadButton = function previewAndUploadButton() {
if (imagePreview !== '') {
if (!loading) {
return /*#__PURE__*/React.createElement("div", null, uploaded ? /*#__PURE__*/React.createElement("h5", null, "\u2705", ' ', /*#__PURE__*/React.createElement("a", {
href: imagePreview,
target: "_blank",
rel: "noopener noreferrer"
}, "Image"), ' ', "Uploaded Successfully \u2705", ' ') : /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
type: "submit",
className: "py-2 px-3 text-sm font-medium text-white bg-blue-700 hover:bg-blue-500 rounded-md border border-blue-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 shadow-sm"
}, "Upload Image"), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("h5", {
className: "mt-3 mb-3"
}, image.name, ' ', /*#__PURE__*/React.createElement("span", {
className: "bg-green-100 text-green-800 text-sm font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-green-200 dark:text-green-900"
}, image.size, " kb")), /*#__PURE__*/React.createElement("img", {
style: {
height: '269px'
},
className: "mb-3",
src: imagePreview
})));
} else {
return /*#__PURE__*/React.createElement("div", {
className: "grid grid-cols-1 gap-y-6 mt-4 sm:grid-cols-3 sm:gap-x-4"
}, /*#__PURE__*/React.createElement("h4", null, "Uploading Image"), /*#__PURE__*/React.createElement("div", {
className: "w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700"
}, /*#__PURE__*/React.createElement("div", {
className: "bg-blue-600 h-2.5 rounded-full",
style: "width: 69%"
})), /*#__PURE__*/React.createElement("h4", null, "Please Wait ..."));
}
}
};
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("form", {
onSubmit: uploadFile
}, /*#__PURE__*/React.createElement("input", {
required: true,
type: "file",
accept: "image/*",
onChange: function onChange(e) {
return createPreview(e);
},
className: "p-3 text-sm bg-white rounded border-0 focus:outline-none focus:ring shadow transition-all duration-150 ease-linear placeholder:text-blueGray-300 text-blueGray-600"
}), previewAndUploadButton()));
};
var ipfs$4 = create('https://ipfs.infura.io:5001/api/v0');
var contractURI = function contractURI(name, description, image, animation_url, external_url, sha256) {
return "{\n \"name\": \"" + (name ? name : '') + "\",\n \"description\": \"" + (description ? description : '') + "\",\n \"image\": \"" + image + "\",\n \"animation_url\": \"" + (animation_url ? animation_url : '') + "\",\n \"external_url\": \"" + (external_url ? external_url : '') + "\",\n \"sha256\": \"" + (sha256 ? sha256 : '') + "\"\n}\n";
};
var Erc721ImageUpload = function Erc721ImageUpload(_ref) {
var name = _ref.name,
description = _ref.description,
setUrl = _ref.setUrl,
setPreview = _ref.setPreview,
prepareUpload = _ref.prepareUpload;
var _useState = useState({}),
image = _useState[0],
setImage = _useState[1];
var _useState2 = useState({});
var _useState3 = useState(''),
imagePreview = _useState3[0],
setImagePreview = _useState3[1];
var _useState4 = useState(false),
loading = _useState4[0],
setLoading = _useState4[1];
var _useState5 = useState(false),
uploaded = _useState5[0],
setUploaded = _useState5[1];
var getJsonFile = function getJsonFile(name, description, image, animation_url, external_url, sha256) {
var file = new Blob([contractURI(name, description, image, animation_url, external_url, sha256)], {
name: "contractURI.json",
type: 'application/json'
});
return file;
};
var createPreview = function createPreview(e) {
if (e.target.value !== '') {
setImage(e.target.files[0]);
var src = URL.createObjectURL(e.target.files[0]);
setImagePreview(src);
if (typeof prepareUpload === 'function') {
prepareUpload(true);
}
} else {
setImagePreview('');
}
};
var uploadFile = function uploadFile(e) {
try {
var _temp3 = function _temp3() {
setLoading(false);
};
setLoading(true);
e.preventDefault();
var _temp4 = _catch(function () {
return Promise.resolve(ipfs$4.add(image)).then(function (added) {
var image_url = "https://ipfs.infura.io/ipfs/" + added.path;
setImagePreview(image_url);
setPreview(image_url);
var jsonblob = getJsonFile(name, description, image_url, '', '', '');
return Promise.resolve(ipfs$4.add(jsonblob)).then(function (added_json) {
var url = "https://ipfs.infura.io/ipfs/" + added_json.path;
setUrl(url);
setUploaded(true);
});
});
}, function (err) {
console.log('Error uploading the file : ', err);
});
return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
} catch (e) {
return Promise.reject(e);
}
};
var previewAndUploadButton = function previewAndUploadButton() {
if (imagePreview !== '') {
if (!loading) {
return /*#__PURE__*/React.createElement("div", null, uploaded ? /*#__PURE__*/React.createElement("h5", null, "\u2705", ' ', /*#__PURE__*/React.createElement("a", {
href: imagePreview,
target: "_blank",
rel: "noopener noreferrer"
}, "Image"), ' ', "Uploaded Successfully \u2705", ' ') : /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
type: "submit",
className: "py-2 px-3 text-sm font-medium text-white bg-blue-700 hover:bg-blue-500 rounded-md border border-blue-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 shadow-sm"
}, "Upload Image"), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("h5", {
className: "mt-3 mb-3"
}, image.name, ' ', /*#__PURE__*/React.createElement("span", {
className: "bg-green-100 text-green-800 text-sm font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-green-200 dark:text-green-900"
}, image.size, " kb")), /*#__PURE__*/React.createElement("img", {
style: {
height: '269px'
},
className: "mb-3",
src: imagePreview
})));
} else {
return /*#__PURE__*/React.createElement("div", {
className: "grid grid-cols-1 gap-y-6 mt-4 sm:grid-cols-3 sm:gap-x-4"
}, /*#__PURE__*/React.createElement("h4", null, "Uploading Image"), /*#__PURE__*/React.createElement("div", {
className: "w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700"
}, /*#__PURE__*/React.createElement("div", {
className: "bg-blue-600 h-2.5 rounded-full",
style: "width: 69%"
})), /*#__PURE__*/React.createElement("h4", null, "Please Wait ..."));
}
}
};
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("form", {
onSubmit: uploadFile
}, /*#__PURE__*/React.createElement("input", {
required: true,
type: "file",
accept: "image/*",
onChange: function onChange(e) {
return createPreview(e);
},
className: "p-3 text-sm bg-white rounded border-0 focus:outline-none focus:ring shadow transition-all duration-150 ease-linear placeholder:text-blueGray-300 text-blueGray-600"
}), previewAndUploadButton()));
};
var ipfs$5 = create('https://ipfs.infura.io:5001/api/v0');
var videoPlaceholder = "data:image/jpeg;base64,/9j/4QC8RXhpZgAASUkqAAgAAAAGABIBAwABAAAAAQAAABoBBQABA\nAAAVgAAABsBBQABAAAAXgAAACgBAwABAAAAAgAAABMCAwABAAAAAQAAAGmHBAABAAAAZgAAAAAAA\nABIAAAAAQAAAEgAAAABAAAABgAAkAcABAAAADAyMTABkQcABAAAAAECAwAAoAcABAAAADAxMDABo\nAMAAQAAAP//AAACoAQAAQAAALwCAAADoAQAAQAAAMIBAAAAAAAA/9sAQwAGBAUGBQQGBgUGBwcGC\nAoQCgoJCQoUDg8MEBcUGBgXFBYWGh0lHxobIxwWFiAsICMmJykqKRkfLTAtKDAlKCko/9sAQwEHB\nwcKCAoTCgoTKBoWGigoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoK\nCgoKCgo/8AAEQgBwgK8AwEiAAIRAQMRAf/EABsAAQADAQEBAQAAAAAAAAAAAAAFBgcCAwQB/8QAP\nRABAAIBAgIGBwUHAgcAAAAAAAECAwQFBhESITFBUWEHImJxgZGxExQjocEVNUJDdLLRMlNScpLC4\nfDx/8QAFAEBAAAAAAAAAAAAAAAAAAAAAP/EABQRAQAAAAAAAAAAAAAAAAAAAAD/2gAMAwEAAhEDE\nQA/ALeAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\n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\n+X2bW87c7aXJyrlpHb5THmhQGlcUcP4d901dw2u1LaiaxaJrPVlju6+6f8A5LOM2K+DLbHmpemSs\n8rVtHKYnzhL8OcQ6rZsnRr+LpZnnbFafzr4Lzamx8W4ImJj7xEdscq5ae/xj5wDLBb9y4E12GZnQ\n5ceop3Vt6lv8ITNw/u2GeV9u1Mz7FJt9OYIsSeLYd2yzyrt2qifbxzWPnMJfb+B9y1ExOqnFpad/\nSnp2+UdX5gqtaza0VrEzaZ5REdczLQOD+F/us13HdqxW9Y6WPFb+D2refl3JHTbbsnC2KNRqMlZz\n8urJl67zPs17vgqXE3FWfdulg08Tg0ffXn62T3+XkDvjTiH9q6iNNpbT9zxW58/9y3j7lYAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAB+0\ntbHeL0tNb1nnE1nlMT5S/AFh0HF+76OIrOeNRSO7NHOfn1Sl8XpBzRH42347T7GWY/SVHAXrJ6Qc\nkx+Ht1Kz42zTP8A2witdxnu2pia4749PWf9qvX85mfyVoB3nzZc+WcmfJfJkt22vMzM++XAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA\nAAAAAAAAAAAAAAAAAAAAAAAAAAAA//Z";
var VideoUpload = function VideoUpload(_ref) {
var setUrl = _ref.setUrl;
var _useState = useState({}),
video = _useState[0],
setVideo = _useState[1];
var _useState2 = useState(''),
imagePreview = _useState2[0],
setImagePreview = _useState2[1];
var _useState3 = useState(false),
loading = _useState3[0],
setLoading = _useState3[1];
var _useState4 = useState(false),
uploaded = _useState4[0],
setUploaded = _useState4[1];
var createPreview = function createPreview(e) {
if (e.target.value !== '') {
setVideo(e.target.files[0]);
setImagePreview(videoPlaceholder);
} else {
setImagePreview('');
}
};
var uploadFile = function uploadFile(e) {
try {
var _temp3 = function _temp3() {
setLoading(false);
};
setLoading(true);
e.preventDefault();
var _temp4 = _catch(function () {
return Promise.resolve(ipfs$5.add(video)).then(function (added) {
var url = "https://ipfs.infura.io/ipfs/" + added.path;
setUrl(url);
setImagePreview(url);
setUploaded(true);
});
}, function (err) {
console.log('Error uploading the file : ', err);
});
return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
} catch (e) {
return Promise.reject(e);
}
};
var previewAndUploadButton = function previewAndUploadButton() {
if (imagePreview !== '') {
if (!loading) {
return /*#__PURE__*/React.createElement("div", null, uploaded ? /*#__PURE__*/React.createElement("h5", null, "\u2705", ' ', /*#__PURE__*/React.createElement("a", {
href: imagePreview,
target: "_blank",
rel: "noopener noreferrer"
}, "Video"), ' ', "Uploaded Successfully \u2705", ' ') : /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
type: "submit",
className: "py-2 px-3 text-sm font-medium text-white bg-blue-700 hover:bg-blue-500 rounded-md border border-blue-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 shadow-sm"
}, "Upload Video"), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("h5", null, video.name, ' ', /*#__PURE__*/React.createElement("span", {
className: "bg-green-100 text-green-800 text-sm font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-green-200 dark:text-green-900"
}, video.size, " kb")), /*#__PURE__*/React.createElement("img", {
style: {
height: '300px'
},
className: "mb-3",
src: imagePreview
})));
} else {
return /*#__PURE__*/React.createElement("div", {
className: "grid grid-cols-1 gap-y-6 mt-4 sm:grid-cols-3 sm:gap-x-4"
}, /*#__PURE__*/React.createElement("h4", null, "Uploading Video"), /*#__PURE__*/React.createElement("div", {
className: "w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700"
}, /*#__PURE__*/React.createElement("div", {
className: "bg-blue-600 h-2.5 rounded-full",
style: "width: 69%"
})), /*#__PURE__*/React.createElement("h4", null, "Please Wait ..."));
}
}
};
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("form", {
onSubmit: uploadFile
}, /*#__PURE__*/React.createElement("input", {
required: true,
type: "file",
accept: "video/*",
onChange: function onChange(e) {
return createPreview(e);
},
className: "p-3 text-sm bg-white rounded border-0 focus:outline-none focus:ring shadow transition-all duration-150 ease-linear placeholder:text-blueGray-300 text-blueGray-600"
}), previewAndUploadButton()));
};
var ipfs$6 = create('https://ipfs.infura.io:5001/api/v0');
var PdfUpload = function PdfUpload(_ref) {
var setUrl = _ref.setUrl;
var _useState = useState({}),
pdf = _useState[0],
setPdf = _useState[1];
var _useState2 = useState(''),
pdfPreview = _useState2[0],
setPdfPreview = _useState2[1];
var _useState3 = useState(false),
loading = _useState3[0],
setLoading = _useState3[1];
var _useState4 = useState(false),
uploaded = _useState4[0],
setUploaded = _useState4[1];
var createPreview = function createPreview(e) {
if (e.target.value !== '') {
setPdf(e.target.files[0]);
var src = URL.createObjectURL(e.target.files[0]);
setPdfPreview(src);
} else {
setPdfPreview('');
}
};
var uploadFile = function uploadFile(e) {
try {
var _temp3 = function _temp3() {
setLoading(false);
};
setLoading(true);
e.preventDefault();
var _temp4 = _catch(function () {
return Promise.resolve(ipfs$6.add(pdf)).then(function (added) {
var url = "https://ipfs.infura.io/ipfs/" + added.path;
setPdfPreview(url);
setUrl(url);
setUploaded(true);
});
}, function (err) {
console.log('Error uploading the file : ', err);
});
return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
} catch (e) {
return Promise.reject(e);
}
};
var previewAndUploadButton = function previewAndUploadButton() {
if (pdfPreview !== '') {
if (!loading) {
return /*#__PURE__*/React.createElement("div", null, uploaded ? /*#__PURE__*/React.createElement("h5", null, "\u2705", ' ', /*#__PURE__*/React.createElement("a", {
href: pdfPreview,
s: true,
target: "_blank",
rel: "noopener noreferrer"
}, "PDF"), ' ', "Uploaded Successfully \u2705") : /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
type: "submit",
className: "py-2 px-3 text-sm font-medium text-white bg-blue-700 hover:bg-blue-500 rounded-md border border-blue-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 shadow-sm"
}, "Upload PDF"), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("h5", null, pdf.name, " ", /*#__PURE__*/React.createElement("span", {
className: "bg-green-100 text-green-800 text-sm font-medium mr-2 px-2.5 py-0.5 rounded dark:bg-green-200 dark:text-green-900"
}, pdf.size, " kb")), /*#__PURE__*/React.createElement("embed", {
width: "75%",
height: "400px",
className: "mb-3",
src: pdfPreview
})));
} else {
return /*#__PURE__*/React.createElement("div", {
className: "grid grid-cols-1 gap-y-6 mt-4 sm:grid-cols-3 sm:gap-x-4"
}, /*#__PURE__*/React.createElement("h4", null, "Uploading PDF"), /*#__PURE__*/React.createElement("div", {
className: "w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700"
}, /*#__PURE__*/React.createElement("div", {
className: "bg-blue-600 h-2.5 rounded-full",
style: "width: 69%"
})), /*#__PURE__*/React.createElement("h4", null, "Please Wait ..."));
}
}
};
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("form", {
onSubmit: uploadFile
}, /*#__PURE__*/React.createElement("input", {
required: true,
type: "file",
accept: "application/pdf",
onChange: function onChange(e) {
return createPreview(e);
},
className: "p-3 text-sm bg-white rounded border-0 focus:outline-none focus:ring shadow transition-all duration-150 ease-linear placeholder:text-blueGray-300 text-blueGray-600"
}), previewAndUploadButton()));
};
var ipfs$7 = create('https://ipfs.infura.io:5001/api/v0');
var TextUpload = function TextUpload(_ref) {
var setUrl = _ref.setUrl;
var _useState = useState(''),
text = _useState[0],
setText = _useState[1];
var _useState2 = useState(false),
loading = _useState2[0],
setLoading = _useState2[1];
var _useState3 = useState(false),
uploaded = _useState3[0],
setUploaded = _useState3[1];
var _useState4 = useState(''),
textUrl = _useState4[0],
setTextUrl = _useState4[1];
var uploadText = function uploadText(e) {
try {
var _temp3 = function _temp3() {
setLoading(false);
};
setLoading(true);
e.preventDefault();
var _temp4 = _catch(function () {
return Promise.resolve(ipfs$7.add(text)).then(function (added) {
var url = "https://ipfs.infura.io/ipfs/" + added.path;
setTextUrl(url);
setUrl(url);
setUploaded(true);
});
}, function (err) {
console.log('Error uploading the file : ', err);
});
return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
} catch (e) {
return Promise.reject(e);
}
};
var uploadButtonLoading = function uploadButtonLoading() {
if (text === '') return;
if (uploaded) {
return /*#__PURE__*/React.createElement("h5", null, "\u2705", ' ', /*#__PURE__*/React.createElement("a", {
href: textUrl,
target: "_blank",
rel: "noopener noreferrer"
}, "Text"), ' ', "Uploaded Successfully \u2705");
} else {
if (loading) {
return /*#__PURE__*/React.createElement("div", {
className: "grid grid-cols-1 gap-y-6 mt-4 sm:grid-cols-3 sm:gap-x-4"
}, /*#__PURE__*/React.createElement("h4", null, "Uploading Text"), /*#__PURE__*/React.createElement("div", {
className: "w-full bg-gray-200 rounded-full h-2.5 dark:bg-gray-700"
}, /*#__PURE__*/React.createElement("div", {
className: "bg-blue-600 h-2.5 rounded-full",
style: "width: 69%"
})), /*#__PURE__*/React.createElement("h4", null, "Please Wait ..."));
} else {
return /*#__PURE__*/React.createElement("button", {
type: "submit",
className: "py-2 px-3 text-sm font-medium text-white bg-blue-700 hover:bg-blue-500 rounded-md border border-blue-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 shadow-sm"
}, "Upload Text");
}
}
};
var textForm = function textForm() {
if (loading || uploaded) {
return /*#__PURE__*/React.createElement("form", null, /*#__PURE__*/React.createElement("div", {
className: "mb-3"
}, /*#__PURE__*/React.createElement("label", {
className: "block text-sm font-medium text-gray-700"
}, "Enter the Text :"), /*#__PURE__*/React.createElement("div", {
className: "mt-1"
}, /*#__PURE__*/React.createElement("textarea", {
className: "block mt-1 w-full rounded-md border border-gray-300 focus:border-blue-500 focus:ring-blue-500 shadow-sm sm:text-sm",
onChange: function onChange(e) {
return setText(e.target.value);
},
readOnly: true,
rows: 3
}))), uploadButtonLoading());
} else {
return /*#__PURE__*/React.createElement("form", {
onSubmit: uploadText
}, /*#__PURE__*/React.createElement("div", {
className: "mb-3"
}, /*#__PURE__*/React.createElement("label", {
className: "block text-sm font-medium text-gray-700"
}, "Enter the Text :"), /*#__PURE__*/React.createElement("div", {
className: "mt-1"
}, /*#__PURE__*/React.createElement("textarea", {
className: "block mt-1 w-full rounded-md border border-gray-300 focus:border-blue-500 focus:ring-blue-500 shadow-sm sm:text-sm",
onChange: function onChange(e) {
return setText(e.target.value);
},
required: true,
rows: 3
}))), uploadButtonLoading());
}
};
return /*#__PURE__*/React.createElement("div", null, textForm());
};
export { Erc721ImageUpload, FileUpload, FolderUpload, ImageUpload, MultipleFilesUpload, PdfUpload, TextUpload, VideoUpload };
//# sourceMappingURL=index.cjs.modern.js.map