I have no idea what i'm doing :(

src/actions/index.js

@@ -5,7 +5,7 @@ export const fetchPosts = () => async (dispatch) => {
     dispatch({ type: 'FETCH_POSTS', payload: response.data })
 };
 
-export const fetchPost = () => async (dispatch) => {
-    const response = await sudoscientist.get('/blog');
-    dispatch({ type: 'FETCH_POSTS', payload: response.data })
+export const fetchPost = (id) => async (dispatch) => {
+    const response = await sudoscientist.get('/blog/' + id);
+    dispatch({ type: 'FETCH_POST', payload: response.data })
 };

src/components/NavBar.js

@@ -6,10 +6,12 @@ import PostList from './PostList';
 class NavBar extends Component {
   render() {
     return (
-	 <div className="ui three item menu">
-	   <Link to="/" className="active item">Home</Link>
+	 <div className="ui five item menu">
+       <img src="https://avatars1.githubusercontent.com/u/2782304" style={{width:"50px",height:"50px"}}/>
+	   <Link to="/" className="item">Home</Link>
 	   <Link to="/users/" className="item">Users</Link>
 	   <Link to="/posts/" className="item">Posts</Link>
+	   <Link to="/about/" className="item">About</Link>
 	 </div>
     );
   }

src/components/Post.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactMarkdown from 'react-markdown';
 import { connect } from 'react-redux';
-import { fetchPosts } from '../actions';
+import { fetchPost } from '../actions';
 
 class Post extends React.Component {
     componentDidMount() {

src/reducers/postsReducer.js

@@ -2,6 +2,8 @@ export default (state = [], action) => {
     switch (action.type) {
         case 'FETCH_POSTS':
             return action.payload;
+        case 'FETCH_POST':
+            return action.payload;
         default:
             return state;
     }