camox 0.65.1 → 0.67.0

package/dist/features/studio/components/UnnamedDraftBar.js

@@ -0,0 +1,349 @@
+import { reads, useReadQuery } from "../../../lib/studio-reads.js";
+import { cn } from "../../../lib/utils.js";
+import { studioStore } from "../studioStore.js";
+import { plural } from "../draftLabel.js";
+import { useRenameDraft } from "./ReviewDraftSheet.js";
+import { useDrafts } from "./DraftsControl.js";
+import { c } from "react/compiler-runtime";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useSelector } from "@xstate/store-react";
+import { Button } from "@camox/ui/button";
+import { Input } from "@camox/ui/input";
+import { toast } from "@camox/ui/toaster";
+import { Spinner } from "@camox/ui/spinner";
+import { Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger } from "@camox/ui/popover";
+import { FloatingToolbar } from "@camox/ui/floating-toolbar";
+
+//#region src/features/studio/components/UnnamedDraftBar.tsx
+/**
+* How long a draft goes without a change before the bar shows, so it doesn't pop up mid-edit.
+*/
+const SETTLE_MS = 1500;
+/**
+* Asks what to do with an unnamed draft, which only editing on Live starts: discard its
+* changes, keep it as a draft by naming it, or publish it. It stays up until one of them ends
+* the draft or names it, and stands in for the navbar's pending changes until then.
+*/
+function UnnamedDraftBar(t0) {
+	const $ = c(23);
+	const { stacked } = t0;
+	const { projectId, current } = useDrafts();
+	const unnamed = current?.name === null ? current : null;
+	const keeping = useSelector(studioStore, _temp);
+	const settled = useSettled(unnamed?.id ?? null, unnamed?.lastChangedAt ?? null);
+	if (!projectId || !unnamed || !(settled || keeping)) return null;
+	const empty = unnamed.changeCount === 0;
+	const t1 = stacked ? "bottom-16" : "bottom-2";
+	let t2;
+	if ($[0] !== t1) {
+		t2 = cn("animate-in fade-in slide-in-from-bottom-4 fixed w-max gap-6 duration-300", t1);
+		$[0] = t1;
+		$[1] = t2;
+	} else t2 = $[1];
+	let t3;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = /* @__PURE__ */ jsx("span", {
+			"aria-hidden": true,
+			className: "size-2 shrink-0 rounded-full bg-blue-500"
+		});
+		$[2] = t3;
+	} else t3 = $[2];
+	let t4;
+	if ($[3] !== empty || $[4] !== unnamed.changeCount) {
+		t4 = empty ? "No changes yet" : plural(unnamed.changeCount, "pending change");
+		$[3] = empty;
+		$[4] = unnamed.changeCount;
+		$[5] = t4;
+	} else t4 = $[5];
+	let t5;
+	if ($[6] !== t4) {
+		t5 = /* @__PURE__ */ jsxs("span", {
+			className: "flex items-center gap-2 px-2 text-sm",
+			children: [t3, t4]
+		});
+		$[6] = t4;
+		$[7] = t5;
+	} else t5 = $[7];
+	let t6;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = /* @__PURE__ */ jsx(Button, {
+			type: "button",
+			variant: "outline",
+			onClick: _temp2,
+			children: "Discard"
+		});
+		$[8] = t6;
+	} else t6 = $[8];
+	let t7;
+	if ($[9] !== empty || $[10] !== keeping || $[11] !== projectId || $[12] !== unnamed) {
+		t7 = /* @__PURE__ */ jsx(KeepDraft, {
+			projectId,
+			draft: unnamed,
+			open: keeping,
+			disabled: empty
+		});
+		$[9] = empty;
+		$[10] = keeping;
+		$[11] = projectId;
+		$[12] = unnamed;
+		$[13] = t7;
+	} else t7 = $[13];
+	let t8;
+	if ($[14] !== empty) {
+		t8 = /* @__PURE__ */ jsx(Button, {
+			type: "button",
+			disabled: empty,
+			onClick: _temp3,
+			children: "Publish…"
+		});
+		$[14] = empty;
+		$[15] = t8;
+	} else t8 = $[15];
+	let t9;
+	if ($[16] !== t7 || $[17] !== t8) {
+		t9 = /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-2",
+			children: [
+				t6,
+				t7,
+				t8
+			]
+		});
+		$[16] = t7;
+		$[17] = t8;
+		$[18] = t9;
+	} else t9 = $[18];
+	let t10;
+	if ($[19] !== t2 || $[20] !== t5 || $[21] !== t9) {
+		t10 = /* @__PURE__ */ jsxs(FloatingToolbar, {
+			"aria-label": "Unnamed draft",
+			className: t2,
+			children: [t5, t9]
+		});
+		$[19] = t2;
+		$[20] = t5;
+		$[21] = t9;
+		$[22] = t10;
+	} else t10 = $[22];
+	return t10;
+}
+function _temp3() {
+	return studioStore.send({ type: "openReviewDraftSheet" });
+}
+function _temp2() {
+	return studioStore.send({ type: "openDeleteDraftDialog" });
+}
+function _temp(state) {
+	return state.context.isKeepDraftOpen;
+}
+/**
+* Whether the draft went without a change for `SETTLE_MS`. Once settled it stays so for that
+* draft, so the bar doesn't hide again on the next edit.
+*/
+function useSettled(draftId, lastChangedAt) {
+	const $ = c(5);
+	const [settledDraft, setSettledDraft] = React.useState(null);
+	let t0;
+	let t1;
+	if ($[0] !== draftId || $[1] !== lastChangedAt || $[2] !== settledDraft) {
+		t0 = () => {
+			if (!draftId || settledDraft === draftId) return;
+			const wait = Math.max(0, (lastChangedAt ?? 0) + SETTLE_MS - Date.now());
+			const timer = setTimeout(() => setSettledDraft(draftId), wait);
+			return () => clearTimeout(timer);
+		};
+		t1 = [
+			draftId,
+			lastChangedAt,
+			settledDraft
+		];
+		$[0] = draftId;
+		$[1] = lastChangedAt;
+		$[2] = settledDraft;
+		$[3] = t0;
+		$[4] = t1;
+	} else {
+		t0 = $[3];
+		t1 = $[4];
+	}
+	React.useEffect(t0, t1);
+	return !!draftId && settledDraft === draftId;
+}
+/** "Keep as draft": names the draft, which keeps it and ends the bar. */
+function KeepDraft(t0) {
+	const $ = c(15);
+	const { projectId, draft, open, disabled } = t0;
+	let t1;
+	if ($[0] !== disabled) {
+		t1 = /* @__PURE__ */ jsx(Button, {
+			type: "button",
+			variant: "outline",
+			disabled
+		});
+		$[0] = disabled;
+		$[1] = t1;
+	} else t1 = $[1];
+	let t2;
+	if ($[2] !== disabled || $[3] !== t1) {
+		t2 = /* @__PURE__ */ jsx(PopoverTrigger, {
+			disabled,
+			render: t1,
+			children: "Keep as draft"
+		});
+		$[2] = disabled;
+		$[3] = t1;
+		$[4] = t2;
+	} else t2 = $[4];
+	let t3;
+	if ($[5] !== draft || $[6] !== open || $[7] !== projectId) {
+		t3 = open && /* @__PURE__ */ jsx(KeepDraftForm, {
+			projectId,
+			draft
+		});
+		$[5] = draft;
+		$[6] = open;
+		$[7] = projectId;
+		$[8] = t3;
+	} else t3 = $[8];
+	let t4;
+	if ($[9] !== t3) {
+		t4 = /* @__PURE__ */ jsx(PopoverContent, {
+			side: "top",
+			sideOffset: 16,
+			className: "w-80",
+			children: t3
+		});
+		$[9] = t3;
+		$[10] = t4;
+	} else t4 = $[10];
+	let t5;
+	if ($[11] !== open || $[12] !== t2 || $[13] !== t4) {
+		t5 = /* @__PURE__ */ jsxs(Popover, {
+			open,
+			onOpenChange: _temp4,
+			children: [t2, t4]
+		});
+		$[11] = open;
+		$[12] = t2;
+		$[13] = t4;
+		$[14] = t5;
+	} else t5 = $[14];
+	return t5;
+}
+function _temp4(next) {
+	return studioStore.send({ type: next ? "openKeepDraft" : "closeKeepDraft" });
+}
+/**
+* The name to keep the draft under, filled with the short name its Draft Overview suggests until
+* the editor types: AI names a few changes well, and better than a name typed before making them.
+*/
+function KeepDraftForm(t0) {
+	const $ = c(24);
+	const { projectId, draft } = t0;
+	let t1;
+	if ($[0] !== draft.id || $[1] !== projectId) {
+		t1 = reads.publishPreview({
+			projectId,
+			draftId: draft.id
+		});
+		$[0] = draft.id;
+		$[1] = projectId;
+		$[2] = t1;
+	} else t1 = $[2];
+	const preview = useReadQuery(t1);
+	const overview = preview.data?.overview;
+	const suggested = overview?.status === "ready" ? overview.name : null;
+	const summarizing = !suggested && (preview.isPending || overview?.status === "pending");
+	const [typed, setTyped] = React.useState(null);
+	const name = typed ?? suggested ?? "";
+	const rename = useRenameDraft(projectId);
+	let t2;
+	if ($[3] !== draft.id || $[4] !== name || $[5] !== rename) {
+		t2 = (event) => {
+			event.preventDefault();
+			const kept = name.trim();
+			if (!kept) return;
+			rename.mutate({
+				draftId: draft.id,
+				name: kept
+			}, { onSuccess: () => {
+				studioStore.send({ type: "closeKeepDraft" });
+				toast.success(`Kept as "${kept}"`);
+			} });
+		};
+		$[3] = draft.id;
+		$[4] = name;
+		$[5] = rename;
+		$[6] = t2;
+	} else t2 = $[6];
+	let t3;
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = /* @__PURE__ */ jsxs(PopoverHeader, { children: [/* @__PURE__ */ jsx(PopoverTitle, { children: "Keep as draft" }), /* @__PURE__ */ jsx(PopoverDescription, { children: "Name it for what it changes, so you and your team can find it later." })] });
+		$[7] = t3;
+	} else t3 = $[7];
+	const t4 = summarizing ? "Summarizing your changes…" : "What does this draft change?";
+	let t5;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = (event_0) => setTyped(event_0.target.value);
+		$[8] = t5;
+	} else t5 = $[8];
+	let t6;
+	if ($[9] !== name || $[10] !== t4) {
+		t6 = /* @__PURE__ */ jsx(Input, {
+			autoFocus: true,
+			"aria-label": "Draft name",
+			value: name,
+			maxLength: 200,
+			placeholder: t4,
+			onChange: t5
+		});
+		$[9] = name;
+		$[10] = t4;
+		$[11] = t6;
+	} else t6 = $[11];
+	let t7;
+	if ($[12] !== name || $[13] !== rename.isPending) {
+		t7 = !name.trim() || rename.isPending;
+		$[12] = name;
+		$[13] = rename.isPending;
+		$[14] = t7;
+	} else t7 = $[14];
+	let t8;
+	if ($[15] !== rename.isPending) {
+		t8 = rename.isPending ? /* @__PURE__ */ jsx(Spinner, {}) : null;
+		$[15] = rename.isPending;
+		$[16] = t8;
+	} else t8 = $[16];
+	let t9;
+	if ($[17] !== t7 || $[18] !== t8) {
+		t9 = /* @__PURE__ */ jsxs(Button, {
+			type: "submit",
+			disabled: t7,
+			children: [t8, "Keep draft"]
+		});
+		$[17] = t7;
+		$[18] = t8;
+		$[19] = t9;
+	} else t9 = $[19];
+	let t10;
+	if ($[20] !== t2 || $[21] !== t6 || $[22] !== t9) {
+		t10 = /* @__PURE__ */ jsxs("form", {
+			className: "flex flex-col gap-3",
+			onSubmit: t2,
+			children: [
+				t3,
+				t6,
+				t9
+			]
+		});
+		$[20] = t2;
+		$[21] = t6;
+		$[22] = t9;
+		$[23] = t10;
+	} else t10 = $[23];
+	return t10;
+}
+
+//#endregion
+export { SETTLE_MS, UnnamedDraftBar };

