From 78a054f0a159c792f48c524f68f53c75e9857777 Mon Sep 17 00:00:00 2001
From: Orion Reed <orionreedt@gmail.com>
Date: Sun, 13 Aug 2023 14:25:47 +0100
Subject: [PATCH] add titles to pages

---
 src/hooks/useTitle.ts |  7 +++++++
 src/pages/Home.tsx    |  2 ++
 src/pages/Posts.tsx   | 16 ++++++----------
 src/pages/Stream.tsx  |  5 +++++
 4 files changed, 20 insertions(+), 10 deletions(-)
 create mode 100644 src/hooks/useTitle.ts

diff --git a/src/hooks/useTitle.ts b/src/hooks/useTitle.ts
new file mode 100644
index 0000000..4449c39
--- /dev/null
+++ b/src/hooks/useTitle.ts
@@ -0,0 +1,7 @@
+import { useEffect } from 'preact/hooks'
+
+export function useTitle(title: string) {
+  useEffect(() => {
+    document.title = `${title} | Orion Reed`
+  }, [])
+}
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
index 2cf04a2..7980650 100644
--- a/src/pages/Home.tsx
+++ b/src/pages/Home.tsx
@@ -1,7 +1,9 @@
 import { Header } from '@/components/Header'
+import { useTitle } from '@/hooks/useTitle'
 import { Container, Text, Title, Anchor, Space } from '@mantine/core'
 
 export function Home() {
+  useTitle('Home')
   return (
     <>
       <Header />
diff --git a/src/pages/Posts.tsx b/src/pages/Posts.tsx
index 72e25d9..ccccc73 100644
--- a/src/pages/Posts.tsx
+++ b/src/pages/Posts.tsx
@@ -9,24 +9,19 @@ import {
   createStyles,
 } from '@mantine/core'
 import { friendlyDate, getJsonl } from '@/utils'
+import { useTitle } from '@/hooks/useTitle'
 
 const posts = await getJsonl('/posts.jsonl')
 
-type Post = {
-  slug: string
-  title: string
-  date: string
-}
-
 const useStyles = createStyles((theme) => ({
   index: {
     fontFamily: theme.fontFamilyMonospace,
-    fontSize: '0.85em',
+    fontSize: '0.75em',
     alignSelf: 'flex-end',
   },
   date: {
     fontFamily: theme.fontFamilyMonospace,
-    fontSize: '0.85em',
+    fontSize: '0.75em',
     alignSelf: 'flex-end',
   },
 }))
@@ -39,11 +34,11 @@ function PostListItem({ slug, title, date, index }) {
       <Text color="dimmed" className={classes.index}>
         {`${index}`.padStart(3, '0')}
       </Text>
-      <Anchor href={`posts/${slug}`} color={black}>
+      <Anchor href={`posts/${slug}`} td="none" color={black}>
         {title}
       </Anchor>
       <Text color="dimmed" fs="italic" className={classes.date}>
-        {friendlyDate(date, 'dd/MMM/yyyy')}
+        {friendlyDate(date, 'MMM dd')}
       </Text>
     </Group>
   )
@@ -62,6 +57,7 @@ function Frame({ children }) {
 }
 
 export function Posts() {
+  useTitle('Posts')
   return (
     <Frame>
       {posts.map((post, index, array) => {
diff --git a/src/pages/Stream.tsx b/src/pages/Stream.tsx
index e50cf3b..6afd33f 100644
--- a/src/pages/Stream.tsx
+++ b/src/pages/Stream.tsx
@@ -14,6 +14,7 @@ import Markdown from 'markdown-to-jsx'
 import MiniSearch from 'minisearch'
 import { signal } from '@preact/signals'
 import { friendlyDate, getJsonl } from '@/utils'
+import { useTitle } from '@/hooks/useTitle'
 
 const search = signal('')
 
@@ -129,8 +130,12 @@ function Search() {
 }
 
 export default function Stream() {
+  useTitle('Stream')
   const { classes } = useStyles()
   const results = !search.value ? streamItems : miniSearch.search(search.value)
+  console.log(search.value)
+  console.log(results)
+
   return (
     <>
       <Header />