@nextlyhq/plugin-form-builder 0.0.2-alpha.72 → 0.0.2-alpha.74

package/dist/admin/index.d.ts

@@ -1,4 +1,4 @@
-import { S as FormNotification, T as FormSettings, _ as FormField, t as AnyFormField, y as FormFieldTypeId } from "../types-BHReIA0j.js";
+import { O as FormSettings, S as FormFieldTypeId, T as FormNotification, b as FormField, i as AnyFormField, r as NewSubmissionsData } from "../new-submissions-CzlhVGhH.js";
 import { ComponentPath, DocumentLockGates } from "@nextlyhq/plugin-sdk/admin";
 import React, { JSX, ReactNode } from "react";
 import { FieldTypeCatalogEntry, FormFieldCatalogType } from "nextly/field-catalog";
@@ -18,6 +18,11 @@ interface FormBuilderViewProps {
     fields?: unknown[];
     settings?: Record<string, unknown>;
     notifications?: unknown[];
+    /**
+     * The form's version as read, which a save sends back so one made from an
+     * older version is refused rather than replacing what someone saved since.
+     */
+    _rev?: string;
   };
   onSave?: (data: unknown) => void;
   onSuccess?: (entry?: Record<string, unknown>) => void;
@@ -49,6 +54,8 @@ interface SubmissionRow {
   submittedAt?: string | null;
   editedAt?: string | null;
   editedBy?: string | null;
+  /** The submission's version as the list read it; see `submissionPatch`. */
+  _rev?: string;
 }
 interface FormOption {
   id: string;
@@ -69,6 +76,10 @@ interface SubmissionSheetProps {
   onSave: (changes: Record<string, unknown>) => Promise<void>;
 }
 export declare function SubmissionSheet({ submission, form, canUpdate, onClose, onPrev, onNext, onSave }: SubmissionSheetProps): JSX.Element;
+/** The card's rows, as many as its size holds. */
+export declare function NewSubmissionsCard({ data }: {
+  data: NewSubmissionsData;
+}): JSX.Element;
 interface FieldCardsProps {
   /**
    * Form-surface types the host has NOT excluded (the plugin's field

package/dist/admin/index.js

@@ -1,5 +1,5 @@
-import { A as isKnownFormField, C as enforcedValidationRules, N as documentReachability, P as parseRedirectReference, l as evaluateConditions, m as DEFAULT_FORM_SETTINGS, n as parseFieldRef, p as normalizeFormSettings, s as formatExportValue, t as buildFieldReferenceMap } from "../field-references-BshlgMcn.js";
-import { ConditionRow, DataTableView, FieldOptionsEditor, FieldTypePicker, ValidationRulesEditor, drawsAnyValidationRule, registerComponents, registerKnownPlugin, usePluginFieldTypeEntries, withOptionIds } from "@nextlyhq/plugin-sdk/admin";
+import { A as isKnownFormField, C as enforcedValidationRules, L as documentReachability, R as parseRedirectReference, l as evaluateConditions, m as DEFAULT_FORM_SETTINGS, n as parseFieldRef, p as normalizeFormSettings, s as formatExportValue, t as buildFieldReferenceMap } from "../field-references-CtzGg51W.js";
+import { ConditionRow, DataTableView, FieldOptionsEditor, FieldTypePicker, FrameState, ValidationRulesEditor, Widget, drawsAnyValidationRule, formatWidgetTime, registerComponents, registerKnownPlugin, usePluginFieldTypeEntries, useRefreshDashboard, useWidgetClock, withOptionIds } from "@nextlyhq/plugin-sdk/admin";
 import { Badge, Button, Card, Checkbox, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, FieldShell, FormActions, FormLabelWithTooltip, FormSection, Grid, Input, Label, RadioGroup, RadioGroupItem, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue, Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Tooltip, TooltipContent, TooltipTrigger, toast } from "@nextlyhq/ui";
 import * as Lucide from "lucide-react";
 import { ChevronLeft, ChevronRight, Columns3, Copy, Download, ExternalLink, Eye, Filter, Mail, Monitor, MoreHorizontal, Paperclip, Pencil, Plus, RotateCcw, Smartphone, Trash2, TriangleAlert, X } from "lucide-react";
@@ -388,6 +388,19 @@ function SubmissionSheet({ submission, form, canUpdate, onClose, onPrev, onNext,
 *
 * @module admin/components/submissions/SubmissionsView
 */
+/**
+* What a change to a submission sends: the change, with the version its row
+* had when the list read it, so a change made from an older copy is refused
+* rather than replacing what someone saved since.
+*/
+function submissionPatch(row, changes) {
+	return typeof row?._rev === "string" ? {
+		...changes,
+		_rev: row._rev
+	} : changes;
+}
+/** What a refused change says when someone saved the submission since. */
+const SUBMISSION_CHANGED_SINCE = "Someone changed this submission since the list loaded. The list now shows their change; make yours again.";
 const STATUS_TABS = [
 	{
 		value: "all",
@@ -469,7 +482,7 @@ function SubmissionsView({ collectionSlug }) {
 				const allForms = [];
 				const formsPageSize = 200;
 				for (let formsPage = 1;; formsPage += 1) {
-					const formsRes = await fetch(`/admin/api/collections/${resolved.forms}/entries?pageSize=${formsPageSize}&page=${formsPage}`, { credentials: "include" });
+					const formsRes = await fetch(`/admin/api/collections/${resolved.forms}/entries?limit=${formsPageSize}&page=${formsPage}`, { credentials: "include" });
 					if (!formsRes.ok) break;
 					const items = (await formsRes.json()).items ?? [];
 					allForms.push(...items.map((item) => ({
@@ -513,7 +526,7 @@ function SubmissionsView({ collectionSlug }) {
 			else where.status = { equals: statusTab };
 			const params = new URLSearchParams({
 				page: String(page),
-				pageSize: String(PAGE_SIZE$1),
+				limit: String(PAGE_SIZE$1),
 				sortBy: "submittedAt",
 				sortOrder: "desc",
 				where: JSON.stringify(where)
@@ -592,14 +605,22 @@ function SubmissionsView({ collectionSlug }) {
 		formNameById,
 		hiddenFieldColumns
 	]);
+	const rowsNow = useRef(rows);
+	rowsNow.current = rows;
 	const patchSubmission = useCallback(async (id, body) => {
 		const res = await fetch(`/admin/api/collections/${submissionsSlug}/entries/${id}`, {
 			method: "PATCH",
 			headers: { "Content-Type": "application/json" },
 			credentials: "include",
-			body: JSON.stringify(body)
+			body: JSON.stringify(submissionPatch(rowsNow.current.find((row) => row.id === id), body))
 		});
-		if (!res.ok) throw new Error(`Update failed (${res.status})`);
+		if (!res.ok) {
+			if ((await res.json().catch(() => null))?.error?.code === "STALE_VERSION") {
+				await fetchRows();
+				throw new Error(SUBMISSION_CHANGED_SINCE);
+			}
+			throw new Error(`Update failed (${res.status})`);
+		}
 		await fetchRows();
 	}, [submissionsSlug, fetchRows]);
 	const deleteSubmission = useCallback(async (id) => {
@@ -619,7 +640,7 @@ function SubmissionsView({ collectionSlug }) {
 			onSelect: (target) => void patchSubmission(target.id, {
 				status: "new",
 				spamReason: null
-			})
+			}).catch((reason) => setError(reason instanceof Error ? reason.message : "Update failed."))
 		});
 		if (canDelete) actions.push({
 			id: "delete",
@@ -2427,7 +2448,7 @@ async function fetchCanEditTemplates() {
 		if (!res.ok) return false;
 		const json = await res.json();
 		const held = json.permissions ?? [];
-		return Boolean(json.isSuperAdmin) || held.includes("update-email-templates") || held.includes("manage-email-templates");
+		return Boolean(json.isSuperAdmin) || held.includes("update-email-templates");
 	} catch {
 		return false;
 	}
@@ -4407,10 +4428,32 @@ function FormPreview({ fields, formData }) {
 * @module admin/FormBuilderView
 * @since 0.1.0
 */
+/**
+* The key a form's version travels under, as the admin reads and sends it.
+* Spelled here because the plugin reaches the admin only through the SDK,
+* which does not publish it.
+*/
+const DOCUMENT_VERSION_KEY = "_rev";
+/**
+* What a save sends: an existing form's save names the version the editor's
+* copy started from, where it has one, so a save from an older copy is refused.
+*/
+function saveBody(saveData, isCreating, startedFrom) {
+	return isCreating || startedFrom === void 0 ? saveData : {
+		...saveData,
+		[DOCUMENT_VERSION_KEY]: startedFrom
+	};
+}
+/** The version a save answered, or the copy's own where it names none. */
+function versionAfterSave(saved, previous) {
+	const answered = saved[DOCUMENT_VERSION_KEY];
+	return typeof answered === "string" ? answered : previous;
+}
 function slugify(text) {
 	return text.toLowerCase().trim().replace(/[^\w\s-]/g, "").replace(/[\s_-]+/g, "-").replace(/^-+|-+$/g, "");
 }
-function FormBuilderViewInner({ isCreating = false, collectionSlug = "forms", entryId, onSave, onSuccess, onCancel, documentLock }) {
+function FormBuilderViewInner({ isCreating = false, collectionSlug = "forms", entryId, onSave, onSuccess, onCancel, documentLock, version }) {
+	const startedFrom = useRef(version);
 	const { fields, activeTab, isDirty, formData, settings, notifications, setActiveTab, addField, selectField, seedNotifications, updateFormData, markAsSaved } = useFormBuilder();
 	const queryClient = useQueryClient();
 	const [isSaving, setIsSaving] = useState(false);
@@ -4497,11 +4540,12 @@ function FormBuilderViewInner({ isCreating = false, collectionSlug = "forms", en
 				method: isCreating ? "POST" : "PATCH",
 				headers: { "Content-Type": "application/json" },
 				credentials: "include",
-				body: JSON.stringify(saveData)
+				body: JSON.stringify(saveBody(saveData, isCreating, startedFrom.current))
 			});
 			if (!response.ok) throw new Error(saveErrorMessage(await response.json().catch(() => ({})), response.statusText));
 			const result = await response.json();
 			const savedEntry = result.item ?? result;
+			startedFrom.current = versionAfterSave(savedEntry, startedFrom.current);
 			queryClient.invalidateQueries({ queryKey: [
 				"entries",
 				"list",
@@ -4744,6 +4788,10 @@ function FormBuilderViewInner({ isCreating = false, collectionSlug = "forms", en
 */
 function saveErrorMessage(body, statusText) {
 	const error = body?.error;
+	if (error?.code === "STALE_VERSION") {
+		const name = error.data?.changedBy?.name;
+		return `${typeof name === "string" && name.trim() !== "" ? name.trim() : "Someone"} changed this form since you opened it. Reload to see their change; your edits are still here, not saved.`;
+	}
 	return (error?.data?.errors ?? []).map((issue) => issue.message).filter((message) => Boolean(message)).join(" ") || error?.message || `Failed to save form: ${statusText}`;
 }
 function FormBuilderView({ id, entryId, collection, collectionSlug, isCreating, initialData, onSave, onSuccess, onCancel, documentLock }) {
@@ -4771,11 +4819,144 @@ function FormBuilderView({ id, entryId, collection, collectionSlug, isCreating,
 			onSave,
 			onSuccess,
 			onCancel,
-			documentLock
+			documentLock,
+			version: initialData?._rev
 		})
 	}, providerKey);
 }
 
+// src/dashboard/mark-read.ts
+/**
+* Marking a submission read when it is opened from the New form submissions
+* card: the status the submissions list sets, through the same collection
+* update the list's own status changes are sent through, as the reader.
+*
+* Sent as an update of the submissions that match the id AND are still new,
+* so a submission someone archived, flagged or read since the card loaded is
+* matched by nothing and keeps its status. The update is judged as every
+* update of the collection is (`update-<slug>` and its rule): a reader who
+* may not update submissions is refused, and the submission stays new.
+*
+* @module dashboard/mark-read
+*/
+/** The status an opened submission moves to, as the submissions list names it. */
+const READ_STATUS = "read";
+/** The admin's API root, which the submissions list sends its updates to. */
+const ADMIN_API = "/admin/api";
+/** The request that marks submission `id` of `collection` read while it is still new. */
+function markReadRequest(collection, id) {
+	return {
+		url: `${ADMIN_API}/collections/${encodeURIComponent(collection)}/entries`,
+		init: {
+			method: "PATCH",
+			headers: { "Content-Type": "application/json" },
+			credentials: "include",
+			keepalive: true,
+			body: JSON.stringify({
+				where: {
+					id: { equals: id },
+					status: { equals: "new" }
+				},
+				data: {
+					status: READ_STATUS,
+					_overwrite: true
+				}
+			})
+		}
+	};
+}
+/**
+* Marks submission `id` read, answering whether the update was taken. A
+* refusal or a failed request answers `false` and leaves it new, which the
+* card and the list then still say; it never rejects.
+*/
+async function markRead(collection, id) {
+	const { url, init } = markReadRequest(collection, id);
+	try {
+		return (await fetch(url, init)).ok;
+	} catch {
+		return false;
+	}
+}
+
+// src/dashboard/NewSubmissionsCard.tsx
+/**
+* The New form submissions card's body: the newest new submissions as core's
+* list rows, each opening its submission and marking it read, with the
+* card's footer leading to every submission, and how many are new beside its
+* title. While nothing is new it says so, with a link to every submission,
+* and its title carries no count.
+*
+* Drawn only with data: the frame draws loading and every failure itself.
+* The empty state is drawn here rather than by the frame, because its link
+* is the submissions collection the site installed, which only the card's
+* data knows; the frame's would name the slug the plugin declared. Built from
+* the widget kit alone, so it reads like core's list cards beside it.
+*
+* @module dashboard/NewSubmissionsCard
+*/
+/** The mouse button that opens a link in a new tab. */
+const MIDDLE_BUTTON = 1;
+/** What a row says under its title: its form, and the first line of its first text answer. */
+function metaOf(row) {
+	return [row.form, row.excerpt].filter((part) => part !== void 0);
+}
+/** The row whose link a click landed on, if it landed on one. */
+function openedRow(event, rows) {
+	if (!(event.target instanceof Element)) return void 0;
+	const href = event.target.closest("a[href]")?.getAttribute("href");
+	return href === null || href === void 0 ? void 0 : rows.find((row) => row.href === href);
+}
+/**
+* Nothing new, with a way to every submission. Offered to whoever sees the
+* card: the card is shown only to a reader who may read the submissions
+* collection the site installed, which is where the link leads.
+*/
+function NothingNew({ allHref }) {
+	return /* @__PURE__ */ jsx(FrameState, { state: {
+		kind: "empty",
+		empty: {
+			title: "No new submissions",
+			action: {
+				label: "All submissions",
+				href: allHref
+			}
+		}
+	} });
+}
+/** The card's rows, as many as its size holds. */
+function NewSubmissionsCard({ data }) {
+	const now = useWidgetClock();
+	const refresh = useRefreshDashboard();
+	Widget.useTitleCount(data.total > 0 ? data.total : void 0, data.atLeast === true);
+	if (data.total === 0) return /* @__PURE__ */ jsx(NothingNew, { allHref: data.allHref });
+	const opened = (event) => {
+		const row = openedRow(event, data.items);
+		if (row === void 0) return;
+		markRead(data.collection, row.id).then((taken) => {
+			if (taken) refresh();
+		});
+	};
+	return /* @__PURE__ */ jsx("div", {
+		className: "contents",
+		onClickCapture: opened,
+		onAuxClickCapture: (event) => {
+			if (event.button === MIDDLE_BUTTON) opened(event);
+		},
+		children: /* @__PURE__ */ jsx(Widget.List, {
+			rows: data.items,
+			title: (row) => row.title,
+			href: (row) => row.href,
+			meta: metaOf,
+			trailing: (row) => row.at === void 0 ? void 0 : /* @__PURE__ */ jsx("time", {
+				dateTime: row.at,
+				children: formatWidgetTime(row.at, now)
+			}),
+			viewAllHref: data.allHref
+		})
+	});
+}
+
 // src/admin/index.ts
 /**
 * Form Builder Admin Components
@@ -4823,5 +5004,5 @@ registerKnownPlugin("@nextlyhq/plugin-form-builder", async () => {
 	});
 });
 
-export { AddFieldDialog, DEFAULT_SETTINGS, FORM_BUILDER_VIEW_PATH, FieldCards, FieldEditor, FormBuilderProvider, FormBuilderView, FormNotificationsTab, FormPreview, FormSettingsTab, SUBMISSIONS_VIEW_PATH, SubmissionSheet, SubmissionsView, createFieldFromType, createNotification, generateFieldLabel, generateFieldName, useFormBuilder, useOptionalFormBuilder };
+export { AddFieldDialog, DEFAULT_SETTINGS, FORM_BUILDER_VIEW_PATH, FieldCards, FieldEditor, FormBuilderProvider, FormBuilderView, FormNotificationsTab, FormPreview, FormSettingsTab, NewSubmissionsCard, SUBMISSIONS_VIEW_PATH, SubmissionSheet, SubmissionsView, createFieldFromType, createNotification, generateFieldLabel, generateFieldName, useFormBuilder, useOptionalFormBuilder };
 //# sourceMappingURL=index.js.map