From 0aa9ef160fe3362a85a6e9b678d1b65756c8e3a0 Mon Sep 17 00:00:00 2001
From: Joris
Date: Wed, 8 Feb 2023 10:33:51 +0100
Subject: Filter on read status

---
 src/main.ts | 48 ++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 48 insertions(+)
 create mode 100644 src/main.ts

(limited to 'src/main.ts')

diff --git a/src/main.ts b/src/main.ts
new file mode 100644
index 0000000..7033690
--- /dev/null
+++ b/src/main.ts
@@ -0,0 +1,48 @@
+import { h, withVar, mount } from 'lib/rx'
+
+interface Book {
+  title: string
+  authors: Array<string>
+  authorsSort: string
+  genres: Array<string>
+  date: string
+  read: boolean
+  cover: string
+}
+
+// @ts-ignore
+const sortedBooks: Array<Book> = (books as Array<Book>).sort((a, b) =>
+  a.authorsSort == b.authorsSort
+    ? a.date > b.date
+    : a.authorsSort > b.authorsSort)
+
+enum Filter {
+  All,
+  Read,
+  Unread
+}
+
+const view = withVar(Filter.All, (filter, updateFilter) => [
+  h('aside',
+    { className: 'g-Aside' },
+    h('select',
+      { name: 'filter',
+        id: 'filter',
+        onchange: (event: Event) => updateFilter(_ => (event.target as HTMLSelectElement).value as any)
+      },
+      h('option', { value: Filter.All }, 'Tous les livres'),
+      h('option', { value: Filter.Read }, 'Livres lus'),
+      h('option', { value: Filter.Unread }, 'Livres non lus')
+    )
+  ),
+  h('main',
+    { className: 'g-Main' },
+    filter.map(f =>
+      sortedBooks
+        .filter(b => f == Filter.All || b.read == (f == Filter.Read))
+        .map(book => h('img', { className: 'g-Book', src: book.cover }))
+    )
+  )
+])
+
+mount(view)
-- 
cgit v1.2.3