@questpie/admin 3.2.4 → 3.2.6

package/dist/client/components/history-sidebar.mjs

@@ -9,9 +9,8 @@ import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "./
 import { Skeleton } from "./ui/skeleton.mjs";
 import { EmptyState } from "./ui/empty-state.mjs";
 import { ScrollFade } from "./ui/scroll-fade.mjs";
-import { c } from "react/compiler-runtime";
 import { Icon } from "@iconify/react";
-import "react";
+import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/client/components/history-sidebar.tsx
@@ -245,38 +244,20 @@ function formatFieldValue({ field, value, t, locale, resolveText }) {
 	}
 	return { summary: String(value) };
 }
-function ValuePreview(t0) {
-	const $ = c(13);
-	const { field, value, t, locale, resolveText } = t0;
-	let t1;
-	if ($[0] !== field || $[1] !== locale || $[2] !== resolveText || $[3] !== t || $[4] !== value) {
-		t1 = formatFieldValue({
-			field,
-			value,
-			t,
-			locale,
-			resolveText
-		});
-		$[0] = field;
-		$[1] = locale;
-		$[2] = resolveText;
-		$[3] = t;
-		$[4] = value;
-		$[5] = t1;
-	} else t1 = $[5];
-	const formatted = t1;
-	let t2;
-	if ($[6] !== formatted.summary) {
-		t2 = /* @__PURE__ */ jsx("div", {
+function ValuePreview({ field, value, t, locale, resolveText }) {
+	const formatted = formatFieldValue({
+		field,
+		value,
+		t,
+		locale,
+		resolveText
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: "min-w-0 space-y-2",
+		children: [/* @__PURE__ */ jsx("div", {
 			className: "text-foreground text-xs leading-relaxed text-pretty break-words",
 			children: formatted.summary
-		});
-		$[6] = formatted.summary;
-		$[7] = t2;
-	} else t2 = $[7];
-	let t3;
-	if ($[8] !== formatted.detail) {
-		t3 = formatted.detail && /* @__PURE__ */ jsx(ScrollFade, {
+		}), formatted.detail && /* @__PURE__ */ jsx(ScrollFade, {
 			orientation: "both",
 			fadeSize: 16,
 			children: /* @__PURE__ */ jsx("pre", {
@@ -284,21 +265,8 @@ function ValuePreview(t0) {
 				className: "control-surface text-muted-foreground h-auto max-h-36 overflow-auto p-2 font-mono text-[0.6875rem] leading-relaxed whitespace-pre-wrap",
 				children: formatted.detail
 			})
-		});
-		$[8] = formatted.detail;
-		$[9] = t3;
-	} else t3 = $[9];
-	let t4;
-	if ($[10] !== t2 || $[11] !== t3) {
-		t4 = /* @__PURE__ */ jsxs("div", {
-			className: "min-w-0 space-y-2",
-			children: [t2, t3]
-		});
-		$[10] = t2;
-		$[11] = t3;
-		$[12] = t4;
-	} else t4 = $[12];
-	return t4;
+		})]
+	});
 }
 function getDiffKind(from, to) {
 	if (isEmptyValue(from) && !isEmptyValue(to)) return "added";
@@ -324,61 +292,27 @@ function getDiffKindConfig(kind) {
 		};
 	}
 }
-function VersionDiffPanel(t0) {
-	const $ = c(26);
-	const { previousVersion, changes, fields } = t0;
+function VersionDiffPanel({ previousVersion, changes, fields }) {
 	const { t, locale } = useTranslation();
 	const resolveText = useResolveText();
 	const previousNumber = previousVersion?.versionNumber;
-	if (changes.length === 0) {
-		let t1$1;
-		if ($[0] !== t) {
-			t1$1 = t("history.noFieldChanges");
-			$[0] = t;
-			$[1] = t1$1;
-		} else t1$1 = $[1];
-		let t2$1;
-		if ($[2] !== t1$1) {
-			t2$1 = /* @__PURE__ */ jsx(EmptyState, {
-				title: t1$1,
-				iconName: "ph:git-diff",
-				height: "h-32",
-				className: "panel-surface"
-			});
-			$[2] = t1$1;
-			$[3] = t2$1;
-		} else t2$1 = $[3];
-		return t2$1;
-	}
-	let t1;
-	if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
-		t1 = /* @__PURE__ */ jsx(Icon, {
-			icon: "ph:git-diff",
-			className: "size-3.5"
-		});
-		$[4] = t1;
-	} else t1 = $[4];
-	let t2;
-	if ($[5] !== previousNumber || $[6] !== t) {
-		t2 = previousNumber ? t("history.diffAgainstVersion", { number: previousNumber }) : t("history.initialSnapshot");
-		$[5] = previousNumber;
-		$[6] = t;
-		$[7] = t2;
-	} else t2 = $[7];
-	let t3;
-	if ($[8] !== t2) {
-		t3 = /* @__PURE__ */ jsxs("div", {
+	if (changes.length === 0) return /* @__PURE__ */ jsx(EmptyState, {
+		title: t("history.noFieldChanges"),
+		iconName: "ph:git-diff",
+		height: "h-32",
+		className: "panel-surface"
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-3",
+		children: [/* @__PURE__ */ jsxs("div", {
 			className: "text-muted-foreground flex items-center gap-2 text-xs text-pretty",
-			children: [t1, /* @__PURE__ */ jsx("span", { children: t2 })]
-		});
-		$[8] = t2;
-		$[9] = t3;
-	} else t3 = $[9];
-	let t4;
-	if ($[10] !== changes || $[11] !== fields || $[12] !== locale || $[13] !== resolveText || $[14] !== t) {
-		let t5$1;
-		if ($[16] !== fields || $[17] !== locale || $[18] !== resolveText || $[19] !== t) {
-			t5$1 = (change) => {
+			children: [/* @__PURE__ */ jsx(Icon, {
+				icon: "ph:git-diff",
+				className: "size-3.5"
+			}), /* @__PURE__ */ jsx("span", { children: previousNumber ? t("history.diffAgainstVersion", { number: previousNumber }) : t("history.initialSnapshot") })]
+		}), /* @__PURE__ */ jsx("div", {
+			className: "space-y-2",
+			children: changes.map((change) => {
 				const field = fields?.[change.name];
 				const kind = getDiffKindConfig(change.kind);
 				return /* @__PURE__ */ jsxs("div", {
@@ -459,430 +393,244 @@ function VersionDiffPanel(t0) {
 						})
 					]
 				}, change.name);
-			};
-			$[16] = fields;
-			$[17] = locale;
-			$[18] = resolveText;
-			$[19] = t;
-			$[20] = t5$1;
-		} else t5$1 = $[20];
-		t4 = changes.map(t5$1);
-		$[10] = changes;
-		$[11] = fields;
-		$[12] = locale;
-		$[13] = resolveText;
-		$[14] = t;
-		$[15] = t4;
-	} else t4 = $[15];
-	let t5;
-	if ($[21] !== t4) {
-		t5 = /* @__PURE__ */ jsx("div", {
-			className: "space-y-2",
-			children: t4
-		});
-		$[21] = t4;
-		$[22] = t5;
-	} else t5 = $[22];
-	let t6;
-	if ($[23] !== t3 || $[24] !== t5) {
-		t6 = /* @__PURE__ */ jsxs("div", {
-			className: "space-y-3",
-			children: [t3, t5]
-		});
-		$[23] = t3;
-		$[24] = t5;
-		$[25] = t6;
-	} else t6 = $[25];
-	return t6;
-}
-function HistoryListSkeleton(t0) {
-	const $ = c(2);
-	const { rows: t1 } = t0;
-	const rows = t1 === void 0 ? 4 : t1;
-	let t2;
-	if ($[0] !== rows) {
-		t2 = /* @__PURE__ */ jsx("div", {
-			className: "space-y-4 py-2",
-			"aria-busy": "true",
-			children: Array.from({ length: rows }, _temp)
-		});
-		$[0] = rows;
-		$[1] = t2;
-	} else t2 = $[1];
-	return t2;
+			})
+		})]
+	});
 }
