@tideworthy/tidysites-platform 0.10.8 → 0.10.10

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # Changelog
 
+## 0.10.10
+
+- Editor: the bar reads Edit, Request a change, Revisions, Publish live; Publish live is green.
+
+## 0.10.9
+
+- Editor: the request panel greets the person by name and speaks plainly; the floating button is a pen, not a chat bubble. `GET /_tidy/change` says who is signed in.
+
 ## 0.10.8
 
 - Editor: Request a change, from the bar and a floating button at the corner. A panel takes what to change and which page (the current one by default) and hands it to the platform through the control plane (`POST /_tidy/change`); it shows up under Changes.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@tideworthy/tidysites-platform",
-	"version": "0.10.8",
+	"version": "0.10.10",
 	"description": "The Tidysites platform integration for EmDash sites: bootstrap, sessions, maintenance, health, and publish hooks under /_tidy/*.",
 	"license": "MIT",
 	"type": "module",

package/src/editor/TidyEditor.astro

@@ -110,6 +110,8 @@ const htmlClass = !signedIn ? (signInUrl ? "tidy-has-bar tidy-idle" : "") : !act
 	.tidy-btn-primary { background: #2b7fd1; border-color: #2b7fd1; color: #fff; }
 	.tidy-btn-primary:hover { background: #2470bd; }
 	.tidy-btn-danger:hover { background: #b3261e; border-color: #b3261e; }
+	.tidy-btn-go { background: #1f9d55; border-color: #1f9d55; color: #fff; }
+	.tidy-btn-go:hover { background: #1a8a4a; }
 	.tidy-btn-sm { padding: 3px 8px; font-size: 12px; }
 	.tidy-add-end { display: block; width: calc(100% - 32px); margin: 16px; padding: 14px; border: 2px dashed #2b7fd1; border-radius: 10px; background: rgba(43,127,209,.06); color: #2b7fd1; font: 600 14px system-ui, sans-serif; cursor: pointer; }
 	.tidy-panel { position: fixed; top: 0; right: 0; bottom: 0; width: min(420px, 100vw); z-index: 2147483001; overflow: auto; background: #fff; color: #17211c; border-left: 1px solid #d3dcd6; box-shadow: -12px 0 40px rgba(0,0,0,.18); padding: 20px; font: 14px/1.45 system-ui, sans-serif; }

package/src/editor/request.ts

@@ -29,8 +29,16 @@ export function mountRequestChange(): void {
 		panel.replaceChildren();
 	}
 
-	function render() {
-		const head = el("div", { class: "tidy-panel-head" }, [el("h2", { text: "Request a change" }), el("p", { text: "Say what you would like changed. It shows up under Changes and someone picks it up." })]);
+	let who: { name: string | null } | null = null;
+	const firstName = () => (who?.name ?? "").trim().split(/\s+/)[0] || "";
+
+	async function render() {
+		if (!who) who = (await fetch(ROUTE, { credentials: "same-origin" }).then((r) => (r.ok ? r.json() : null)).catch(() => null)) as { name: string | null } | null;
+		const name = firstName();
+		const head = el("div", { class: "tidy-panel-head" }, [
+			el("h2", { text: name ? `Hi ${name},` : "Hi there," }),
+			el("p", { text: "We would love to help you make some adjustments to your website. Describe what you would like to see different or new, and we will get a version back to you as soon as possible." })
+		]);
 		const body = el("textarea", { id: "tidy-change-body", rows: "7", maxlength: "10000", required: "" });
 		const page = el("input", { id: "tidy-change-page", type: "text", value: here });
 		const err = el("p", { class: "tidy-field-note", hidden: "" });
@@ -53,7 +61,7 @@ export function mountRequestChange(): void {
 			sending = false;
 			if (r?.ok && j.ok) {
 				panel.replaceChildren(
-					el("div", { class: "tidy-panel-head" }, [el("h2", { text: "Request sent" }), el("p", { text: "It is under Changes now. You will hear back there." })]),
+					el("div", { class: "tidy-panel-head" }, [el("h2", { text: name ? `Thanks, ${name}.` : "Thanks." }), el("p", { text: "We have your request and will get a version back to you as soon as possible." })]),
 					el("div", { class: "tidy-panel-actions" }, [el("button", { type: "button", class: "tidy-btn", text: "Close" })])
 				);
 				panel.querySelector("button")?.addEventListener("click", close);
@@ -67,7 +75,7 @@ export function mountRequestChange(): void {
 		panel.replaceChildren(
 			head,
 			el("div", { class: "tidy-form" }, [
-				el("div", { class: "tidy-field" }, [el("label", { class: "tidy-field-label", for: "tidy-change-body", text: "What would you like changed?" }), body]),
+				el("div", { class: "tidy-field" }, [el("label", { class: "tidy-field-label", for: "tidy-change-body", text: "What would you like to see different or new?" }), body]),
 				el("div", { class: "tidy-field" }, [el("label", { class: "tidy-field-label", for: "tidy-change-page", text: "Which page" }), page]),
 				err
 			]),
@@ -79,10 +87,11 @@ export function mountRequestChange(): void {
 
 	const barBtn = el("button", { type: "button", class: "tidy-btn", text: "Request a change" });
 	barBtn.addEventListener("click", render);
-	actions.prepend(barBtn);
+	// Right after Edit (or Done), before Revisions and Publish live.
+	actions.insertBefore(barBtn, actions.children[1] ?? null);
 
 	const fab = el("button", { type: "button", class: "tidy-fab", title: "Request a change", "aria-label": "Request a change" });
-	fab.innerHTML = '<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>';
+	fab.innerHTML = '<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 20h9"/><path d="M16.376 3.622a1 1 0 0 1 3.002 3.002L7.368 18.635a2 2 0 0 1-.855.506l-2.872.838a.5.5 0 0 1-.62-.62l.838-2.872a2 2 0 0 1 .506-.854z"/></svg>';
 	fab.addEventListener("click", render);
 	document.body.append(fab);
 	document.addEventListener("keydown", (e) => {

package/src/editor/revisions.ts

@@ -41,8 +41,9 @@ export function startRevisions(): void {
 	if (!actions) return;
 	const here = location.pathname;
 	const revBtn = el("button", { type: "button", class: "tidy-btn", text: "Revisions" });
-	const liveBtn = el("button", { type: "button", class: "tidy-btn", text: "Publish live" });
-	actions.prepend(revBtn, liveBtn);
+	const liveBtn = el("button", { type: "button", class: "tidy-btn tidy-btn-go", text: "Publish live" });
+	// Edit, Request a change, Revisions, Publish live: the bar reads left to right in that order.
+	actions.append(revBtn, liveBtn);
 
 	// --- the panel --------------------------------------------------------
 	const panel = el("div", { class: "tidy-panel", hidden: "" });

package/src/routes/change.ts

@@ -4,6 +4,7 @@
  * own secret. The Astro session is the gate; the person's name and email
  * come from the site's user record.
  *
+ *   GET                       → { name, email } of the signed-in person
  *   POST { body, pageUrl? }  → { ok, changeId }
  */
 import type { APIRoute } from "astro";
@@ -45,4 +46,15 @@ export const POST: APIRoute = platformRoute(
 	{ requireBearer: false }
 );
 
-export const ALL = methodNotAllowed("POST");
+/** Who is signed in, for the panel's greeting: { name, email } or 401. */
+export const GET: APIRoute = platformRoute(
+	async (context, deps) => {
+		const session = context.session ? ((await context.session.get("user")) as { id?: string } | null) : null;
+		if (!session?.id) return new Response("Unauthorized", { status: 401 });
+		const user = await deps.store.findUserById(session.id);
+		return json({ name: user?.name ?? null, email: user?.email ?? null }, 200, { "cache-control": "no-store" });
+	},
+	{ requireBearer: false }
+);
+
+export const ALL = methodNotAllowed("GET, POST");

package/src/version.ts

@@ -1,3 +1,3 @@
 /** Kept in step with package.json by the release checklist in MAINTAINING.md. */
-export const VERSION = "0.10.8";
+export const VERSION = "0.10.10";
 export const PLUGIN_ID = "tidy-platform";