fix service worker cache-control

Author: 0f-0b

.gitignore

@@ -5,4 +5,6 @@ node_modules/
 .env
 /index.html
 /404.html
+/sw.js
+/sw.js.map
 /dist/

deno.json

@@ -1,8 +1,8 @@
 {
   "imports": {
-    "@deno/cache-dir": "jsr:@deno/cache-dir@0.13.2",
-    "@deno/graph": "jsr:@deno/graph@^0.84.0",
-    "@deno/import-map": "https://deno.land/x/import_map@v0.20.1/mod.ts",
+    "@deno/cache-dir": "jsr:@deno/cache-dir@0.14.0",
+    "@deno/graph": "jsr:@deno/graph@^0.86.0",
+    "@deno/import-map": "https://deno.land/x/import_map@v0.21.0/mod.ts",
     "@std/datetime": "jsr:@std/datetime@^0.225.0",
     "@std/encoding": "jsr:@std/encoding@^1.0.0",
     "@std/fs": "jsr:@std/fs@^1.0.0",
@@ -17,16 +17,12 @@
     "zod": "https://deno.land/x/[email protected]/mod.ts"
   },
   "scopes": {
-    "https://jsr.io/@deno/cache-dir/0.13.2/": {
-      "jsr:/@deno/graph@^0.73.1/types": "jsr:@deno/graph@^0.84.0/types",
-      "jsr:@deno/graph@^0.73.1": "jsr:@deno/graph@^0.84.0"
+    "https://jsr.io/@deno/cache-dir/0.14.0/": {
+      "jsr:/@deno/graph@^0.86.0/types": "jsr:@deno/graph@^0.86.0/types",
+      "jsr:@deno/graph@^0.86.0": "jsr:@deno/graph@^0.86.0"
     }
   },
   "exclude": [
-    "404.html",
-    "index.html",
-    "generated_import_map.json",
-    "dist",
     "static"
   ],
   "lint": {

deno.lock

@@ -15,15 +15,10 @@ export type Handler<C = unknown> = (
 
 export function toFetch(handler: Handler): (req: Request) => Promise<Response> {
   return async (req) => {
-    const headersOnly = req.method === "HEAD";
-    if (headersOnly) {
+    if (req.method === "HEAD") {
       req = new Request(req, { method: "GET" });
     }
-    let res = await handler(req, null);
-    if (headersOnly) {
-      res = new Response(null, res);
-    }
-    return res;
+    return await handler(req, null);
   };
 }
 

handler.ts

@@ -1,4 +1,4 @@
-#!/usr/bin/env -S deno serve --unstable-kv --allow-import=deno.land:443,jsr.io:443 --allow-read=dist,404.html,index.html,robots.txt
+#!/usr/bin/env -S deno serve --unstable-kv --allow-import=deno.land:443,jsr.io:443 --allow-read=dist,404.html,index.html,robots.txt,sw.js,sw.js.map
 
 import { toFetch } from "./handler.ts";
 import { getHandler } from "./server.ts";

main.ts

@@ -108,7 +108,7 @@ const [js, css] = await (async () => {
     const currentCacheKey = await createCacheKey(cacheablePaths);
     await build({
       bundle: true,
-      outfile: "dist/sw.js",
+      outfile: "sw.js",
       entryPoints: ["static/sw.ts"],
       plugins: [denoCachePlugin()],
       absWorkingDir: cwd,

scripts/build.tsx

@@ -15,42 +15,50 @@ import {
 import { decodeURLPathComponents, staticFile } from "./static.ts";
 
 export function getHandler(kv: Deno.Kv): Handler {
-  return logTime(reportHttpErrors(route({
-    "/": () => staticFile("index.html"),
-    "/c/:id": () => staticFile("index.html"),
-    "/robots.txt": () => staticFile("robots.txt"),
-    "/api/*": route({
-      "/code": methods({
-        POST: parseBodyAsJson(Code, async (_, { body: code }) => {
-          const id = await putCode(kv, code);
-          return Response.json({ id }, { status: STATUS_CODE.Created });
+  return logTime(reportHttpErrors(route(
+    {
+      "/api/*": route({
+        "/code": methods({
+          POST: parseBodyAsJson(Code, async (_, { body: code }) => {
+            const id = await putCode(kv, code);
+            return Response.json({ id }, { status: STATUS_CODE.Created });
+          }),
         }),
-      }),
-      "/code/:id": methods({
-        GET: async (_, { params: { id } }) => {
-          const code = await getCode(kv, id!) ??
-            fail(new HttpError("Code not found", "NotFound"));
-          return Response.json({ code });
-        },
-      }),
-    }, () => fail(new HttpError("Not found", "NotFound"))),
-  }, async (req) => {
-    const path = decodeURLPathComponents(new URL(req.url).pathname);
-    if (path) {
-      try {
-        return await staticFile(join("dist", ...path), {
-          cacheControl: "max-age=2592000, immutable",
-        });
-      } catch (e) {
-        if (
-          !(e instanceof Deno.errors.NotFound ||
-            e instanceof Deno.errors.NotADirectory ||
-            e instanceof Deno.errors.IsADirectory)
-        ) {
-          throw e;
+        "/code/:id": methods({
+          GET: async (_, { params: { id } }) => {
+            const code = await getCode(kv, id!) ??
+              fail(new HttpError("Code not found", "NotFound"));
+            return Response.json({ code });
+          },
+        }),
+      }, () => fail(new HttpError("Not found", "NotFound"))),
+    },
+    methods({
+      GET: route({
+        "/": () => staticFile("index.html"),
+        "/c/:id": () => staticFile("index.html"),
+        "/sw.js": () => staticFile("sw.js"),
+        "/sw.js.map": () => staticFile("sw.js.map"),
+        "/robots.txt": () => staticFile("robots.txt"),
+      }, async (req) => {
+        const path = decodeURLPathComponents(new URL(req.url).pathname);
+        if (path) {
+          try {
+            return await staticFile(join("dist", ...path), {
+              cacheControl: "max-age=2592000, immutable",
+            });
+          } catch (e) {
+            if (
+              !(e instanceof Deno.errors.NotFound ||
+                e instanceof Deno.errors.NotADirectory ||
+                e instanceof Deno.errors.IsADirectory)
+            ) {
+              throw e;
+            }
+          }
         }
-      }
-    }
-    return await staticFile("404.html", { status: STATUS_CODE.NotFound });
-  })));
+        return await staticFile("404.html", { status: STATUS_CODE.NotFound });
+      }),
+    }),
+  )));
 }

server.ts

@@ -1,7 +1,7 @@
 /* @jsxImportSource react */
 
 import { lazy, type React, Suspense } from "react";
-import { Route, Routes } from "react-router-dom";
+import { Route, Routes } from "react-router";
 
 const Home = lazy(() => import("./home.tsx"));
 const Code = lazy(() => import("./code.tsx"));

static/app.tsx

@@ -1,7 +1,7 @@
 /* @jsxImportSource react */
 
 import { type React, useEffect, useState } from "react";
-import { useNavigate, useParams } from "react-router-dom";
+import { useNavigate, useParams } from "react-router";
 
 import { getCode } from "./api.ts";
 import { ErrorMessage } from "./components/error_message.tsx";

static/code.tsx

@@ -1,17 +1,17 @@
 {
   "imports": {
     "@codemirror/commands": "npm:@codemirror/[email protected]",
-    "@codemirror/language": "npm:@codemirror/[email protected].3",
+    "@codemirror/language": "npm:@codemirror/[email protected].5",
     "@codemirror/state": "npm:@codemirror/[email protected]",
-    "@codemirror/view": "npm:@codemirror/view@6.34.2",
+    "@codemirror/view": "npm:@codemirror/view@6.35.0",
     "@primer/octicons-react": "npm:@primer/[email protected]",
     "@std/assert": "jsr:@std/assert@^1.0.0",
     "clsx": "npm:[email protected]",
     "floating-point-hex-parser": "./deps/floating_point_hex_parser.ts",
     "react": "./deps/react.ts",
     "react/jsx-runtime": "./deps/react/jsx_runtime.ts",
     "react-dom/client": "./deps/react_dom/client.ts",
-    "react-router-dom": "npm:react-router[email protected]",
+    "react-router": "npm:react-router@7.0.1",
     "use-latest": "./deps/use_latest.ts"
   },
   "nodeModulesDir": "auto",