SOrting and filtering of posts

_posts/blog/dev-2019-08-09-ide-to copy.md

@@ -0,0 +1,86 @@
+---
+layout: blog
+title: Ide to ? copy
+date: 2020-01-09T17:24:13.481Z
+thumbnail: /images/uploads/screenshot.gif
+rating: 4
+tags: ['dev']
+---
+
+![Photo presentation of a responzIO device ](/images/uploads/responzio.png 'responzIO device')
+
+# Invenit vaporibus in educat visa Cererem dissimiles
+
+## Mala cacumine abiere suae retia concipe
+
+[Lorem markdownum](http://negabat.org/) natantibus remeasse, et rege medentum
+innuba equorum generis. Dubitat aliis malum falsisque sororis castos; seque est
+undas validis Phrygias praemia praeceps, et igitur mutare. Heres insigne minimus
+similis: caput te prodere disceditis: quinque: an et in, accipis divitior talia?
+Per deducit ademi, _sub_ qvem orbatura Pindo te manus verbaque **tuorum nati**
+vivere, an me detectique est. Decoram erat mediaque auras.
+
+> Leti ensis mihi torquere fiducia me sunt nec prima caeli quaeras et coma
+> tinctis sibi; tua fidem aethera. Animosque ferret vultus puellari poteris
+> florilegae ignes crevisse ad pulvere recenti, luce male; neque nec!
+
+## Habitare cum nodum recipit totque fulmineos
+
+Cursu exarsit. Pondus quam vagata sorores Mulciber, in ipsa poteras uterum
+petere timebant! Parente cognataque peragunt tollens sine, umquam nomen! Quamvis
+lugendae temptatos nam: praebet non forte acer mortalis, est plura, coit,
+perfunditur haec suem: vultus. A **sacra** spumantis percipit servat!
+
+Quid animus ultima nefasque abigoque
+[nominat](http://www.dat-aula.org/iampridem.html) haec latrare **aut** misit.
+Rector et humilesque amor et adde hoc semine, init, ego.
+
+## Qua territa maturus et velat quoque et
+
+Confusa terque temptabat cinximus Iliacos inque iuro sua hunc subitis mihi
+victor inmanemque nocte insidere saevior elaborque vetat. Spectat cum fumo locus
+excutit silvarum terram ore simili plura harundine quantas ferae, Athamanas,
+praemia pariter exaestuat fecerat. Haemonio quem: _in_ sibi spectans parmam,
+tetenderat filia ait quo calcitrat at vides, cui iuvenem rerum erat. Eminus
+flammas iamque.
+
+```typescript
+var brouterVisualRecycle =
+  netmaskExbibyteMac +
+  download(twitter_serp_yobibyte, backlinkDirectBandwidth, hot)
+ldap_markup -= 811567
+icqKofficeCache = e(
+  2 + bps + 5,
+  cardComputer.addressArchitectureSystem.vdu(
+    workstation,
+    cad_icon_impression + portalIsa,
+    4
+  ),
+  cpcHashtagRing
+)
+```
+
+## Quid percussa dura auro ferentem tamen Numidasque
+
+Erat Iunonis pennis lugubris, vixque nec quo tua lacrimarum nubila nobiscum.
+Ferrum inhaeret ille; operi in Theseus contingere fateri, mirabatur, consequar
+ullis, exuit fatemur humani iustis!
+
+```
+var mpeg_reader_modifier = jfs;
+if (318464 >= association_thunderbolt_bar) {
+    copyrightMemoryWep.skinHeaderEmoticon =
+            reality_youtube.index_file_graymail.bounce(thumbnail);
+} else {
+    correction.dual += 5;
+    petabyte = task;
+    mask_malware_file(page_bar_cpc.tooltip_gigaflops(winsMailFont));
+}
+file_hypermedia.cisc_dial = 2;
+```
+
+Levi **peteret iam remota** sed, tum in bifidosque totum. Forte quaeras
+squalidus fallite, volat iudice membra inponique [iacens pabula](http://in.org/)
+celatur viva exit. Coniunx deae; dolendi, vos caro diriguit prima in posuit
+dixit foedumque carpsit. Censet infans Baccheaque mea scopulis carmine nam? Ecce
+sibi purpureum victor; aut, et et nec aequora sagitta obliquaque.

src/routes/blog/index.json.js

@@ -1,18 +1,16 @@
 import { readdir, readFile } from 'fs'
 import { promisify } from 'util'
 import { basename } from 'path'
+import { pipe, partial, prop, sortBy, reverse } from 'ramda'
 import fm from 'front-matter'
 import marked from 'marked'
 
 const { NODE_ENV } = process.env
 
 export async function get(req, res) {
+  const { tag } = req.query
   const files = await promisify(readdir)(`_posts/blog/`, 'utf-8')
-
+  const filteredFiles = filterDevelopmentFiles(files)
-  const filteredFiles =
-    NODE_ENV !== 'production'
-      ? files
-      : files.filter(file => !file.startsWith('dev-'))
 
   const contents = await Promise.all(
     filteredFiles.map(async file => {
@@ -36,10 +34,24 @@ export async function get(req, res) {
       }
     })
   )
+  const filteredContents = pipe(
+    sortBy(prop('date')),
+    reverse,
+    partial(filterByTag, [tag])
+  )(contents)
 
   res.writeHead(200, {
     'Content-Type': 'application/json',
   })
-
+  res.end(JSON.stringify(filteredContents))
-  res.end(JSON.stringify(contents))
+}
+
+function filterDevelopmentFiles(files) {
+  return NODE_ENV !== 'production'
+    ? files
+    : files.filter(file => !file.startsWith('dev-'))
+}
+
+function filterByTag(tag, contents) {
+  return tag ? contents.filter(content => content.tags.includes(tag)) : contents
 }

src/routes/blog/index.svelte

@@ -1,9 +1,15 @@
 <script context="module">
   export function preload({ params, query }) {
-    return this.fetch(`blog.json`)
+    const blogQuery = query
+      ? '?' +
+        Object.entries(query)
+          .map(q => q.join('='))
+          .join('&')
+      : ''
+    return this.fetch(`blog.json${blogQuery}`)
       .then(r => r.json())
       .then(posts => {
-        return { posts }
+        return { posts, query }
       })
   }
 </script>
@@ -12,6 +18,7 @@
   import { format } from 'date-fns'
 
   export let posts
+  export let query
 </script>
 
 <style>
@@ -54,14 +61,33 @@
   .lighten {
     color: #595a8f;
   }
+
+  .see-all {
+    text-align: end;
+    margin-top: -1.5em;
+  }
 </style>
 
 <svelte:head>
   <title>My blog @michalvankodev</title>
 </svelte:head>
 
-<h1>Recent posts</h1>
+{#if posts.length === 0}
-
+  <p class="no-posts">You've found void in the space.</p>
+{:else}
+  <h1>
+    Recent
+    {#if query.tag}
+      <em>{query.tag}</em>
+    {/if}
+    posts
+  </h1>
+  {#if query.tag}
+    <div class="see-all">
+      <a href="/blog" class="">See all posts</a>
+    </div>
+  {/if}
+{/if}
 <ul class="post-list">
   {#each posts as post}
     <!-- we're using the non-standard `rel=prefetch` attribute to