From 857535bb93b5c203d5ffe5c6d03370232658446a Mon Sep 17 00:00:00 2001
From: Armin Friedl <dev@friedl.net>
Date: Sun, 17 May 2020 19:01:33 +0200
Subject: [PATCH] Move fling administration to /admin subpath

Fling administration was directly beneth root path. For convenience the root
path should be reserved for retrieving flings.

Also adds fling content sections to real urls instead of hash urls,
parameterized by the active fling. A content section for a fling can hence now
be bookmarked or directly navigated to.
---
 web/fling/src/App.jsx                         | 10 ++---
 web/fling/src/components/FlingContent.jsx     | 41 -----------------
 .../src/components/{ => admin}/Error.jsx      |  0
 .../src/components/{ => admin}/Fling.jsx      |  4 +-
 .../components/{ => admin}/FlingArtifacts.jsx |  2 +-
 .../src/components/admin/FlingContent.jsx     | 44 +++++++++++++++++++
 .../src/components/{ => admin}/FlingList.jsx  |  2 +-
 .../src/components/{ => admin}/FlingTile.jsx  |  2 +-
 .../src/components/{ => admin}/Login.jsx      |  4 +-
 .../src/components/{ => admin}/Navbar.jsx     |  6 +--
 .../src/components/{ => admin}/Settings.jsx   |  2 +-
 .../src/components/{ => admin}/Upload.jsx     |  7 +--
 .../src/components/{ => resources}/drop.svg   |  0
 .../src/components/{ => resources}/send.svg   |  0
 .../src/components/{ => resources}/upload.svg |  0
 15 files changed, 65 insertions(+), 59 deletions(-)
 delete mode 100644 web/fling/src/components/FlingContent.jsx
 rename web/fling/src/components/{ => admin}/Error.jsx (100%)
 rename web/fling/src/components/{ => admin}/Fling.jsx (86%)
 rename web/fling/src/components/{ => admin}/FlingArtifacts.jsx (97%)
 create mode 100644 web/fling/src/components/admin/FlingContent.jsx
 rename web/fling/src/components/{ => admin}/FlingList.jsx (95%)
 rename web/fling/src/components/{ => admin}/FlingTile.jsx (98%)
 rename web/fling/src/components/{ => admin}/Login.jsx (95%)
 rename web/fling/src/components/{ => admin}/Navbar.jsx (81%)
 rename web/fling/src/components/{ => admin}/Settings.jsx (98%)
 rename web/fling/src/components/{ => admin}/Upload.jsx (95%)
 rename web/fling/src/components/{ => resources}/drop.svg (100%)
 rename web/fling/src/components/{ => resources}/send.svg (100%)
 rename web/fling/src/components/{ => resources}/upload.svg (100%)

diff --git a/web/fling/src/App.jsx b/web/fling/src/App.jsx
index a8eb75c..b812159 100644
--- a/web/fling/src/App.jsx
+++ b/web/fling/src/App.jsx
@@ -5,14 +5,14 @@ import {Switch, Route, Redirect} from "react-router-dom";
 
 import request, {isOwner} from './util/request';
 
