Returning validation errors and old values to `post` form.

Made custom middleware for that purpose.

4 files changed, 33 insertions, 2 deletions

diff --git a/controllers/post.js b/controllers/post.js
index 45da525..30d0002 100644
--- a/controllers/post.js
+++ b/controllers/post.js
@@ -30,7 +30,7 @@ module.exports = {
     newPost.save()
       .then(() => res.redirect('/'))
       .catch(err => {
-        console.log(err);
+        req.setOldForm(err);
         res.redirect('/new-post');
       });
   },
diff --git a/index.js b/index.js
index 743a85e..d2e486e 100644
--- a/index.js
+++ b/index.js
@@ -7,6 +7,8 @@ const flash = require('connect-flash');
 const passport = require('passport');
 require('dotenv').config();
 
+const oldForm = require('./utils/middleware/oldForm');
+
 const webRoutes = require('./routes/web');
 
 const app = express();
@@ -42,6 +44,8 @@ require('./config/passport');
 app.use(passport.initialize());
 app.use(passport.session());
 
+app.use(oldForm);
+
 app.use('/', webRoutes);
 
 app.listen(process.env.PORT, () => console.log(`Server started on port ${process.env.PORT}.`));
diff --git a/utils/middleware/oldForm.js b/utils/middleware/oldForm.js
new file mode 100644
index 0000000..7bcfb34
--- /dev/null
+++ b/utils/middleware/oldForm.js
@@ -0,0 +1,23 @@
+module.exports = (req, res, next) => {
+
+  req.setOldForm = (errors) => {
+    let prettyErrors = {};
+    Object.keys(errors.errors).forEach(err => {
+      prettyErrors[err] = errors.errors[err].message;
+    });
+
+    req.session.oldForm = {
+      errors: prettyErrors,
+      values: req.body
+    };
+  };
+
+  if (!req.session.oldForm) req.session.oldForm = {
+    errors: null,
+    values: null
+  };
+
+  res.locals.oldForm = req.session.oldForm;
+  delete req.session.oldForm;
+  next();
+};
diff --git a/views/new-post.handlebars b/views/new-post.handlebars
index 9e42ba9..2038326 100644
--- a/views/new-post.handlebars
+++ b/views/new-post.handlebars
@@ -3,11 +3,15 @@
   <form action="/new-post" method="post" accept-charset="utf-8">
     <div class="mb-3">
       <label for="post_title" class="form-label">Post title:</label>
-      <input name="title" type="text" class="form-control" id="post_title" required>
+      <input name="title" type="text" class="form-control" id="post_title"
+        value="{{oldForm.values.title}}" required>
     </div>
     <div class="mb-3">
       <label for="post_text" class="form-label">Post text:</label>
       <textarea name="text" class="form-control" id="post_text"></textarea>
+      {{#if oldForm.errors.text}}
+        <div class="invalid-feedback d-block">{{oldForm.errors.text}}</div>
+      {{/if}}
     </div>
     <button type="submit" class="btn">Submit</button>
   </form>