finished reading page

src/components/BookReview.astro

@@ -23,9 +23,5 @@ const { Content } = await section.render();
       font-weight: bolder;
       cursor: pointer;
     }
-
-    .indent {
-      margin-left: 40px;
-    }
   }
 </style>

src/components/UnreadBook.astro

@@ -0,0 +1,37 @@
+---
+interface Props {
+  title: string;
+  author: string;
+  url: string;
+}
+
+const { title, author, url } = Astro.props;
+---
+
+
+<div class="indent">
+  <a href={url}>{title}</a>
+  <br>
+  <span>by {author}</span>
+</div>
+
+<style style="scss">
+  div {
+    padding: 0.75em 0;
+  }
+
+  a {
+    color: hsl(0, 0%, 95%);
+    font-size: 1.2em;
+    text-decoration: none;
+
+    &:hover {
+      text-decoration: underline;
+      color: hsl(0, 0%, 85%);
+    }
+  }
+
+  span {
+    color: hsl(0, 0%, 50%);
+  }
+</style>

src/content/book-review/The Elements of Computing Systems: Building a Modern Computer from First Principles.mdx

@@ -2,7 +2,3 @@
 rating: 5
 read: 2023-10-09T08:00:00
 ---
-
-hello world
-
-hooray

src/content/book-review/The Rust Programming Language, 2nd Edition.mdx

@@ -2,7 +2,3 @@
 rating: 4.5
 read: 2024-05-21T08:00:00
 ---
-
-hello world
-
-yoo

src/content/unread-books/unread-books.json

@@ -0,0 +1,56 @@
+[
+    {
+        "title": "The Art of Electronics",
+        "author": "Paul Horowitz, Winfield Hill",
+        "url": "https://www.amazon.com/Art-Electronics-Paul-Horowitz/dp/0521809266",
+        "inProgress": false
+    },
+    {
+        "title": "Existentialism Is a Humanism",
+        "author": "Jean-Paul Sartre",
+        "url": "https://www.amazon.com/Existentialism-Humanism-Jean-Paul-Sartre/dp/0300115466",
+        "inProgress": false
+    },
+    {
+        "title": "The Hitchhiker's Guide to the Galaxy",
+        "author": "Douglas Adams",
+        "url": "https://www.amazon.com/Hitchhikers-Guide-Galaxy-Illustrated-dp-0593359445/dp/0593359445",
+        "inProgress": false
+    },
+    {
+        "title": "The Art of Computer Programming",
+        "author": "Donald Knuth",
+        "url": "https://www.amazon.com/Computer-Programming-Volumes-1-4B-Boxed-dp-0137935102/dp/0137935102",
+        "inProgress": false
+    },
+    {
+        "title": "Computer Networks and Internets",
+        "author": "Douglas Comer",
+        "url": "https://www.amazon.com/Computer-Networks-Internets-Douglas-Comer/dp/0133587932",
+        "inProgress": true
+    },
+    {
+        "title": "The Subtle Art of Not Giving a F*ck: A Counterintuitive Approach to Living a Good Life",
+        "author": "Mark Manson",
+        "url": "https://www.amazon.com/Subtle-Art-Not-Giving-Counterintuitive/dp/0062457713",
+        "inProgress": true
+    },
+    {
+        "title": "The Perfectionists: How Precision Engineers Created the Modern World",
+        "author": "Simon Winchester",
+        "url": "https://www.amazon.com/Perfectionists-Precision-Engineers-Created-Modern/dp/0062652559",
+        "inProgress": false
+    },
+    {
+        "title": "The Scientist & Engineer's Guide to Digital Signal Processing",
+        "author": "Steven Smith",
+        "url": "https://www.amazon.com/Scientist-Engineers-Digital-Signal-Processing/dp/0966017633",
+        "inProgress": false
+    },
+    {
+        "title": "This Is How You Lose the Time War",
+        "author": "Amal El-Mohtar, Max Gladstone",
+        "url": "https://www.amazon.com/This-How-You-Lose-Time/dp/1534430997",
+        "inProgress": false
+    }
+]

