camox 0.67.0 → 0.69.0

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

@@ -0,0 +1,139 @@
+import { cn } from "../../../lib/utils.js";
+import { studioStore } from "../studioStore.js";
+import { plural } from "../draftLabel.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 { Button } from "@camox/ui/button";
+import { FloatingToolbar } from "@camox/ui/floating-toolbar";
+
+//#region src/features/studio/components/DraftBar.tsx
+/**
+* How long a draft goes without a change before its bar shows, so it doesn't pop up mid-edit.
+*/
+const SETTLE_MS = 1500;
+/**
+* Asks what to do with the draft being viewed, once its edits settle: discard its changes or
+* publish them. `stacked` places it in the Preview toolbar's column, just above the toolbar;
+* otherwise it floats at the bottom of the screen on its own.
+*/
+function DraftBar(t0) {
+	const $ = c(15);
+	const { stacked: t1 } = t0;
+	const stacked = t1 === void 0 ? false : t1;
+	const { projectId, current } = useDrafts();
+	const settled = useSettled(current?.id ?? null, current?.lastChangedAt ?? null);
+	if (!projectId || !current || !settled) return null;
+	const empty = current.changeCount === 0;
+	const t2 = stacked ? "pointer-events-auto relative left-auto translate-x-0" : "fixed bottom-2";
+	let t3;
+	if ($[0] !== t2) {
+		t3 = cn("w-max gap-4", t2);
+		$[0] = t2;
+		$[1] = t3;
+	} else t3 = $[1];
+	let t4;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t4 = /* @__PURE__ */ jsx("span", {
+			"aria-hidden": true,
+			className: "size-2 shrink-0 rounded-full bg-blue-500"
+		});
+		$[2] = t4;
+	} else t4 = $[2];
+	let t5;
+	if ($[3] !== current.changeCount || $[4] !== empty) {
+		t5 = empty ? "No changes yet" : plural(current.changeCount, "pending change");
+		$[3] = current.changeCount;
+		$[4] = empty;
+		$[5] = t5;
+	} else t5 = $[5];
+	let t6;
+	if ($[6] !== t5) {
+		t6 = /* @__PURE__ */ jsxs("span", {
+			className: "flex items-center gap-2 px-2 text-sm",
+			children: [t4, t5]
+		});
+		$[6] = t5;
+		$[7] = t6;
+	} else t6 = $[7];
+	let t7;
+	if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+		t7 = /* @__PURE__ */ jsx(Button, {
+			type: "button",
+			variant: "outline",
+			onClick: _temp,
+			children: "Discard"
+		});
+		$[8] = t7;
+	} else t7 = $[8];
+	let t8;
+	if ($[9] !== empty) {
+		t8 = /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-2",
+			children: [t7, /* @__PURE__ */ jsx(Button, {
+				type: "button",
+				disabled: empty,
+				onClick: _temp2,
+				children: "Publish…"
+			})]
+		});
+		$[9] = empty;
+		$[10] = t8;
+	} else t8 = $[10];
+	let t9;
+	if ($[11] !== t3 || $[12] !== t6 || $[13] !== t8) {
+		t9 = /* @__PURE__ */ jsxs(FloatingToolbar, {
+			"aria-label": "Draft",
+			className: t3,
+			children: [t6, t8]
+		});
+		$[11] = t3;
+		$[12] = t6;
+		$[13] = t8;
+		$[14] = t9;
+	} else t9 = $[14];
+	return t9;
+}
+function _temp2() {
+	return studioStore.send({ type: "openReviewDraftSheet" });
+}
+function _temp() {
+	return studioStore.send({ type: "openDeleteDraftDialog" });
+}
+/**
+* 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;
+}
+
+//#endregion
+export { DraftBar, SETTLE_MS };

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

@@ -6,7 +6,8 @@ import { reads, useReadQuery } from "../../../lib/studio-reads.js";
 import { cn } from "../../../lib/utils.js";
 import { studioStore } from "../studioStore.js";
 import { draftLabel, plural, timeAgo } from "../draftLabel.js";
-import { DeleteDraftDialog, ReviewDraftSheet, useLeaveDraft } from "./ReviewDraftSheet.js";
+import { useLeaveDraft, useSwitchView } from "../viewSwitch.js";
+import { DeleteDraftDialog, ReviewDraftSheet } from "./ReviewDraftSheet.js";
 import { c } from "react/compiler-runtime";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -14,7 +15,6 @@ import { useSelector } from "@xstate/store-react";
 import { Button } from "@camox/ui/button";
 import { ChevronsUpDown } from "lucide-react";
 import { toast } from "@camox/ui/toaster";
-import { Badge } from "@camox/ui/badge";
 import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuTrigger } from "@camox/ui/dropdown-menu";
 
 //#region src/features/studio/components/DraftsControl.tsx
@@ -98,12 +98,13 @@ function useDrafts() {
 * still names what the studio is viewing.
 */
 function DraftPicker(t0) {
-	const $ = c(66);
+	const $ = c(68);
 	const { disabled: t1 } = t0;
 	const disabled = t1 === void 0 ? false : t1;
 	const { draftScope, draftId, projectId, list, current } = useDrafts();
 	const navigate = useNavigate();
 	const leaveDraft = useLeaveDraft();
+	const switchView = useSwitchView();
 	const review = useSelector(studioStore, _temp);
 	const deleting = useSelector(studioStore, _temp2);
 	let t2;
@@ -135,23 +136,30 @@ function DraftPicker(t0) {
 	} else t5 = $[6];
 	const drafts = t5;
 	let t6;
-	if ($[7] !== draftId || $[8] !== navigate) {
+	if ($[7] !== draftId || $[8] !== drafts || $[9] !== navigate || $[10] !== switchView) {
 		t6 = (next) => {
 			if (next === draftId) return;
-			navigate({
+			const target = next ? drafts.find((draft) => draft.id === next) : void 0;
+			const label = next ? target ? draftLabel(target) : "the draft" : "Live";
+			switchView(() => navigate({
 				to: window.location.href,
 				draft: next
+			}), {
+				loading: `Switching to ${label}…`,
+				success: `You're now viewing ${label}.`
 			});
 		};
 		$[7] = draftId;
-		$[8] = navigate;
-		$[9] = t6;
-	} else t6 = $[9];
+		$[8] = drafts;
+		$[9] = navigate;
+		$[10] = switchView;
+		$[11] = t6;
+	} else t6 = $[11];
 	const switchTo = t6;
 	const t7 = !!projectId;
 	const t8 = current?.name === null;
 	let t9;
-	if ($[10] !== draftId || $[11] !== drafts || $[12] !== switchTo || $[13] !== t7 || $[14] !== t8) {
+	if ($[12] !== draftId || $[13] !== drafts || $[14] !== switchTo || $[15] !== t7 || $[16] !== t8) {
 		t9 = {
 			enabled: t7,
 			draftId,
@@ -159,65 +167,65 @@ function DraftPicker(t0) {
 			drafts,
 			switchTo
 		};
-		$[10] = draftId;
-		$[11] = drafts;
-		$[12] = switchTo;
-		$[13] = t7;
-		$[14] = t8;
-		$[15] = t9;
-	} else t9 = $[15];
+		$[12] = draftId;
+		$[13] = drafts;
+		$[14] = switchTo;
+		$[15] = t7;
+		$[16] = t8;
+		$[17] = t9;
+	} else t9 = $[17];
 	useDraftsActions(t9);
 	if (draftId && !current) return null;
 	let t10;
-	if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[18] === Symbol.for("react.memo_cache_sentinel")) {
 		t10 = /* @__PURE__ */ jsx(Button, {
 			type: "button",
 			variant: "ghost"
 		});
-		$[16] = t10;
-	} else t10 = $[16];
+		$[18] = t10;
+	} else t10 = $[18];
 	const t11 = draftId ? "bg-blue-500" : "bg-emerald-500";
 	let t12;
-	if ($[17] !== t11) {
+	if ($[19] !== t11) {
 		t12 = cn("size-2 shrink-0 rounded-full", t11);
-		$[17] = t11;
-		$[18] = t12;
-	} else t12 = $[18];
+		$[19] = t11;
+		$[20] = t12;
+	} else t12 = $[20];
 	let t13;
-	if ($[19] !== t12) {
+	if ($[21] !== t12) {
 		t13 = /* @__PURE__ */ jsx("span", {
 			"aria-hidden": true,
 			className: t12
 		});
-		$[19] = t12;
-		$[20] = t13;
-	} else t13 = $[20];
+		$[21] = t12;
+		$[22] = t13;
+	} else t13 = $[22];
 	let t14;
-	if ($[21] !== current || $[22] !== draftId) {
+	if ($[23] !== current || $[24] !== draftId) {
 		t14 = draftId ? draftLabel(current) : "Live";
-		$[21] = current;
-		$[22] = draftId;
-		$[23] = t14;
-	} else t14 = $[23];
+		$[23] = current;
+		$[24] = draftId;
+		$[25] = t14;
+	} else t14 = $[25];
 	let t15;
-	if ($[24] !== t14) {
+	if ($[26] !== t14) {
 		t15 = /* @__PURE__ */ jsx("span", {
 			className: "max-w-48 truncate",
 			children: t14
 		});
-		$[24] = t14;
-		$[25] = t15;
-	} else t15 = $[25];
+		$[26] = t14;
+		$[27] = t15;
+	} else t15 = $[27];
 	let t16;
-	if ($[26] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[28] === Symbol.for("react.memo_cache_sentinel")) {
 		t16 = /* @__PURE__ */ jsx(ChevronsUpDown, {
 			"aria-hidden": true,
 			className: "size-4 opacity-50"
 		});
-		$[26] = t16;
-	} else t16 = $[26];
+		$[28] = t16;
+	} else t16 = $[28];
 	let t17;
-	if ($[27] !== disabled || $[28] !== t13 || $[29] !== t15) {
+	if ($[29] !== disabled || $[30] !== t13 || $[31] !== t15) {
 		t17 = /* @__PURE__ */ jsxs(DropdownMenuTrigger, {
 			disabled,
 			render: t10,
@@ -227,48 +235,48 @@ function DraftPicker(t0) {
 				t16
 			]
 		});
-		$[27] = disabled;
-		$[28] = t13;
-		$[29] = t15;
-		$[30] = t17;
-	} else t17 = $[30];
+		$[29] = disabled;
+		$[30] = t13;
+		$[31] = t15;
+		$[32] = t17;
+	} else t17 = $[32];
 	let t18;
-	if ($[31] !== draftId) {
+	if ($[33] !== draftId) {
 		t18 = !draftId && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(DropdownMenuGroup, { children: /* @__PURE__ */ jsx(DropdownMenuLabel, {
 			className: "text-muted-foreground font-normal",
 			children: "Live is read-only. Your first edit starts a new draft."
 		}) }), /* @__PURE__ */ jsx(DropdownMenuSeparator, {})] });