package/dist/features/studio/findingSentence.js

@@ -1,15 +1,14 @@
 import { localeName } from "./localeOptions.js";
-import { findingSentence } from "@camox/api-contract/patrol";
+import { findingSentence, findingSentenceInPlace } from "@camox/api-contract/patrol";
 
 //#region src/features/studio/findingSentence.ts
 /** Quoted as editors read it. */
 const quoted = (text) => `“${text}”`;
-/** What a dismissal dismissed, briefly: "Links to About", or the text it was about. */
+/** What a dismissal dismissed, briefly: "Links to About". */
 function dismissedSentence(about) {
 	switch (about.kind) {
 		case "missingPage": return `Links to ${about.page ?? "a missing page"}`;
 		case "brokenLink": return `Links to ${about.url}`;
-		default: return quoted(about.text);
 	}
 }
 /** What dismissing a finding says, as its button says it: a broken link's is "This link is fine". */
@@ -20,7 +19,6 @@ function dismissLabel(about) {
 function fixLabel(fix) {
 	switch (fix.kind) {
 		case "removeLink": return "Remove the link";
-		case "replaceText": return `Replace with ${quoted(fix.replacement)}`;
 	}
 }
 /**
@@ -34,4 +32,4 @@ function askAgentMessage(finding, role) {
 }
 
 //#endregion
-export { askAgentMessage, dismissLabel, dismissedSentence, findingSentence, fixLabel };
+export { askAgentMessage, dismissLabel, dismissedSentence, findingSentence, findingSentenceInPlace, fixLabel };

package/dist/features/studio/patrollerBio.js

@@ -0,0 +1,39 @@
+//#region src/features/studio/patrollerBio.ts
+/** What each patroller does, wherever it works. */
+const ABOUT = {
+	seoManager: "Writes what search engines read: each page's SEO, and each file's alt text and filename.",
+	translator: "Translates your website from its default language into every other one, so that each stays complete.",
+	linkChecker: "Looks for links that lead nowhere, to your own pages or elsewhere, and suggests a fix when it can."
+};
+/** What a patroller does, as its profile card introduces it. */
+function aboutSentence(id) {
+	return ABOUT[id];
+}
+/**
+* When a patroller works where the editor is, by its duty there, in a draft or on Live, as its
+* card's tag says it, and whether it runs there at all. In a project with a single locale, the
+* Translator waits for a second one.
+*/
+function whenTag(id, duty, inDraft, singleLocale) {
+	const runs = (label) => ({
+		label,
+		runs: true
+	});
+	if (id === "translator" && singleLocale) return {
+		label: "Runs once you add a language",
+		runs: false
+	};
+	if (duty === "atPublish") return runs("Runs when you publish");
+	if (duty === "asYouGo") {
+		if (inDraft) return runs("Runs as you edit");
+		if (id === "linkChecker") return runs("Runs every 6 hours");
+		return runs("Runs while a release is translated");
+	}
+	return {
+		label: "Doesn't run on Live",
+		runs: false
+	};
+}
+
+//#endregion
+export { aboutSentence, whenTag };

package/dist/features/studio/reportSentence.js

@@ -36,11 +36,6 @@ const PHRASES = {
 		done: "Fixed a link in",
 		failed: "Couldn't fix a link in",
 		locale: "in"
-	},
-	fixedMistake: {
-		done: "Fixed a typo in",
-		failed: "Couldn't fix a typo in",
-		locale: "in"
 	}
 };
 /** A report as a sentence: "Wrote SEO for Pricing in German", or the text an AI wrote. */