-function _temp(_, index) {
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex gap-3",
-		children: [/* @__PURE__ */ jsx(Skeleton, { className: "mt-1 size-7 shrink-0 rounded-full" }), /* @__PURE__ */ jsxs("div", {
-			className: "min-w-0 flex-1 space-y-2",
-			children: [/* @__PURE__ */ jsx(Skeleton, {
-				variant: "text",
-				className: "h-4 w-28"
-			}), /* @__PURE__ */ jsx(Skeleton, {
-				variant: "text",
-				className: "h-3 w-40"
+function HistoryListSkeleton({ rows = 4 }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "space-y-4 py-2",
+		"aria-busy": "true",
+		children: Array.from({ length: rows }, (_, index) => /* @__PURE__ */ jsxs("div", {
+			className: "flex gap-3",
+			children: [/* @__PURE__ */ jsx(Skeleton, { className: "mt-1 size-7 shrink-0 rounded-full" }), /* @__PURE__ */ jsxs("div", {
+				className: "min-w-0 flex-1 space-y-2",
+				children: [/* @__PURE__ */ jsx(Skeleton, {
+					variant: "text",
+					className: "h-4 w-28"
+				}), /* @__PURE__ */ jsx(Skeleton, {
+					variant: "text",
+					className: "h-3 w-40"
+				})]
 			})]
-		})]
-	}, index);
+		}, index))
+	});
 }