-		$[31] = draftId;
-		$[32] = t18;
-	} else t18 = $[32];
+		$[33] = draftId;
+		$[34] = t18;
+	} else t18 = $[34];
 	const t19 = draftId ?? LIVE;
 	let t20;
-	if ($[33] !== switchTo) {
+	if ($[35] !== switchTo) {
 		t20 = (value) => switchTo(value === LIVE ? null : String(value));
-		$[33] = switchTo;
-		$[34] = t20;
-	} else t20 = $[34];
+		$[35] = switchTo;
+		$[36] = t20;
+	} else t20 = $[36];
 	let t21;
-	if ($[35] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[37] === Symbol.for("react.memo_cache_sentinel")) {
 		t21 = /* @__PURE__ */ jsx(DropdownMenuLabel, { children: "Switch to" });
-		$[35] = t21;
-	} else t21 = $[35];
+		$[37] = t21;
+	} else t21 = $[37];
 	let t22;
-	if ($[36] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[38] === Symbol.for("react.memo_cache_sentinel")) {
 		t22 = /* @__PURE__ */ jsx("span", { children: "Live" });
-		$[36] = t22;
-	} else t22 = $[36];
+		$[38] = t22;
+	} else t22 = $[38];
 	let t23;
-	if ($[37] !== list) {
+	if ($[39] !== list) {
 		t23 = list && /* @__PURE__ */ jsx("span", {
 			className: "text-muted-foreground text-xs",
 			children: liveLine(list.live)
 		});
-		$[37] = list;
-		$[38] = t23;
-	} else t23 = $[38];
+		$[39] = list;
+		$[40] = t23;
+	} else t23 = $[40];
 	let t24;
