@gavin-hu/my-pi-agent 0.19.0 → 0.21.0

package/extensions/plan/web-plan.ts

@@ -0,0 +1,160 @@
+/**
+ * The review page's plan renderer: the DOM a frame draws, thrown away and rebuilt.
+ *
+ * The seventh capability out of the review client's template literal, and the one with the
+ * most to read: it builds every block, its comment rail, and the cards under it, then puts
+ * the reader back where they were. Reads arrive through getters and mutations leave through
+ * callbacks, so the client keeps every variable it owns — `activeIndex`, the quote a click
+ * is waiting for, the observer — and this function holds only the shape of one frame.
+ *
+ * Two rules it owns, both about a repaint not stealing the reader's place:
+ *
+ * - focus is restored only when it was inside the plan to begin with, so a frame the stream
+ *   caused cannot pull the keyboard out of the page the reviewer is working in;
+ * - the active block's class is put back in place rather than by scrolling, so the arrow
+ *   keys resume where they were instead of jumping to the top.
+ */
+
+import type { ClientNode } from "../../lib/web/client-runtime.ts";
+import type { ComposerDeps } from "./web-composer.ts";
+import { blockElements, type IslandBlock, setActive } from "./web-blocks.ts";
+import type { SectionWatcher } from "./web-outline.ts";
+
+/** What `el` has to answer for a frame. Spliced beside it; declared for the checker. */
+type Build = (tag: string, className?: string, text?: string | null) => ClientNode;
+declare const el: Build;
+
+/** The quote a click on a block's control is waiting for: the reader's selection. */
+export interface PendingQuote {
+	wrap: ClientNode;
+	quote: string;
+}
+
+/** What a repaint reads, and the callbacks it changes the client's state through. */
+export interface PlanRenderDeps {
+	planEl: ClientNode | null;
+	outlineList: ClientNode | null;
+	/** The element that had focus before this frame, or null when nothing did. */
+	focused: ClientNode | null;
+	blocks(): readonly IslandBlock[];
+	/** Whether this block is new or edited since the previous review; absent means no marks. */
+	changed?(line: number): boolean;
+	annotations(): readonly { anchor: number }[];
+	activeIndex(): number;
+	setActiveIndex(index: number): void;
+	pendingQuote(): PendingQuote | null;
+	clearPendingQuote(): void;
+	/** Whether the review has ended, so the rail offers no new comment. */
+	settled?(): boolean;
+	/** The composer lifecycle, for the close a repaint begins with. */
+	composer(): ComposerDeps;
+	/** The block's content, from the Markdown half. */
+	renderBlock(wrap: ClientNode, block: IslandBlock): void;
+	/** The cards under one block, and the loose ones that lost their anchor. */
+	renderComments(scope: ClientNode, line: number): void;
+	renderCommentCards(scope: ClientNode, list: readonly unknown[]): void;
+	/** The text a reader selected inside a block, used as the next comment's quote. */
+	selectionIn(wrap: ClientNode): string;
+	open(wrap: ClientNode, block: IslandBlock, quote: string): void;
+	/** The facts and the header chip, repainted after the blocks. */
+	facts(): void;
+	updateState(): void;
+}
+
+/**
+ * Draw the plan, and put the reader back. Returns the section watcher it installed.
+ *
+ * The client's own zero-argument entry is `renderAll()`: it builds the frame's deps and
+ * hands them here, which is how the fragments keep calling a name that takes nothing.
+ */
+export function renderPlanFrame(
+	deps: PlanRenderDeps,
+	closePlan: () => void,
+	observe: (
+		planEl: ClientNode | null,
+		list: ClientNode | null,
+		previous: SectionWatcher | null,
+	) => SectionWatcher | null,
+	previousObserver: SectionWatcher | null,
+): SectionWatcher | null {
+	const { planEl } = deps;
+	if (!planEl) return previousObserver;
+	// Focus is only put back when it was inside this document to begin with.
+	const keepFocus = !!(deps.focused && deps.focused !== planEl && planEl.contains(deps.focused));
+	closePlan();
+	const scrollTop = planEl.scrollTop;
+	planEl.replaceChildren();
+	const anchored: Record<number, boolean> = {};
+	for (const block of deps.blocks()) {
+		if (block.kind === "blank") continue;
+		anchored[block.start] = true;
+		const wrap = el("div", "bf-block");
+		wrap.setAttribute("data-line", String(block.start));
+		wrap.setAttribute("data-kind", String(block.kind));
+		// The one mark that says "read this line again": a block the last review did not have.
+		if (deps.changed?.(block.start) === true) wrap.setAttribute("data-changed", "1");
+		if (block.kind === "heading") wrap.id = "s-" + block.start;
+		deps.renderBlock(wrap, block);
+		const mine = deps.annotations().filter((annotation) => annotation.anchor === block.start);
+		if (mine.length > 0) wrap.classList.add("bf-block--commented");
+		const rail = el("div", "bf-block__rail");
+		// A settled review takes no new comment: this control would open a composer whose
+		// note could never be saved, so it is not drawn rather than drawn and refused.
+		if (deps.settled?.() !== true) {
+			const add = el("button", "bf-block__add");
+			add.type = "button";
+			add.textContent = "+";
+			add.setAttribute("aria-label", "Comment on this block");
+			add.addEventListener("click", function () {
+				// Read at click time, not at render time: a selection made after this frame is
+				// the quote the reader means.
+				const waiting = deps.pendingQuote();
+				const quoted = waiting && waiting.wrap === wrap ? waiting.quote : deps.selectionIn(wrap);
+				deps.clearPendingQuote();
+				deps.open(wrap, block, quoted);
+			});
+			rail.appendChild(add);
+		}
+		if (mine.length > 0) {
+			const badge = el("span", "bf-block__count");
+			badge.textContent = String(mine.length);
+			badge.title = mine.length === 1 ? "1 review comment" : mine.length + " review comments";
+			rail.appendChild(badge);
+		}
+		wrap.appendChild(rail);
+		wrap.addEventListener("focusin", function () {
+			const next = setActive(planEl, blockElements(planEl).indexOf(wrap));
+			if (next !== null) deps.setActiveIndex(next);
+		});
+		planEl.appendChild(wrap);
+		deps.renderComments(planEl, block.start);
+	}
+	const orphans = deps.annotations().filter((annotation) => !anchored[annotation.anchor]);
+	if (orphans.length > 0) {
+		const box = el("div", "bf-comments bf-comments--orphans");
+		const note = el("p");
+		note.textContent = "Comments not attached to a current block";
+		box.appendChild(note);
+		deps.renderCommentCards(box, orphans);
+		planEl.appendChild(box);
+	}
+	planEl.scrollTop = scrollTop;
+	// The DOM was rebuilt, so the active block's class is gone; restore it in place rather
+	// than scrolling, so the keyboard resumes where the reviewer was.
+	const activeIndex = deps.activeIndex();
+	const active = activeIndex >= 0 ? blockElements(planEl)[activeIndex] : null;
+	if (active) active.classList.add("bf-block--active");
+	// The focused element went with the old DOM, so put the tab stop back on the block's
+	// comment control: that is where adding, editing, or deleting left it.
+	if (keepFocus && active) {
+		const stop = active.querySelector(".bf-block__add");
+		if (stop) stop.focus();
+	}
+	deps.facts();
+	const observer = observe(planEl, deps.outlineList, previousObserver);
+	deps.updateState();
+	return observer;
+}
+
+/** The block renderer as source, for the client bundle. */
+export const WEB_PLAN_JS = String(renderPlanFrame);