-function ActivityTimeline(t0) {
-	const $ = c(13);
-	const { entries, isLoading } = t0;
+function ActivityTimeline({ entries, isLoading }) {
 	const { locale, t } = useTranslation();
-	if (isLoading) {
-		let t1$1;
-		if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-			t1$1 = /* @__PURE__ */ jsx(HistoryListSkeleton, {});
-			$[0] = t1$1;
-		} else t1$1 = $[0];
-		return t1$1;
-	}
-	if (entries.length === 0) {
-		let t1$1;
-		if ($[1] !== t) {
-			t1$1 = t("history.empty");
-			$[1] = t;
-			$[2] = t1$1;
-		} else t1$1 = $[2];
-		let t2$1;
-		if ($[3] !== t1$1) {
-			t2$1 = /* @__PURE__ */ jsx(EmptyState, {
-				title: t1$1,
-				iconName: "ph:clock-counter-clockwise",
-				height: "h-48"
-			});
-			$[3] = t1$1;
-			$[4] = t2$1;
-		} else t2$1 = $[4];
-		return t2$1;
-	}
-	let t1;
-	if ($[5] !== entries || $[6] !== locale) {
-		let t2$1;
-		if ($[8] !== entries.length || $[9] !== locale) {
-			t2$1 = (entry, index) => {
-				const config = getActionConfig(entry.action);
-				const date = new Date(entry.createdAt);
-				const isLast = index === entries.length - 1;
-				return /* @__PURE__ */ jsxs("div", {
-					className: "flex gap-3",
-					children: [/* @__PURE__ */ jsxs("div", {
-						className: "flex flex-col items-center",
-						children: [/* @__PURE__ */ jsx("div", { className: `mt-1.5 size-2.5 shrink-0 rounded-full ${config.color}` }), !isLast && /* @__PURE__ */ jsx("div", { className: "bg-border min-h-4 w-px flex-1" })]
-					}), /* @__PURE__ */ jsx("div", {
-						className: "min-w-0 flex-1 pb-4",
-						children: /* @__PURE__ */ jsxs("div", {
-							className: "flex items-start justify-between gap-2",
-							children: [/* @__PURE__ */ jsx("p", {
-								className: "text-sm leading-snug",
-								children: entry.title
-							}), /* @__PURE__ */ jsx("span", {
-								className: "text-muted-foreground shrink-0 text-xs whitespace-nowrap",
-								children: formatRelativeTime(date, locale)
-							})]
-						})
-					})]
-				}, entry.id);
-			};
-			$[8] = entries.length;
-			$[9] = locale;
-			$[10] = t2$1;
-		} else t2$1 = $[10];
-		t1 = entries.map(t2$1);
-		$[5] = entries;
-		$[6] = locale;
-		$[7] = t1;
-	} else t1 = $[7];
-	let t2;
-	if ($[11] !== t1) {
-		t2 = /* @__PURE__ */ jsx("div", {
-			className: "space-y-0",
-			children: t1
-		});
-		$[11] = t1;
-		$[12] = t2;
-	} else t2 = $[12];
-	return t2;
+	if (isLoading) return /* @__PURE__ */ jsx(HistoryListSkeleton, {});
+	if (entries.length === 0) return /* @__PURE__ */ jsx(EmptyState, {
+		title: t("history.empty"),
+		iconName: "ph:clock-counter-clockwise",
+		height: "h-48"
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className: "space-y-0",
+		children: entries.map((entry, index) => {
+			const config = getActionConfig(entry.action);
+			const date = new Date(entry.createdAt);
+			const isLast = index === entries.length - 1;
+			return /* @__PURE__ */ jsxs("div", {
+				className: "flex gap-3",
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: "flex flex-col items-center",
+					children: [/* @__PURE__ */ jsx("div", { className: `mt-1.5 size-2.5 shrink-0 rounded-full ${config.color}` }), !isLast && /* @__PURE__ */ jsx("div", { className: "bg-border min-h-4 w-px flex-1" })]
+				}), /* @__PURE__ */ jsx("div", {
+					className: "min-w-0 flex-1 pb-4",
+					children: /* @__PURE__ */ jsxs("div", {
+						className: "flex items-start justify-between gap-2",
+						children: [/* @__PURE__ */ jsx("p", {
+							className: "text-sm leading-snug",
+							children: entry.title
+						}), /* @__PURE__ */ jsx("span", {
+							className: "text-muted-foreground shrink-0 text-xs whitespace-nowrap",
+							children: formatRelativeTime(date, locale)
+						})]
+					})
+				})]
+			}, entry.id);
+		})
+	});
 }