-	if ($[39] !== t23) {
+	if ($[41] !== t23) {
 		t24 = /* @__PURE__ */ jsx(DropdownMenuRadioItem, {
 			value: LIVE,
 			closeOnClick: true,
@@ -277,58 +285,58 @@ function DraftPicker(t0) {
 				children: [t22, t23]
 			})
 		});
-		$[39] = t23;
-		$[40] = t24;
-	} else t24 = $[40];
+		$[41] = t23;
+		$[42] = t24;
+	} else t24 = $[42];
 	let t25;
-	if ($[41] !== drafts) {
+	if ($[43] !== drafts) {
 		t25 = drafts.map(_temp6);
-		$[41] = drafts;
-		$[42] = t25;
-	} else t25 = $[42];
+		$[43] = drafts;
+		$[44] = t25;
+	} else t25 = $[44];
 	let t26;
-	if ($[43] !== t24 || $[44] !== t25) {
+	if ($[45] !== t24 || $[46] !== t25) {
 		t26 = /* @__PURE__ */ jsxs(DropdownMenuGroup, { children: [
 			t21,
 			t24,
 			t25
 		] });
-		$[43] = t24;
-		$[44] = t25;
-		$[45] = t26;
-	} else t26 = $[45];
+		$[45] = t24;
+		$[46] = t25;
+		$[47] = t26;
+	} else t26 = $[47];
 	let t27;
