better delete action wiring for shares and environments (#142)

ui/src/console/PropertyTable.js

@@ -39,7 +39,6 @@ const PropertyTable = (props) => {
             cell: row => {
                 if(props.custom) {
                     if(row.property in props.custom) {
-                        console.log(Date.now());
                         return props.custom[row.property](row);
                     }
                 }

ui/src/console/detail/Detail.js

@@ -1,5 +1,5 @@
 import AccountDetail from "./AccountDetail";
-import ShareDetail from "./ShareDetail";
+import ShareDetail from "./share/ShareDetail";
 import EnvironmentDetail from "./environment/EnvironmentDetail";
 
 const Detail = (props) => {

ui/src/console/detail/environment/ActionsTab.js

@@ -1,17 +1,17 @@
 import {Button} from "react-bootstrap";
-import * as identity from "../../../api/environment";
+import * as environment from "../../../api/environment";
 
 const ActionsTab = (props) => {
     const deleteEnvironment = (envZId) => {
         if(window.confirm("Really delete environment '" + envZId + "' and all shares within?")) {
-            identity.disable({body: {identity: envZId}}).then(resp => {
+            environment.disable({body: {identity: envZId}}).then(resp => {
                 console.log(resp);
             });
         }
     }
 
     return (
-        <div class={"actions-tab"}>
+        <div className={"actions-tab"}>
             <h3>Delete your environment '{props.environment.description}' ({props.environment.zId})?</h3>
             <p>
                 This will remove all shares from this environment, and will remove the environment from the network. You

ui/src/console/detail/share/ActionsTab.js

@@ -0,0 +1,28 @@
+import * as share from "../../../api/share";
+import {Button} from "react-bootstrap";
+
+const ActionsTab = (props) => {
+    const deleteShare = (envZId, shrToken, reserved) => {
+        console.log(envZId, shrToken, reserved);
+        if(window.confirm("Really delete share '" + shrToken + "'?")) {
+            share.unshare({body: {envZId: envZId, shrToken: shrToken, reserved: reserved}}).then(resp => {
+                console.log(resp);
+            });
+        }
+    }
+
+    return (
+        <div className={"actions-tab"}>
+            <h3>Delete your share '{props.share.token}'?</h3>
+            <p>
+                This will remove the share (of <code>{props.share.backendProxyEndpoint}</code>) from your environment, making it
+                unavailable. You will need to terminate the backend for this share in your local environment.
+            </p>
+            <Button variant={"danger"} onClick={() => deleteShare(props.share.envZId, props.share.token, props.share.reserved)}>
+                Delete '{props.share.token}'
+            </Button>
+        </div>
+    );
+};
+
+export default ActionsTab;

ui/src/console/detail/share/ShareDetail.js

@@ -1,11 +1,12 @@
-import * as metadata from "../../api/metadata";
+import * as metadata from "../../../api/metadata";
 import {Sparklines, SparklinesLine, SparklinesSpots} from "react-sparklines";
 import {useEffect, useState} from "react";
 import {mdiEyeOffOutline, mdiEyeOutline, mdiShareVariant} from "@mdi/js";
 import Icon from "@mdi/react";
-import PropertyTable from "../PropertyTable";
+import PropertyTable from "../../PropertyTable";
 import {Tab, Tabs} from "react-bootstrap";
-import {secretString} from "./util";
+import {secretString} from "../util";
+import ActionsTab from "./ActionsTab";
 
 const ShareDetail = (props) => {
     const [detail, setDetail] = useState({});
@@ -14,7 +15,10 @@ const ShareDetail = (props) => {
     useEffect(() => {
         metadata.getShareDetail(props.selection.id)
             .then(resp => {
-               setDetail(resp.data);
+                let detail = resp.data;
+                detail.envZId = props.selection.envZId;
+                console.log(detail);
+                setDetail(detail);
             });
     }, [props.selection]);
 
@@ -23,7 +27,9 @@ const ShareDetail = (props) => {
         let interval = setInterval(() => {
             metadata.getShareDetail(props.selection.id)
                 .then(resp => {
-                    setDetail(resp.data);
+                    let detail = resp.data;
+                    detail.envZId = props.selection.envZId;
+                    setDetail(detail);
                 });
         }, 1000);
         return () => {
@@ -61,6 +67,9 @@ const ShareDetail = (props) => {
                     <Tab eventKey={"detail"} title={"Detail"}>
                         <PropertyTable object={detail} custom={customProperties} />
                     </Tab>
+                    <Tab eventKey={"actions"} title={"Actions"}>
+                        <ActionsTab share={detail} />
+                    </Tab>
                 </Tabs>
             </div>
         );

ui/src/console/visualizer/Network.js

@@ -53,7 +53,7 @@ const Network = (props) => {
     }
 
     const nodeClicked = (node) => {
-        props.setSelection({id: node.id, type: node.type});
+        props.setSelection(node);
     }
 
     return (

ui/src/console/visualizer/graph.js

@@ -50,6 +50,7 @@ export const mergeGraph = (oldGraph, user, newOverview) => {
                 }
                 let shrNode = {
                     id: shr.token,
+                    envZId: env.environment.zId,
                     label: shrLabel,
                     type: "share",
                     val: 50