store json after every generate

client/src/App.js

@@ -2,18 +2,25 @@ import React, { Component } from 'react';
 import LetterOptions from './LetterOptions';
 import Button from './Button';
 import Preview from './Preview';
-import {generatePdf} from './apiHelper';
+import LatestList from './LatestList';
+import {generatePdf, getLatest} from './apiHelper';
 
 import './App.css';
 
 class App extends Component {
+  componentDidMount() {
+    getLatest()
+      .then(latest => this.setState({latest}));
+  }
+
   render() {
     const state = this.state || {};
 
     return (
       <div className="home">
         <div>
-          <LetterOptions onChange={this._onChange.bind(this)} />
+          <LetterOptions onChange={this._onChange.bind(this)} {...state.options}/>
+          <LatestList latest={state.latest} clickHandler={this._onClickLatest.bind(this)} />
         </div>
         <div>
           <Button onClick={this._onGenerate.bind(this)} text="Backe PDF"/>
@@ -27,6 +34,10 @@ class App extends Component {
     );
   }
 
+  _onClickLatest(selectedOptions) {
+    this.setState({options: Object.assign({}, selectedOptions)});
+  }
+
   _onGenerate() {
     const state = this.state || {};
     this.setState({
@@ -34,7 +45,7 @@ class App extends Component {
       pdfError: null
     })
 
-    generatePdf(state)
+    generatePdf(state.options)
       .then((data) => {
         const {id} = data;
         this.setState({
@@ -56,7 +67,8 @@ class App extends Component {
       return;
     }
     const value = event && event.target && event.target.value;
-    this.setState({[name]: value || undefined})
+    const options = Object.assign({}, this.state.options, {[name]: value || undefined});
+    this.setState({options});
   }
 }
 

client/src/Input.js

@@ -9,6 +9,7 @@ export default function(props) {
         type="text"
         placeholder={props.placeholder}
         onChange={props.onchange.bind(null, props.name)}
+        value={props.value}
       />
     </label>
   );

client/src/LatestList.js

@@ -0,0 +1,20 @@
+import React from 'react';
+
+export default function(props) {
+  const latest = props.latest || [];
+  const latestElements = latest.map(item => {
+    const created = new Date(item.created);
+    return (
+      <li key={item.id}>
+        <a href="#" onClick={() => props.clickHandler(item)}>Brief vom {created.toLocaleString()}</a>
+      </li>
+    );
+  });
+
+  return (
+    <div>
+      <h4>Vergangene:</h4>
+      <ul>{latestElements}</ul>
+    </div>
+  );
+}

client/src/apiHelper.js

@@ -1,14 +1,23 @@
 export function generatePdf(state){
-  return fetch('/api/pdf/generate/brief', {
+    return fetch('/api/pdf/generate/brief', {
-    method: 'POST',
+        method: 'POST',
-    headers: {
+        headers: {
-      'Content-Type': 'application/json'
+            'Content-Type': 'application/json'
-    },
+        },
-    body: JSON.stringify(state)
+        body: JSON.stringify(state)
-  }).then(function(res) {
+    }).then(function(res) {
-    if (res.status !== 200) {
+        if (res.status !== 200) {
-      throw new Error(`Something went wrong (Status ${res.status}) - I do feel very sorry!`);
+            throw new Error(`Something went wrong (Status ${res.status}) - I do feel very sorry!`);
-    }
+        }
-    return res.json();
+        return res.json();
-  });
+    });
+}
+
+export function getLatest() {
+    return fetch('/api/pdf/latest').then(function(res) {
+        if (res.status !== 200) {
+            throw new Error(`Something went wrong (Status ${res.status}) - Cannot get latest`);
+        }
+        return res.json();
+    });
 }

server/index.js

@@ -3,8 +3,8 @@ const bodyParser = require('body-parser');
 const app = express();
 const templates = require('./templates');
 const renderer = require('./renderer');
-
+const store = require('./store');
-const {getPdfPath} = require('./utils');
+const { getPdfPath } = require('./utils');
 
 app.use(bodyParser.json());
 
@@ -15,6 +15,15 @@ app.post('/api/pdf/generate/:template', (req, res) => {
 
     templates.get(templateName, options)
         .then(renderer)
+        .then(id => {
+            const storeData = Object.assign({}, options, {
+                id,
+                created: new Date().toISOString()
+            });
+            return store
+                .add(storeData)
+                .then(() => id);
+        })
         .then(id => {
             res.send({id: id});
             res.end();
@@ -25,6 +34,14 @@ app.post('/api/pdf/generate/:template', (req, res) => {
         });
 });
 
+app.get('/api/pdf/latest', (req, res) => {
+    store
+        .list()
+        .then(results => res.json(results))
+        .catch(err => res.sendStatus(500).end(err));
+});
+
+
 app.options('/api/pdf/:id');
 app.get('/api/pdf/:id', (req, res) => {
     const {id} = req.params;

server/package.json

@@ -13,6 +13,8 @@
   "dependencies": {
     "body-parser": "^1.16.1",
     "express": "^4.14.1",
+    "glob": "^7.1.2",
+    "json-fs-store": "^1.0.1",
     "uuid": "^3.0.1"
   },
   "devDependencies": {

server/store.js

@@ -0,0 +1,14 @@
+const store = require('json-fs-store')('/tmp/pdfer-store/');
+const { promisify } = require('util');
+
+const list = promisify(store.list);
+const load = promisify(store.load);
+const add = promisify(store.add);
+
+module.exports = {
+    list: () => list(),
+    load: id => load(id),
+    add: item => add(item),
+}
+
+

server/utils.js

@@ -15,5 +15,5 @@ function getPdfPath(id) {
 module.exports = {
     getDirPath,
     getDocPath,
-    getPdfPath
+    getPdfPath,
 };