Fetching gradebooks

emeraldwalk · Nov 25, 2023 · a7da432 · a7da432
1 parent 4ea91ac
commit a7da432
Show file tree

Hide file tree

Showing 11 changed files with 76 additions and 22 deletions.
diff --git a/gradegrid/astro.config.mjs b/gradegrid/astro.config.mjs
@@ -10,4 +10,7 @@ export default defineConfig({
   adapter: node({
     mode: 'standalone',
   }),
+  redirects: {
+    '/': '/gradebooks',
+  },
 })
diff --git a/gradegrid/src/components/GradeBookDetail.tsx b/gradegrid/src/components/GradeBookDetail.tsx
@@ -0,0 +1,11 @@
+import { createResource } from 'solid-js'
+import { getGradeBook } from '../utils'
+
+export interface GradeBookDetailProps {
+  id: string
+}
+
+export function GradeBookDetail({ id }: GradeBookDetailProps) {
+  const [data] = createResource(id, getGradeBook)
+  return <div>{data()?.name}</div>
+}
diff --git a/gradegrid/src/components/GradeBookList.tsx b/gradegrid/src/components/GradeBookList.tsx
@@ -10,7 +10,13 @@ export const GradeBookList = lazy(async () => {
         <div>
           <ul>
             Gradebooks
-            <For each={gradeBookList}>{({ name }) => <li>{name}</li>}</For>
+            <For each={gradeBookList}>
+              {({ id, name }) => (
+                <li>
+                  <a href={`/gradebooks/${id}`}>{name}</a>
+                </li>
+              )}
+            </For>
           </ul>
         </div>
       )

diff --git a/gradegrid/src/components/index.ts b/gradegrid/src/components/index.ts
@@ -1 +1,2 @@
+export * from './GradeBookDetail'
 export * from './GradeBookList'
diff --git a/gradegrid/src/config.ts b/gradegrid/src/config.ts
@@ -1 +1,2 @@
 export const SESSION_COOKIE_KEY = 'session'
+export const SESSION_COOKIE_EXP_KEY = 'session-exp'
diff --git a/gradegrid/src/layouts/Layout.astro b/gradegrid/src/layouts/Layout.astro
@@ -22,8 +22,9 @@ const { title } = Astro.props
     <title>{title}</title>
   </head>
   <body>
-    <a href="/login">Login</a>
     <a href="/gradebooks">Gradebooks</a>
+    <a href="/signin">Sign In</a>
+    <a href="/signout">Sign Out</a>
     <slot />
   </body>
 </html>

diff --git a/gradegrid/src/pages/gradebooks.astro b/gradegrid/src/pages/gradebooks.astro
@@ -1,17 +1,6 @@
 ---
-export const prerender = false
-
 import Layout from '../layouts/Layout.astro'
 import { GradeBookList } from '../components'
-
-let counter = 0
-
-if (Astro.cookies.has('counter')) {
-  const cookie = Astro.cookies.get('counter')!
-  counter = cookie.number() + 1
-}
-
-Astro.cookies.set('counter', String(counter))
 ---
 
 <Layout title="Gradebooks | GradeGrid">

diff --git a/gradegrid/src/pages/gradebooks/[id].astro b/gradegrid/src/pages/gradebooks/[id].astro
@@ -0,0 +1,12 @@
+---
+import Layout from '../../layouts/Layout.astro'
+import { GradeBookDetail } from '../../components'
+
+const { id = '' } = Astro.params
+---
+
+<Layout title="Gradebook | GradeGrid">
+  <main>
+    <GradeBookDetail id={id} client:only />
+  </main>
+</Layout>
diff --git a/gradegrid/src/pages/login.astro → gradegrid/src/pages/signin.astro b/gradegrid/src/pages/login.astro → gradegrid/src/pages/signin.astro
@@ -1,7 +1,7 @@
 ---
 import PocketBase from 'pocketbase'
 import Layout from '../layouts/Layout.astro'
-import { SESSION_COOKIE_KEY } from '../config'
+import { SESSION_COOKIE_EXP_KEY, SESSION_COOKIE_KEY } from '../config'
 
 if (Astro.request.method === 'POST') {
   try {
@@ -17,26 +17,39 @@ if (Astro.request.method === 'POST') {
 
     const cookie = pb.authStore.exportToCookie()
 
-    const [, session = '', expires = ''] =
+    const [, session = '', expiresStr = ''] =
       /^pb_auth=(.*?);.*?Expires=(.*?);/.exec(decodeURIComponent(cookie)) ?? []
 
-    // console.log('cookie:', session)
-
-    Astro.cookies.set(SESSION_COOKIE_KEY, session, {
+    const cookieCommon = {
       sameSite: 'strict',
       secure: true,
-      expires: new Date(expires),
-    })
+      expires: new Date(expiresStr),
+    } as const
+
+    Astro.cookies.set(SESSION_COOKIE_KEY, session, cookieCommon)
+
+    Astro.cookies.set(
+      SESSION_COOKIE_EXP_KEY,
+      String(cookieCommon.expires.valueOf()),
+      {
+        ...cookieCommon,
+        httpOnly: true,
+      },
+    )
+
+    return Astro.redirect('/')
   } catch (err) {
     console.error(err)
+    Astro.cookies.delete(SESSION_COOKIE_KEY)
+    Astro.cookies.delete(SESSION_COOKIE_EXP_KEY)
   }
 }
 ---
 
 <Layout title="Gradebooks | GradeGrid">
   <form method="POST">
     <label>Email</label>
-    <input name="email" type="email" />
+    <input name="email" type="email" autofocus />
     <label>Password</label>
     <input name="password" type="password" />
     <button>Sign In</button>

diff --git a/gradegrid/src/pages/signout.astro b/gradegrid/src/pages/signout.astro
@@ -0,0 +1,10 @@
+---
+import Layout from '../layouts/Layout.astro'
+import { SESSION_COOKIE_KEY } from '../config'
+
+Astro.cookies.delete(SESSION_COOKIE_KEY)
+---
+
+<Layout title="Gradebooks | GradeGrid">
+  <main>Signed out</main>
+</Layout>
diff --git a/gradegrid/src/utils/pb.ts b/gradegrid/src/utils/pb.ts
@@ -5,9 +5,16 @@ import { SESSION_COOKIE_KEY } from '../config'
 export function getPb(): PocketBase {
   const pb = new PocketBase('http://127.0.0.1:8090')
   pb.authStore.loadFromCookie(document.cookie, SESSION_COOKIE_KEY)
+  if (!pb.authStore.isValid) {
+    window.location.pathname = '/signin'
+  }
   return pb
 }
 
-export function listGradeBooks() {
+export function listGradeBooks(): Promise<GradeBook[]> {
   return getPb().collection('gradebooks').getFullList<GradeBook>()
 }
+
+export function getGradeBook(id: string): Promise<GradeBook> {
+  return getPb().collection('gradebooks').getOne<GradeBook>(id)
+}
Original file line number	Diff line number	Diff line change
		@@ -1 +1,2 @@
		export * from './GradeBookDetail'
		export * from './GradeBookList'
Original file line number	Diff line number	Diff line change
		@@ -1 +1,2 @@
		export const SESSION_COOKIE_KEY = 'session'
		export const SESSION_COOKIE_EXP_KEY = 'session-exp'