-	if ($[46] !== t19 || $[47] !== t20 || $[48] !== t26) {
+	if ($[48] !== t19 || $[49] !== t20 || $[50] !== t26) {
 		t27 = /* @__PURE__ */ jsx(DropdownMenuRadioGroup, {
 			value: t19,
 			onValueChange: t20,
 			children: t26
 		});
-		$[46] = t19;
-		$[47] = t20;
-		$[48] = t26;
-		$[49] = t27;
-	} else t27 = $[49];
+		$[48] = t19;
+		$[49] = t20;
+		$[50] = t26;
+		$[51] = t27;
+	} else t27 = $[51];
 	let t28;
-	if ($[50] !== t18 || $[51] !== t27) {
+	if ($[52] !== t18 || $[53] !== t27) {
 		t28 = /* @__PURE__ */ jsx(DropdownMenuContent, {
 			className: "w-80",
 			align: "start",
 			children: /* @__PURE__ */ jsxs(Fragment, { children: [t18, t27] })
 		});
-		$[50] = t18;
-		$[51] = t27;
-		$[52] = t28;
-	} else t28 = $[52];
+		$[52] = t18;
+		$[53] = t27;
+		$[54] = t28;
+	} else t28 = $[54];
 	let t29;
-	if ($[53] !== t17 || $[54] !== t28) {
+	if ($[55] !== t17 || $[56] !== t28) {
 		t29 = /* @__PURE__ */ jsxs(DropdownMenu, { children: [t17, t28] });
-		$[53] = t17;
-		$[54] = t28;
-		$[55] = t29;
-	} else t29 = $[55];
+		$[55] = t17;
+		$[56] = t28;
+		$[57] = t29;
+	} else t29 = $[57];
 	let t30;
-	if ($[56] !== current?.name || $[57] !== deleting || $[58] !== draftId || $[59] !== leaveDraft || $[60] !== projectId || $[61] !== review) {
+	if ($[58] !== current?.name || $[59] !== deleting || $[60] !== draftId || $[61] !== leaveDraft || $[62] !== projectId || $[63] !== review) {
 		t30 = draftId && projectId && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(ReviewDraftSheet, {
 			projectId,
 			draftId,
@@ -342,21 +350,21 @@ function DraftPicker(t0) {
 			onOpenChange: _temp8,
 			onDeleted: (ended) => leaveDraft(ended, { discarded: current?.name === null })
 		})] });
