95d5700
@@ -55,6 +55,12 @@
import { repoAsks } from "./asks.ts";
import { appPanels } from "./previews.ts";
import { noCrewLine, servingHistory, type WordCtx } from "./words.ts";
import { crewKeyNote } from "./crew.ts";
import {
  notePhase,
  takeSessionTime,
  timePhase,
  timePhaseAsync,
} from "../../core/route_timing.ts";
import { noteAppOpened } from "../../core/next-steps.ts";
/**
@@ -213,6 +219,8 @@
export async function studioApp(
  record: AppRecord,
): Promise<Response> {
  const db = ctx.app.db;
  const req = ctx.request;
  notePhase(req, "session", takeSessionTime(req));
  const base = repoBase(repo);
  // Money, the crew roster, autonomy limits and the decision ledger are the
  // owner's facts, not the app's — a viewer who cannot write here reads this
@@ -223,7 +231,9 @@
export async function studioApp(
  // the app IS the step, and a beacon would miss a person without
  // JavaScript. It is one user_setting row, written once, only on a spawned
  // forge, only for its owner, and changes nothing anyone else sees.
  await noteAppOpened(ctx.app, ctx.auth.user);
  await timePhaseAsync(req, "opened", () =>
    noteAppOpened(ctx.app, ctx.auth.user),
  );
  const wordCtx: WordCtx = {
    db,
    dir: repoDir(ctx.app.reposRoot, repo.ownerName, repo.name),
@@ -232,27 +242,33 @@
export async function studioApp(
    history: servingHistory(),
    viewer: ctx.auth.user,
  };
  const crew = listCrewRoles(db, repo.id);
  const crew = timePhase(req, "crew", () => listCrewRoles(db, repo.id));
  const builders = crew.filter((c) => c.role === "builder").map((c) => c.agent);
  const openPulls = listPulls(db, repo.id, {
    state: "open",
    limit: 10,
    ...sealedScope(db, repo, ctx.auth.user),
  });
  const openPulls = timePhase(req, "pulls", () =>
    listPulls(db, repo.id, {
      state: "open",
      limit: 10,
      ...sealedScope(db, repo, ctx.auth.user),
    }),
  );
  const week = new Date(Date.now() - 7 * 24 * 60 * 60_000).toISOString();
  // What landed this week, counted by the database like the runs and the
  // spend below — a page of closed pulls would stop at a hundred and the
  // cost per shipped change would read high off the short count.
  const shipped = mergedPullCount(db, repo.id, week);
  const shipped = timePhase(req, "shipped", () =>
    mergedPullCount(db, repo.id, week),
  );
  // The rest is spend, worked out only for a viewer who is going to see it —
  // counted by the database over the whole week, not off a page of rows.
  const weekTotals = ownerFacts
    ? agentRunTotals(db, repo.id, week)
    ? timePhase(req, "spend", () => agentRunTotals(db, repo.id, week))
    : { runs: 0, spentUsd: 0 };
  const spent = weekTotals.spentUsd;
  const ledgerWeek = ownerFacts ? decisionStats(db, repo.id, week) : [];
  const ledgerWeek = ownerFacts
    ? timePhase(req, "decisions", () => decisionStats(db, repo.id, week))
    : [];
  const weekLatency = ownerFacts
    ? previewLatency(db, repo.id, week)
    ? timePhase(req, "latency", () => previewLatency(db, repo.id, week))
    : undefined;
  // Whether there is any history at all — ever, not this week's — so a
  // fresh app reads as "nothing yet" rather than a stretch of zeros and a
@@ -261,24 +277,23 @@
export async function studioApp(
  // gets the quieter line. Deploys are not part of this: they happen on
  // their own the moment an app exists, so they say nothing about whether
  // anyone has done anything yet.
  const everShipped = shipped > 0 || mergedPullCount(db, repo.id, EPOCH) > 0;
  const everRuns = ownerFacts
    ? weekTotals.runs > 0 || agentRunTotals(db, repo.id, EPOCH).runs > 0
    : false;
  const hasHistory = everShipped || everRuns;
  const hasHistory = timePhase(req, "history", () => {
    const everShipped = shipped > 0 || mergedPullCount(db, repo.id, EPOCH) > 0;
    const everRuns = ownerFacts
      ? weekTotals.runs > 0 || agentRunTotals(db, repo.id, EPOCH).runs > 0
      : false;
    return everShipped || everRuns;
  });
  const autonomy =
    !ownerFacts || repo.autonomy === "off"
      ? undefined
      : autonomyStatus(ctx.app, repo);
      : timePhase(req, "autonomy", () => autonomyStatus(ctx.app, repo));
  // ---- the app itself ----
  // `deployTailing` says the head card is tailing production's own deploy —
  // the "Now" panel's empty-state words below care about that distinction.
  const { head, previews, deployTailing } = appPanels(
    ctx,
    repo,
    record,
    openPulls,
  const { head, previews, deployTailing } = timePhase(req, "panels", () =>
    appPanels(ctx, repo, record, openPulls),
  );
  // ---- the box ----
@@ -318,13 +333,15 @@
export async function studioApp(
      </form>`;
  // ---- now: one row per thing, in the five words (studio/now.ts) ----
  const { card: now } = await nowCard(ctx, repo, record, {
    openPulls,
    builderCount: builders.length,
    ownerFacts,
    wordCtx,
    deployTailing,
  });
  const { card: now } = await timePhaseAsync(req, "now", () =>
    nowCard(ctx, repo, record, {
      openPulls,
      builderCount: builders.length,
      ownerFacts,
      wordCtx,
      deployTailing,
    }),
  );
  // ---- the rail ----
  // Crew, spend and autonomy are the owner's facts; a viewer who cannot
@@ -453,7 +470,13 @@
export async function studioApp(
  // An app that follows another says so before anything else: whether it
  // is in step is the first thing its owner wants to know.
  const following = await followingOf(ctx, repo);
  const following = await timePhaseAsync(req, "following", () =>
    followingOf(ctx, repo),
  );
  const policy = await timePhaseAsync(req, "policy", () =>
    policyLine(ctx, repo, record),
  );
  const rendering = performance.now();
  const body = html`${repoHeader(ctx, repo, "app", {
      compact: true,
      ownTitle: true,
@@ -461,7 +484,7 @@
export async function studioApp(
    ${following === undefined ? "" : followingCard(ctx, repo, following)}
    <div id="app-head">${head}</div>
    ${askingLine(ctx, repo)}
    ${await policyLine(ctx, repo, record)}
    ${policy}
    ${ownerFacts ? crewKeyNote(ctx) : null}
    ${ownerFacts
      ? egressNote(
@@ -484,7 +507,7 @@
export async function studioApp(
      </aside>
    </div>
    ${liveMount({ repo: base, app: true })}`;
  return page({
  const response = page({
    ctx,
    title: `${repo.name}`,
    description: appLine({
@@ -503,4 +526,6 @@
export async function studioApp(
    body,
    scriptJs: `${liveClientJs}\n${liveRegionsJs}\n${appTailJs}`,
  });
  notePhase(req, "render", performance.now() - rendering);
  return response;
}
@@ -0,0 +1,80 @@
/** `/:owner/:name/app` names session, each read and render in Server-Timing (#3631). */
import { afterAll, beforeAll, expect, test } from "bun:test";
import { mkdtempSync, rmSync } from "node:fs";
import { tmpdir } from "node:os";
import { join } from "node:path";
import { enableApp } from "../src/actions/apps.ts";
import { commitToBranch, createRepo } from "../src/actions/repos.ts";
import { createApp, type App } from "../src/app.ts";
import { createUser } from "../src/core/users.ts";
import { serve, type Servers } from "../src/http/server.ts";
import { proveAll } from "./helpers/verified.ts";
import { quietLogs } from "./helpers/globals.ts";
quietLogs();
let root = "";
let app: App;
let servers: Servers;
beforeAll(async () => {
  root = mkdtempSync(join(tmpdir(), "forge-studio-app-timing-"));
  app = createApp({ dataDir: root, port: 0, forgeRepo: "alice/forge" });
  const u = await createUser(app.db, {
    origin: "seed",
    trusted: true,
    username: "alice",
    email: "[email protected]",
    password: "a-good-passphrase",
    adminIfFirst: true,
  });
  if (!u.ok) throw new Error(u.error);
  proveAll(app);
  const made = await createRepo(app, { id: u.value.id, username: "alice" } as never, { name: "vault" });
  if (!made.ok) throw new Error(String(made.error));
  const seeded = await commitToBranch(app, u.value, made.value, {
    message: "Start",
    files: [{ path: "README.md", content: "v\n" }],
  });
  if (!seeded.ok) throw new Error(JSON.stringify(seeded.error));
  const enabled = await enableApp(app, u.value, made.value, { slug: "vault" });
  if (!enabled.ok) throw new Error(String(enabled.error));
  servers = await serve(app);
});
afterAll(() => {
  servers.stop();
  app.close();
  rmSync(root, { recursive: true, force: true });
});
test("GET /:owner/:name/app names its phases", async () => {
  const signin = await fetch(`${servers.url}/signin`, {
    method: "POST",
    headers: { origin: servers.url },
    body: new URLSearchParams({ username: "alice", password: "a-good-passphrase" }),
    redirect: "manual",
  });
  const cookie = (signin.headers.get("set-cookie") ?? "").split(";")[0]!;
  const res = await fetch(`${servers.url}/alice/vault/app`, { headers: { cookie } });
  await res.text();
  expect(res.status).toBe(200);
  const parts = (res.headers.get("server-timing") ?? "").split(", ");
  for (const name of [
    "app",
    "session",
    "opened",
    "crew",
    "pulls",
    "shipped",
    "spend",
    "decisions",
    "latency",
    "history",
    "panels",
    "now",
    "following",
    "policy",
    "render",
  ])
    expect(parts.find((p) => p.startsWith(`${name};`))).toMatch(/^[a-z]+;dur=\d+\.\d$/);
});
		@@ -55,6 +55,12 @@ import { repoAsks } from "./asks.ts";
