Implement new API for user upload and artifacts

service/fling/src/main/java/net/friedl/fling/service/AuthorizationService.java

@@ -2,6 +2,7 @@ package net.friedl.fling.service;
 
 import java.util.UUID;
 import javax.persistence.EntityNotFoundException;
+import javax.transaction.Transactional;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.security.authentication.AbstractAuthenticationToken;
 import org.springframework.stereotype.Service;
@@ -13,6 +14,7 @@ import net.friedl.fling.security.authentication.FlingToken;
 
 @Slf4j
 @Service
+@Transactional
 public class AuthorizationService {
   private FlingRepository flingRepository;
 
@@ -32,7 +34,8 @@ public class AuthorizationService {
       return true;
     }
 
-    if (!flingRepository.getOne(flingId).getAllowUpload()) {
+    FlingEntity flingEntity = flingRepository.getOne(flingId);
+    if (flingEntity.getAllowUpload() == null || !flingEntity.getAllowUpload()) {
       log.debug("Fling[.id={}] does not not allow uploads");
       return false;
     }

web/fling/src/components/user/FlingUserList.jsx

@@ -3,7 +3,8 @@ import React, {useState, useEffect, useRef} from 'react';
 
 import { Switch, Route, useLocation, Link } from "react-router-dom";
 
-import {flingClient, artifactClient} from '../../util/flingclient';
+import { FlingClient, AuthClient, ArtifactClient, fc } from '../../util/fc';
+import { prettifyTimestamp, prettifyBytes } from '../../util/fn';
 
 import upload from '../resources/upload.svg';
 import drop from '../resources/drop.svg';
@@ -14,37 +15,25 @@ function Artifacts(props) {
   useEffect(() => {
     if (!props.fling) return;
 
-        artifactClient.getArtifacts(props.fling.id)
+    let flingClient = new FlingClient();
-            .then((artifacts) => setArtifacts(artifacts));
+    flingClient.getArtifacts(props.fling.id)
+      .then(artifacts => setArtifacts(artifacts));
   }, [props.fling]);
 
   function renderArtifact(artifact) {
-        function readableBytes(bytes) {
-            if(bytes <= 0) return "0 KB";
-
-            var i = Math.floor(Math.log(bytes) / Math.log(1024)),
-                sizes = ['Byte', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
-
-            return (bytes / Math.pow(1024, i)).toFixed(2) * 1 + ' ' + sizes[i];
-        }
-
-        function localizedDate(t) {
-            let d = new Date(t);
-            return d.toLocaleDateString();
-        }
 
     return (
       <div className="user-list-artifact">
         <div className="container">
           <div className="columns">
             <div className="column col-8 col-sm-12">
-                    {artifact.name}<br />
+              {artifact.path}<br />
             </div>
             <div className="column col-2 col-sm-6">
-                    <div className="text-gray">{readableBytes(artifact.size)}</div>
+              <div className="text-gray"></div>
             </div>
             <div className="column col-2 col-sm-6">
-                    <div className="text-gray float-right">{localizedDate(artifact.uploadTime)}</div>
+              <div className="text-gray float-right">{prettifyTimestamp(artifact.creationTime)}</div>
             </div>
           </div>
         </div>
@@ -77,15 +66,6 @@ function Upload(props) {
   });
 
   function fileList() {
-        function readableBytes(bytes) {
-            if(bytes <= 0) return "0 KB";
-
-            var i = Math.floor(Math.log(bytes) / Math.log(1024)),
-                sizes = ['Byte', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
-
-            return (bytes / Math.pow(1024, i)).toFixed(2) * 1 + ' ' + sizes[i];
-        }
-
     let fileList = [];
     files.forEach((file, idx) => {
       if (!file.uploaded) {
@@ -95,7 +75,7 @@ function Upload(props) {
               <div className="card-header">
                 <i className="icon icon-cross float-right c-hand" onClick={ev => deleteFile(idx)} />
                 <div className="card-title h5">{file.name}</div>
-                          <div className="card-subtitle text-gray">{(new Date(file.lastModified)).toLocaleString()+", "+readableBytes(file.size)}</div>
+                <div className="card-subtitle text-gray">{(new Date(file.lastModified)).toLocaleString() + ", " + prettifyBytes(file.size)}</div>
               </div>
             </div>
           </div>
@@ -113,21 +93,12 @@ function Upload(props) {
   }
 
   function totalSize() {
-        function readableBytes(bytes) {
-            if(bytes <= 0) return "0 KB";
-
-            var i = Math.floor(Math.log(bytes) / Math.log(1024)),
-                sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
-
-            return (bytes / Math.pow(1024, i)).toFixed(2) * 1 + ' ' + sizes[i];
-        }
-
     let totalSize = 0;
     for (let file of files) {
       totalSize += file.size;
     }
 
-        return readableBytes(totalSize);
+    return prettifyBytes(totalSize);
   }
 
   function handleClick(ev) {
@@ -204,9 +175,15 @@ function Upload(props) {
   }
 
   function handleUpload() {
+    const flingClient = new FlingClient();
+    const artifactClient = new ArtifactClient();
+
     files.forEach((file, idx) => {
-            artifactClient.postArtifact(props.fling.id, file)
+      let artifact = new fc.Artifact(file.name)
-                .then(response => {
+
+      flingClient.postArtifact(props.fling.id, { artifact: artifact })
+        .then(artifact => {
+          artifactClient.uploadArtifactData(artifact.id, { body: file });
           setFileUploaded(idx);
         });
     });
@@ -275,34 +252,13 @@ export default function FlingUserList(props) {
   let [infoText, setInfoText] = useState("");
   let [inProgress, setInProgress] = useState(false);
 
-    useEffect((flingId) => {
+  useEffect(() => {
-        if(!flingId) return;
+    if (!props.fling.id) return;
 
-        function readableBytes(bytes) {
+    let flingClient = new FlingClient();
-            if(bytes <= 0) return "0 KB";
+    flingClient.getArtifacts(props.fling.id)
-
-            var i = Math.floor(Math.log(bytes) / Math.log(1024)),
-                sizes = ['Byte', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
-
-            return (bytes / Math.pow(1024, i)).toFixed(2) * 1 + ' ' + sizes[i];
-        }
-
-        function localizedDate(t) {
-            let d = new Date(t);
-            return d.toLocaleDateString();
-        }
-
-        artifactClient.getArtifacts(flingId)
       .then((artifacts) => {
-                let totalSize = 0;
+        setInfoText(`${prettifyTimestamp(props.fling.creationTime)} - ${artifacts.length} files`);
-                let countArtifacts = 0;
-
-                for(let artifact of artifacts) {
-                    totalSize += artifact.size;
-                    countArtifacts++;
-                }
-
-                setInfoText(`${localizedDate(props.fling.creationTime)} - ${countArtifacts} files - ${readableBytes(totalSize)}`);
       });
   }, [props.fling.id, props.fling.creationTime]);
 
@@ -310,22 +266,24 @@ export default function FlingUserList(props) {
     ev.preventDefault();
 
     setInProgress(true);
-
+    let authClient = new AuthClient();
-        flingClient.packageFling(props.fling.id)
+    authClient.deriveToken({ singleUse: true })
-            .then(downloadUrl => {
+      .then(token => {
         // We need this iframe hack because with a regular href, while
         // the browser downloads the file fine, it also reloads the page, hence
         // loosing all logs and state
         let frame = document.createElement("iframe");
-                frame.src = downloadUrl;
+        let url = `${process.env.REACT_APP_API.replace(/\/+$/, '')}/api/fling/${props.fling.id}/data?derivedToken=${token}`;
-                iframeContainer.current.appendChild(frame);
+        log.trace(`Generated download url: ${url}`);
+        frame.src = url;
         setInProgress(false);
+        iframeContainer.current.appendChild(frame);
       });
   }
 
   function path(tail) {
-        if(props.fling && props.fling.sharing) {
+    if (props.fling && props.fling.shareId) {
-            return `/f/${props.fling.sharing.shareUrl}/${tail}`;
+      return `/f/${props.fling.shareId}/${tail}`;
     }
 
     return "";
@@ -345,14 +303,17 @@ export default function FlingUserList(props) {
               <li className={`tab-item ${location.pathname !== path("upload") ? "active" : ""}`}>
                 <Link to={path("files")}>Files</Link>
               </li>
-                <li className={`tab-item ${location.pathname === path("upload") ? "active": ""}`}>
+              { props.fling.allowUpload
+                ? <li className={`tab-item ${location.pathname === path("upload") ? "active" : ""}`}>
                     <Link to={path("upload")}>Upload</Link>
                   </li>
+                : <></>
+              }
 
               <li className="tab-item tab-action">
                 <div className="card-title">
                   {inProgress
-                     ? <button className="m-2 btn btn-xs btn-secondary float-right user-list-loading" disabled="true"
+                    ? <button className="m-2 btn btn-xs btn-secondary float-right user-list-loading" disabled
                       onClick={(ev) => ev.preventDefault()}>
                       <div className="loading" /> Packaging
                        </button>

web/fling/src/components/user/FlingUserUpload.jsx

@@ -1,25 +0,0 @@
-import log from 'loglevel';
-import React, {useState, useEffect} from 'react';
-
-import {useParams, BrowserRouter} from 'react-router-dom';
-
-import {flingClient} from '../../util/flingclient';
-
-import DirectDownload from './DirectDownload';
-
-export default function FlingUserUpload(props) {
-    let { shareId } = useParams();
-    let [fling, setFling] = useState({});
-
-    useEffect(() => {
-        flingClient.getFlingByShareId(shareId)
-            .then(f => setFling(f));
-    }, [shareId]);
-
-    return(
-        <div>
-          {fling.sharing && fling.sharing.directDownload ? <DirectDownload fling={fling} />: ""}
-        </div>
-    );
-}
-