sitebase / packages / web / src / routes / publication.ts

import { Hono } from "hono";
import { html } from "hono/html";
import { layout } from "../views/layouts/main";
import { requireAuth, type Session } from "../lib/session";
import { csrfField } from "../lib/csrf";
import type { AppVariables } from "../types";

export const publicationRoutes = new Hono<{ Variables: AppVariables }>();

const PUBLICATION_COLLECTION = "site.standard.publication";

// View/manage publication
publicationRoutes.get("/", async (c) => {
	let session: Session;
	try {
		session = requireAuth(c);
	} catch {
		return c.redirect("/auth/login");
	}

	try {
		// Fetch existing publication
		const response = await session.agent!.com.atproto.repo.listRecords({
			repo: session.did!,
			collection: PUBLICATION_COLLECTION,
			limit: 1,
		});

		const publication = response.data.records[0];

		if (publication) {
			const pub = publication.value as any;
			const content = html`
        <div class="publication">
          <h1>Your Publication</h1>

          <div class="pub-details">
            <h2>${pub.name}</h2>
            <p class="url">
              <a href="${pub.url}" target="_blank">${pub.url}</a>
            </p>
            ${
							pub.description
								? html`<p class="description">${pub.description}</p>`
								: ""
						}
          </div>

          <div class="actions">
            <a href="/publication/edit" class="btn btn-primary"
              >Edit Publication</a
            >
          </div>
        </div>
      `;
			return c.html(
				layout(content, { title: "Publication - sitebase", session }),
			);
		}

		// No publication exists, show create form
		return c.redirect("/publication/new");
	} catch (error) {
		console.error("Error fetching publication:", error);
		return c.redirect("/publication/new");
	}
});

// New publication form
publicationRoutes.get("/new", async (c) => {
	let session: Session;
	try {
		session = requireAuth(c);
	} catch {
		return c.redirect("/auth/login");
	}

	const csrfToken = c.get("csrfToken") as string;

	const content = html`
    <div class="form-page">
      <h1>Create Publication</h1>

      <form action="/publication/new" method="POST">
        ${csrfField(csrfToken)}
        <div class="form-group">
          <label for="name">Name *</label>
          <input type="text" id="name" name="name" required maxlength="128" />
        </div>

        <div class="form-group">
          <label for="url">URL *</label>
          <input
            type="url"
            id="url"
            name="url"
            placeholder="https://yourblog.com"
            required
          />
          <small
            >The base URL of your publication (without trailing slash)</small
          >
        </div>

        <div class="form-group">
          <label for="description">Description</label>
          <textarea
            id="description"
            name="description"
            rows="3"
            maxlength="300"
          ></textarea>
        </div>

        <button type="submit" class="btn btn-primary">
          Create Publication
        </button>
      </form>
    </div>
  `;

	return c.html(
		layout(content, { title: "New Publication - sitebase", session }),
	);
});

// Handle publication creation
publicationRoutes.post("/new", async (c) => {
	let session: Session;
	try {
		session = requireAuth(c);
	} catch {
		return c.redirect("/auth/login");
	}

	const body = await c.req.parseBody();
	const name = body.name as string;
	const url = (body.url as string).replace(/\/$/, ""); // Remove trailing slash
	const description = (body.description as string) || undefined;

	try {
		// Generate a TID for the record key
		const rkey = generateTID();

		await session.agent!.com.atproto.repo.createRecord({
			repo: session.did!,
			collection: PUBLICATION_COLLECTION,
			rkey,
			record: {
				$type: PUBLICATION_COLLECTION,
				name,
				url,
				...(description && { description }),
			},
		});

		return c.redirect("/publication");
	} catch (error) {
		console.error("Error creating publication:", error);
		return c.redirect("/publication/new?error=create_failed");
	}
});

// Edit publication form
publicationRoutes.get("/edit", async (c) => {
	let session: Session;
	try {
		session = requireAuth(c);
	} catch {
		return c.redirect("/auth/login");
	}

	try {
		const response = await session.agent!.com.atproto.repo.listRecords({
			repo: session.did!,
			collection: PUBLICATION_COLLECTION,
			limit: 1,
		});

		const publication = response.data.records[0];
		if (!publication) {
			return c.redirect("/publication/new");
		}

		const pub = publication.value as any;
		const rkey = publication.uri.split("/").pop();

		const csrfToken = c.get("csrfToken") as string;

		const content = html`
      <div class="form-page">
        <h1>Edit Publication</h1>

        <form action="/publication/edit" method="POST">
          ${csrfField(csrfToken)}
          <input type="hidden" name="rkey" value="${rkey}" />

          <div class="form-group">
            <label for="name">Name *</label>
            <input
              type="text"
              id="name"
              name="name"
              value="${pub.name}"
              required
              maxlength="128"
            />
          </div>

          <div class="form-group">
            <label for="url">URL *</label>
            <input type="url" id="url" name="url" value="${pub.url}" required />
          </div>

          <div class="form-group">
            <label for="description">Description</label>
            <textarea
              id="description"
              name="description"
              rows="3"
              maxlength="300"
            >
${pub.description || ""}</textarea
            >
          </div>

          <button type="submit" class="btn btn-primary">Save Changes</button>
          <a href="/publication" class="btn btn-secondary">Cancel</a>
        </form>
      </div>
    `;

		return c.html(
			layout(content, { title: "Edit Publication - sitebase", session }),
		);
	} catch (error) {
		console.error("Error fetching publication:", error);
		return c.redirect("/publication");
	}
});

// Handle publication update
publicationRoutes.post("/edit", async (c) => {
	let session: Session;
	try {
		session = requireAuth(c);
	} catch {
		return c.redirect("/auth/login");
	}

	const body = await c.req.parseBody();
	const rkey = body.rkey as string;
	const name = body.name as string;
	const url = (body.url as string).replace(/\/$/, "");
	const description = (body.description as string) || undefined;

	try {
		await session.agent!.com.atproto.repo.putRecord({
			repo: session.did!,
			collection: PUBLICATION_COLLECTION,
			rkey,
			record: {
				$type: PUBLICATION_COLLECTION,
				name,
				url,
				...(description && { description }),
			},
		});

		return c.redirect("/publication");
	} catch (error) {
		console.error("Error updating publication:", error);
		return c.redirect("/publication/edit?error=update_failed");
	}
});

// Generate a TID (timestamp-based ID)
function generateTID(): string {
	const now = Date.now() * 1000; // microseconds
	const clockId = Math.floor(Math.random() * 1024);
	const tid = (BigInt(now) << 10n) | BigInt(clockId);
	return tid.toString(36).padStart(13, "0");
}