55	55	import { appPanels } from "./previews.ts";
56	56	import { noCrewLine, servingHistory, type WordCtx } from "./words.ts";
57	57	import { crewKeyNote } from "./crew.ts";
	58	import {
	59	notePhase,
	60	takeSessionTime,
	61	timePhase,
	62	timePhaseAsync,
	63	} from "../../core/route_timing.ts";
58	64	import { noteAppOpened } from "../../core/next-steps.ts";
59	65
60	66	/**
		@@ -213,6 +219,8 @@ export async function studioApp(
213	219	record: AppRecord,
214	220	): Promise<Response> {
215	221	const db = ctx.app.db;
	222	const req = ctx.request;
	223	notePhase(req, "session", takeSessionTime(req));
216	224	const base = repoBase(repo);
217	225	// Money, the crew roster, autonomy limits and the decision ledger are the
218	226	// owner's facts, not the app's — a viewer who cannot write here reads this
		@@ -223,7 +231,9 @@ export async function studioApp(
223	231	// the app IS the step, and a beacon would miss a person without
224	232	// JavaScript. It is one user_setting row, written once, only on a spawned
225	233	// forge, only for its owner, and changes nothing anyone else sees.
226		await noteAppOpened(ctx.app, ctx.auth.user);
	234	await timePhaseAsync(req, "opened", () =>
	235	noteAppOpened(ctx.app, ctx.auth.user),
	236	);
227	237	const wordCtx: WordCtx = {
228	238	db,
229	239	dir: repoDir(ctx.app.reposRoot, repo.ownerName, repo.name),
		@@ -232,27 +242,33 @@ export async function studioApp(
232	242	history: servingHistory(),
233	243	viewer: ctx.auth.user,
234	244	};
235		const crew = listCrewRoles(db, repo.id);
	245	const crew = timePhase(req, "crew", () => listCrewRoles(db, repo.id));
236	246	const builders = crew.filter((c) => c.role === "builder").map((c) => c.agent);
237		const openPulls = listPulls(db, repo.id, {
238		state: "open",
239		limit: 10,
240		...sealedScope(db, repo, ctx.auth.user),
241		});
	247	const openPulls = timePhase(req, "pulls", () =>
	248	listPulls(db, repo.id, {
	249	state: "open",
	250	limit: 10,
	251	...sealedScope(db, repo, ctx.auth.user),
	252	}),
	253	);
242	254	const week = new Date(Date.now() - 7 * 24 * 60 * 60_000).toISOString();
243	255	// What landed this week, counted by the database like the runs and the
244	256	// spend below — a page of closed pulls would stop at a hundred and the
245	257	// cost per shipped change would read high off the short count.
246		const shipped = mergedPullCount(db, repo.id, week);
	258	const shipped = timePhase(req, "shipped", () =>
	259	mergedPullCount(db, repo.id, week),
	260	);
247	261	// The rest is spend, worked out only for a viewer who is going to see it —
248	262	// counted by the database over the whole week, not off a page of rows.
249	263	const weekTotals = ownerFacts
250		? agentRunTotals(db, repo.id, week)
	264	? timePhase(req, "spend", () => agentRunTotals(db, repo.id, week))
251	265	: { runs: 0, spentUsd: 0 };
252	266	const spent = weekTotals.spentUsd;
253		const ledgerWeek = ownerFacts ? decisionStats(db, repo.id, week) : [];
	267	const ledgerWeek = ownerFacts
	268	? timePhase(req, "decisions", () => decisionStats(db, repo.id, week))
	269	: [];
254	270	const weekLatency = ownerFacts
255		? previewLatency(db, repo.id, week)
	271	? timePhase(req, "latency", () => previewLatency(db, repo.id, week))
256	272	: undefined;
257	273	// Whether there is any history at all — ever, not this week's — so a
258	274	// fresh app reads as "nothing yet" rather than a stretch of zeros and a
		@@ -261,24 +277,23 @@ export async function studioApp(
261	277	// gets the quieter line. Deploys are not part of this: they happen on
262	278	// their own the moment an app exists, so they say nothing about whether
263	279	// anyone has done anything yet.
264		const everShipped = shipped > 0 \|\| mergedPullCount(db, repo.id, EPOCH) > 0;
265		const everRuns = ownerFacts
266		? weekTotals.runs > 0 \|\| agentRunTotals(db, repo.id, EPOCH).runs > 0
267		: false;
268		const hasHistory = everShipped \|\| everRuns;
	280	const hasHistory = timePhase(req, "history", () => {
	281	const everShipped = shipped > 0 \|\| mergedPullCount(db, repo.id, EPOCH) > 0;
	282	const everRuns = ownerFacts
	283	? weekTotals.runs > 0 \|\| agentRunTotals(db, repo.id, EPOCH).runs > 0
	284	: false;
	285	return everShipped \|\| everRuns;
	286	});
269	287	const autonomy =
270	288	!ownerFacts \|\| repo.autonomy === "off"
271	289	? undefined
272		: autonomyStatus(ctx.app, repo);
	290	: timePhase(req, "autonomy", () => autonomyStatus(ctx.app, repo));
273	291
274	292	// ---- the app itself ----
275	293	// `deployTailing` says the head card is tailing production's own deploy —
276	294	// the "Now" panel's empty-state words below care about that distinction.
277		const { head, previews, deployTailing } = appPanels(
278		ctx,
279		repo,
280		record,
281		openPulls,
	295	const { head, previews, deployTailing } = timePhase(req, "panels", () =>
	296	appPanels(ctx, repo, record, openPulls),
282	297	);
283	298
284	299	// ---- the box ----
		@@ -318,13 +333,15 @@ export async function studioApp(
318	333	</form>`;
319	334
320	335	// ---- now: one row per thing, in the five words (studio/now.ts) ----
321		const { card: now } = await nowCard(ctx, repo, record, {
322		openPulls,
323		builderCount: builders.length,
324		ownerFacts,
325		wordCtx,
326		deployTailing,
327		});
	336	const { card: now } = await timePhaseAsync(req, "now", () =>
	337	nowCard(ctx, repo, record, {
	338	openPulls,
	339	builderCount: builders.length,
	340	ownerFacts,
	341	wordCtx,
	342	deployTailing,
	343	}),
	344	);
328	345
329	346	// ---- the rail ----
330	347	// Crew, spend and autonomy are the owner's facts; a viewer who cannot
		@@ -453,7 +470,13 @@ export async function studioApp(
453	470
454	471	// An app that follows another says so before anything else: whether it
455	472	// is in step is the first thing its owner wants to know.
456		const following = await followingOf(ctx, repo);
	473	const following = await timePhaseAsync(req, "following", () =>
	474	followingOf(ctx, repo),
	475	);
	476	const policy = await timePhaseAsync(req, "policy", () =>
	477	policyLine(ctx, repo, record),
	478	);
	479	const rendering = performance.now();
457	480	const body = html`${repoHeader(ctx, repo, "app", {
458	481	compact: true,
459	482	ownTitle: true,
		@@ -461,7 +484,7 @@ export async function studioApp(
461	484	${following === undefined ? "" : followingCard(ctx, repo, following)}
462	485	<div id="app-head">${head}</div>
463	486	${askingLine(ctx, repo)}
464		${await policyLine(ctx, repo, record)}
	487	${policy}
465	488	${ownerFacts ? crewKeyNote(ctx) : null}
466	489	${ownerFacts
467	490	? egressNote(
		@@ -484,7 +507,7 @@ export async function studioApp(
484	507	</aside>
485	508	</div>
486	509	${liveMount({ repo: base, app: true })}`;
487		return page({
	510	const response = page({
488	511	ctx,
489	512	title: `${repo.name}`,
490	513	description: appLine({
		@@ -503,4 +526,6 @@ export async function studioApp(
503	526	body,
504	527	scriptJs: `${liveClientJs}\n${liveRegionsJs}\n${appTailJs}`,
505	528	});
	529	notePhase(req, "render", performance.now() - rendering);
	530	return response;
506	531	}
		@@ -0,0 +1,80 @@
	1	/** `/:owner/:name/app` names session, each read and render in Server-Timing (#3631). */
	2	import { afterAll, beforeAll, expect, test } from "bun:test";
	3	import { mkdtempSync, rmSync } from "node:fs";
	4	import { tmpdir } from "node:os";
	5	import { join } from "node:path";
	6	import { enableApp } from "../src/actions/apps.ts";
	7	import { commitToBranch, createRepo } from "../src/actions/repos.ts";
	8	import { createApp, type App } from "../src/app.ts";
	9	import { createUser } from "../src/core/users.ts";
	10	import { serve, type Servers } from "../src/http/server.ts";
	11	import { proveAll } from "./helpers/verified.ts";
	12	import { quietLogs } from "./helpers/globals.ts";
	13
	14	quietLogs();
	15
	16	let root = "";
	17	let app: App;
	18	let servers: Servers;
	19
	20	beforeAll(async () => {
	21	root = mkdtempSync(join(tmpdir(), "forge-studio-app-timing-"));
	22	app = createApp({ dataDir: root, port: 0, forgeRepo: "alice/forge" });
	23	const u = await createUser(app.db, {
	24	origin: "seed",
	25	trusted: true,
	26	username: "alice",
	27	email: "[email protected]",
	28	password: "a-good-passphrase",
	29	adminIfFirst: true,
	30	});
	31	if (!u.ok) throw new Error(u.error);
	32	proveAll(app);
	33	const made = await createRepo(app, { id: u.value.id, username: "alice" } as never, { name: "vault" });
	34	if (!made.ok) throw new Error(String(made.error));
	35	const seeded = await commitToBranch(app, u.value, made.value, {
	36	message: "Start",
	37	files: [{ path: "README.md", content: "v\n" }],
	38	});
	39	if (!seeded.ok) throw new Error(JSON.stringify(seeded.error));
	40	const enabled = await enableApp(app, u.value, made.value, { slug: "vault" });
	41	if (!enabled.ok) throw new Error(String(enabled.error));
	42	servers = await serve(app);
	43	});
	44	afterAll(() => {
	45	servers.stop();
	46	app.close();
	47	rmSync(root, { recursive: true, force: true });
	48	});
	49
	50	test("GET /:owner/:name/app names its phases", async () => {
	51	const signin = await fetch(`${servers.url}/signin`, {
	52	method: "POST",
	53	headers: { origin: servers.url },
	54	body: new URLSearchParams({ username: "alice", password: "a-good-passphrase" }),
	55	redirect: "manual",
	56	});
	57	const cookie = (signin.headers.get("set-cookie") ?? "").split(";")[0]!;
	58	const res = await fetch(`${servers.url}/alice/vault/app`, { headers: { cookie } });
	59	await res.text();
	60	expect(res.status).toBe(200);
	61	const parts = (res.headers.get("server-timing") ?? "").split(", ");
	62	for (const name of [
	63	"app",
	64	"session",
	65	"opened",
	66	"crew",
	67	"pulls",
	68	"shipped",
	69	"spend",
	70	"decisions",
	71	"latency",
	72	"history",
	73	"panels",
	74	"now",
	75	"following",
	76	"policy",
	77	"render",
	78	])
	79	expect(parts.find((p) => p.startsWith(`${name};`))).toMatch(/^[a-z]+;dur=\d+\.\d$/);
	80	});