Flesh out posting

package-lock.json

@@ -1224,15 +1224,6 @@
       "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-1.1.3.tgz",
       "integrity": "sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw=="
     },
-    "@semantic-ui-react/event-stack": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/@semantic-ui-react/event-stack/-/event-stack-3.1.1.tgz",
-      "integrity": "sha512-SA7VOu/tY3OkooR++mm9voeQrJpYXjJaMHO1aFCcSouS2xhqMR9Gnz0LEGLOR0h9ueWPBKaQzKIrx3FTTJZmUQ==",
-      "requires": {
-        "exenv": "1.2.2",
-        "prop-types": "15.7.2"
-      }
-    },
     "@svgr/babel-plugin-add-jsx-attribute": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-4.2.0.tgz",
@@ -2664,7 +2655,7 @@
       "integrity": "sha512-QtULFqKIAtiyNx7NhZ/p4rB8m3xDozVo/pi5VgTlADLF2tNigz/QH+v0m5qhn7XfHT7u+607NcCNOnC0HZAlMg==",
       "requires": {
         "caniuse-lite": "1.0.30000999",
-        "electron-to-chromium": "1.3.285",
+        "electron-to-chromium": "1.3.286",
         "node-releases": "1.1.36"
       }
     },
@@ -3395,11 +3386,6 @@
         }
       }
     },
-    "classnames": {
-      "version": "2.2.6",
-      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz",
-      "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q=="
-    },
     "clean-css": {
       "version": "4.2.1",
       "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.1.tgz",
@@ -3793,15 +3779,6 @@
         "sha.js": "2.4.11"
       }
     },
-    "create-react-context": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.3.0.tgz",
-      "integrity": "sha512-dNldIoSuNSvlTJ7slIKC/ZFGKexBMBrrcc+TTe1NdmROnaASuLPvqpwj9v4XS4uXZ8+YPu0sNmShX2rXI5LNsw==",
-      "requires": {
-        "gud": "1.0.0",
-        "warning": "4.0.3"
-      }
-    },
     "cross-spawn": {
       "version": "6.0.5",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
@@ -4501,9 +4478,9 @@
       "integrity": "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
     },
     "electron-to-chromium": {
-      "version": "1.3.285",
+      "version": "1.3.286",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.285.tgz",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.286.tgz",
-      "integrity": "sha512-DYR9KW723sUbGK++DCmCmM95AbNXT4Q0tlCFMcYijFjayhuDqlGYR68OemlP8MJj0gjkwdeItIUfd0oLCgw+4A=="
+      "integrity": "sha512-gPvrdAHxCdF2IxCeGEIJdXmor32Czae8+ZLOMsk/qmGAfIgtH7BfXiaBHZHVVHz6L2ouAdR377lzPuOE5wJFZg=="
     },
     "elliptic": {
       "version": "6.5.1",
@@ -5150,11 +5127,6 @@
         "strip-eof": "1.0.0"
       }
     },
-    "exenv": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
-      "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
-    },
     "exit": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/exit/-/exit-0.1.2.tgz",
@@ -8022,11 +7994,6 @@
         "object.assign": "4.1.0"
       }
     },
-    "keyboard-key": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/keyboard-key/-/keyboard-key-1.0.4.tgz",
-      "integrity": "sha512-my04dE6BCwPpwoe4KYKfPxWiwgDYQOHrVmtzn1CfzmoEsGG/ef4oZGaXCzi1+iFhG7CN5JkOuxmei5OABY8/ag=="
-    },
     "killable": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/killable/-/killable-1.0.1.tgz",
@@ -9455,11 +9422,6 @@
         "ts-pnp": "1.1.4"
       }
     },
-    "popper.js": {
-      "version": "1.16.0",
-      "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.0.tgz",
-      "integrity": "sha512-+G+EkOPoE5S/zChTpmBSSDYmhXJ5PsW8eMhH8cP/CQHMFPBG/kC9Y5IIw6qNYgdJ+/COf0ddY2li28iHaZRSjw=="
-    },
     "portfinder": {
       "version": "1.0.25",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.25.tgz",
@@ -10612,7 +10574,7 @@
           "integrity": "sha512-9rGNDtnj+HaahxiVV38Gn8n8Lr8REKsel68v1sPFfIGEK6uSXTY3h9acgiT1dZVtOOUtifo/Dn8daDQ5dUgVsA==",
           "requires": {
             "caniuse-lite": "1.0.30000999",
-            "electron-to-chromium": "1.3.285",
+            "electron-to-chromium": "1.3.286",
             "node-releases": "1.1.36"
           }
         },