package/extensions/plan/web-router.ts

@@ -122,7 +122,6 @@ export async function handleReviewRequest(
 	if (!parsed) return jsonError(400, "Malformed request URL.");
 	const { pathname, search } = parsed;
 
-	if (pathname === "/favicon.ico") return { status: 204, headers: { "Cache-Control": "no-store" } };
 	if (pathname === THEME_JS_PATH) return { status: 200, headers: scriptHeaders(), body: THEME_JS };
 	if (pathname === "/client.js") return { status: 200, headers: scriptHeaders(), body: REVIEW_CLIENT_JS };
 

package/extensions/plan/web-settle.ts

@@ -0,0 +1,201 @@
+/**
+ * The review page's settlement: the four ways a review ends, and the one POST they share.
+ *
+ * The eighth capability out of the review client's template literal. Every write has the
+ * same shape — POST the annotations, read the answer, report it in the status line — and
+ * what differs is whether the review settles: the owner's save and approve finish it, a
+ * reviewer's post does not (the server keeps the review open so she can keep editing), and
+ * cancel is the owner's own decision and carries no body at all.
+ *
+ * The page owns its flags, its buttons, and its stream; this module owns the rules about
+ * them, so it reads through getters and reports changes through the callbacks it is given.
+ */
+
+/** What a settlement reads of the page, and the changes it reports. */
+export interface SettleDeps {
+	/** The path a write goes to, without its query string. */
+	token(): string;
+	/** The review's mount on the session's server, e.g. `/plan/3f9c21aa`. */
+	base(): string;
+	role(): string;
+	/** The comments this writer may write: her own when she is a reviewer, all when owner. */
+	mine(): readonly { author?: string }[];
+	annotations(): readonly { author?: string }[];
+	/** Whether the review has already ended, by any of the three routes. */
+	settled(): boolean;
+	setStatus(text: string, kind?: string): void;
+	/** The three buttons a conflict disables, and the fourth a close does. */
+	buttons(): {
+		approve: { disabled: boolean } | null;
+		save: { disabled: boolean } | null;
+		post: { disabled: boolean } | null;
+	};
+	/** The draft this tab's work lives in: cleared once the server has it. */
+	clearDraft(): void;
+	/** The page is no longer dirty: the server has everything this tab wrote. */
+	markClean(): void;
+	/** The server bound this reviewer's name to her link: adopt it. */
+	adoptName(name: string): void;
+	/** Put a reload button beside the controls: the page cannot recover on its own. */
+	offerReload(): void;
+	/** Record how the review ended, stop following it, and stop offering to change it. */
+	markSettled(kind: "saved" | "approved" | "closed"): void;
+	settleStream(): void;
+	lockActions(): void;
+	/** Repaint the header chip and the facts. */
+	updateState(): void;
+	/** Refuse to leave a half-written comment, saying why. */
+	confirmNoDraft(): boolean;
+	post(url: string, body: unknown): Promise<{ ok: boolean; status: number; body: unknown }>;
+	/** A body-less POST, for the close that carries nothing. */
+	send(url: string): Promise<unknown>;
+	/** What a body-less conflict says, when the server gave no sentence of its own. */
+	planMoved: string;
+}
+
+/** What a settlement reports back: the flag it set, and whether the page is finished. */
+export interface SettleResult {
+	outcome: "ok" | "conflict" | "failed";
+	reason?: string;
+}
+
+/**
+ * POST the annotations, and read the answer on both branches.
+ *
+ * A 409 disables the three write buttons and offers a reload, because the page's island is
+ * out of date and no retry from here can fix that; anything else surfaces the server's own
+ * sentence, which is why the body is parsed on both branches rather than only on success.
+ */
+export function submitAnnotations(
+	deps: SettleDeps,
+	url: string,
+	okText: string,
+	failText: string,
+	onOk: (() => void) | null,
+): Promise<SettleResult> {
+	const payload = deps.role() === "reviewer" ? deps.mine() : deps.annotations();
+	return deps
+		.post(url + "?token=" + encodeURIComponent(deps.token()), { annotations: payload })
+		.then((result) => {
+			if (result.ok) {
+				deps.markClean();
+				deps.clearDraft();
+				deps.setStatus(okText, "saved");
+				if (onOk) onOk();
+				deps.updateState();
+				// The server binds a reviewer's name to her link on the first post, so a
+				// second tab of the same link posts under the same name — and it may normalise
+				// what she typed (`@alice` is stored as `alice`). The comments she just posted
+				// are in the file under the bound name, so the page's copy has to say that too:
+				// otherwise they stop being hers to edit, and her next post would replace
+				// markers it never sent.
+				const body = result.body as { author?: unknown } | null;
+				if (deps.role() === "reviewer" && body && typeof body.author === "string" && body.author) {
+					for (const annotation of payload) if (annotation.author !== undefined) annotation.author = body.author;
+					deps.adoptName(body.author);
+				}
+				return { outcome: "ok" as const };
+			}
+			if (result.status === 409) {
+				const buttons = deps.buttons();
+				if (buttons.approve) buttons.approve.disabled = true;
+				if (buttons.save) buttons.save.disabled = true;
+				if (buttons.post) buttons.post.disabled = true;
+				deps.offerReload();
+				const body = result.body as { error?: unknown } | null;
+				const reason = body && typeof body.error === "string" ? body.error : deps.planMoved;
+				deps.setStatus(reason, "error");
+				return { outcome: "conflict" as const, reason };
+			}
+			const body = result.body as { error?: unknown } | null;
+			throw new Error(body && typeof body.error === "string" ? body.error : "server returned " + result.status);
+		})
+		.catch((error: { message?: string }) => {
+			const reason = failText + (error && error.message ? error.message : "");
+			deps.setStatus(reason, "error");
+			return { outcome: "failed" as const, reason };
+		});
+}
+
+/** Save the annotations and finish the review: the owner's way to close an approved plan. */
+export function saveReview(deps: SettleDeps): Promise<SettleResult> | null {
+	if (deps.settled()) return null;
+	if (deps.confirmNoDraft()) return null;
+	deps.setStatus("Saving\u2026");
+	return submitAnnotations(
+		deps,
+		deps.base() + "/api/feedback",
+		"Saved \u2014 return to Pi to continue.",
+		"Could not save: ",
+		function () {
+			deps.markSettled("saved");
+			deps.settleStream();
+			deps.lockActions();
+		},
+	);
+}
+
+/**
+ * Post a reviewer's comments and keep the review open.
+ *
+ * A reviewer's write never settles the page: the server keeps the review open so she can
+ * keep editing her own comments, and closing the stream here would strand her.
+ */
+export function postReviewComments(deps: SettleDeps): Promise<SettleResult> | null {
+	if (deps.settled()) return null;
+	if (deps.confirmNoDraft()) return null;
+	deps.setStatus("Posting\u2026");
+	return submitAnnotations(
+		deps,
+		deps.base() + "/api/comment",
+		"Comments posted \u2014 the owner sees them now.",
+		"Could not post: ",
+		null,
+	);
+}
+
+/** Approve the plan, which finishes the review. */
+export function approveReview(deps: SettleDeps): Promise<SettleResult> | null {
+	if (deps.settled()) return null;
+	deps.setStatus("Approving\u2026");
+	return submitAnnotations(
+		deps,
+		deps.base() + "/api/approve",
+		"Approved \u2014 return to Pi to continue.",
+		"Could not approve: ",
+		function () {
+			deps.markSettled("approved");
+			deps.settleStream();
+			deps.lockActions();
+		},
+	);
+}
+
+/**
+ * Close the review without saving: only the owner may, and the page says so while it asks.
+ *
+ * The close carries no body, so it is the one write that does not go through
+ * `submitAnnotations`; its answer is a status line either way, because a tab that closed the
+ * review has nothing left to do with a failure.
+ */
+export function cancelReview(deps: SettleDeps): Promise<void> | null {
+	if (deps.role() !== "owner" || deps.settled()) return null;
+	if (deps.confirmNoDraft()) return null;
+	deps.markSettled("closed");
+	deps.settleStream();
+	deps.lockActions();
+	deps.setStatus("Closing\u2026");
+	deps.updateState();
+	return deps
+		.send(deps.base() + "/api/cancel?token=" + encodeURIComponent(deps.token()))
+		.catch(function () {})
+		.then(function () {
+			deps.setStatus("Closed \u2014 return to Pi.");
+			deps.updateState();
+		});
+}
+
+/** The settlement rules as source, for the client bundle. */
+export const WEB_SETTLE_JS = [submitAnnotations, saveReview, postReviewComments, approveReview, cancelReview]
+	.map(String)
+	.join("\n\n");

package/extensions/plan/web-share-session.ts

@@ -8,31 +8,25 @@
  * hooks, and the frame hooks, so it never reaches into the session's maps.
  */
 
-import { LOOPBACK_HOSTS, type LoopbackHandler, type LoopbackServer, serveLoopback } from "../../lib/http/index.ts";
+import { type HttpMount, LOOPBACK_HOSTS, type SharedListener } from "../../lib/http/index.ts";
 import { qrSvg } from "../../lib/qr.ts";
 import type { ReviewFrame, ReviewRole } from "./types.ts";
 import {
 	AT_CAP_REASON,
 	createLinkTable,
-	lanAddresses,
 	NO_SHARE_REASON,
 	shareUrl,
 	type LinkTable,
-	type NetworkInterfaces,
 	type ShareResult,
 	type ShareState,
 } from "./web-share.ts";
 
 /** What the share listener needs from the review session it belongs to. */
 export interface ShareSessionDeps {
-	/** The one request handler: a loopback page and a shared page are the same page. */
-	handleRequest: LoopbackHandler;
-	/** The body cap both listeners read under, so a shared page is not read differently. */
-	maxBodyBytes: number;
-	/** The owner's bound port, reused for the link when it is free. */
-	ownerPort: () => number;
-	/** The machine's interfaces, or a snapshot a test injected. */
-	networkInterfaces: () => NetworkInterfaces;
+	/** The review's mount on the session's server; sharing borrows its LAN listener. */
+	mount: HttpMount;
+	/** The mount's prefix, so a reviewer's link names the same page the owner has. */
+	base: string;
 	/** Add a reviewer token to the session's role map. */
 	mintReviewer: () => string;
 	/** Remove a reviewer token from the session's role map. */
@@ -64,16 +58,14 @@ export interface ShareSession {
 }
 
 export function createShareSession(deps: ShareSessionDeps): ShareSession {
-	let address = "";
-	let port = 0;
-	let server: LoopbackServer | undefined;
+	let shared: SharedListener | undefined;
 	const links: LinkTable = createLinkTable({
 		mint: deps.mintReviewer,
 		revoke: deps.revokeReviewer,
 		nameOf: deps.nameOf,
 	});
 	let reason: string | undefined;
-	const hosts = (): readonly string[] => (address ? [...LOOPBACK_HOSTS, address] : [...LOOPBACK_HOSTS]);
+	const hosts = (): readonly string[] => (shared ? [...LOOPBACK_HOSTS, shared.address] : [...LOOPBACK_HOSTS]);
 
 	/**
 	 * The share surface as it is now, read rather than cached: a link's bound name
@@ -81,42 +73,22 @@ export function createShareSession(deps: ShareSessionDeps): ShareSession {
 	 * another share action.
 	 */
 	const snapshot = (): ShareState => {
-		const base: ShareState = server === undefined ? { sharing: false, port: 0, links: [] } : links.state(port, address);
-		return reason === undefined ? base : { ...base, reason };
-	};
-
-	/** Bind the shared listener on `chosen`, reusing the owner's port when it is free. */
-	const bind = async (chosen: string): Promise<void> => {
-		try {
-			const bound = await serveLoopback({
-				host: chosen,
-				ports: [deps.ownerPort(), 0],
-				maxBodyBytes: deps.maxBodyBytes,
-				handler: deps.handleRequest,
-			});
-			server = bound;
-			address = chosen;
-			port = bound.port;
-		} catch {
-			// Neither the owner's port nor a free one answered: the caller reports it.
-			server = undefined;
-		}
+		const state: ShareState =
+			shared === undefined
+				? { sharing: false, origin: "", links: [] }
+				: links.state(deps.base, shared.origin, shared.address);
+		return reason === undefined ? state : { ...state, reason };
 	};
 
 	/**
-	 * Bind the one shared listener the first time a link needs it, or report why
-	 * there is nothing to bind to. Every link answers on this same listener, so this
-	 * runs once per share and the rest is bookkeeping.
+	 * Ask the session's server for the LAN listener the first time a link needs it, or
+	 * report why there is nothing to bind to. Every link answers on this same listener, so
+	 * this runs once per share and the rest is bookkeeping.
 	 */
 	const ensureListener = async (): Promise<boolean> => {
-		if (server !== undefined) return true;
-		const chosen = lanAddresses(deps.networkInterfaces())[0];
-		if (chosen === undefined) {
-			reason = NO_SHARE_REASON;
-			return false;
-		}
-		await bind(chosen);
-		if (server === undefined) {
+		if (shared !== undefined) return true;
+		shared = await deps.mount.share();
+		if (shared === undefined) {
 			reason = NO_SHARE_REASON;
 			return false;
 		}
@@ -129,7 +101,7 @@ export function createShareSession(deps: ShareSessionDeps): ShareSession {
 		deps.broadcast("share", "owner");
 		const state = snapshot();
 		if (minted === undefined) return { state };
-		return { state, svg: await qrSvg(shareUrl(address, port, minted)) };
+		return { state, svg: await qrSvg(shareUrl(deps.base, shared?.origin ?? "", minted)) };
 	};
 
 	const share = async (): Promise<ShareResult> => {
@@ -172,19 +144,16 @@ export function createShareSession(deps: ShareSessionDeps): ShareSession {
 		// The reviewers are told before their listener goes away; the review itself
 		// stays open for its owner.
 		deps.endStreams("revoked", { role: "reviewer" });
-		const closer = server;
-		server = undefined;
-		address = "";
-		port = 0;
+		shared = undefined;
 		reason = undefined;
-		if (closer) await closer.close();
+		await deps.mount.unshare();
 		return settle();
 	};
 
 	const close = async (): Promise<void> => {
-		const closer = server;
-		server = undefined;
-		if (closer) await closer.close();
+		if (shared === undefined) return;
+		shared = undefined;
+		await deps.mount.unshare();
 	};
 
 	return { share, invite, revoke, stop, state: snapshot, hosts, close };

package/extensions/plan/web-share.ts

@@ -12,10 +12,12 @@
  * failed. Everything else would print a link that cannot work.
  */
 
-import type { NetworkInterfaceInfo } from "node:os";
+import { lanAddresses, type NetworkInterfaces } from "../../lib/http/index.ts";
 
-/** The interfaces a review may be shared to, by name. */
-export type NetworkInterfaces = Record<string, NetworkInterfaceInfo[] | undefined>;
+/** The interfaces a review may be shared to, by name; `lib/http` owns the rule. */
+export type { NetworkInterfaces };
+
+export { lanAddresses };
 
 /** One address a reviewer can open the review at. */
 export interface ShareLink {
@@ -33,8 +35,12 @@ export interface ShareLink {
 export interface ShareState {
 	/** True while reviewer tokens exist and an address is bound. */
 	sharing: boolean;
-	/** The port reviewers connect to. */
-	port: number;
+	/**
+	 * The origin reviewers connect to, `http://192.168.1.24:4780`, or `""` when nothing is
+	 * shared. The port is the listener's own, which is why it is reported with its address
+	 * rather than as a number the review could have guessed.
+	 */
+	origin: string;
 	/** Every shared link, oldest first. */
 	links: ShareLink[];
 	/** Why sharing is unavailable, when it is. */
@@ -53,35 +59,11 @@ export const NO_SHARE_REASON =
 	"This machine has no network address to share on. Reviewers can still use a loopback link on this computer.";
 
 /**
- * IPv4 addresses another machine on this network can reach, deduplicated and
- * sorted, so the same machine prints the same link every time.
+ * The tokenized link for one reviewer: the origin the page answers on, its mount inside
+ * that origin, and the token the link carries.
  */
-export function lanAddresses(interfaces: NetworkInterfaces): string[] {
-	const addresses = new Set<string>();
-	for (const entries of Object.values(interfaces)) {
-		for (const entry of entries ?? []) {
-			if (entry.family !== "IPv4" || entry.internal) continue;
-			if (entry.address === "0.0.0.0" || entry.address.startsWith("169.254.")) continue;
-			addresses.add(entry.address);
-		}
-	}
-	return [...addresses].sort(byAddress);
-}
-
-/** Numeric IPv4 comparison, so `…1.9` sorts before `…1.24`. */
-function byAddress(a: string, b: string): number {
-	const left = a.split(".").map(Number);
-	const right = b.split(".").map(Number);
-	for (let index = 0; index < 4; index++) {
-		const difference = (left[index] ?? 0) - (right[index] ?? 0);
-		if (difference !== 0) return difference;
-	}
-	return 0;
-}
-
-/** The tokenized link for one address. */
-export function shareUrl(address: string, port: number, token: string): string {
-	return `http://${address}:${port}/?token=${token}`;
+export function shareUrl(base: string, origin: string, token: string): string {
+	return `${origin}${base}/?token=${token}`;
 }
 
 /**
@@ -129,7 +111,7 @@ export interface LinkTable {
 	/** The links currently shared, oldest first. */
 	list(): readonly SharedLink[];
 	/** The state the owner's page and the terminal read. */
-	state(port: number, address: string): ShareState;
+	state(base: string, origin: string, address: string): ShareState;
 }
 
 export function createLinkTable(deps: LinkTableDeps): LinkTable {
@@ -152,15 +134,15 @@ export function createLinkTable(deps: LinkTableDeps): LinkTable {
 			return true;
 		},
 		list: () => [...links],
-		state: (port, address) => ({
+		state: (base, origin, address) => ({
 			sharing: links.length > 0,
-			port,
+			origin,
 			links: links.map((link) => {
 				const name = deps.nameOf(link.token);
 				return {
 					id: link.id,
 					address,
-					url: shareUrl(address, port, link.token),
+					url: shareUrl(base, origin, link.token),
 					...(name === undefined ? {} : { name }),
 				};
 			}),