-		$[56] = current?.name;
-		$[57] = deleting;
-		$[58] = draftId;
-		$[59] = leaveDraft;
-		$[60] = projectId;
-		$[61] = review;
-		$[62] = t30;
-	} else t30 = $[62];
+		$[58] = current?.name;
+		$[59] = deleting;
+		$[60] = draftId;
+		$[61] = leaveDraft;
+		$[62] = projectId;
+		$[63] = review;
+		$[64] = t30;
+	} else t30 = $[64];
 	let t31;
-	if ($[63] !== t29 || $[64] !== t30) {
+	if ($[65] !== t29 || $[66] !== t30) {
 		t31 = /* @__PURE__ */ jsxs(Fragment, { children: [t29, t30] });
-		$[63] = t29;
-		$[64] = t30;
-		$[65] = t31;
-	} else t31 = $[65];
+		$[65] = t29;
+		$[66] = t30;
+		$[67] = t31;
+	} else t31 = $[67];
 	return t31;
 }
 function _temp8(open_0) {
@@ -365,8 +373,8 @@ function _temp8(open_0) {
 function _temp7(open) {
 	if (!open) studioStore.send({ type: "closeReviewDraftSheet" });
 }
-function _temp6(draft) {
-	return /* @__PURE__ */ jsx(DraftItem, { draft }, draft.id);
+function _temp6(draft_0) {
+	return /* @__PURE__ */ jsx(DraftItem, { draft: draft_0 }, draft_0.id);
 }
 function _temp5() {
 	return _temp4;
@@ -374,7 +382,6 @@ function _temp5() {
 function _temp4() {
 	studioStore.send({ type: "closeReviewDraftSheet" });
 	studioStore.send({ type: "closeDeleteDraftDialog" });
-	studioStore.send({ type: "closeKeepDraft" });
 }
 function _temp3(t0) {
 	const { move } = t0;
@@ -387,47 +394,6 @@ function _temp(state) {
 	return state.context.reviewDraftSheet;
 }
 /**
-* The current draft's pending changes, which open its review to publish or delete them. Live
-* has none, so it shows nothing there. An unnamed draft shows the Unnamed Draft Bar instead.
-*/
-function PendingChanges() {
-	const $ = c(7);
-	const { current } = useDrafts();
-	if (!current || current.name === null) return null;
-	let t0;
-	if ($[0] !== current.changeCount) {
-		t0 = plural(current.changeCount, "change");
-		$[0] = current.changeCount;
-		$[1] = t0;
-	} else t0 = $[1];
-	const t1 = `Review ${t0}`;
-	let t2;
-	if ($[2] !== current.changeCount) {
-		t2 = /* @__PURE__ */ jsx(Badge, {
-			className: "bg-primary-foreground/20 text-primary-foreground min-w-5 px-1.5 tabular-nums",
-			children: current.changeCount
-		});
-		$[2] = current.changeCount;
-		$[3] = t2;
-	} else t2 = $[3];
-	let t3;
-	if ($[4] !== t1 || $[5] !== t2) {
-		t3 = /* @__PURE__ */ jsxs(Button, {
-			type: "button",
-			"aria-label": t1,
-			onClick: _temp9,
-			children: ["Review changes", t2]
-		});
-		$[4] = t1;
-		$[5] = t2;
-		$[6] = t3;
-	} else t3 = $[6];
-	return t3;
-}
-function _temp9() {
-	return studioStore.send({ type: "openReviewDraftSheet" });
-}
-/**
 * The drafts controls' actions in the command palette, offered where the controls offer them. The palette only opens the review and the delete confirmation; it never publishes or
 * deletes by itself.
 */
@@ -453,7 +419,7 @@ function useDraftsActions(t0) {
 					],
 					groupLabel: "Drafts",
 					checkIfAvailable: () => inDraft,
-					execute: _temp10
+					execute: _temp9
 				},
 				{
 					id: "delete-draft",
@@ -469,22 +435,15 @@ function useDraftsActions(t0) {
 					],
 					groupLabel: "Drafts",
 					checkIfAvailable: () => inDraft,
-					execute: _temp11
+					execute: _temp10
 				},
 				{
 					id: "rename-draft",
-					label: unnamed ? "Keep as draft…" : "Rename draft…",
-					aliases: unnamed ? [
-						"Name draft",
-						"Rename draft",
-						"Save draft"
-					] : ["Name draft"],
+					label: unnamed ? "Name draft…" : "Rename draft…",
+					aliases: unnamed ? ["Rename draft", "Save draft"] : ["Name draft"],
 					groupLabel: "Drafts",
 					checkIfAvailable: () => inDraft,
-					execute: () => studioStore.send(unnamed ? { type: "openKeepDraft" } : {
-						type: "openReviewDraftSheet",
-						startRenaming: true
-					})
+					execute: _temp11
 				},
 				{
 					id: "switch-to-live",
@@ -561,9 +520,15 @@ function _temp13() {
 }
 function _temp12() {}
 function _temp11() {
-	return studioStore.send({ type: "openDeleteDraftDialog" });
+	return studioStore.send({
+		type: "openReviewDraftSheet",
+		startRenaming: true
+	});
 }
 function _temp10() {
+	return studioStore.send({ type: "openDeleteDraftDialog" });
+}
+function _temp9() {
 	return studioStore.send({ type: "openReviewDraftSheet" });
 }
 /** Who published Live last and when: a member, a release, or nobody yet. */
@@ -648,4 +613,4 @@ function DraftItem(t0) {
 }
 
 //#endregion
-export { DraftPicker, PendingChanges, useDrafts };
+export { DraftPicker, useDrafts };

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

@@ -9,6 +9,7 @@ import { usePageDestinations } from "../../../hooks/use-page-destinations.js";
 import { useLocalePath } from "../../../lib/view-locale.js";
 import { studioStore } from "../studioStore.js";
 import { localeLabel, localeOptions } from "../localeOptions.js";
+import { useSwitchView } from "../viewSwitch.js";
 import { pathInLocale } from "../localeSwitch.js";
 import { c } from "react/compiler-runtime";
 import * as React from "react";
@@ -283,7 +284,7 @@ function LocalePicker(t0) {
 			projectId,
 			locales,
 			open: dialog === "add",
-			onAdded: (added) => void switchTo(added)
+			onAdded: (added) => switchTo(added)
 		}), !viewed.isDefault && /* @__PURE__ */ jsx(RemoveLocaleDialog, {
 			projectId,
 			locale: viewed,
@@ -385,7 +386,7 @@ function TranslatingSpinner(t0) {
 * its home.
 */
 function useSwitchLocale(recordPage) {
-	const $ = c(10);
+	const $ = c(15);
 	const navigate = useNavigate();
 	const cache = useStudioCache();
 	const projectUuid = useProjectUuid();
@@ -401,7 +402,6 @@ function useSwitchLocale(recordPage) {
 	let t1;
 	if ($[1] !== cache || $[2] !== destinations || $[3] !== navigate || $[4] !== path || $[5] !== projectUuid || $[6] !== recordPage || $[7] !== search || $[8] !== view.locale) {
 		t1 = async (target) => {
-			if (target.tag === view.locale.tag && target.isDefault === view.locale.isDefault) return;
 			const pagesIn = (locale) => cache.ensure(reads.pageList({ projectUuid }), { locale }).catch(_temp8);
 			const recordPath = recordPage ? cache.reload(reads.discoveredPath({
 				projectUuid,
@@ -426,7 +426,25 @@ function useSwitchLocale(recordPage) {
 		$[8] = view.locale;
 		$[9] = t1;
 	} else t1 = $[9];
-	return t1;
+	const switchTo = t1;
+	const switchView = useSwitchView();
+	let t2;
+	if ($[10] !== switchTo || $[11] !== switchView || $[12] !== view.locale.isDefault || $[13] !== view.locale.tag) {
+		t2 = (target_0) => {
+			if (target_0.tag === view.locale.tag && target_0.isDefault === view.locale.isDefault) return;
+			const label = localeLabel(target_0.tag);
+			switchView(() => switchTo(target_0), {
+				loading: `Switching to ${label}…`,
+				success: `You're now viewing ${label}.`
+			});
+		};
+		$[10] = switchTo;
+		$[11] = switchView;
+		$[12] = view.locale.isDefault;
+		$[13] = view.locale.tag;
+		$[14] = t2;
+	} else t2 = $[14];
+	return t2;
 }
 function _temp9() {
 	return null;