package/dist/features/studio/studioStore.js

@@ -10,6 +10,7 @@ const studioStore = createStore({
 			startRenaming: false
 		},
 		isDeleteDraftDialogOpen: false,
+		isKeepDraftOpen: false,
 		localeDialog: null,
 		websiteLocation: null,
 		agentAsk: null,
@@ -78,6 +79,18 @@ const studioStore = createStore({
 				isDeleteDraftDialogOpen: false
 			};
 		},
+		openKeepDraft: (context) => {
+			return {
+				...context,
+				isKeepDraftOpen: true
+			};
+		},
+		closeKeepDraft: (context) => {
+			return {
+				...context,
+				isKeepDraftOpen: false
+			};
+		},
 		openLocaleDialog: (context, event) => {
 			return {
 				...context,

package/dist/features/studio/workingSentence.js

@@ -4,8 +4,7 @@ import { localeName } from "./localeOptions.js";
 const PHRASES = {
 	translator: {
 		verb: "Translating",
-		locale: "into",
-		singleLocale: "Add a language to translate into"
+		locale: "into"
 	},
 	seoManager: {
 		verb: "Writing SEO for",
@@ -15,10 +14,6 @@ const PHRASES = {
 	linkChecker: {
 		verb: "Checking links in",
 		locale: "in"
-	},
-	proofreader: {
-		verb: "Proofreading",
-		locale: "in"
 	}
 };
 /** The most locales a burst names; past it, the first are named and the rest counted. */
@@ -54,10 +49,6 @@ function workingSentence(id, working) {
 		inLocales(locales, phrase.locale)
 	].filter(Boolean).join(" ");
 }
-/** What a patroller says while idle in a project with a single locale, if anything. */
-function singleLocaleSentence(id) {
-	return PHRASES[id].singleLocale;
-}
 
 //#endregion
-export { singleLocaleSentence, workingSentence };
+export { workingSentence };

package/dist/lib/revisions.js

@@ -1,20 +1,42 @@
+import { c } from "react/compiler-runtime";
 import * as React from "react";
 
 //#region src/lib/revisions.ts
 function createRevisions() {
 	const listeners = /* @__PURE__ */ new Set();
+	const latest = /* @__PURE__ */ new Map();
 	return {
 		announce(revision) {
+			latest.set(revision.draftId, revision.revisionId);
 			for (const listener of listeners) listener(revision);
 		},
-		subscribe(listener) {
+		subscribe: (listener) => {
 			listeners.add(listener);
 			return () => listeners.delete(listener);
-		}
+		},
+		latest: (draftId) => latest.get(draftId) ?? null
 	};
 }
 /** The studio's announced revisions. The signed-in studio provides it. */
 const RevisionsContext = React.createContext(null);
+const noSubscription = () => () => {};
+/**
+* The last revision announced for `draftId` since the studio opened, or null, following each new
+* one: what a URL rendered by the draft's code names, so it is fetched again once a new one built.
+*/
+function useLatestRevision(draftId) {
+	const $ = c(3);
+	const revisions = React.use(RevisionsContext);
+	let t0;
+	if ($[0] !== draftId || $[1] !== revisions) {
+		t0 = () => revisions && draftId ? revisions.latest(draftId) : null;
+		$[0] = draftId;
+		$[1] = revisions;
+		$[2] = t0;
+	} else t0 = $[2];
+	const latest = t0;
+	return React.useSyncExternalStore(revisions?.subscribe ?? noSubscription, latest, latest);
+}
 
 //#endregion
-export { RevisionsContext, createRevisions };
+export { RevisionsContext, createRevisions, useLatestRevision };

package/dist/lib/use-thread.js

@@ -18,7 +18,7 @@ const OPEN = 1;
 *
 * When the agent on Live hands a request off to a draft it started, the studio that sent a
 * message of that run hears it (`onEnterDraft`), to enter the draft. The editor's Live thread
-* stays as it is, ending that turn on the draft's card, which every studio on Live shows.
+* then starts afresh from the draft's card, which every studio on Live shows alone.
 *
 * It reports what each writing script touched (`touched`), for runs one of its messages was part
 * of only, so that the studio follows the agent; teammates' runs leave it where it is.

package/dist/package.js

@@ -1,5 +1,5 @@
 //#region package.json
-var version = "0.65.1";
+var version = "0.67.0";
 
 //#endregion
 export { version };