@questpie/admin 3.2.3 → 3.2.4

package/dist/client/views/collection/form-view.mjs

@@ -31,6 +31,8 @@ import { getLockUser, useLock } from "../../hooks/use-locks.mjs";
 import { useReactiveFields } from "../../hooks/use-reactive-fields.mjs";
 import { useServerActions } from "../../hooks/use-server-actions.mjs";
 import { useTransitionStage } from "../../hooks/use-transition-stage.mjs";
+import { applyPatchBatchImmutable, cloneSnapshot } from "../../preview/patch.mjs";
+import { diffSnapshot, diffSnapshotAtPath } from "../../preview/diff.mjs";
 import { detectManyToManyRelations, hasManyToManyRelations } from "../../utils/detect-relations.mjs";
 import { shouldHandleAdminShortcut } from "../../utils/keyboard-shortcuts.mjs";
 import { AdminViewHeader } from "../layout/admin-view-layout.mjs";
@@ -64,74 +66,6 @@ function extractReactiveConfigs(schema) {
 	for (const [fieldName, fieldDef] of Object.entries(schema.fields)) if (fieldDef.reactive) configs[fieldName] = fieldDef.reactive;
 	return configs;
 }
-function isPlainObject(value) {
-	if (!value || typeof value !== "object") return false;
-	const prototype = Object.getPrototypeOf(value);
-	return prototype === Object.prototype || prototype === null;
-}
-function clonePreviewSnapshot(value) {
-	if (typeof structuredClone === "function") try {
-		return structuredClone(value);
-	} catch {}
-	const json = JSON.stringify(value);
-	return json === void 0 ? value : JSON.parse(json);
-}
-function arePreviewValuesEqual(a, b) {
-	if (Object.is(a, b)) return true;
-	if (Array.isArray(a) || Array.isArray(b)) {
-		if (!Array.isArray(a) || !Array.isArray(b) || a.length !== b.length) return false;
-		return a.every((value, index) => arePreviewValuesEqual(value, b[index]));
-	}
-	if (isPlainObject(a) || isPlainObject(b)) {
-		if (!isPlainObject(a) || !isPlainObject(b)) return false;
-		const aKeys = Object.keys(a);
-		const bKeys = Object.keys(b);
-		if (aKeys.length !== bKeys.length) return false;
-		return aKeys.every((key) => Object.prototype.hasOwnProperty.call(b, key) && arePreviewValuesEqual(a[key], b[key]));
-	}
-	return false;
-}
-function joinPreviewPath(basePath, key) {
-	return basePath ? `${basePath}.${key}` : key;
-}
-function diffPreviewSnapshots(previous, current, basePath = "") {
-	if (arePreviewValuesEqual(previous, current)) return [];
-	if (isPlainObject(previous) && isPlainObject(current)) {
-		const ops = [];
-		const keys = new Set([...Object.keys(previous), ...Object.keys(current)]);
-		for (const key of keys) {
-			const path = joinPreviewPath(basePath, key);
-			const previousHasKey = Object.prototype.hasOwnProperty.call(previous, key);
-			if (!Object.prototype.hasOwnProperty.call(current, key)) {
-				ops.push({
-					op: "remove",
-					path
-				});
-				continue;
-			}
-			if (!previousHasKey) {
-				ops.push({
-					op: "set",
-					path,
-					value: current[key]
-				});
-				continue;
-			}
-			ops.push(...diffPreviewSnapshots(previous[key], current[key], path));
-		}
-		return ops;
-	}
-	if (!basePath) return [{
-		op: "set",
-		path: "",
-		value: current
-	}];
-	return [{
-		op: "set",
-		path: basePath,
-		value: current
-	}];
-}
 function isSafePreviewEditPath(path) {
 	if (!path || path.length > 512) return false;
 	return path.split(".").every((segment) => segment.length > 0 && segment !== "__proto__" && segment !== "prototype" && segment !== "constructor");
@@ -322,23 +256,48 @@ const PreviewPatchBridge = React.memo(function PreviewPatchBridge$1(t0) {
 				snapshotVersionRef.current = void 0;
 				return;
 			}
-			const initialSnapshot = clonePreviewSnapshot(form.getValues());
+			const initialSnapshot = cloneSnapshot(form.getValues());
 			previousSnapshotRef.current = initialSnapshot;
 			snapshotVersionRef.current = previewRef.current?.sendInitSnapshot(initialSnapshot);
-			const subscription = form.watch((values) => {
+			let animationFrame = null;
+			const pendingOps = /* @__PURE__ */ new Map();
+			const flushPendingOps = () => {
+				animationFrame = null;
+				if (pendingOps.size === 0) return;
+				const ops = [...pendingOps.values()];
+				pendingOps.clear();
+				previewRef.current?.sendPatchBatch(ops, snapshotVersionRef.current);
+			};
+			const queuePatchOps = (ops_0) => {
+				for (const op of ops_0) if (op.path) pendingOps.set(op.path, op);
+				if (pendingOps.size === 0 || animationFrame !== null) return;
+				animationFrame = window.requestAnimationFrame(flushPendingOps);
+			};
+			const subscription = form.watch((values, info) => {
 				const previousSnapshot = previousSnapshotRef.current;
-				const nextSnapshot = clonePreviewSnapshot(values);
+				const nextValues = values;
 				if (!previousSnapshot) {
+					const nextSnapshot = cloneSnapshot(nextValues);
 					previousSnapshotRef.current = nextSnapshot;
 					snapshotVersionRef.current = previewRef.current?.sendInitSnapshot(nextSnapshot);
 					return;
 				}
-				const ops = diffPreviewSnapshots(previousSnapshot, nextSnapshot).filter(_temp);
-				previousSnapshotRef.current = nextSnapshot;
-				if (ops.length === 0) return;
-				previewRef.current?.sendPatchBatch(ops, snapshotVersionRef.current);
+				const changedPath = info?.name;
+				let ops_1 = changedPath && isSafePreviewEditPath(changedPath) ? diffSnapshotAtPath(previousSnapshot, nextValues, changedPath) : diffSnapshot(previousSnapshot, nextValues);
+				if (ops_1.some(_temp)) {
+					const nextSnapshot_0 = cloneSnapshot(nextValues);
+					previousSnapshotRef.current = nextSnapshot_0;
+					snapshotVersionRef.current = previewRef.current?.sendInitSnapshot(nextSnapshot_0);
+					pendingOps.clear();
+					return;
+				}
+				ops_1 = ops_1.filter(_temp2);
+				if (ops_1.length === 0) return;
+				previousSnapshotRef.current = applyPatchBatchImmutable(previousSnapshot, ops_1);
+				queuePatchOps(ops_1);
 			});
 			return () => {
+				if (animationFrame !== null) window.cancelAnimationFrame(animationFrame);
 				subscription.unsubscribe();
 			};
 		};
@@ -458,7 +417,7 @@ const AutosaveIndicator = React.memo(function AutosaveIndicator$1(t0) {
 		$[1] = t1;
 	} else t1 = $[1];
 	const { isDirty } = useFormState(t1);
-	const [, forceUpdate] = React.useReducer(_temp2, 0);
+	const [, forceUpdate] = React.useReducer(_temp3, 0);
 	let t2;
 	if ($[2] !== forceUpdate || $[3] !== lastSaved) {
 		t2 = () => {
@@ -760,7 +719,7 @@ function FormView({ collection, id, config, viewConfig, navigate, basePath = "/a
 	});
 	const commitPreviewSnapshot = React.useCallback((data) => {
 		if (!isLivePreviewOpen) return;
-		previewRef.current?.sendCommit(clonePreviewSnapshot(data));
+		previewRef.current?.sendCommit(cloneSnapshot(data));
 	}, [isLivePreviewOpen]);
 	const triggerPreviewFullResync = React.useCallback((reason) => {
 		if (!isLivePreviewOpen) return;
@@ -780,7 +739,7 @@ function FormView({ collection, id, config, viewConfig, navigate, basePath = "/a
 			shouldTouch: true,
 			shouldValidate: true
 		});
-		setTimeout(() => scrollFieldIntoView(message.path), 0);
+		setTimeout(() => scrollFieldIntoView(message.path, { focus: false }), 0);
 	}, [form, schema]);
 	const handlePreviewResyncRequest = React.useCallback((reason_0) => {
 		triggerPreviewFullResync(reason_0 ?? "preview-request");
@@ -1822,10 +1781,13 @@ function FormView({ collection, id, config, viewConfig, navigate, basePath = "/a
 		children: formShell
 	});
 }
-function _temp(op) {
-	return op.path;
+function _temp(op_0) {
+	return !op_0.path;
+}
+function _temp2(op_1) {
+	return op_1.path;
 }
-function _temp2(x) {
+function _temp3(x) {
 	return x + 1;
 }
 

package/dist/client/views/collection/table-view.mjs

@@ -134,12 +134,14 @@ function UploadCollectionSheet({ open, onOpenChange, collection, onUploaded }) {
 	const { uploadMany, isUploading, progress } = useUpload();
 	const [uploadedAssets, setUploadedAssets] = React.useState([]);
 	const [editAssetId, setEditAssetId] = React.useState(null);
-	React.useEffect(() => {
-		if (!open) {
-			setUploadedAssets([]);
-			setEditAssetId(null);
-		}
-	}, [open]);
+	const resetUploadSheetState = React.useCallback(() => {
+		setUploadedAssets([]);
+		setEditAssetId(null);
+	}, []);
+	const handleOpenChange = React.useCallback((nextOpen) => {
+		if (!nextOpen) resetUploadSheetState();
+		onOpenChange(nextOpen);
+	}, [onOpenChange, resetUploadSheetState]);
 	const handleValidationError = React.useCallback((errors) => {
 		for (const validationError of errors) toast.error(validationError.message);
 	}, []);
@@ -166,7 +168,7 @@ function UploadCollectionSheet({ open, onOpenChange, collection, onUploaded }) {
 	]);
 	return /* @__PURE__ */ jsx(Sheet, {
 		open,
-		onOpenChange,
+		onOpenChange: handleOpenChange,
 		modal: false,
 		children: /* @__PURE__ */ jsxs(SheetContent, {
 			side: "right",
@@ -206,7 +208,7 @@ function UploadCollectionSheet({ open, onOpenChange, collection, onUploaded }) {
 					className: "border-t px-6 py-4",
 					children: /* @__PURE__ */ jsx(Button, {
 						variant: "outline",
-						onClick: () => onOpenChange(false),
+						onClick: () => handleOpenChange(false),
 						disabled: isUploading,
 						children: t("common.close")
 					})
@@ -216,8 +218,8 @@ function UploadCollectionSheet({ open, onOpenChange, collection, onUploaded }) {
 					collection,
 					itemId: editAssetId,
 					open: !!editAssetId,
-					onOpenChange: (nextOpen) => {
-						if (!nextOpen) setEditAssetId(null);
+					onOpenChange: (nextOpen_0) => {
+						if (!nextOpen_0) setEditAssetId(null);
 					},
 					onSave: () => {
 						onUploaded?.();