api

packages/cubby/src/components/Project.tsx

@@ -21,7 +21,7 @@ export function Project({ name, readme, files }: ProjectProps) {
               <ul class="file-list">
                 {files.sort().map(file => (
                   <li key={file}>
-                    <a href={`/${name}/${file}`}>{file}</a>
+                    <a href={`/p/${name}/${file}`}>{file}</a>
                     <button
                       type="button"
                       class="delete-button"

packages/cubby/src/server.tsx

@@ -19,6 +19,11 @@ const CUBBY_DIR = "./cubby"
 const app = new Hono()
 const api = new Hono()
 
+app.use('/css/*', serveStatic({ root: './public' }))
+app.use('/js/*', serveStatic({ root: './public' }))
+app.use('/src/css/*', serveStatic({ root: '.' }))
+app.use('/src/js/*', serveStatic({ root: '.' }))
+
 app.use("*", async (c, next) => {
     const start = Date.now()
     await next()
@@ -26,10 +31,14 @@ app.use("*", async (c, next) => {
     console.log(`${c.req.method} ${c.req.url} - ${c.res.status} (${end - start}ms)`)
 })
 
-app.use('/css/*', serveStatic({ root: './public' }))
-app.use('/js/*', serveStatic({ root: './public' }))
-app.use('/src/css/*', serveStatic({ root: '.' }))
-app.use('/src/js/*', serveStatic({ root: '.' }))
+// ----------------------------------------------------------------------------
+// API routes
+// ----------------------------------------------------------------------------
+
+api.get('/projects', async c => {
+    const names = await projects()
+    return c.json(names)
+})
 
 // ----------------------------------------------------------------------------
 // Web routes
@@ -41,13 +50,13 @@ app.get("/", async (c) => {
         <div>
             <h1>Projects</h1>
             <ul>
-                {names.map(name => <li key={name}><a href={`/${name}`}>{name}</a></li>)}
+                {names.map(name => <li key={name}><a href={`/p/${name}`}>{name}</a></li>)}
             </ul>
         </div>
     ))
 })
 
-app.get("/:name", async (c) => {
+app.get("/p/:name", async (c) => {
     const name = c.req.param("name").replace("..", "")
     const readme = await Bun.file(`${PROJECTS_DIR}/${name}/README.md`).text()
     const cubbyPath = join(CUBBY_DIR, `project_${name}`)
@@ -64,7 +73,7 @@ app.get("/:name", async (c) => {
     return c.html(tsx(<Project name={name} readme={readme} files={files} />))
 })
 
-app.get('/:id/:filename', async c => {
+app.get('/p/:id/:filename', async c => {
     const { id, filename } = c.req.param()
     const path = join(CUBBY_DIR, `project_${id}`, filename)
     const file = Bun.file(path)
@@ -77,7 +86,7 @@ app.get('/:id/:filename', async c => {
     })
 })
 
-app.post('/:id/upload', async c => {
+app.post('/p/:id/upload', async c => {
     const id = c.req.param('id')
 
     if (id !== basename(id))
@@ -96,14 +105,14 @@ app.post('/:id/upload', async c => {
         const filepath = join(folder, filename)
         await Bun.write(filepath, await file.arrayBuffer())
 
-        return c.redirect(`/${id}`)
+        return c.redirect(`/p/${id}`)
     } catch (err) {
         console.error('Upload error:', err)
         return c.json({ error: 'Upload failed' }, 500)
     }
 })
 
-app.delete('/:id/delete/:filename', async c => {
+app.delete('/p/:id/delete/:filename', async c => {
     const { id, filename } = c.req.param()
 
     if (id !== basename(id) || filename !== basename(filename))
@@ -119,15 +128,6 @@ app.delete('/:id/delete/:filename', async c => {
     }
 })
 
-// ----------------------------------------------------------------------------
-// API routes
-// ----------------------------------------------------------------------------
-
-api.get('/projects', async c => {
-    const names = await projects()
-    return c.json(names)
-})
-
 // ----------------------------------------------------------------------------
 // Helper functions
 // ----------------------------------------------------------------------------