fixed story retrieval

server/api/blockchain.js

@@ -15,7 +15,7 @@ router.get('/', async (req, res, next) => {
 router.get('/:hash', async (req, res, next) => {
   try {
     const hash = await Blockchain.findOne({
-      where: { hashedStory: req.params.hashedStory },
+      where: { hashedStory: req.params.hash },
     })
 
     res.status(201).json(hash)

server/api/stories.js

@@ -12,11 +12,11 @@ router.post('/', async (req, res, next) => {
   }
 })
 
-router.post('/read', async (req, res, next) => {
+router.get('/:hash', async (req, res, next) => {
   try {
-    const story = await Story.find({
+    const story = await Story.findOne({
       where: {
-        hash: req.body.hash,
+        hashedStory: req.params.hash,
       },
     })
 

src/App.js

@@ -32,6 +32,7 @@ class App extends React.Component {
     this.state = initialState
     this.navigate = this.navigate.bind(this)
     this.submitStory = this.submitStory.bind(this)
+    this.fetchStory = this.fetchStory.bind(this)
   }
 
   componentWillMount() {
@@ -75,17 +76,16 @@ class App extends React.Component {
     }
   }
 
-  async fetchStory(encryptionKey, hash) {
+  async fetchStory(submittedData) {
+    const { encryptionKey, hash } = submittedData
     try {
-      const retrievedStory = await axios.get(`/api/stories/${hash}`)
-
-      const decryptedStory = decryptString(
-        retrievedStory.encryptedStory,
-        encryptionKey
-      )
-      return this.setState({ decryptedStory })
+      const { data } = await axios.get(API + `/api/stories/${hash}`)
+      console.log(data)
+      const decryptedStory = decryptString(data.encryptedStory, encryptionKey)
+      this.setState({ decryptedStory })
     } catch (e) {
-      return this.setState({ retrievalError: 'Story not found' })
+      console.log(e)
+      this.setState({ retrievalError: 'Story not found.' })
     }
   }
 

src/components/CreateStory/CreateStoryForm.js

@@ -17,7 +17,6 @@ class StoryForm extends React.Component {
   }
 
   handleChange(e) {
-    console.log(this.state)
     this.setState({ [e.target.name]: e.target.value })
   }
 

src/components/RetrieveStory/ReadStoryView.js

@@ -4,7 +4,7 @@ const ReadStoryView = props => {
   return (
     <div>
       <h3> {props.eventDate}</h3>
-      <p>{props.eventDetails}</p>
+      <p>{props.decryptedStory}</p>
     </div>
   )
 }

src/components/RetrieveStory/RetrieveStoryForm.js

@@ -3,7 +3,7 @@ import React from 'react'
 //----------------------------------------------//
 
 const initialState = {
-  password: '',
+  encryptionKey: '',
   hash: '',
 }
 
@@ -21,15 +21,7 @@ class RetrieveStoryForm extends React.Component {
 
   handleSubmit(e) {
     e.preventDefault()
-    try {
-      const encryptedStory = this.props.fetchStory(
-        this.state.password,
-        this.state.hash
-      )
-      this.props.navigate('read')
-    } catch (e) {
-      console.log(e)
-    }
+    this.props.fetchStory({ ...this.state })
   }
   render() {
     return (
@@ -38,18 +30,18 @@ class RetrieveStoryForm extends React.Component {
         <p>Enter your secret key and your hash below.</p>
         <form onSubmit={this.handleSubmit}>
           <div className="form-group row">
-            <label htmlFor="password" className="col-sm-3 col-form-label">
-              Password
+            <label htmlFor="encryptionKey" className="col-sm-3 col-form-label">
+              Encryption Key:
             </label>
             <div className="col-sm-7">
               <input
                 type="text"
                 className="form-control"
-                id="password"
-                name="password"
-                placeholder="Password"
+                id="encryptionKey"
+                name="encryptionKey"
+                placeholder="Encryption Key"
                 onChange={this.handleChange}
-                value={this.state.password}
+                value={this.state.encryptionKey}
               />
             </div>
           </div>
@@ -77,6 +69,11 @@ class RetrieveStoryForm extends React.Component {
             </div>
           </div>
         </form>
+        {this.props.retrievalError ? (
+          <h5>{this.props.retrievalError}</h5>
+        ) : (
+          <div />
+        )}
       </div>
     )
   }

src/components/RetrieveStory/index.js

@@ -3,7 +3,7 @@ import ReadStoryView from './ReadStoryView'
 import RetrieveStoryForm from './RetrieveStoryForm'
 
 const ReadStory = props => {
-  if (props.retrievedStory) return <ReadStoryView {...props} />
+  if (props.decryptedStory) return <ReadStoryView {...props} />
   return <RetrieveStoryForm {...props} />
 }
 

src/encrypt/decryptString.js

@@ -1,3 +1,4 @@
+const crypto = require('crypto')
 const ALGORITHM_NAME = 'aes-128-gcm'
 const ALGORITHM_NONCE_SIZE = 12
 const ALGORITHM_TAG_SIZE = 16