Refactor dialogs out of squeak detail (#728)

* Refactor dialogs out of squeak detail component

* Update static build for refactored squeak detail component

frontend/src/components/SqueakDetailItem/SqueakDetailItem.js

@@ -28,10 +28,7 @@ import ZoomInIcon from '@material-ui/icons/ZoomIn';
 import useStyles from "./styles";
 
 import Widget from "../../components/Widget";
-import MakeSqueakDialog from "../../components/MakeSqueakDialog";
-import DeleteSqueakDialog from "../../components/DeleteSqueakDialog";
-import BuySqueakDialog from "../../components/BuySqueakDialog";
-import SqueakDetailsDialog from "../../components/SqueakDetailsDialog";
+
 
 
 import {
@@ -50,61 +47,18 @@ export default function SqueakDetailItem({
   network,
   handleReplyClick,
   handleDeleteClick,
+  handleViewDetailsClick,
+  handleUnlockClick,
   ...props
 }) {
   var classes = useStyles();
 
   const history = useHistory();
-  const [replyDialogOpen, setReplyDialogOpen] = useState(false);
-  const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
-  const [buyDialogOpen, setBuyDialogOpen] = useState(false);
-  const [viewDetailsDialogOpen, setViewDetailsDialogOpen] = useState(false);
-
-  const handleClickOpen = () => {
-    setReplyDialogOpen(true);
-  };
-
-  const handleClose = () => {
-     setReplyDialogOpen(false);
-  };
-
-  const handleClickOpenDeleteDialog = () => {
-    setDeleteDialogOpen(true);
-    console.log("deleteDialogOpen: " + deleteDialogOpen);
-  };
-
-  const handleCloseDeleteDialog = () => {
-     setDeleteDialogOpen(false);
-  };
-
-  const handleClickOpenBuyDialog = () => {
-    setBuyDialogOpen(true);
-  };
-
-  const handleCloseBuyDialog = () => {
-    setBuyDialogOpen(false);
-  };
-
-  const handleClickOpenViewDetailsDialog = () => {
-    setViewDetailsDialogOpen(true);
-  };
-
-  const handleCloseViewDetailsDialog = () => {
-    setViewDetailsDialogOpen(false);
-  };
 
   const goToSqueakAddressPage = () => {
     history.push("/app/squeakaddress/" + squeak.getAuthorAddress());
   };
 
-  const goToBuyPage = (hash) => {
-    history.push("/app/buy/" + hash);
-  };
-
-  const goToSqueakDetailPage = () => {
-    history.push("/app/squeakdetail/" + hash);
-  };
-
   const reloadRoute = () => {
     history.go(0);
   };
@@ -130,7 +84,7 @@ export default function SqueakDetailItem({
     if (!squeak) {
       return;
     }
-    handleClickOpen();
+    handleReplyClick();
   }
 
   const onDeleteClick = (event) => {
@@ -139,7 +93,7 @@ export default function SqueakDetailItem({
     if (!squeak) {
       return;
     }
-    handleClickOpenDeleteDialog();
+    handleDeleteClick();
   }
 
   const onZoomInClick = (event) => {
@@ -150,7 +104,7 @@ export default function SqueakDetailItem({
     }
     //handleClickOpenDeleteDialog();
     // goToSqueakDetailPage();
-    handleClickOpenViewDetailsDialog();
+    handleViewDetailsClick();
   }
 
   const onUnlockClick = (event) => {
@@ -160,7 +114,7 @@ export default function SqueakDetailItem({
       return;
     }
     // goToBuyPage(squeak.getSqueakHash());
-    handleClickOpenBuyDialog();
+    handleUnlockClick();
   }
 
   const onDownloadClick = (event) => {
@@ -282,54 +236,6 @@ export default function SqueakDetailItem({
     )
   }
 
-  function MakeSqueakDialogContent() {
-    return (
-      <>
-        <MakeSqueakDialog
-          open={replyDialogOpen}
-          handleClose={handleClose}
-          replytoSqueak={squeak}
-          ></MakeSqueakDialog>
-      </>
-    )
-  }
-
-  function DeleteSqueakDialogContent() {
-    return (
-      <>
-        <DeleteSqueakDialog
-          open={deleteDialogOpen}
-          handleClose={handleCloseDeleteDialog}
-          squeakToDelete={squeak}
-          ></DeleteSqueakDialog>
-      </>
-    )
-  }
-
-  function BuyDialogContent() {
-    return (
-      <>
-        <BuySqueakDialog
-          open={buyDialogOpen}
-          handleClose={handleCloseBuyDialog}
-          hash={hash}
-          ></BuySqueakDialog>
-      </>
-    )
-  }
-
-  function ViewDetailsDialogContent() {
-    return (
-      <>
-        <SqueakDetailsDialog
-          open={viewDetailsDialogOpen}
-          handleClose={handleCloseViewDetailsDialog}
-          hash={hash}
-          squeak={squeak}
-          ></SqueakDetailsDialog>
-      </>
-    )
-  }
 
   return (
     <>
@@ -420,10 +326,6 @@ export default function SqueakDetailItem({
             </Grid>
           </Grid>
     </Paper>
-    {MakeSqueakDialogContent()}
-    {DeleteSqueakDialogContent()}
-    {BuyDialogContent()}
-    {ViewDetailsDialogContent()}
     </>
   )
 }

frontend/src/pages/squeak/Squeak.js

@@ -28,6 +28,12 @@ import SqueakDetailItem from "../../components/SqueakDetailItem";
 import SqueakThreadItem from "../../components/SqueakThreadItem";
 import SqueakUserAvatar from "../../components/SqueakUserAvatar";
 
+import MakeSqueakDialog from "../../components/MakeSqueakDialog";
+import DeleteSqueakDialog from "../../components/DeleteSqueakDialog";
+import BuySqueakDialog from "../../components/BuySqueakDialog";
+import SqueakDetailsDialog from "../../components/SqueakDetailsDialog";
+
+
 import {
   getSqueakDisplayRequest,
   getAncestorSqueakDisplaysRequest,
@@ -45,6 +51,12 @@ export default function SqueakPage() {
   const [replySqueaks, setReplySqueaks] = useState([]);
   const [network, setNetwork] = useState("");
 
+  const [replyDialogOpen, setReplyDialogOpen] = useState(false);
+  const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
+  const [buyDialogOpen, setBuyDialogOpen] = useState(false);
+  const [viewDetailsDialogOpen, setViewDetailsDialogOpen] = useState(false);
+
+
   const getSqueak = (hash) => {
       getSqueakDisplayRequest(hash, setSqueak);
   };
@@ -75,6 +87,40 @@ export default function SqueakPage() {
       return oldestKnownAncestor.getReplyTo();
   };
 
+  const handleClickOpen = () => {
+    setReplyDialogOpen(true);
+  };
+
+  const handleClose = () => {
+     setReplyDialogOpen(false);
+  };
+
+  const handleClickOpenDeleteDialog = () => {
+    setDeleteDialogOpen(true);
+    console.log("deleteDialogOpen: " + deleteDialogOpen);
+  };
+
+  const handleCloseDeleteDialog = () => {
+     setDeleteDialogOpen(false);
+  };
+
+  const handleClickOpenBuyDialog = () => {
+    setBuyDialogOpen(true);
+  };
+
+  const handleCloseBuyDialog = () => {
+    setBuyDialogOpen(false);
+  };
+
+  const handleClickOpenViewDetailsDialog = () => {
+    setViewDetailsDialogOpen(true);
+  };
+
+  const handleCloseViewDetailsDialog = () => {
+    setViewDetailsDialogOpen(false);
+  };
+
+
   useEffect(()=>{
     getSqueak(hash)
   },[hash]);
@@ -194,6 +240,10 @@ export default function SqueakPage() {
 <SqueakDetailItem
   hash={hash}
   squeak={squeak}
+  handleReplyClick={handleClickOpen}
+  handleDeleteClick={handleClickOpenDeleteDialog}
+  handleViewDetailsClick={handleClickOpenViewDetailsDialog}
+  handleUnlockClick={handleClickOpenBuyDialog}
   network={network}>
 </SqueakDetailItem>
 <Divider />
@@ -250,10 +300,64 @@ export default function SqueakPage() {
     )
   }
 
+
+    function MakeSqueakDialogContent() {
+      return (
+        <>
+          <MakeSqueakDialog
+            open={replyDialogOpen}
+            handleClose={handleClose}
+            replytoSqueak={squeak}
+            ></MakeSqueakDialog>
+        </>
+      )
+    }
+
+    function DeleteSqueakDialogContent() {
+      return (
+        <>
+          <DeleteSqueakDialog
+            open={deleteDialogOpen}
+            handleClose={handleCloseDeleteDialog}
+            squeakToDelete={squeak}
+            ></DeleteSqueakDialog>
+        </>
+      )
+    }
+
+    function BuyDialogContent() {
+      return (
+        <>
+          <BuySqueakDialog
+            open={buyDialogOpen}
+            handleClose={handleCloseBuyDialog}
+            hash={hash}
+            ></BuySqueakDialog>
+        </>
+      )
+    }
+
+    function ViewDetailsDialogContent() {
+      return (
+        <>
+          <SqueakDetailsDialog
+            open={viewDetailsDialogOpen}
+            handleClose={handleCloseViewDetailsDialog}
+            hash={hash}
+            squeak={squeak}
+            ></SqueakDetailsDialog>
+        </>
+      )
+    }
+
   return (
     <>
       <PageTitle title="Squeak" />
       {SqueakContent()}
+      {MakeSqueakDialogContent()}
+      {DeleteSqueakDialogContent()}
+      {BuyDialogContent()}
+      {ViewDetailsDialogContent()}
     </>
   );
 }

squeaknode/admin/webapp/static/build/asset-manifest.json

@@ -1,17 +1,17 @@
 {
   "files": {
-    "main.js": "/static/js/main.5fdf011b.chunk.js",
-    "main.js.map": "/static/js/main.5fdf011b.chunk.js.map",
+    "main.js": "/static/js/main.15c32003.chunk.js",
+    "main.js.map": "/static/js/main.15c32003.chunk.js.map",
     "runtime-main.js": "/static/js/runtime-main.9f0ba400.js",
     "runtime-main.js.map": "/static/js/runtime-main.9f0ba400.js.map",
     "static/css/2.15110fae.chunk.css": "/static/css/2.15110fae.chunk.css",
-    "static/js/2.7baefd49.chunk.js": "/static/js/2.7baefd49.chunk.js",
-    "static/js/2.7baefd49.chunk.js.map": "/static/js/2.7baefd49.chunk.js.map",
+    "static/js/2.016f4b29.chunk.js": "/static/js/2.016f4b29.chunk.js",
+    "static/js/2.016f4b29.chunk.js.map": "/static/js/2.016f4b29.chunk.js.map",
     "index.html": "/index.html",
-    "precache-manifest.d4bb68409c9a68116903f30c450af8dc.js": "/precache-manifest.d4bb68409c9a68116903f30c450af8dc.js",
+    "precache-manifest.da0e08df1b0b57c88f6400e952e1f501.js": "/precache-manifest.da0e08df1b0b57c88f6400e952e1f501.js",
     "service-worker.js": "/service-worker.js",
     "static/css/2.15110fae.chunk.css.map": "/static/css/2.15110fae.chunk.css.map",
-    "static/js/2.7baefd49.chunk.js.LICENSE.txt": "/static/js/2.7baefd49.chunk.js.LICENSE.txt",
+    "static/js/2.016f4b29.chunk.js.LICENSE.txt": "/static/js/2.016f4b29.chunk.js.LICENSE.txt",
     "static/media/font-awesome.min.css": "/static/media/fontawesome-webfont.fee66e71.woff",
     "static/media/google.svg": "/static/media/google.695a3160.svg",
     "static/media/logo.svg": "/static/media/logo.a0185b04.svg"
@@ -19,7 +19,7 @@
   "entrypoints": [
     "static/js/runtime-main.9f0ba400.js",
     "static/css/2.15110fae.chunk.css",
-    "static/js/2.7baefd49.chunk.js",
-    "static/js/main.5fdf011b.chunk.js"
+    "static/js/2.016f4b29.chunk.js",
+    "static/js/main.15c32003.chunk.js"
   ]
 }

squeaknode/admin/webapp/static/build/index.html

@@ -1 +1 @@
-<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="shortcut icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"/><meta name="theme-color" content="#000000"/><link rel="manifest" href="/manifest.json"/><title>Squeak Node</title><meta name="description" content="Squeak Node is a frontend for accessing a squeak node"><meta name="keywords" content="squeak, bitcoin, lightning"><meta name="author" content="Flatlogic LLC."><link href="/static/css/2.15110fae.chunk.css" rel="stylesheet"></head><body style="font-family:Roboto,sans-serif"><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function r(r){for(var n,f,l=r[0],a=r[1],i=r[2],c=0,s=[];c<l.length;c++)f=l[c],Object.prototype.hasOwnProperty.call(o,f)&&o[f]&&s.push(o[f][0]),o[f]=0;for(n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n]);for(p&&p(r);s.length;)s.shift()();return u.push.apply(u,i||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,l=1;l<t.length;l++){var a=t[l];0!==o[a]&&(n=!1)}n&&(u.splice(r--,1),e=f(f.s=t[0]))}return e}var n={},o={1:0},u=[];function f(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,f),t.l=!0,t.exports}f.m=e,f.c=n,f.d=function(e,r,t){f.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},f.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},f.t=function(e,r){if(1&r&&(e=f(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(f.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)f.d(t,n,function(r){return e[r]}.bind(null,n));return t},f.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return f.d(r,"a",r),r},f.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},f.p="/";var l=this["webpackJsonpsqueak-node-frontend"]=this["webpackJsonpsqueak-node-frontend"]||[],a=l.push.bind(l);l.push=r,l=l.slice();for(var i=0;i<l.length;i++)r(l[i]);var p=a;t()}([])</script><script src="/static/js/2.7baefd49.chunk.js"></script><script src="/static/js/main.5fdf011b.chunk.js"></script></body></html>
+<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="shortcut icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"/><meta name="theme-color" content="#000000"/><link rel="manifest" href="/manifest.json"/><title>Squeak Node</title><meta name="description" content="Squeak Node is a frontend for accessing a squeak node"><meta name="keywords" content="squeak, bitcoin, lightning"><meta name="author" content="Flatlogic LLC."><link href="/static/css/2.15110fae.chunk.css" rel="stylesheet"></head><body style="font-family:Roboto,sans-serif"><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function r(r){for(var n,f,l=r[0],a=r[1],i=r[2],c=0,s=[];c<l.length;c++)f=l[c],Object.prototype.hasOwnProperty.call(o,f)&&o[f]&&s.push(o[f][0]),o[f]=0;for(n in a)Object.prototype.hasOwnProperty.call(a,n)&&(e[n]=a[n]);for(p&&p(r);s.length;)s.shift()();return u.push.apply(u,i||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,l=1;l<t.length;l++){var a=t[l];0!==o[a]&&(n=!1)}n&&(u.splice(r--,1),e=f(f.s=t[0]))}return e}var n={},o={1:0},u=[];function f(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,f),t.l=!0,t.exports}f.m=e,f.c=n,f.d=function(e,r,t){f.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},f.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},f.t=function(e,r){if(1&r&&(e=f(e)),8&r)return e;if(4&r&&"object"==typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(f.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)f.d(t,n,function(r){return e[r]}.bind(null,n));return t},f.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return f.d(r,"a",r),r},f.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},f.p="/";var l=this["webpackJsonpsqueak-node-frontend"]=this["webpackJsonpsqueak-node-frontend"]||[],a=l.push.bind(l);l.push=r,l=l.slice();for(var i=0;i<l.length;i++)r(l[i]);var p=a;t()}([])</script><script src="/static/js/2.016f4b29.chunk.js"></script><script src="/static/js/main.15c32003.chunk.js"></script></body></html>

squeaknode/admin/webapp/static/build/precache-manifest.da0e08df1b0b57c88f6400e952e1f501.js

@@ -1,23 +1,23 @@
 self.__precacheManifest = (self.__precacheManifest || []).concat([
   {
-    "revision": "dbe5da45bdf13a29c60e766041d7fe13",
+    "revision": "51fc4f578938a15d7b3b88b5c988d1ac",
     "url": "/index.html"
   },
   {
-    "revision": "c9d27b949e8dea77fab9",
+    "revision": "750cdaac9c114827f73d",
     "url": "/static/css/2.15110fae.chunk.css"
   },
   {
-    "revision": "c9d27b949e8dea77fab9",
-    "url": "/static/js/2.7baefd49.chunk.js"
+    "revision": "750cdaac9c114827f73d",
+    "url": "/static/js/2.016f4b29.chunk.js"
   },
   {
     "revision": "7156b2c9571000777b9be03b3c6006ee",
-    "url": "/static/js/2.7baefd49.chunk.js.LICENSE.txt"
+    "url": "/static/js/2.016f4b29.chunk.js.LICENSE.txt"
   },
   {
-    "revision": "7fefd2d0688ee3174bbc",
-    "url": "/static/js/main.5fdf011b.chunk.js"
+    "revision": "d72cab0a91b17facba0a",
+    "url": "/static/js/main.15c32003.chunk.js"
   },
   {
     "revision": "cc9816de5a8639d377ea",

squeaknode/admin/webapp/static/build/service-worker.js

@@ -14,7 +14,7 @@
 importScripts("https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js");
 
 importScripts(
-  "/precache-manifest.d4bb68409c9a68116903f30c450af8dc.js"
+  "/precache-manifest.da0e08df1b0b57c88f6400e952e1f501.js"
 );
 
 self.addEventListener('message', (event) => {