\n//

Comments

\n//

\n// {comments.map((comment) => (\n//

\n// {comment.text}\n// \n//

\n// ))}\n//

\n// \n//

,\n// );\n// });\n\n// app.post(\"/comment\", async (c) => {\n// const formData = await c.req.parseBody();\n// const newComment = formData.comment as string;\n\n// let comments = await blob.getJSON(\"comments\") || [];\n// comments.push({ text: newComment, id: Math.floor(Math.random() * 1000).toString() });\n// await blob.setJSON(\"comments\", comments);\n\n// return c.redirect(\"/\");\n// });\n\n// app.post(\"/comment/:id/delete\", async (c) => {\n// const id = c.req.param(\"id\");\n// let comments = await blob.getJSON(\"comments\");\n// await blob.setJSON(\"comments\", comments.filter((comment) => comment.id !== id));\n// return c.redirect(\"/\");\n// });\n\n// New route to serve images from blob storage\napp.get(\"/image/:id.png\", async (c) => {\n console.log(c.req)\n const id = c.req.param(\"id\");\n console.log({ id })\n const imageBlob = await blob.get(id);\n const known = await blob.get(\"notionDeleteTest\")\n console.log({ known })\n \n if (!imageBlob) {\n return c.text(\"Image not found\", 404);\n }\n\n return new Response(imageBlob.body, {\n headers: {\n \"Content-Type\": \"image/png\"\n }\n });\n});\n\napp.get('/:temp/:filename.png', async (c) => {\n console.log(c.req)\n // const filename = c.req.param('filename')\n // console.log({ filename })\n const checkParams = c.req.param(\"temp\")\n console.log({ checkParams })\n const filename = c.req.path.split(\"/\").at(-1).split(\".png\").at(0)\n console.log({ filename })\n // Handle the PNG file request here\n // For example, you could:\n // 1. Serve a PNG file from storage\n // 2. Generate a PNG dynamically\n // 3. Return a PNG buffer\n const known = await blob.get(filename)\n console.log({ known })\n \n // Example response:\n return c.body(known.body, {\n headers: {\n 'Content-Type': 'image/png'\n }\n })\n})\n\n// https://app.studyraid.com/en/read/11303/352712/route-parameters-and-dynamic-routing\napp.get('/:filename{.*\\\\.png}', async (c) => {\n// app.get('/:filename.png', async (c) => {\n // console.log(c.req)\n // this doesnt work as :fileName probably bc of the . \n const filename1 = c.req.param('filename')\n console.log({ filename1, withoutFiletype: filename1.split(\".\").at(0) })\n \n const filename = c.req.path.split(\"/\").at(-1).split(\".png\").at(0)\n console.log({ filename })\n // Handle the PNG file request here\n // For example, you could:\n // 1. Serve a PNG file from storage\n // 2. Generate a PNG dynamically\n // 3. Return a PNG buffer\n const known = await blob.get(filename)\n console.log({ known })\n \n // Example response:\n return c.body(known.body, {\n headers: {\n 'Content-Type': 'image/png'\n }\n })\n})\napp.get('/filename.png', async (c) => {\n const filename = c.req.param('filename')\n console.log({ filename })\n // Handle the PNG file request here\n // For example, you could:\n // 1. Serve a PNG file from storage\n // 2. Generate a PNG dynamically\n // 3. Return a PNG buffer\n const known = await blob.get(\"notionDeleteTest\")\n console.log({ known })\n \n // Example response:\n return c.body(known.body, {\n headers: {\n 'Content-Type': 'image/png'\n }\n })\n})\n\nexport default app.fetch;","deleted","label",[99],"permalink","https://www.val.town/x/airandopal/blobCommentDemo/code/main.tsx","extension","actionData","errors"]