-function VersionsList(t0) {
-	const $ = c(41);
-	const { versions, fields, isLoading, isReverting, onRevert } = t0;
+function VersionsList({ versions, fields, isLoading, isReverting, onRevert }) {
 	const { formatDate, locale, t } = useTranslation();
 	const resolveText = useResolveText();
-	let t1;
-	if ($[0] !== versions) {
-		t1 = versions.slice().sort(_temp2);
-		$[0] = versions;
-		$[1] = t1;
-	} else t1 = $[1];
-	const sortedAscVersions = t1;
-	let t2;
-	if ($[2] !== versions) {
-		t2 = versions.slice().sort(_temp3);
-		$[2] = versions;
-		$[3] = t2;
-	} else t2 = $[3];
-	const sortedVersions = t2;
-	let t3;
-	bb0: {
-		if (fields && Object.keys(fields).length > 0) {
-			t3 = fields;
-			break bb0;
+	const sortedAscVersions = React.useMemo(() => {
+		return versions.slice().sort((a, b) => {
+			return (a.versionNumber ?? 0) - (b.versionNumber ?? 0);
+		});
+	}, [versions]);
+	const sortedVersions = React.useMemo(() => versions.slice().sort((a, b) => {
+		const aNum = a.versionNumber ?? 0;
+		return (b.versionNumber ?? 0) - aNum;
+	}), [versions]);
+	const fieldsForDiff = React.useMemo(() => {
+		if (fields && Object.keys(fields).length > 0) return fields;
+		const inferred = {};
+		for (const version of versions) for (const key of Object.keys(version)) {
+			if (VERSION_META_KEYS.has(key)) continue;
+			inferred[key] = {
+				name: key,
+				metadata: {
+					type: "unknown",
+					label: formatLabel(key)
+				}
+			};
 		}
-		let inferred;
-		if ($[4] !== versions) {
-			inferred = {};
-			for (const version of versions) for (const key of Object.keys(version)) {
-				if (VERSION_META_KEYS.has(key)) continue;
-				inferred[key] = {
-					name: key,
-					metadata: {
-						type: "unknown",
-						label: formatLabel(key)
-					}
-				};
-			}
-			$[4] = versions;
-			$[5] = inferred;
-		} else inferred = $[5];
-		t3 = inferred;
-	}
-	const fieldsForDiff = t3;
-	let byKey;
-	if ($[6] !== fieldsForDiff || $[7] !== resolveText || $[8] !== sortedAscVersions) {
-		byKey = /* @__PURE__ */ new Map();
-		for (let index = 0; index < sortedAscVersions.length; index = index + 1) {
-			const version_0 = sortedAscVersions[index];
+		return inferred;
+	}, [fields, versions]);
+	const versionDetails = React.useMemo(() => {
+		const byKey = /* @__PURE__ */ new Map();
+		for (let index = 0; index < sortedAscVersions.length; index += 1) {
+			const version = sortedAscVersions[index];
 			const previousVersion = sortedAscVersions[index - 1];
-			const key_0 = getVersionKey(version_0, index);
-			byKey.set(key_0, {
-				key: key_0,
+			const key = getVersionKey(version, index);
+			byKey.set(key, {
+				key,
 				previousVersion,
 				changes: buildVersionDiff({
-					version: version_0,
+					version,
 					previousVersion,
 					fields: fieldsForDiff,
 					resolveText
 				})
 			});
 		}
-		$[6] = fieldsForDiff;
-		$[7] = resolveText;
-		$[8] = sortedAscVersions;
-		$[9] = byKey;
-	} else byKey = $[9];
-	const versionDetails = byKey;
-	let t4;
-	if ($[10] !== t) {
-		t4 = function operationLabel$1(operation) {
-			switch (operation) {
-				case "create": return t("version.operationCreate");
-				case "delete": return t("version.operationDelete");
-				case "update": return t("version.operationUpdate");
-				default: return operation || t("version.operationUnknown");
-			}
-		};
-		$[10] = t;
-		$[11] = t4;
-	} else t4 = $[11];
-	const operationLabel = t4;
-	let t5;
-	if ($[12] !== formatDate) {
-		t5 = (value) => {
-			if (!value) return "-";
-			const date = new Date(value);
-			if (Number.isNaN(date.getTime())) return "-";
-			return formatDate(date, {
-				dateStyle: "medium",
-				timeStyle: "short"
-			});
-		};
-		$[12] = formatDate;
-		$[13] = t5;
-	} else t5 = $[13];
-	const formatDateTime = t5;
-	if (isLoading) {
-		let t6$1;
-		if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
-			t6$1 = /* @__PURE__ */ jsx(HistoryListSkeleton, {});
-			$[14] = t6$1;
-		} else t6$1 = $[14];
-		return t6$1;
-	}
-	if (sortedVersions.length === 0) {
-		let t6$1;
-		if ($[15] !== t) {
-			t6$1 = t("version.empty");
-			$[15] = t;
-			$[16] = t6$1;
-		} else t6$1 = $[16];
-		let t7$1;
-		if ($[17] !== t6$1) {
-			t7$1 = /* @__PURE__ */ jsx(EmptyState, {
-				title: t6$1,
-				iconName: "ph:clock-counter-clockwise",
-				height: "h-48"
-			});
-			$[17] = t6$1;
-			$[18] = t7$1;
-		} else t7$1 = $[18];
-		return t7$1;
+		return byKey;
+	}, [
+		fieldsForDiff,
+		resolveText,
+		sortedAscVersions
+	]);
+	function operationLabel(operation) {
+		switch (operation) {
+			case "create": return t("version.operationCreate");
+			case "delete": return t("version.operationDelete");
+			case "update": return t("version.operationUpdate");
+			default: return operation || t("version.operationUnknown");
+		}
 	}
-	let t6;
-	if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
-		t6 = [];
-		$[19] = t6;
-	} else t6 = $[19];
-	let t7;
-	if ($[20] !== fieldsForDiff || $[21] !== formatDateTime || $[22] !== isReverting || $[23] !== locale || $[24] !== onRevert || $[25] !== operationLabel || $[26] !== sortedVersions || $[27] !== t || $[28] !== versionDetails) {
-		let t8$1;
-		if ($[30] !== fieldsForDiff || $[31] !== formatDateTime || $[32] !== isReverting || $[33] !== locale || $[34] !== onRevert || $[35] !== operationLabel || $[36] !== t || $[37] !== versionDetails) {
-			t8$1 = (version_1, index_0) => {
-				const key_1 = getVersionKey(version_1, index_0);
-				const details = versionDetails.get(key_1);
-				const changes = details?.changes ?? [];
-				const visibleChangedFields = changes.slice(0, 3);
-				const remainingChangedFields = Math.max(0, changes.length - visibleChangedFields.length);
-				const changedPreview = visibleChangedFields.map(_temp4).join(", ");
-				const date_0 = version_1.versionCreatedAt ? new Date(version_1.versionCreatedAt) : null;
-				const canRevert = typeof version_1.versionId === "string" || typeof version_1.versionNumber === "number";
-				const action = getActionConfig(version_1.versionOperation ?? "");
-				return /* @__PURE__ */ jsxs(AccordionItem, {
-					value: key_1,
-					className: "px-0",
-					children: [/* @__PURE__ */ jsx(AccordionTrigger, {
-						className: "min-h-20 items-start px-3 py-3 hover:no-underline",
-						children: /* @__PURE__ */ jsxs("div", {
-							className: "flex min-w-0 flex-1 flex-col gap-2",
-							children: [
-								/* @__PURE__ */ jsxs("div", {
-									className: "flex flex-wrap items-center gap-2",
-									children: [
-										/* @__PURE__ */ jsx(Badge, {
-											variant: "secondary",
-											className: "tabular-nums",
-											children: t("version.label", { number: version_1.versionNumber ?? "-" })
-										}),
-										/* @__PURE__ */ jsxs(Badge, {
-											variant: "outline",
-											className: cn(action.badge),
-											children: [/* @__PURE__ */ jsx(Icon, {
-												icon: action.icon,
-												className: "size-2.5"
-											}), operationLabel(version_1.versionOperation)]
-										}),
-										version_1.versionStage && /* @__PURE__ */ jsxs(Badge, {
-											variant: "outline",
-											children: [
-												t("history.stage"),
-												": ",
-												version_1.versionStage
-											]
-										}),
-										/* @__PURE__ */ jsx(Badge, {
-											variant: "outline",
-											className: "tabular-nums",
-											children: t("history.changedFields", { count: changes.length })
-										})
-									]
-								}),
-								/* @__PURE__ */ jsxs("div", {
-									className: "text-muted-foreground flex flex-wrap items-center gap-x-3 gap-y-1 text-xs",
-									children: [
-										/* @__PURE__ */ jsx("span", {
-											className: "tabular-nums",
-											children: date_0 ? formatDateTime(version_1.versionCreatedAt) : "-"
-										}),
-										date_0 && /* @__PURE__ */ jsx("span", {
-											className: "tabular-nums",
-											children: formatRelativeTime(date_0, locale)
-										}),
-										/* @__PURE__ */ jsxs("span", { children: [
-											t("version.user"),
-											":",
-											" ",
-											version_1.versionUserId || t("history.systemUser")
-										] })
-									]
-								}),
-								/* @__PURE__ */ jsxs("p", {
-									className: "text-muted-foreground truncate text-xs text-pretty",
-									children: [changedPreview || t("history.noFieldChanges"), remainingChangedFields > 0 && ` + ${t("history.moreFields", { count: remainingChangedFields })}`]
-								})
-							]
-						})
-					}), /* @__PURE__ */ jsxs(AccordionContent, {
-						className: "px-3 pt-0 pb-3",
+	const formatDateTime = (value) => {
+		if (!value) return "-";
+		const date = new Date(value);
+		if (Number.isNaN(date.getTime())) return "-";
+		return formatDate(date, {
+			dateStyle: "medium",
+			timeStyle: "short"
+		});
+	};
+	if (isLoading) return /* @__PURE__ */ jsx(HistoryListSkeleton, {});
+	if (sortedVersions.length === 0) return /* @__PURE__ */ jsx(EmptyState, {
+		title: t("version.empty"),
+		iconName: "ph:clock-counter-clockwise",
+		height: "h-48"
+	});
+	return /* @__PURE__ */ jsx(Accordion, {
+		defaultValue: [],
+		className: "panel-surface bg-card",
+		children: sortedVersions.map((version, index) => {
+			const key = getVersionKey(version, index);
+			const details = versionDetails.get(key);
+			const changes = details?.changes ?? [];
+			const visibleChangedFields = changes.slice(0, 3);
+			const remainingChangedFields = Math.max(0, changes.length - visibleChangedFields.length);
+			const changedPreview = visibleChangedFields.map((change) => change.label).join(", ");
+			const date = version.versionCreatedAt ? new Date(version.versionCreatedAt) : null;
+			const canRevert = typeof version.versionId === "string" || typeof version.versionNumber === "number";
+			const action = getActionConfig(version.versionOperation ?? "");
+			return /* @__PURE__ */ jsxs(AccordionItem, {
+				value: key,
+				className: "px-0",
+				children: [/* @__PURE__ */ jsx(AccordionTrigger, {
+					className: "min-h-20 items-start px-3 py-3 hover:no-underline",
+					children: /* @__PURE__ */ jsxs("div", {
+						className: "flex min-w-0 flex-1 flex-col gap-2",
 						children: [
-							/* @__PURE__ */ jsx(Separator, { className: "mb-3" }),
-							/* @__PURE__ */ jsx("div", {
-								className: "space-y-3",
-								children: /* @__PURE__ */ jsx(VersionDiffPanel, {
-									previousVersion: details?.previousVersion,
-									changes,
-									fields: fieldsForDiff
-								})
+							/* @__PURE__ */ jsxs("div", {
+								className: "flex flex-wrap items-center gap-2",
+								children: [
+									/* @__PURE__ */ jsx(Badge, {
+										variant: "secondary",
+										className: "tabular-nums",
+										children: t("version.label", { number: version.versionNumber ?? "-" })
+									}),
+									/* @__PURE__ */ jsxs(Badge, {
+										variant: "outline",
+										className: cn(action.badge),
+										children: [/* @__PURE__ */ jsx(Icon, {
+											icon: action.icon,
+											className: "size-2.5"
+										}), operationLabel(version.versionOperation)]
+									}),
+									version.versionStage && /* @__PURE__ */ jsxs(Badge, {
+										variant: "outline",
+										children: [
+											t("history.stage"),
+											": ",
+											version.versionStage
+										]
+									}),
+									/* @__PURE__ */ jsx(Badge, {
+										variant: "outline",
+										className: "tabular-nums",
+										children: t("history.changedFields", { count: changes.length })
+									})
+								]
 							}),
-							onRevert && /* @__PURE__ */ jsx("div", {
-								className: "mt-3 flex justify-end",
-								children: /* @__PURE__ */ jsx(Button, {
-									variant: "outline",
-									size: "sm",
-									disabled: !canRevert || isReverting,
-									onClick: () => {
-										onRevert(version_1);
-									},
-									children: t("version.revert")
-								})
+							/* @__PURE__ */ jsxs("div", {
+								className: "text-muted-foreground flex flex-wrap items-center gap-x-3 gap-y-1 text-xs",
+								children: [
+									/* @__PURE__ */ jsx("span", {
+										className: "tabular-nums",
+										children: date ? formatDateTime(version.versionCreatedAt) : "-"
+									}),
+									date && /* @__PURE__ */ jsx("span", {
+										className: "tabular-nums",
+										children: formatRelativeTime(date, locale)
+									}),
+									/* @__PURE__ */ jsxs("span", { children: [
+										t("version.user"),
+										":",
+										" ",
+										version.versionUserId || t("history.systemUser")
+									] })
+								]
+							}),
+							/* @__PURE__ */ jsxs("p", {
+								className: "text-muted-foreground truncate text-xs text-pretty",
+								children: [changedPreview || t("history.noFieldChanges"), remainingChangedFields > 0 && ` + ${t("history.moreFields", { count: remainingChangedFields })}`]
 							})
 						]
-					})]
-				}, key_1);
-			};
-			$[30] = fieldsForDiff;
-			$[31] = formatDateTime;
-			$[32] = isReverting;
-			$[33] = locale;
-			$[34] = onRevert;
-			$[35] = operationLabel;
-			$[36] = t;
-			$[37] = versionDetails;
-			$[38] = t8$1;
-		} else t8$1 = $[38];
-		t7 = sortedVersions.map(t8$1);
-		$[20] = fieldsForDiff;
-		$[21] = formatDateTime;
-		$[22] = isReverting;
-		$[23] = locale;
-		$[24] = onRevert;
-		$[25] = operationLabel;
-		$[26] = sortedVersions;
-		$[27] = t;
-		$[28] = versionDetails;
-		$[29] = t7;
-	} else t7 = $[29];
-	let t8;
-	if ($[39] !== t7) {
-		t8 = /* @__PURE__ */ jsx(Accordion, {
-			defaultValue: t6,
-			className: "panel-surface bg-card",
-			children: t7
-		});
-		$[39] = t7;
-		$[40] = t8;
-	} else t8 = $[40];
-	return t8;
-}
-function _temp4(change) {
-	return change.label;
-}
-function _temp3(a_0, b_0) {
-	const aNum_0 = a_0.versionNumber ?? 0;
-	return (b_0.versionNumber ?? 0) - aNum_0;
-}
-function _temp2(a, b) {
-	return (a.versionNumber ?? 0) - (b.versionNumber ?? 0);
+					})
+				}), /* @__PURE__ */ jsxs(AccordionContent, {
+					className: "px-3 pt-0 pb-3",
+					children: [
+						/* @__PURE__ */ jsx(Separator, { className: "mb-3" }),
+						/* @__PURE__ */ jsx("div", {
+							className: "space-y-3",
+							children: /* @__PURE__ */ jsx(VersionDiffPanel, {
+								previousVersion: details?.previousVersion,
+								changes,
+								fields: fieldsForDiff
+							})
+						}),
+						onRevert && /* @__PURE__ */ jsx("div", {
+							className: "mt-3 flex justify-end",
+							children: /* @__PURE__ */ jsx(Button, {
+								variant: "outline",
+								size: "sm",
+								disabled: !canRevert || isReverting,
+								onClick: () => {
+									onRevert(version);
+								},
+								children: t("version.revert")
+							})
+						})
+					]
+				})]
+			}, key);
+		})
+	});
 }
 function getVersionKey(version, index) {
 	if (version.versionId) return version.versionId;
@@ -912,116 +660,48 @@ function buildVersionDiff({ version, previousVersion, fields, resolveText }) {
 	}
 	return changes;
 }
-function HistorySidebar(t0) {
-	const $ = c(29);
-	const { open, onOpenChange, auditEntries: t1, isLoadingAudit: t2, versions, fields, isLoadingVersions: t3, isReverting: t4, onRevert, showVersionsTab: t5 } = t0;
-	const auditEntries = t1 === void 0 ? EMPTY_AUDIT_ENTRIES : t1;
-	const isLoadingAudit = t2 === void 0 ? false : t2;
-	const isLoadingVersions = t3 === void 0 ? false : t3;
-	const isReverting = t4 === void 0 ? false : t4;
-	const showVersionsTab = t5 === void 0 ? false : t5;
+function HistorySidebar({ open, onOpenChange, auditEntries = EMPTY_AUDIT_ENTRIES, isLoadingAudit = false, versions, fields, isLoadingVersions = false, isReverting = false, onRevert, showVersionsTab = false }) {
 	const { t } = useTranslation();
-	let t6;
-	if ($[0] !== showVersionsTab || $[1] !== t) {
-		t6 = showVersionsTab ? t("version.history") : t("history.title");
-		$[0] = showVersionsTab;
-		$[1] = t;
-		$[2] = t6;
-	} else t6 = $[2];
-	let t7;
-	if ($[3] !== t6) {
-		t7 = /* @__PURE__ */ jsx(SheetTitle, { children: t6 });
-		$[3] = t6;
-		$[4] = t7;
-	} else t7 = $[4];
-	let t8;
-	if ($[5] !== showVersionsTab || $[6] !== t) {
-		t8 = showVersionsTab ? t("history.versionDescription") : t("history.description");
-		$[5] = showVersionsTab;
-		$[6] = t;
-		$[7] = t8;
-	} else t8 = $[7];
-	let t9;
-	if ($[8] !== t8) {
-		t9 = /* @__PURE__ */ jsx(SheetDescription, { children: t8 });
-		$[8] = t8;
-		$[9] = t9;
-	} else t9 = $[9];
-	let t10;
-	if ($[10] !== t7 || $[11] !== t9) {
-		t10 = /* @__PURE__ */ jsxs(SheetHeader, {
-			className: "border-b px-6 py-5",
-			children: [t7, t9]
-		});
-		$[10] = t7;
-		$[11] = t9;
-		$[12] = t10;
-	} else t10 = $[12];
-	let t11;
-	if ($[13] !== auditEntries || $[14] !== fields || $[15] !== isLoadingAudit || $[16] !== isLoadingVersions || $[17] !== isReverting || $[18] !== onRevert || $[19] !== showVersionsTab || $[20] !== versions) {
-		t11 = showVersionsTab ? /* @__PURE__ */ jsx(ScrollFade, {
-			orientation: "vertical",
-			className: "min-h-0 flex-1",
-			children: /* @__PURE__ */ jsx("div", {
-				"data-scroll-fade-target": true,
-				className: "h-full overflow-y-auto px-6 py-4",
-				children: /* @__PURE__ */ jsx(VersionsList, {
-					versions: versions ?? [],
-					fields,
-					isLoading: isLoadingVersions,
-					isReverting,
-					onRevert
-				})
-			})
-		}) : /* @__PURE__ */ jsx(ScrollFade, {
-			orientation: "vertical",
-			className: "min-h-0 flex-1",
-			children: /* @__PURE__ */ jsx("div", {
-				"data-scroll-fade-target": true,
-				className: "h-full overflow-y-auto px-6 py-4",
-				children: /* @__PURE__ */ jsx(ActivityTimeline, {
-					entries: auditEntries,
-					isLoading: isLoadingAudit
-				})
-			})
-		});
-		$[13] = auditEntries;
-		$[14] = fields;
-		$[15] = isLoadingAudit;
-		$[16] = isLoadingVersions;
-		$[17] = isReverting;
-		$[18] = onRevert;
-		$[19] = showVersionsTab;
-		$[20] = versions;
-		$[21] = t11;
-	} else t11 = $[21];
-	let t12;
-	if ($[22] !== t10 || $[23] !== t11) {
-		t12 = /* @__PURE__ */ jsxs(SheetContent, {
+	return /* @__PURE__ */ jsx(Sheet, {
+		open,
+		onOpenChange,
+		modal: false,
+		children: /* @__PURE__ */ jsxs(SheetContent, {
 			side: "right",
 			animated: false,
 			showOverlay: false,
 			className: "qa-history-sidebar flex flex-col p-0 sm:max-w-2xl",
-			children: [t10, t11]
-		});
-		$[22] = t10;
-		$[23] = t11;
-		$[24] = t12;
-	} else t12 = $[24];
-	let t13;
-	if ($[25] !== onOpenChange || $[26] !== open || $[27] !== t12) {
-		t13 = /* @__PURE__ */ jsx(Sheet, {
-			open,
-			onOpenChange,
-			modal: false,
-			children: t12
-		});
-		$[25] = onOpenChange;
-		$[26] = open;
-		$[27] = t12;
-		$[28] = t13;
-	} else t13 = $[28];
-	return t13;
+			children: [/* @__PURE__ */ jsxs(SheetHeader, {
+				className: "border-b px-6 py-5",
+				children: [/* @__PURE__ */ jsx(SheetTitle, { children: showVersionsTab ? t("version.history") : t("history.title") }), /* @__PURE__ */ jsx(SheetDescription, { children: showVersionsTab ? t("history.versionDescription") : t("history.description") })]
+			}), showVersionsTab ? /* @__PURE__ */ jsx(ScrollFade, {
+				orientation: "vertical",
+				className: "min-h-0 flex-1",
+				children: /* @__PURE__ */ jsx("div", {
+					"data-scroll-fade-target": true,
+					className: "h-full overflow-y-auto px-6 py-4",
+					children: /* @__PURE__ */ jsx(VersionsList, {
+						versions: versions ?? [],
+						fields,
+						isLoading: isLoadingVersions,
+						isReverting,
+						onRevert
+					})
+				})
+			}) : /* @__PURE__ */ jsx(ScrollFade, {
+				orientation: "vertical",
+				className: "min-h-0 flex-1",
+				children: /* @__PURE__ */ jsx("div", {
+					"data-scroll-fade-target": true,
+					className: "h-full overflow-y-auto px-6 py-4",
+					children: /* @__PURE__ */ jsx(ActivityTimeline, {
+						entries: auditEntries,
+						isLoading: isLoadingAudit
+					})
+				})
+			})]
+		})
+	});
 }
 
 //#endregion