@delmaredigital/payload-experiments 0.4.0-rc.2 → 0.4.0-rc.3

package/dist/admin/copy/goals.d.ts

@@ -1,6 +1,7 @@
 export declare const GOALS_COPY: {
     readonly slugRule: "Use 1–64 lowercase letters, numbers, underscores or hyphens, starting with a letter or number.";
     readonly duplicateSlug: "Another goal already uses this short name. Change it under Advanced.";
+    readonly duplicateSlugMain: "Another goal already uses this short name. Choose another.";
     readonly title: "Goals";
     readonly goal: "Goal";
     readonly newGoal: "New goal";

package/dist/admin/copy/goals.js

@@ -2,6 +2,7 @@ import { CLICK_GOAL_COPY } from '../../goals/picker/copy.js';
 export const GOALS_COPY = {
     slugRule: CLICK_GOAL_COPY.slugRule,
     duplicateSlug: CLICK_GOAL_COPY.duplicateSlug,
+    duplicateSlugMain: 'Another goal already uses this short name. Choose another.',
     title: 'Goals',
     goal: 'Goal',
     newGoal: 'New goal',

package/dist/admin/surface/goals/GoalForm.js

@@ -51,17 +51,13 @@ export function GoalForm({ surface, id, returnToTest }) {
     const [loadError, setLoadError] = useState('');
     const [error, setError] = useState('');
     const [fieldErrors, setFieldErrors] = useState({});
+    const [seenFieldErrors, setSeenFieldErrors] = useState(fieldErrors);
+    const [advancedOpen, setAdvancedOpen] = useState(false);
     const [pending, setPending] = useState(null);
     const [slugEdited, setSlugEdited] = useState(false);
     const [attempt, setAttempt] = useState(0);
     const inFlight = useRef(false);
-    const advanced = useRef(null);
     const [confirmDelete, setConfirmDelete] = useState(false);
-    useEffect(()=>{
-        if (advanced.current && (fieldErrors.slug || fieldErrors.capType || fieldErrors.capValue || fieldErrors.warningPercent)) advanced.current.open = true;
-    }, [
-        fieldErrors
-    ]);
     const listUrl = surfaceUrls.goals(surface.adminRoute, returnToTest ? {
         return: returnToTest
     } : undefined);
@@ -108,6 +104,11 @@ export function GoalForm({ surface, id, returnToTest }) {
     ]);
     const source = sourceFor(draft.source, surface.metricSources);
     const click = draft.source.startsWith('click:');
+    // Keep the disclosure and its new field errors in the same commit.
+    if (fieldErrors !== seenFieldErrors) {
+        setSeenFieldErrors(fieldErrors);
+        if (click && fieldErrors.slug || fieldErrors.capType || fieldErrors.capValue || fieldErrors.warningPercent) setAdvancedOpen(true);
+    }
     const hint = metricSourceHint(source);
     const options = metricSourceOptions(surface.metricSources);
     const set = (key, value)=>setDraft((current)=>({
@@ -177,7 +178,7 @@ export function GoalForm({ surface, id, returnToTest }) {
             if (cause instanceof GoalResponseError) setFieldErrors(Object.fromEntries(Object.entries(cause.fields).flatMap(([path, message])=>fieldNames[path] ? [
                     [
                         fieldNames[path],
-                        path === 'slug' ? C.duplicateSlug : message
+                        path === 'slug' ? click ? C.duplicateSlug : C.duplicateSlugMain : message
                     ]
                 ] : [])));
             inFlight.current = false;
@@ -320,6 +321,10 @@ export function GoalForm({ surface, id, returnToTest }) {
                                                         ...current,
                                                         slug: clickGoalSlug(draft.name) ? undefined : C.slugRule
                                                     }));
+                                                else if (sourceId === 'click:' !== click) setFieldErrors((current)=>({
+                                                        ...current,
+                                                        slug: undefined
+                                                    }));
                                             },
                                             children: [
                                                 /*#__PURE__*/ _jsx("option", {
@@ -375,7 +380,8 @@ export function GoalForm({ surface, id, returnToTest }) {
                                         }),
                                         /*#__PURE__*/ _jsxs("details", {
                                             className: "xp-goal-advanced",
-                                            ref: advanced,
+                                            open: advancedOpen,
+                                            onToggle: (event)=>setAdvancedOpen(event.currentTarget.open),
                                             children: [
                                                 /*#__PURE__*/ _jsx("summary", {
                                                     children: C.advanced

package/dist/admin/surface/test/Section.js

@@ -1,24 +1,25 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useRef } from 'react';
+import { useState } from 'react';
 import { readinessParts } from '../readiness/parts.js';
 import { SectionCard } from '../../../ui/SectionCard.js';
 import { SECTION_ORDER } from '../contracts.js';
 import { TEST_PAGE as C } from '../../copy/testPage.js';
 export function Section({ test, sectionId, children }) {
-    const disclosure = useRef(null);
     const hasAdvancedError = Object.keys(test.errors).some((path)=>path.startsWith('analysis.') && ![
             'analysis.reachPerDay',
             'analysis.plannedDurationDays'
         ].includes(path) || path === 'exposurePolicy');
-    useEffect(()=>{
-        if (hasAdvancedError && disclosure.current) disclosure.current.open = true;
-    }, [
-        hasAdvancedError
-    ]);
+    const [open, setOpen] = useState(hasAdvancedError);
+    const [prevHasAdvancedError, setPrevHasAdvancedError] = useState(hasAdvancedError);
+    if (hasAdvancedError !== prevHasAdvancedError) {
+        setPrevHasAdvancedError(hasAdvancedError);
+        if (hasAdvancedError) setOpen(true);
+    }
     const done = readinessParts.sectionDone(test)[sectionId];
     if (sectionId === 'advanced') return /*#__PURE__*/ _jsxs("details", {
-        ref: disclosure,
+        open: open,
+        onToggle: (event)=>setOpen(event.currentTarget.open),
         className: "xp-test-advanced",
         id: "section-advanced",
         children: [

package/dist/goals/picker/copy.d.ts

@@ -10,7 +10,9 @@ export declare const CLICK_GOAL_COPY: {
     readonly createGoal: "Create goal";
     readonly cancel: "Cancel";
     readonly undefinedKey: "No click goal has this name yet. Create it with \"+ New click goal\".";
+    readonly invalidKey: "Use a click goal short name.";
     readonly slugRule: "Use 1–64 lowercase letters, numbers, underscores or hyphens, starting with a letter or number.";
     readonly duplicateSlug: "Another goal already uses this short name. Change it under Advanced.";
     readonly saveError: "Couldn't save the goal. Try again.";
 };
+export declare function puckGoalRefusal(rawKey: string, block: string, malformed: boolean, more?: number): string;

package/dist/goals/picker/copy.js

@@ -9,7 +9,14 @@
     createGoal: 'Create goal',
     cancel: 'Cancel',
     undefinedKey: 'No click goal has this name yet. Create it with "+ New click goal".',
+    invalidKey: 'Use a click goal short name.',
     slugRule: 'Use 1–64 lowercase letters, numbers, underscores or hyphens, starting with a letter or number.',
     duplicateSlug: 'Another goal already uses this short name. Change it under Advanced.',
     saveError: "Couldn't save the goal. Try again."
 };
+export function puckGoalRefusal(rawKey, block, malformed, more = 0) {
+    // A malformed key can be any length; keep the dialog readable.
+    const key = rawKey.length > 64 ? `${rawKey.slice(0, 64)}…` : rawKey;
+    const sentence = malformed ? `Click goal "${key}" on the ${block} block isn't a valid short name. Use lowercase letters, numbers, - and _, then publish.` : `Click goal "${key}" doesn't exist yet. Create it with "+ New click goal" on the ${block} block, then publish.`;
+    return sentence + (more > 0 ? ` (and ${more} more)` : '');
+}

package/dist/goals/validate.js

@@ -2,13 +2,14 @@ import { definedClickKeys } from '../db/clickGoals.js';
 import { pooledExecutor } from '../db/executor.js';
 import { clickKeys } from './cache.js';
 import { CLICK_KEY } from './key.js';
+import { CLICK_GOAL_COPY } from './picker/copy.js';
 /** Shared publish validation for Payload fields and Puck JSON props. */ export async function validateClickGoal(value, req) {
     if (!value) return true;
-    if (!CLICK_KEY.test(value)) return 'Use a click goal short name.';
+    if (!CLICK_KEY.test(value)) return CLICK_GOAL_COPY.invalidKey;
     const options = req.payload.config.custom?.xp;
     if (!options || await options.access.manage({
         req
     }) !== true) return true;
     const keys = await clickKeys(req.payload);
-    return !keys || keys.has(value) || (await definedClickKeys(pooledExecutor(req.payload))).has(value) || 'No click goal has this name yet. Create it with "+ New click goal".';
+    return !keys || keys.has(value) || (await definedClickKeys(pooledExecutor(req.payload))).has(value) || CLICK_GOAL_COPY.undefinedKey;
 }

package/dist/hooks/puckGoals.d.ts

@@ -1,3 +1,5 @@
 import { type CollectionBeforeChangeHook } from 'payload';
+/** Host component labels are not passed to the plugin; display their type as words. */
+export declare function puckBlockName(rawType: string): string;
 /** Validate only the Puck JSON included in a publishing write. */
 export declare function puckGoalsBeforeChange(field: string): CollectionBeforeChangeHook;

package/dist/hooks/puckGoals.js

@@ -1,5 +1,13 @@
 import { ValidationError } from 'payload';
 import { validateClickGoal } from '../goals/validate.js';
+import { CLICK_KEY } from '../goals/key.js';
+import { puckGoalRefusal } from '../goals/picker/copy.js';
+/** Host component labels are not passed to the plugin; display their type as words. */ export function puckBlockName(rawType) {
+    // Cap before any regex: the type comes from saved page JSON and the first pattern backtracks on long capital runs.
+    const type = rawType.slice(0, 64);
+    const words = type.replace(/([A-Z]+)([A-Z][a-z])/g, '$1 $2').replace(/([a-z0-9])([A-Z])/g, '$1 $2').replace(/([A-Za-z])([0-9])/g, '$1 $2').replace(/[\s_-]+/g, ' ').trim();
+    return words ? words[0].toUpperCase() + words.slice(1) : 'Page';
+}
 /** Validate only the Puck JSON included in a publishing write. */ export function puckGoalsBeforeChange(field) {
     return async function validatePuckGoals({ collection, data, originalDoc, req }) {
         const drafts = Boolean(collection.versions && collection.versions.drafts);
@@ -15,24 +23,40 @@ import { validateClickGoal } from '../goals/validate.js';
             }
         }
         const errors = [];
-        async function walk(value, path) {
+        let first;
+        // Holds the raw component type; it is humanised once, for the first refusal only.
+        async function walk(value, path, block = '') {
             if (!value || typeof value !== 'object') return;
+            const item = value;
+            if (typeof item.type === 'string' && item.props && typeof item.props === 'object' && !Array.isArray(item.props)) {
+                block = item.type;
+            }
             for (const [key, prop] of Object.entries(value)){
                 const propPath = `${path}.${key}`;
                 if (key === 'xpGoal' && typeof prop === 'string') {
                     const result = await validateClickGoal(prop, req);
-                    if (result !== true) errors.push({
-                        path: propPath,
-                        message: result
-                    });
-                } else await walk(prop, propPath);
+                    if (result !== true) {
+                        first ??= {
+                            key: prop,
+                            block
+                        };
+                        errors.push({
+                            path: propPath,
+                            message: result
+                        });
+                    }
+                } else await walk(prop, propPath, block);
             }
         }
         await walk(value, field);
-        if (errors.length) throw new ValidationError({
-            collection: collection.slug,
-            errors
-        });
+        if (first) {
+            const error = new ValidationError({
+                collection: collection.slug,
+                errors
+            });
+            error.message = puckGoalRefusal(first.key, first.block ? puckBlockName(first.block) : 'Page', !CLICK_KEY.test(first.key), errors.length - 1);
+            throw error;
+        }
         return data;
     };
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@delmaredigital/payload-experiments",
-  "version": "0.4.0-rc.2",
+  "version": "0.4.0-rc.3",
   "description": "No-code A/B testing for Payload CMS and Next.js: block, page and flag experiments with holdouts, layers, exposure logging and honest statistics inside the admin — no vendor",
   "type": "module",
   "license": "MIT",