import React, { useState, useContext } from "react"; import classNames from "classnames"; import Dropzone from "react-dropzone"; import Reveal from "react-reveal/Reveal"; import shortid from "shortid"; import { Button, UploadFile } from "../"; import { Deco3, Deco4, Deco5, Folder, DownArrow } from "../../svg"; import "./HomeUpload.scss"; import AppContext from "../../AppContext"; import axios from "axios"; export default function HomeUpload() { const [files, setFiles] = useState([]); const { apiUrl } = useContext(AppContext); const handleDrop = async (acceptedFiles) => { setFiles((previousFiles) => [...acceptedFiles.map((file) => ({ file, status: "uploading" })), ...previousFiles]); const onFileStateChange = (file, state) => { setFiles((previousFiles) => { const index = previousFiles.findIndex((f) => f.file === file); return [ ...previousFiles.slice(0, index), { ...previousFiles[index], ...state }, ...previousFiles.slice(index + 1) ]; }); }; const onProgress = (file, { loaded, total }) => { const progress = loaded / total; const status = progress === 1 ? "processing" : "uploading"; onFileStateChange(file, { status, progress }); }; acceptedFiles.forEach(async (file) => { try { const fd = new FormData(); fd.append("file", file); const uuid = shortid.generate(); const { data } = await axios.post(`${apiUrl}/skynet/skyfile/${uuid}`, fd, { onUploadProgress: (event) => onProgress(file, event) }); onFileStateChange(file, { status: "complete", url: `${apiUrl}/${data.skylink}` }); } catch (error) { onFileStateChange(file, { status: "error" }); } }); }; const handleSkylink = (event) => { event.preventDefault(); const skylink = event.target.skylink.value.replace("sia://", ""); if (skylink.match(/^[a-zA-Z0-9_-]{46}$/)) { window.open(skylink, "_blank"); } }; return (
{({ getRootProps, getInputProps, isDragActive }) => ( <>

Upload your Files

Drop your files here to pin to Skynet
)}

Paste the link to retrieve your file

{files.length > 0 && (
{files.map((file, i) => { return ; })}
)}

Upon uploading a file, Skynet generates a 46 byte link called a Skylink. This link can then be shared with anyone to retrieve the file on any Skynet Webportal.

); }