src/pages/ctfing.astro

@@ -64,19 +64,15 @@ const CTFWriteupNames = new Set(
         allCTFs.map(({ ctfName, ctfLink }) => (
           <li>
             <a href={ctfLink}>{ctfName}</a> —
-            {(() => {
-              if (CTFWriteupNames.has(ctfName)) {
-                return (
-                  <a
-                    href={`/write-up/${ctfName.toLowerCase().replaceAll(" ", "-")}/`}
-                  >
-                    write-up
-                  </a>
-                );
-              } else {
-                return "(no write-up)";
-              }
-            })()}
+            {CTFWriteupNames.has(ctfName) ? (
+              <a
+                href={`/write-up/${ctfName.toLowerCase().replaceAll(" ", "-")}/`}
+              >
+                write-up
+              </a>
+            ) : (
+              "(no write-up)"
+            )}
           </li>
         ))
       }

src/pages/reading.astro

@@ -1,33 +1,63 @@
 ---
 import Layout from "../layouts/Layout.astro";
 import BookReview from "../components/BookReview.astro";
+import UnreadBook from "../components/UnreadBook.astro";
 import { getCollection } from "astro:content";
+import { getEntry } from "astro:content";
 import type { CollectionEntry } from "astro:content";
 
 const allBookReviews = await getCollection("book-review");
-allBookReviews.reverse();
-const yearsToReviews = new Map<number, CollectionEntry<"book-review">[]>();
+const yearsToBookReviews: [number, CollectionEntry<"book-review">[]][] = [];
 
-for (let section of allBookReviews) {
-  const year = section.data.read.getFullYear();
-  if (!yearsToReviews.has(year)) {
-    yearsToReviews.set(year, []);
+for (let bookReview of allBookReviews) {
+  let year = bookReview.data.read.getFullYear();
+  let yearToBookReviews = yearsToBookReviews.find(([y, _]) => y === year);
+  let bookReviews: CollectionEntry<"book-review">[];
+  if (yearToBookReviews) {
+    bookReviews = yearToBookReviews[1];
+  } else {
+    let i = 0;
+    while (i < yearsToBookReviews.length && yearsToBookReviews[i][0] > year) {
+      i++;
+    }
+    bookReviews = [];
+    yearsToBookReviews.splice(i, 0, [year, bookReviews]);
   }
-  const curr = yearsToReviews.get(year)!;
   let i = 0;
-  while (i < curr.length && curr[i].data.read > section.data.read) {
+  while (
+    i < bookReviews.length &&
+    bookReviews[i].data.read > bookReview.data.read
+  ) {
     i++;
   }
-  curr.splice(i, 0, section);
+  bookReviews.splice(i, 0, bookReview);
 }
+
+const { data: allUnreadBooks } = await getEntry("unread-books", "unread-books");
 ---
 
 <Layout title="Arhan's Reading Notes" sshUser="reading">
   <div id="max-width-wrapper" class="system-ui">
     <h1 class="input-mono">My reading notes & book reviews</h1>
     <hr />
+    <details>
+      <summary>Reading List</summary>
+      {
+        allUnreadBooks
+          .filter(({ inProgress }) => !inProgress)
+          .map((unreadBook) => <UnreadBook {...unreadBook} />)
+      }
+    </details>
+    <details>
+      <summary>Reading in Progress</summary>
+      {
+        allUnreadBooks
+          .filter(({ inProgress }) => inProgress)
+          .map((unreadBook) => <UnreadBook {...unreadBook} />)
+      }
+    </details>
     {
-      Array.from(yearsToReviews, ([year, bookReviews]) => (
+      yearsToBookReviews.map(([year, bookReviews]) => (
         <>
           <details>
             <summary>{year}</summary>
@@ -52,9 +82,11 @@ for (let section of allBookReviews) {
       font-weight: bolder;
       cursor: pointer;
     }
+  }
+</style>
 
-    .indent {
-      margin-left: 40px;
-    }
+<style lang="scss" is:global>
+  .indent {
+    margin-left: 40px;
   }
 </style>