diff --git a/packages/siaviewnode-client/pages/index.tsx b/packages/siaviewnode-client/pages/index.tsx index 71a90248..57767e6f 100644 --- a/packages/siaviewnode-client/pages/index.tsx +++ b/packages/siaviewnode-client/pages/index.tsx @@ -10,43 +10,37 @@ import { makeStyles, AppBar, Tabs, - Tab + Tab, + Input } from "@material-ui/core" import Dropzone from "../src/components/Dropzone" import { useState } from "react" import { TabPanel } from "../src/components/TabPanel" - -const useStyles = makeStyles({ - card: { - minWidth: 275 - }, - bullet: { - display: "inline-block", - margin: "0 2px", - transform: "scale(0.8)" - }, - title: { - fontSize: 14 - }, - pos: { - marginBottom: 12 - } -}) +import * as R from "ramda" const Index = () => { - const classes = useStyles({}) - const [value, setValue] = useState(0) + const [value, setValue] = useState(1) + const [linkfileUrl, setInput] = useState("") const handleChange = (event, newValue) => { setValue(newValue) } + + const directView = () => { + const removeHead = R.compose(R.tail, R.split("sia://")) + const hash = removeHead(linkfileUrl)[0] + if (window) { + var win = window.open(`/direct/${hash}`, "_blank") + win.focus() + } + } return ( <> - Sia View Node + Sia Skynet + + + diff --git a/packages/siaviewnode-client/src/components/Dropzone.tsx b/packages/siaviewnode-client/src/components/Dropzone.tsx index de511f27..bebf77ee 100644 --- a/packages/siaviewnode-client/src/components/Dropzone.tsx +++ b/packages/siaviewnode-client/src/components/Dropzone.tsx @@ -18,49 +18,64 @@ const splitFilename = R.compose(R.head, R.split(".sia")) function MyDropzone() { const [loading, setLoading] = useState(false) const [error, setError] = useState(null) - const formRef = useRef(null) - const inputRef = useRef(null) + const [link, setLink] = useState("") const onDrop = useCallback( acceptedFiles => { setLoading(true) const file = R.head(acceptedFiles) const url = API_ENDPOINT + "/linkfile/upload" - console.log("file is", file) + const fd = new FormData() + fd.append("file", file) fetch(url, { method: "POST", - body: file + body: fd, + mode: "cors" }) .then(res => { return res.json() }) - .then(data => { - console.log("WE OUT HERE BOYS", data) + .then(({ sialink }) => { + console.log("WE OUT HERE BOYS", sialink) + setLink(sialink) + setLoading(false) }) .catch(e => { - console.log("error is", e) + console.log("Upload error:", e) + setError("An unexpected error occured. Check console for details.") setLoading(false) }) }, - [loading, setLoading, error, setError, formRef] + [loading, setLoading, error, setError] ) const { getRootProps, getInputProps, isDragActive } = useDropzone({ onDrop }) return ( - - - {isDragActive ? ( -

Drop file here ...

- ) : ( -

Drag 'n' drop a file here, or click to select a file

- )} -
+ {link ? ( + +
{link}
+
+ ) : ( + + + {isDragActive && !loading && !error && !link && ( +

Drop file here ...

+ )} + {!isDragActive && !loading && !error && !link && ( +

Drag 'n' drop a file here, or click to select a file

+ )} + {loading && } + {error && !loading &&
{error}
} +
+ )}
) } diff --git a/packages/siaviewnode-server/src/main.ts b/packages/siaviewnode-server/src/main.ts index 5c292b89..ed8c6a6f 100644 --- a/packages/siaviewnode-server/src/main.ts +++ b/packages/siaviewnode-server/src/main.ts @@ -59,7 +59,7 @@ export class Server { private setRoutes = (): void => { this.app.use( cors({ - origin: "http://localhost:*", + origin: "*", credentials: true }) ) @@ -71,7 +71,7 @@ export class Server { // siafile this.app.post("/siafile", this.postSiaFile) // linkfile - this.app.post("/linkfile", this.handleLinkUpload) + this.app.post("/linkfile/upload", this.handleLinkUpload) } private async handleLinkUpload( @@ -98,7 +98,7 @@ export class Server { console.log("data is ", data) return res.send(data) } catch (err) { - console.log("err", err) + console.log("err", err.message) return res.sendStatus(500) } }