import React from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { actions } from 'redux-ghost';

import JsonTree from 'react-json-tree';

import './app.css';

const App = ({ actions, blog }) => {
  return (
    <div className="wrapper">
      <h1>Redux Ghost Blog</h1>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.</p>
      <h2>Posts</h2>
      <button onClick={actions.getPosts}>Load Posts</button>
      <button onClick={() => actions.getPost(1)}>Load Post</button>
      <button onClick={actions.getPost}>Load Post2</button>

      <h2>Tags</h2>
      <button onClick={actions.getTags}>Load Tags</button>
      <button onClick={actions.getTag}>Load Tag</button>

      <h2>Users</h2>
      <button onClick={actions.getUsers}>Load Users</button>
      <button onClick={actions.getUser}>Load User</button>

      <h2>Reset</h2>
      <button onClick={actions.reset}>Reset</button>

      <JsonTree data={blog} theme="monokai" />
    </div>
  );
}

const mapStateToProps = ({ blog }) => ({
  blog,
});

const mapDispatchToProps = (dispatch) => ({
  actions: bindActionCreators(actions, dispatch)
});

export default connect(
  mapStateToProps,
  mapDispatchToProps,
)(App);

@@ -704,68 +704,8 @@
 ton%3E
-%0A      %3Cbutton onClick=%7Bactions.getPost%7D%3ELoad Post2%3C/button%3E
 %0A%0A  
@@ -796,32 +796,38 @@
 button onClick=%7B
+() =%3E 
 actions.getTag%7D%3E
@@ -824,16 +824,19 @@
 s.getTag
+(1)
 %7D%3ELoad T
@@ -945,32 +945,38 @@
 button onClick=%7B
+() =%3E 
 actions.getUser%7D
@@ -974,16 +974,19 @@
 .getUser
+(1)
 %7D%3ELoad U

Add parameter to get single post/user/tag