layout.ts

1import type { Database } from "bun:sqlite";2import type { Context } from "hono";3import { openMirror } from "../mirror/store.ts";4import { publicRepo, type RepoSettings, setting } from "../server/db.ts";5import { type Html, html } from "./html.ts";67export type PageContext = { domain: string; kepr: Database; mirrorDir: string };89export type PublicRepo = { settings: RepoSettings; mirror: Database };1011const HEAD_CACHE = "public, max-age=60";12// Content at a save never changes, but strip can remove it, so it is long-lived rather than immutable.13const SAVE_CACHE = "public, max-age=31536000";14const FONTS =15	"https://fonts.bunny.net/css?family=bellota:700|comfortaa:700|martian-mono:400|quicksand:400,600|sacramento:400&display=swap";1617/** The gate of §20: a private repo and an unknown one both come back null, and so both 404 alike. */18export function openPublicRepo(ctx: PageContext, name: string): PublicRepo | null {19	const settings = publicRepo(ctx.kepr, name);20	return settings ? { settings, mirror: openMirror(ctx.mirrorDir, name) } : null;21}2223export function cacheFor(c: Context, atSave: boolean): void {24	c.header("Cache-Control", atSave ? SAVE_CACHE : HEAD_CACHE);25}2627export function notFound(c: Context, ctx: PageContext): Response {28	c.header("Cache-Control", "no-store");29	const body = html`<h1 class="file-page-title">Not found</h1>30		<p class="muted">Nothing lives at this address.</p>`;31	return c.html(page(ctx, { title: "Not found", description: "", path: c.req.path, body }), 404);32}3334type PageOptions = { title: string; description: string; path: string; body: Html };3536export function page(ctx: PageContext, options: PageOptions): string {37	const site = setting(ctx.kepr, "site_name") ?? "kepr";38	const branding = setting(ctx.kepr, "branding");39	const title = `${options.title} — ${site}`;40	const url = `https://${ctx.domain}${options.path}`;41	return html`<!doctype html>42<html lang="en">43<head>44<meta charset="utf-8">45<meta name="viewport" content="width=device-width, initial-scale=1">46<title>${title}</title>47<meta name="description" content="${options.description}">48<meta property="og:site_name" content="${site}">49<meta property="og:type" content="website">50<meta property="og:url" content="${url}">51<meta property="og:title" content="${title}">52<meta property="og:description" content="${options.description}">53<meta name="twitter:card" content="summary">54<meta name="twitter:title" content="${title}">55<meta name="twitter:description" content="${options.description}">56<meta name="theme-color" content="#090706">57<link rel="canonical" href="${url}">58<link rel="preconnect" href="https://fonts.bunny.net">59<link rel="stylesheet" href="${FONTS}">60<link rel="stylesheet" href="/static/css/kepr.css">61<script src="/static/js/kepr.js" defer></script>62</head>63<body>64<nav>65<a class="wordmark" href="/" aria-label="${site}"><svg viewBox="0 0 32 32" class="wordmark-icon" aria-hidden="true"><g class="tri-outer"><polygon points="16,3 27,23 5,23"/></g><g class="tri-inner"><polygon points="16,10 22,21 10,21"/></g></svg></a>66${branding && html`<span class="wordmark-by">${branding}</span>`}67<span class="nav-links"><a href="/browse">browse</a><a href="/docs">docs</a><a href="/support">support</a></span>68</nav>69<main>70${options.body}71</main>72<footer><div class="credit">${site}</div></footer>73</body>74</html>`.value;75}7677const UNITS: [number, string][] = [78	[365 * 86400, "year"],79	[30 * 86400, "month"],80	[7 * 86400, "week"],81	[86400, "day"],82	[3600, "hour"],83	[60, "minute"],84];8586export function relativeTime(unixSeconds: number, now = Date.now() / 1000): string {87	const elapsed = now - unixSeconds;88	for (const [seconds, unit] of UNITS) {89		const n = Math.floor(elapsed / seconds);90		if (n >= 1) return `${n} ${unit}${n === 1 ? "" : "s"} ago`;91	}92	return "just now";93}9495export function formatDate(unixSeconds: number): string {96	return new Date(unixSeconds * 1000).toISOString().slice(0, 16).replace("T", " ");97}9899export function plural(n: number, noun: string): string {100	return `${n.toLocaleString("en-US")} ${noun}${n === 1 ? "" : "s"}`;101}102103export function formatSize(bytes: number): string {104	if (bytes < 1024) return `${bytes} B`;105	if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;106	return `${(bytes / 1024 / 1024).toFixed(1)} MB`;107}108109/** Percent-encodes each segment of a repo path for use in a URL. */110export function pathUrl(path: string): string {111	return path.split("/").map(encodeURIComponent).join("/");112}