feat: initial use of cache api

src/components/Library.astro

@@ -0,0 +1,30 @@
+<div id="library"></div>
+
+<script>
+  const cache = await caches.open('cozy-reader');
+  const url = new URL(window.location.href);
+  console.log('client script loaded', url);
+  const response = await cache.match(url)
+  if (response) {
+    console.log('cache hit', response);
+  } else {
+    console.log('cache miss');
+    await cache.add(url);
+  }
+
+  const cachedResponses = await cache.keys();
+  console.log(cachedResponses);
+
+  const library = document.getElementById('library');
+  const list = document.createElement('ul');
+  cachedResponses.forEach(response => {
+    const {url} = response;
+    const link = document.createElement('a');
+    link.innerText = url;
+    link.href = url;
+    const item = document.createElement('li');
+    item.appendChild(link);
+    list?.appendChild(item);
+  })
+  library?.appendChild(list);
+</script>

src/pages/index.astro

@@ -3,6 +3,7 @@ import { extract } from "@extractus/article-extractor";
 import AddressBar from "../components/AddressBar.astro";
 import Post from "../components/Post.astro";
 import Layout from "../layouts/Layout.astro";
+import Library from "../components/Library.astro";
 
 const params = Astro.url.searchParams;
 const url = params.get('url') || '';
@@ -16,8 +17,10 @@ try {
     content: "<p>The article extractor did not get any result.</p>",
   };
 }
+
 ---
 <Layout title={url !== "" ?  article?.title : "Your modern-day reading assistant"}>
   <AddressBar url={url} />
+  <Library />
   {url && <Post article={article} />}
 </Layout>