Update button styling and render additional elements on file page if authenticated

tests/integration/pages.test.ts

@@ -181,6 +181,57 @@ describe('GET /files — copy link', () => {
   });
 });
 
+describe('GET /f/:id — owner-aware header', () => {
+  let ctx: TestContext;
+  let aliceToken: string;
+  let bobToken: string;
+  let fileId: string;
+
+  beforeEach(async () => {
+    ctx = createTestApp();
+    const hash = await hashPassword('secret');
+    createUser(ctx.db, { username: 'alice', passwordHash: hash });
+    createUser(ctx.db, { username: 'bob', passwordHash: hash });
+
+    aliceToken = await loginAs(ctx.app, 'alice', 'secret');
+    bobToken = await loginAs(ctx.app, 'bob', 'secret');
+
+    const uploadRes = await ctx.app.inject({
+      method: 'POST',
+      url: '/upload',
+      cookies: { token: aliceToken },
+      ...buildMultipart({ file: { filename: 'owned.txt', contentType: 'text/plain', data: Buffer.from('data') } }),
+    });
+    const match = uploadRes.body.match(/\/f\/([^/"]+)/);
+    fileId = match?.[1] ?? '';
+  });
+  afterEach(async () => { await ctx.app.close(); ctx.cleanup(); });
+
+  it('shows nav when owner views their file', async () => {
+    const res = await ctx.app.inject({ method: 'GET', url: `/f/${fileId}`, cookies: { token: aliceToken } });
+    expect(res.statusCode).toBe(200);
+    expect(res.body).toContain('My Files');
+  });
+
+  it('shows delete button when owner views', async () => {
+    const res = await ctx.app.inject({ method: 'GET', url: `/f/${fileId}`, cookies: { token: aliceToken } });
+    expect(res.statusCode).toBe(200);
+    expect(res.body).toContain('delete');
+  });
+
+  it('no header when non-owner views', async () => {
+    const res = await ctx.app.inject({ method: 'GET', url: `/f/${fileId}`, cookies: { token: bobToken } });
+    expect(res.statusCode).toBe(200);
+    expect(res.body).not.toContain('<header');
+  });
+
+  it('no header when unauthenticated', async () => {
+    const res = await ctx.app.inject({ method: 'GET', url: `/f/${fileId}` });
+    expect(res.statusCode).toBe(200);
+    expect(res.body).not.toContain('<header');
+  });
+});
+
 describe('POST /files/:id/delete', () => {
   let ctx: TestContext;
   let token: string;