Add makesqueak page (#117)

* Add makesqueak page

* Return None when squeak is not found in database

frontend/react-material-admin/src/components/Layout/Layout.js

@@ -19,6 +19,7 @@ import Dashboard from "../../pages/dashboard";
 import SqueakAddress from "../../pages/squeakaddress";
 import Profile from "../../pages/profile";
 import CreateSigningProfile from "../../pages/createsigningprofile";
+import MakeSqueak from "../../pages/makesqueak";
 import Notifications from "../../pages/notifications";
 import Maps from "../../pages/maps";
 import Profiles from "../../pages/profiles";
@@ -51,6 +52,7 @@ function Layout(props) {
               <Route path="/app/profile/:id" component={Profile} />
               <Route path="/app/createsigningprofile" component={CreateSigningProfile} />
               <Route path="/app/profiles" component={Profiles} />
+              <Route path="/app/makesqueak" component={MakeSqueak} />
               <Route path="/app/notifications" component={Notifications} />
               <Route
                 exact

frontend/react-material-admin/src/pages/makesqueak/MakeSqueak.js

@@ -0,0 +1,93 @@
+import React, {useState, useEffect} from 'react';
+import {useHistory, useParams } from 'react-router-dom';
+import {Grid, TextField, Button, Typography, Paper} from "@material-ui/core";
+
+// styles
+import useStyles from "./styles";
+
+// components
+import PageTitle from "../../components/PageTitle";
+import Widget from "../../components/Widget";
+// import { Typography } from "../../components/Wrappers";
+
+import {MakeSqueakRequest, GetSigningProfilesRequest} from "../../proto/squeak_admin_pb"
+import {SqueakAdminClient} from "../../proto/squeak_admin_grpc_web_pb"
+
+var client = new SqueakAdminClient('http://' + window.location.hostname + ':8080')
+
+export default function MakeSqueakPage() {
+  const [profileId, setProfileId] = useState(-1);
+  const [content, setContent] = useState('');
+  const [signingProfiles, setSigningProfiles] = useState([]);
+  const { replyto } = useParams();
+
+  var classes = useStyles();
+  const history = useHistory();
+
+  const goToSqueakPage = (squeakHash) => {
+    history.push("/app/squeak/" + squeakHash);
+  };
+
+  function handleSubmit(event) {
+    event.preventDefault();
+    console.log( 'profileId:', profileId);
+    console.log( 'content:', content);
+    console.log( 'replyto:', replyto);
+   makeSqueak(profileId, content, replyto);
+  }
+
+  const makeSqueak = (profileId, content, replyto) => {
+    console.log("called makeSqueak");
+
+    var makeSqueakRequest = new MakeSqueakRequest()
+    makeSqueakRequest.setProfileId(profileId);
+    makeSqueakRequest.setContent(content);
+    makeSqueakRequest.setReplyto(replyto);
+    console.log(makeSqueakRequest);
+
+    client.makeSqueak(makeSqueakRequest, {}, (err, response) => {
+      console.log(response);
+      console.log(response.getHash());
+      goToSqueakPage(response.getHash());
+    });
+  };
+  const getSigningProfiles = () => {
+    console.log("called getSigningProfiles");
+    var getSigningProfilesRequest = new GetSigningProfilesRequest()
+    client.getSigningProfiles(getSigningProfilesRequest, {}, (err, response) => {
+      console.log(response);
+      console.log(response.getSqueakProfilesList());
+      setSigningProfiles(response.getSqueakProfilesList());
+    });
+  };
+
+  useEffect(() => {
+    getSigningProfiles()
+  }, []);
+
+  return (
+    <>
+     < PageTitle title = "Make Squeak" />
+
+     <div>
+      Number of signing profiles: {signingProfiles.length}
+     </div>
+
+     <Paper>
+         <form className={classes.root} onSubmit={handleSubmit} >
+             <TextField required
+                 value={content}
+                 label="Content"
+                 onInput={ e=>setContent(e.target.value)}
+             />
+             <Typography className={classes.divider} />
+             <Button
+                 type="submit"
+                 className={classes.button}
+             >
+                 Create
+             </Button>
+         </form>
+     </Paper>
+</>);
+}

frontend/react-material-admin/src/pages/makesqueak/package.json

@@ -0,0 +1,6 @@
+{
+  "name": "MakeSqueak",
+  "version": "0.0.0",
+  "main": "MakeSqueak.js",
+  "private": true
+}

frontend/react-material-admin/src/pages/makesqueak/styles.js

@@ -0,0 +1,21 @@
+import { makeStyles } from "@material-ui/styles";
+
+export default makeStyles(theme => ({
+  dashedBorder: {
+    border: "1px dashed",
+    borderColor: theme.palette.primary.main,
+    padding: theme.spacing(2),
+    paddingTop: theme.spacing(4),
+    paddingBottom: theme.spacing(4),
+    marginTop: theme.spacing(1),
+  },
+  text: {
+    marginBottom: theme.spacing(2),
+  },
+  root: {
+  '& .MuiTextField-root': {
+    margin: theme.spacing(1),
+    width: '25ch',
+  },
+},
+}));

squeakserver/server/postgres_db.py

@@ -280,6 +280,8 @@ class PostgresDb:
         return SqueakEntry(squeak=squeak, block_header=block_header)
 
     def _parse_squeak_profile(self, row):
+        if row is None:
+            return None
         private_key_column = row["private_key"]
         private_key = bytes(private_key_column) if private_key_column else None
         return SqueakProfile(
@@ -292,6 +294,8 @@ class PostgresDb:
         )
 
     def _parse_squeak_entry_with_profile(self, row):
+        if row is None:
+            return None
         squeak_entry = self._parse_squeak_entry(row)
         squeak_profile = self._parse_squeak_profile(row)
         return SqueakEntryWithProfile(