feat: move status to footer and clean up home page

This commit is contained in:
syntaxbullet
2026-01-07 13:21:36 +01:00
parent 292991c605
commit ff23f22337
4 changed files with 58 additions and 11 deletions

View File

@@ -7,7 +7,10 @@ describe("Web Router", () => {
const res = await router(req);
expect(res.status).toBe(200);
expect(res.headers.get("Content-Type")).toBe("text/html");
expect(await res.text()).toContain("Aurora Web");
const text = await res.text();
expect(text).toContain("Aurora Web");
expect(text).toContain("Uptime:");
expect(text).toContain('id="uptime-display"');
});
it("should return health check on /health", async () => {

View File

@@ -1,20 +1,11 @@
import { BaseLayout } from "../views/layout";
import { formatUptime } from "../utils/format";
export function homeRoute(): Response {
const uptime = formatUptime(process.uptime());
const startTimestamp = Date.now() - (process.uptime() * 1000);
const content = `
<div class="card">
<h2>Welcome</h2>
<p>The Aurora web server is up and running!</p>
</div>
<div class="card">
<h3>Status</h3>
<p>System operational.</p>
<p><strong>Uptime:</strong> <span id="uptime-display" data-start-timestamp="${Math.floor(startTimestamp)}">${uptime}</span></p>
</div>
`;
const html = BaseLayout({ title: "Home", content });

View File

@@ -1,4 +1,5 @@
import { escapeHtml } from "../utils/html";
import { formatUptime } from "../utils/format";
interface LayoutProps {
title: string;
@@ -7,6 +8,12 @@ interface LayoutProps {
export function BaseLayout({ title, content }: LayoutProps): string {
const safeTitle = escapeHtml(title);
// Calculate uptime for the footer
const uptimeSeconds = process.uptime();
const startTimestamp = Date.now() - (uptimeSeconds * 1000);
const initialUptimeString = formatUptime(uptimeSeconds);
return `<!DOCTYPE html>
<html lang="en">
<head>
@@ -30,7 +37,15 @@ export function BaseLayout({ title, content }: LayoutProps): string {
${content}
</main>
<footer>
<p>&copy; ${new Date().getFullYear()} Aurora Bot</p>
<div class="footer-content">
<p>&copy; ${new Date().getFullYear()} Aurora Bot</p>
<div class="footer-status">
<span class="status-indicator online">●</span>
<span>System Operational</span>
<span class="separator">|</span>
<span>Uptime: <span id="uptime-display" data-start-timestamp="${Math.floor(startTimestamp)}">${initialUptimeString}</span></span>
</div>
</div>
</footer>
<script src="/script.js" defer></script>
</body>