-import Login from './components/Login';
-import Fling from './components/Fling';
+import Login from './components/admin/Login';
+import Fling from './components/admin/Fling';
 
 export default () => {
     return (
         <Switch>
-          <Route exact path="/login" component={Login} />
-          <OwnerRoute exact path="(/|/flings)"><Fling /></OwnerRoute>
+          <Route exact path="/admin/login" component={Login} />
+          <OwnerRoute path="/admin"><Fling /></OwnerRoute>
           <Route match="*">Not implemented</Route>
         </Switch>
     );
@@ -27,7 +27,7 @@ function OwnerRoute({ children, ...rest }) {
           render={({ location }) => {
               log.info(request.defaults);
               if(isOwner()) { return children; }
-              else { return <Redirect to={{pathname: "/login", state: {from: location}}} />; }
+              else { return <Redirect to={{pathname: "/admin/login", state: {from: location}}} />; }
           }}
         />
     );
diff --git a/web/fling/src/components/FlingContent.jsx b/web/fling/src/components/FlingContent.jsx
deleted file mode 100644
index ba838e3..0000000
--- a/web/fling/src/components/FlingContent.jsx
+++ /dev/null
@@ -1,41 +0,0 @@
-import log from 'loglevel';
-import React, {useState, useEffect, useRef} from 'react';
-import {Switch, Route, Redirect, HashRouter, useLocation} from "react-router-dom";
-
-import classNames from 'classnames';
-
-import {artifactClient} from '../util/flingclient';
-
-import FlingArtifacts from './FlingArtifacts';
-import Upload from './Upload';
-import Settings from './Settings';
-
-export default function FlingContent(props) {
-    let location = useLocation();
-
-    return(
-        <div className="fling-content p-2">
-          <ul className="tab tab-block mt-0">
-            <li className={`tab-item ${location.hash !== "#/upload" && location.hash !== "#/settings" ? "active": ""}`}>
-              <a href="#/files">Files</a>
-            </li>
-            <li className={`tab-item ${location.hash === "#/upload"? "active": ""}`}>
-              <a href="#/upload">Upload</a>
-            </li>
-            <li className={`tab-item ${location.hash === "#/settings"? "active": ""}`}>
-              <a href="#/settings">Settings</a>
-            </li>
-          </ul>
-
-          <div className="mt-2">
-            <HashRouter>
-              <Switch>
-                <Route exact path={["/files","/"]}><FlingArtifacts activeFling={props.activeFling} /></Route>
-                <Route path="/upload"><Upload activeFling={props.activeFling} /></Route>
-                <Route path="/settings"><div><Settings activeFling={props.activeFling}/></div></Route>
-              </Switch>
-            </HashRouter>
-          </div>
-        </div>
-    );
-}
diff --git a/web/fling/src/components/Error.jsx b/web/fling/src/components/admin/Error.jsx
similarity index 100%
rename from web/fling/src/components/Error.jsx
rename to web/fling/src/components/admin/Error.jsx
diff --git a/web/fling/src/components/Fling.jsx b/web/fling/src/components/admin/Fling.jsx
similarity index 86%
rename from web/fling/src/components/Fling.jsx
rename to web/fling/src/components/admin/Fling.jsx
index 2e22e6f..1f4f720 100644
--- a/web/fling/src/components/Fling.jsx
+++ b/web/fling/src/components/admin/Fling.jsx
@@ -5,7 +5,7 @@ import Navbar from './Navbar';
 import FlingList from './FlingList';
 import FlingContent from './FlingContent';
 
-import {HashRouter} from 'react-router-dom';
+import {BrowserRouter} from 'react-router-dom';
 
 export default function Fling() {
     const [activeFling, setActiveFling] = useState(undefined);
@@ -17,7 +17,9 @@ export default function Fling() {
             <div className="columns mt-2">
               <div className="column col-sm-12 col-lg-3 col-2"> <FlingList setActiveFlingFn={setActiveFling} activeFling={activeFling} /> </div>
               <div className="column col-sm-12">
+                <BrowserRouter>
                   <FlingContent activeFling={activeFling} />
+                </BrowserRouter>
               </div>
             </div>
           </div>
diff --git a/web/fling/src/components/FlingArtifacts.jsx b/web/fling/src/components/admin/FlingArtifacts.jsx
similarity index 97%
rename from web/fling/src/components/FlingArtifacts.jsx
rename to web/fling/src/components/admin/FlingArtifacts.jsx
index fc527e0..4fcd27b 100644
--- a/web/fling/src/components/FlingArtifacts.jsx
+++ b/web/fling/src/components/admin/FlingArtifacts.jsx
@@ -3,7 +3,7 @@ import React, {useState, useEffect, useRef} from 'react';
 
 import classNames from 'classnames';
 
-import {artifactClient} from '../util/flingclient';
+import {artifactClient} from '../../util/flingclient';
 
 function FlingArtifactControl(props) {
     return(
diff --git a/web/fling/src/components/admin/FlingContent.jsx b/web/fling/src/components/admin/FlingContent.jsx
new file mode 100644
index 0000000..a974040
--- /dev/null
+++ b/web/fling/src/components/admin/FlingContent.jsx
@@ -0,0 +1,44 @@
+import log from 'loglevel';
+import React, {useState, useEffect, useRef} from 'react';
+import {Switch, Route, Redirect, BrowserRouter, useLocation, useParams, Link} from "react-router-dom";
+
+import classNames from 'classnames';
+
+import {artifactClient} from '../../util/flingclient';
+
+import FlingArtifacts from './FlingArtifacts';
+import Upload from './Upload';
+import Settings from './Settings';
+
+export default function FlingContent(props) {
+    let location = useLocation();
+    let { fling } = useParams();
+
+    function path(tail) {
+        return `/admin/${props.activeFling}/${tail}`;
+    }
+
+    return(
+        <div className="fling-content p-2">
+          <ul className="tab tab-block mt-0">
+            <li className={`tab-item ${location.pathname !== path("upload") && location.pathname !== path("settings") ? "active": ""}`}>
+              <Link to={path("files")}>Files</Link>
+            </li>
+            <li className={`tab-item ${location.pathname === path("upload") ? "active": ""}`}>
+              <Link to={path("upload")}>Upload</Link>
+            </li>
+            <li className={`tab-item ${location.pathname === path("settings") ? "active": ""}`}>
+              <Link to={path("settings")}>Settings</Link>
+            </li>
+          </ul>
+
+          <div className="mt-2">
+            <Switch>
+              <Route exact path={["/admin/:fling/files","/admin"]}><FlingArtifacts activeFling={props.activeFling} /></Route>
+              <Route path="/admin/:fling/upload"><Upload activeFling={props.activeFling} /></Route>
+              <Route path="/admin/:fling/settings"><Settings activeFling={props.activeFling}/></Route>
+            </Switch>
+          </div>
+        </div>
+    );
+}
diff --git a/web/fling/src/components/FlingList.jsx b/web/fling/src/components/admin/FlingList.jsx
similarity index 95%
rename from web/fling/src/components/FlingList.jsx
rename to web/fling/src/components/admin/FlingList.jsx
index 0550518..0dd6432 100644
--- a/web/fling/src/components/FlingList.jsx
+++ b/web/fling/src/components/admin/FlingList.jsx
@@ -1,7 +1,7 @@
 import log from 'loglevel';
 import React, {useState, useEffect} from 'react';
 
-import {flingClient} from '../util/flingclient';
+import {flingClient} from '../../util/flingclient';
 
 import FlingTile from './FlingTile';
 
diff --git a/web/fling/src/components/FlingTile.jsx b/web/fling/src/components/admin/FlingTile.jsx
similarity index 98%
rename from web/fling/src/components/FlingTile.jsx
rename to web/fling/src/components/admin/FlingTile.jsx
index 90eae31..792d88b 100644
--- a/web/fling/src/components/FlingTile.jsx
+++ b/web/fling/src/components/admin/FlingTile.jsx
@@ -2,7 +2,7 @@ import log from 'loglevel';
 import React, {useRef, useState} from 'react';
 import classNames from 'classnames';
 
-import {flingClient} from '../util/flingclient';
+import {flingClient} from '../../util/flingclient';
 
 function TileAction(props) {
     let shareUrlRef = useRef(null);
diff --git a/web/fling/src/components/Login.jsx b/web/fling/src/components/admin/Login.jsx
similarity index 95%
rename from web/fling/src/components/Login.jsx
rename to web/fling/src/components/admin/Login.jsx
index 13e3926..d63e784 100644
--- a/web/fling/src/components/Login.jsx
+++ b/web/fling/src/components/admin/Login.jsx
@@ -2,7 +2,7 @@ import log from 'loglevel';
 import React, {useState, useEffect} from 'react';
 import {useHistory, useLocation} from 'react-router-dom';
 
-import request, {setAuth} from '../util/request';
+import request, {setAuth} from '../../util/request';
 
 import Error from './Error';
 
@@ -12,7 +12,7 @@ export default () => {
     const [password, setPassword] = useState("");
     const history = useHistory();
     const location = useLocation();
-    const { from } = location.state || { from: { pathname: "/" } };
+    const { from } = location.state || { from: { pathname: "/admin" } };
 
     useEffect(() => setAuth(null), []);
 
diff --git a/web/fling/src/components/Navbar.jsx b/web/fling/src/components/admin/Navbar.jsx
similarity index 81%
rename from web/fling/src/components/Navbar.jsx
rename to web/fling/src/components/admin/Navbar.jsx
index c5522a2..52da91a 100644
--- a/web/fling/src/components/Navbar.jsx
+++ b/web/fling/src/components/admin/Navbar.jsx
@@ -1,9 +1,9 @@
 import log from 'loglevel';
 import React from 'react';
 
-import request from '../util/request';
+import request from '../../util/request';
 
-import send from './send.svg';
+import send from '../resources/send.svg';
 
 export default function Navbar() {
     return (
@@ -22,7 +22,7 @@ export default function Navbar() {
           </section>
           <section className="navbar-section navbar-control">
             <button className="btn btn-sm btn-link"><i className="icon icon-plus"/> New</button>
-            <a className="btn btn-sm btn-link" href="/login"><i className="icon icon-shutdown"/> Logout</a>
+            <a className="btn btn-sm btn-link" href="/admin/login"><i className="icon icon-shutdown"/> Logout</a>
           </section>
         </header>
     );
diff --git a/web/fling/src/components/Settings.jsx b/web/fling/src/components/admin/Settings.jsx
similarity index 98%
rename from web/fling/src/components/Settings.jsx
rename to web/fling/src/components/admin/Settings.jsx
index d430345..2d4c268 100644
--- a/web/fling/src/components/Settings.jsx
+++ b/web/fling/src/components/admin/Settings.jsx
@@ -3,7 +3,7 @@ import React, {useState, useEffect, useRef} from 'react';
 
 import classNames from 'classnames';
 
-import {flingClient} from '../util/flingclient';
+import {flingClient} from '../../util/flingclient';
 
 export default function Settings(props) {
     let [fling, setFling] = useState({name: "", sharing: {directDownload: false, allowUpload: true, shared: true, shareUrl: ""}});
diff --git a/web/fling/src/components/Upload.jsx b/web/fling/src/components/admin/Upload.jsx
similarity index 95%
rename from web/fling/src/components/Upload.jsx
rename to web/fling/src/components/admin/Upload.jsx
index ca55905..022c0b1 100644
--- a/web/fling/src/components/Upload.jsx
+++ b/web/fling/src/components/admin/Upload.jsx
@@ -1,12 +1,13 @@
 import log from 'loglevel';
 import React, {useState, useEffect, useRef} from 'react';
+import {Switch, Route, Redirect, BrowserRouter, useLocation, useParams, Link} from "react-router-dom";
 
 import classNames from 'classnames';
 
-import {artifactClient} from '../util/flingclient';
+import {artifactClient} from '../../util/flingclient';
 
-import upload from './upload.svg';
-import drop from './drop.svg';
+import upload from '../resources/upload.svg';
+import drop from '../resources/drop.svg';
 
 
 export default function Upload(props) {
diff --git a/web/fling/src/components/drop.svg b/web/fling/src/components/resources/drop.svg
similarity index 100%
rename from web/fling/src/components/drop.svg
rename to web/fling/src/components/resources/drop.svg
diff --git a/web/fling/src/components/send.svg b/web/fling/src/components/resources/send.svg
similarity index 100%
rename from web/fling/src/components/send.svg
rename to web/fling/src/components/resources/send.svg
diff --git a/web/fling/src/components/upload.svg b/web/fling/src/components/resources/upload.svg
similarity index 100%
rename from web/fling/src/components/upload.svg
rename to web/fling/src/components/resources/upload.svg