@@ -10687,19 +10649,6 @@
       "resolved": "https://registry.npmjs.org/react-mde/-/react-mde-7.6.2.tgz",
       "integrity": "sha512-czag0H588ZBs3hGrm/N35hNnMHdxfeyBKBl5auzcliY1mS7WcO/5eb2y7wlZvsLfwTdHP2QTAGqBG2AIE94qBw=="
     },
-    "react-popper": {
-      "version": "1.3.4",
-      "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-1.3.4.tgz",
-      "integrity": "sha512-9AcQB29V+WrBKk6X7p0eojd1f25/oJajVdMZkywIoAV6Ag7hzE1Mhyeup2Q1QnvFRtGQFQvtqfhlEoDAPfKAVA==",
-      "requires": {
-        "@babel/runtime": "7.6.3",
-        "create-react-context": "0.3.0",
-        "popper.js": "1.16.0",
-        "prop-types": "15.7.2",
-        "typed-styles": "0.0.7",
-        "warning": "4.0.3"
-      }
-    },
     "react-redux": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-7.1.1.tgz",
@@ -11428,22 +11377,6 @@
         "node-forge": "0.9.0"
       }
     },
-    "semantic-ui-react": {
-      "version": "0.87.3",
-      "resolved": "https://registry.npmjs.org/semantic-ui-react/-/semantic-ui-react-0.87.3.tgz",
-      "integrity": "sha512-YJgFYEheeFBMm/epZpIpWKF9glgSShdLPiY8zoUi+KJ0IKtLtbI8RbMD/ELbZkY+SO/IWbK/f/86pWt3PVvMVA==",
-      "requires": {
-        "@babel/runtime": "7.6.3",
-        "@semantic-ui-react/event-stack": "3.1.1",
-        "classnames": "2.2.6",
-        "keyboard-key": "1.0.4",
-        "lodash": "4.17.15",
-        "prop-types": "15.7.2",
-        "react-is": "16.10.2",
-        "react-popper": "1.3.4",
-        "shallowequal": "1.1.0"
-      }
-    },
     "semver": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/semver/-/semver-6.0.0.tgz",
@@ -11633,11 +11566,6 @@
         }
       }
     },
-    "shallowequal": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz",
-      "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ=="
-    },
     "shebang-command": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
@@ -12628,11 +12556,6 @@
         "mime-types": "2.1.24"
       }
     },
-    "typed-styles": {
-      "version": "0.0.7",
-      "resolved": "https://registry.npmjs.org/typed-styles/-/typed-styles-0.0.7.tgz",
-      "integrity": "sha512-pzP0PWoZUhsECYjABgCGQlRGL1n7tOHsgwYv3oIiEpJwGhFTuty/YNeduxQYzXXa3Ge5BdT6sHYIQYpl4uJ+5Q=="
-    },
     "typedarray": {
       "version": "0.0.6",
       "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
@@ -13053,14 +12976,6 @@
         "makeerror": "1.0.11"
       }
     },
-    "warning": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz",
-      "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==",
-      "requires": {
-        "loose-envify": "1.4.0"
-      }
-    },
     "watchpack": {
       "version": "1.6.0",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.0.tgz",

src/components/NewPost.js

@@ -7,11 +7,18 @@ import "react-mde/lib/styles/css/react-mde-all.css"
 const NewPost = (props) => {
   const [title, setTitle] = React.useState("");
   const [content, setContent] = React.useState("");
+  const [tags, setTags] = React.useState("");
   const [selectedTab, setSelectedTab] = React.useState("write");
+
   const submitPost = () => {
-      console.log(title)
+    const payload = {
-      console.log(content)
+      title: title,
+      content: content,
+      tags: tags,
     }
+    console.log(payload)
+  }
+
   return(
     <div className="container">
       <input
@@ -20,6 +27,7 @@ const NewPost = (props) => {
         onChange={e => setTitle(e.target.value)}
       />
 
+      <div className="markdown-body">
         <ReactMde
           value={content}
           onChange={setContent}
@@ -28,8 +36,16 @@ const NewPost = (props) => {
           generateMarkdownPreview={(markdown) =>
             Promise.resolve(<ReactMarkdown source={markdown} />)}
         />
+      </div>
+      <input
+        value={tags}
+        placeholder="Comma,Seperated,Tags..."
+        onChange={e => setTags(e.target.value)}
+      />
+      <div>
         <button onClick={submitPost}>Submit Post</button>
       </div>
+    </div>
   )
 }