@open-mercato/core 0.6.7-develop.6677.1.beabb7ca12 → 0.6.7-develop.6685.1.77c0a5591b

package/src/modules/workflows/components/ActivitiesEditor.tsx

@@ -26,7 +26,11 @@ interface Activity {
     retryDelay?: number
     backoffMultiplier?: number
   }
-  timeout?: number
+  // Milliseconds, matching the executor and the definition schema. This field
+  // used to be written as `timeout` (a number) while the schema typed `timeout`
+  // as an ISO 8601 string, so saving a timeout from this editor failed
+  // validation outright (#4424).
+  timeoutMs?: number
   compensation?: Record<string, any>
 }
 
@@ -46,8 +50,59 @@ const ACTIVITY_TYPES = [
   { value: 'WAIT', label: 'Wait' },
 ]
 
+/**
+ * Per-activity draft of the raw JSON config text (#4234).
+ *
+ * The config textarea used to be controlled directly by
+ * `JSON.stringify(activity.config)`, and its onChange dropped anything that
+ * did not parse. Every intermediate keystroke of a hand edit is invalid JSON,
+ * so the state never advanced and React re-rendered the previous serialized
+ * value — the field read as frozen/non-editable right after a config was
+ * pasted. Keeping the raw text locally lets the user type freely; the parsed
+ * object is propagated whenever the text is valid, and an inline error is shown
+ * while it is not.
+ */
+type ConfigDraft = { text: string; error: string | null }
+
+function serializeConfig(config: Record<string, unknown> | undefined): string {
+  return JSON.stringify(config ?? {}, null, 2)
+}
+
 export function ActivitiesEditor({ value = [], onChange, error }: ActivitiesEditorProps) {
   const t = useT()
+  const [configDrafts, setConfigDrafts] = React.useState<Record<number, ConfigDraft>>({})
+
+  const configTextFor = (index: number, activity: Activity): string =>
+    configDrafts[index]?.text ?? serializeConfig(activity.config)
+
+  const handleConfigTextChange = (index: number, text: string) => {
+    let parsed: Record<string, unknown> | null = null
+    let parseError: string | null = null
+    try {
+      const candidate = JSON.parse(text) as unknown
+      if (candidate && typeof candidate === 'object' && !Array.isArray(candidate)) {
+        parsed = candidate as Record<string, unknown>
+      } else {
+        parseError = t('workflows.activities.configMustBeObject', 'Config must be a JSON object')
+      }
+    } catch (err) {
+      parseError = err instanceof Error ? err.message : t('workflows.activities.configInvalidJson', 'Invalid JSON')
+    }
+
+    setConfigDrafts((drafts) => ({ ...drafts, [index]: { text, error: parseError } }))
+    if (parsed) updateActivity(index, 'config', parsed)
+  }
+
+  // Drop the raw draft once the field loses focus and its content is valid, so
+  // the textarea goes back to mirroring the canonical (re-formatted) config.
+  const handleConfigBlur = (index: number) => {
+    setConfigDrafts((drafts) => {
+      if (!drafts[index] || drafts[index].error) return drafts
+      const next = { ...drafts }
+      delete next[index]
+      return next
+    })
+  }
 
   const addActivity = () => {
     const newActivity: Activity = {
@@ -85,6 +140,18 @@ export function ActivitiesEditor({ value = [], onChange, error }: ActivitiesEdit
 
   const removeActivity = (index: number) => {
     onChange(value.filter((_, i) => i !== index))
+    // Keep the index-keyed drafts aligned with the re-indexed activities:
+    // drop the removed row's draft and shift every later draft down by one,
+    // otherwise a pending (invalid) draft would render over a different row.
+    setConfigDrafts((drafts) => {
+      const next: Record<number, ConfigDraft> = {}
+      for (const key of Object.keys(drafts)) {
+        const i = Number(key)
+        if (i === index) continue
+        next[i > index ? i - 1 : i] = drafts[i]
+      }
+      return next
+    })
   }
 
   const moveActivity = (index: number, direction: 'up' | 'down') => {
@@ -96,6 +163,18 @@ export function ActivitiesEditor({ value = [], onChange, error }: ActivitiesEdit
     updated[index] = updated[newIndex]
     updated[newIndex] = temp
     onChange(updated)
+    // Swap the two rows' drafts too, so an in-progress edit follows its activity.
+    setConfigDrafts((drafts) => {
+      if (!(index in drafts) && !(newIndex in drafts)) return drafts
+      const next = { ...drafts }
+      const atIndex = drafts[index]
+      const atNew = drafts[newIndex]
+      if (atNew !== undefined) next[index] = atNew
+      else delete next[index]
+      if (atIndex !== undefined) next[newIndex] = atIndex
+      else delete next[newIndex]
+      return next
+    })
   }
 
   return (
@@ -211,8 +290,8 @@ export function ActivitiesEditor({ value = [], onChange, error }: ActivitiesEdit
                   <Input
                     id={`activity-${index}-timeout`}
                     type="number"
-                    value={activity.timeout || ''}
-                    onChange={(e) => updateActivity(index, 'timeout', e.target.value ? parseInt(e.target.value) : undefined)}
+                    value={activity.timeoutMs || ''}
+                    onChange={(e) => updateActivity(index, 'timeoutMs', e.target.value ? parseInt(e.target.value) : undefined)}
                     placeholder="30000"
                     className="mt-1"
                   />
@@ -318,19 +397,24 @@ export function ActivitiesEditor({ value = [], onChange, error }: ActivitiesEdit
                 </Label>
                 <Textarea
                   id={`activity-${index}-config`}
-                  value={JSON.stringify(activity.config || {}, null, 2)}
-                  onChange={(e) => {
-                    try {
-                      const parsed = JSON.parse(e.target.value)
-                      updateActivity(index, 'config', parsed)
-                    } catch {
-                      // Invalid JSON, don't update
-                    }
-                  }}
+                  value={configTextFor(index, activity)}
+                  onChange={(e) => handleConfigTextChange(index, e.target.value)}
+                  onBlur={() => handleConfigBlur(index)}
+                  aria-invalid={configDrafts[index]?.error ? true : undefined}
+                  aria-describedby={configDrafts[index]?.error ? `activity-${index}-config-error` : undefined}
                   placeholder='{"key": "value"}'
                   rows={3}
                   className="mt-1 font-mono text-xs"
                 />
+                {configDrafts[index]?.error ? (
+                  <p
+                    id={`activity-${index}-config-error`}
+                    className="mt-1 text-xs text-status-error-text"
+                    role="alert"
+                  >
+                    {configDrafts[index]?.error}
+                  </p>
+                ) : null}
               </div>
               )}
             </div>

package/src/modules/workflows/components/TransitionsEditor.tsx

@@ -26,7 +26,11 @@ interface Activity {
     retryDelay?: number
     backoffMultiplier?: number
   }
-  timeout?: number
+  // Milliseconds, matching the executor and the definition schema. This field
+  // used to be written as `timeout` (a number) while the schema typed `timeout`
+  // as an ISO 8601 string, so saving a timeout from this editor failed
+  // validation outright (#4424).
+  timeoutMs?: number
   compensation?: Record<string, any>
 }
 
@@ -66,8 +70,53 @@ const ACTIVITY_TYPES = [
   { value: 'WAIT', label: 'Wait' },
 ]
 
+type ConfigDraft = { text: string; error: string | null }
+
 export function TransitionsEditor({ value = [], onChange, steps = [], error }: TransitionsEditorProps) {
   const t = useT()
+  const [configDrafts, setConfigDrafts] = React.useState<Record<string, ConfigDraft>>({})
+
+  const configDraftKey = (transition: Transition, activity: Activity) =>
+    `${transition.transitionId}:${activity.activityId}`
+
+  const handleConfigTextChange = (
+    transitionIndex: number,
+    activityIndex: number,
+    text: string,
+  ) => {
+    const transition = value[transitionIndex]
+    const activity = transition.activities?.[activityIndex]
+    if (!activity) return
+
+    let parsed: Record<string, unknown> | null = null
+    let parseError: string | null = null
+    try {
+      const candidate = JSON.parse(text) as unknown
+      if (candidate && typeof candidate === 'object' && !Array.isArray(candidate)) {
+        parsed = candidate as Record<string, unknown>
+      } else {
+        parseError = t('workflows.activities.configMustBeObject', 'Config must be a JSON object')
+      }
+    } catch (err) {
+      parseError = err instanceof Error
+        ? err.message
+        : t('workflows.activities.configInvalidJson', 'Invalid JSON')
+    }
+
+    const key = configDraftKey(transition, activity)
+    setConfigDrafts((drafts) => ({ ...drafts, [key]: { text, error: parseError } }))
+    if (parsed) updateActivity(transitionIndex, activityIndex, 'config', parsed)
+  }
+
+  const handleConfigBlur = (transition: Transition, activity: Activity) => {
+    const key = configDraftKey(transition, activity)
+    setConfigDrafts((drafts) => {
+      if (!drafts[key] || drafts[key].error) return drafts
+      const next = { ...drafts }
+      delete next[key]
+      return next
+    })
+  }
 
   const addTransition = () => {
     const newTransition: Transition = {
@@ -370,9 +419,12 @@ export function TransitionsEditor({ value = [], onChange, steps = [], error }: T
                 )}
 
                 <div className="space-y-2">
-                  {(transition.activities || []).map((activity, activityIndex) => (
-                    <div key={activityIndex} className="p-3 border rounded-md bg-muted shadow-sm border-l-4 border-l-green-500">
-                      <div className="space-y-2">
+                  {(transition.activities || []).map((activity, activityIndex) => {
+                    const draftKey = configDraftKey(transition, activity)
+                    const configDraft = configDrafts[draftKey]
+                    return (
+                      <div key={draftKey} className="p-3 border rounded-md bg-muted shadow-sm border-l-4 border-l-green-500">
+                        <div className="space-y-2">
                         <div className="flex flex-col gap-2 sm:flex-row sm:items-start sm:justify-between">
                           <div className="flex-1 grid grid-cols-1 sm:grid-cols-2 gap-2">
                             <div>
@@ -461,8 +513,8 @@ export function TransitionsEditor({ value = [], onChange, steps = [], error }: T
                             <Input
                               id={`activity-${index}-${activityIndex}-timeout`}
                               type="number"
-                              value={activity.timeout || ''}
-                              onChange={(e) => updateActivity(index, activityIndex, 'timeout', e.target.value ? parseInt(e.target.value) : undefined)}
+                              value={activity.timeoutMs || ''}
+                              onChange={(e) => updateActivity(index, activityIndex, 'timeoutMs', e.target.value ? parseInt(e.target.value) : undefined)}
                               placeholder="30000"
                               className="mt-1 text-xs h-8"
                             />
@@ -529,23 +581,29 @@ export function TransitionsEditor({ value = [], onChange, steps = [], error }: T
                           </Label>
                           <Textarea
                             id={`activity-${index}-${activityIndex}-config`}
-                            value={JSON.stringify(activity.config || {}, null, 2)}
-                            onChange={(e) => {
-                              try {
-                                const parsed = JSON.parse(e.target.value)
-                                updateActivity(index, activityIndex, 'config', parsed)
-                              } catch {
-                                // Invalid JSON, don't update
-                              }
-                            }}
+                            value={configDraft?.text ?? JSON.stringify(activity.config || {}, null, 2)}
+                            onChange={(e) => handleConfigTextChange(index, activityIndex, e.target.value)}
+                            onBlur={() => handleConfigBlur(transition, activity)}
+                            aria-invalid={configDraft?.error ? true : undefined}
+                            aria-describedby={configDraft?.error ? `activity-${index}-${activityIndex}-config-error` : undefined}
                             placeholder='{"key": "value"}'
                             rows={2}
                             className="mt-1 font-mono text-xs"
                           />
+                          {configDraft?.error ? (
+                            <p
+                              id={`activity-${index}-${activityIndex}-config-error`}
+                              className="mt-1 text-xs text-status-error-text"
+                              role="alert"
+                            >
+                              {configDraft.error}
+                            </p>
+                          ) : null}
+                        </div>
                         </div>
                       </div>
-                    </div>
-                  ))}
+                    )
+                  })}
                 </div>
               </div>
             </div>

package/src/modules/workflows/data/validators.ts

@@ -202,6 +202,20 @@ export const activityRetryPolicySchema = z.object({
   maxIntervalMs: z.number().int().min(0),
 })
 
+/**
+ * Config fields each activity executor requires to run (see
+ * `lib/activity-executor.ts`). WAIT is handled separately below because it
+ * takes "duration" OR "until" rather than a fixed key set.
+ */
+const REQUIRED_ACTIVITY_CONFIG_KEYS: Partial<Record<ActivityType, readonly string[]>> = {
+  SEND_EMAIL: ['to', 'subject'],
+  CALL_API: ['endpoint'],
+  CALL_WEBHOOK: ['url'],
+  UPDATE_ENTITY: ['commandId', 'input'],
+  EMIT_EVENT: ['eventName'],
+  EXECUTE_FUNCTION: ['functionName'],
+}
+
 // Activity definition (embedded in transitions)
 export const activityDefinitionSchema = z.object({
   activityId: z.string().min(1).max(100).regex(/^[a-z0-9_-]+$/, 'Activity ID must contain only lowercase letters, numbers, hyphens, and underscores'),
@@ -210,12 +224,49 @@ export const activityDefinitionSchema = z.object({
   config: z.record(z.string(), z.any()),
   async: z.boolean().default(false).optional(), // For Phase 8.3
   retryPolicy: activityRetryPolicySchema.optional(),
-  timeout: z.string().optional(), // ISO 8601 duration
+  /**
+   * Per-activity timeout in milliseconds. This is what the editor writes and
+   * what `executeActivity` reads; it was missing from the schema, so
+   * `z.object()` stripped it on save and UI-configured timeouts silently did
+   * nothing (#4424).
+   */
+  timeoutMs: z.number().int().positive().optional(),
+  /**
+   * @deprecated Use `timeoutMs`. Accepted for definitions already stored with
+   * an ISO 8601 duration string; the executor normalizes it to milliseconds.
+   */
+  timeout: z.string().optional(),
   compensation: z.object({
     activityId: z.string().min(1), // ID of compensation activity
     automatic: z.boolean().default(true).optional() // Auto-trigger on failure
   }).optional(), // Compensation configuration (Phase 8.2)
 }).superRefine((activity, ctx) => {
+  // Config keys each activity executor requires at runtime. Without this, an
+  // activity missing e.g. CALL_API's `endpoint` saved cleanly from the visual
+  // editor and only failed once an instance ran it — the "edit silently
+  // disappeared / nothing told me why" report in #4232 (and the class of bug
+  // #4322 was an instance of). Validating here surfaces the exact missing field
+  // at edit time, since both the editor's save path and the API route parse
+  // through this schema.
+  const requiredConfigKeys = REQUIRED_ACTIVITY_CONFIG_KEYS[activity.activityType]
+  if (requiredConfigKeys) {
+    const config = activity.config || {}
+    for (const key of requiredConfigKeys) {
+      const value = config[key]
+      const isEmpty =
+        value == null ||
+        (typeof value === 'string' && value.trim() === '') ||
+        (key === 'input' && typeof value !== 'object')
+      if (isEmpty) {
+        ctx.addIssue({
+          code: 'custom',
+          path: ['config', key],
+          message: `${activity.activityType} activity requires "${key}"`,
+        })
+      }
+    }
+  }
+
   if (activity.activityType !== 'WAIT') return
   const config = activity.config || {}
   const hasDuration = config.duration != null && config.duration !== ''

package/src/modules/workflows/i18n/de.json

@@ -80,6 +80,8 @@
   "workflows.activities.async": "Asynchron",
   "workflows.activities.compensation": "Kompensation",
   "workflows.activities.config": "Konfiguration",
+  "workflows.activities.configInvalidJson": "Ungültiges JSON",
+  "workflows.activities.configMustBeObject": "Konfiguration muss ein JSON-Objekt sein",
   "workflows.activities.deleteActivity": "Aktivität löschen",
   "workflows.activities.editActivity": "Aktivität bearbeiten",
   "workflows.activities.plural": "Aktivitäten",

package/src/modules/workflows/i18n/en.json

@@ -80,6 +80,8 @@
   "workflows.activities.async": "Asynchronous",
   "workflows.activities.compensation": "Compensation",
   "workflows.activities.config": "Configuration",
+  "workflows.activities.configInvalidJson": "Invalid JSON",
+  "workflows.activities.configMustBeObject": "Config must be a JSON object",
   "workflows.activities.deleteActivity": "Delete Activity",
   "workflows.activities.editActivity": "Edit Activity",
   "workflows.activities.plural": "Activities",

package/src/modules/workflows/i18n/es.json

@@ -80,6 +80,8 @@
   "workflows.activities.async": "Asincrona",
   "workflows.activities.compensation": "Compensacion",
   "workflows.activities.config": "Configuracion",
+  "workflows.activities.configInvalidJson": "JSON no válido",
+  "workflows.activities.configMustBeObject": "La configuración debe ser un objeto JSON",
   "workflows.activities.deleteActivity": "Eliminar actividad",
   "workflows.activities.editActivity": "Editar actividad",
   "workflows.activities.plural": "Actividades",

package/src/modules/workflows/i18n/pl.json

@@ -80,6 +80,8 @@
   "workflows.activities.async": "Asynchroniczne",
   "workflows.activities.compensation": "Kompensacja",
   "workflows.activities.config": "Konfiguracja",
+  "workflows.activities.configInvalidJson": "Nieprawidłowy JSON",
+  "workflows.activities.configMustBeObject": "Konfiguracja musi być obiektem JSON",
   "workflows.activities.deleteActivity": "Usuń Działanie",
   "workflows.activities.editActivity": "Edytuj Działanie",
   "workflows.activities.plural": "Działania",

package/src/modules/workflows/lib/activity-executor.ts

@@ -107,9 +107,42 @@ export interface ActivityDefinition {
   async?: boolean // Flag to execute activity asynchronously via queue
   retryPolicy?: RetryPolicy
   timeoutMs?: number
+  /**
+   * @deprecated Use `timeoutMs`. Legacy ISO 8601 duration string accepted by
+   * the definition schema before #4424; normalized by `resolveActivityTimeoutMs`.
+   */
+  timeout?: string
   compensate?: boolean // Flag to execute compensation on failure
 }
 
+/**
+ * Effective timeout for an activity, in milliseconds.
+ *
+ * The editor and this executor both speak `timeoutMs`, but the definition
+ * schema historically accepted only an ISO 8601 `timeout` string — so stored
+ * definitions can carry either. Prefer `timeoutMs`; fall back to parsing
+ * `timeout`, ignoring a malformed value rather than throwing mid-execution
+ * (an unparseable timeout must not fail an activity that would otherwise
+ * succeed). Returns undefined when no usable timeout is configured (#4424).
+ */
+export function resolveActivityTimeoutMs(activity: {
+  timeoutMs?: number
+  timeout?: string
+}): number | undefined {
+  if (typeof activity.timeoutMs === 'number' && activity.timeoutMs > 0) {
+    return activity.timeoutMs
+  }
+  if (typeof activity.timeout === 'string' && activity.timeout.trim().length > 0) {
+    try {
+      const parsed = parseDuration(activity.timeout.trim())
+      if (Number.isFinite(parsed) && parsed > 0) return parsed
+    } catch {
+      return undefined
+    }
+  }
+  return undefined
+}
+
 export interface RetryPolicy {
   maxAttempts: number
   initialIntervalMs: number
@@ -332,11 +365,13 @@ export async function executeActivity(
     try {
       const startTime = Date.now()
 
-      // Execute with timeout if specified
-      const result = activity.timeoutMs
+      // Execute with timeout if specified (timeoutMs, or a legacy ISO 8601
+      // `timeout` string normalized to ms — see resolveActivityTimeoutMs).
+      const timeoutMs = resolveActivityTimeoutMs(activity)
+      const result = timeoutMs
         ? await executeWithTimeout(
             () => executeActivityByType(em, container, activity, context),
-            activity.timeoutMs
+            timeoutMs
           )
         : await executeActivityByType(em, container, activity, context)
 

package/src/modules/workflows/lib/format-validation-error.ts

@@ -8,6 +8,66 @@ type ApiErrorBody = {
   details?: ZodIssueLite[]
 }
 
+// Collection segments in a definition path, mapped to the label an operator
+// recognizes from the editor. Indexes are rendered 1-based.
+const COLLECTION_LABELS: Record<string, string> = {
+  steps: 'step',
+  transitions: 'transition',
+  activities: 'activity',
+  triggers: 'trigger',
+  preConditions: 'pre-condition',
+}
+
+/**
+ * Turn a raw Zod path into something an operator can act on:
+ * `steps.2.activities.0.config.endpoint` → `step 3 › activity 1 › config.endpoint`.
+ *
+ * The raw dotted path reads as internal JSON and gives no hint which node to
+ * open in the visual editor (#4232).
+ */
+export function humanizeDefinitionIssuePath(path: ReadonlyArray<PropertyKey>): string {
+  if (!path.length) return 'definition'
+  const parts: string[] = []
+  let pending: string | null = null
+
+  for (const rawSegment of path) {
+    // Zod types issue paths as PropertyKey; symbols can't appear in JSON data
+    // but narrow defensively rather than casting.
+    const segment = typeof rawSegment === 'symbol' ? rawSegment.toString() : rawSegment
+    if (typeof segment === 'number') {
+      parts.push(pending ? `${pending} ${segment + 1}` : `#${segment + 1}`)
+      pending = null
+      continue
+    }
+    const label = COLLECTION_LABELS[segment]
+    if (label) {
+      if (pending) parts.push(pending)
+      pending = label
+      continue
+    }
+    if (pending) {
+      parts.push(pending)
+      pending = null
+    }
+    parts.push(segment)
+  }
+  if (pending) parts.push(pending)
+
+  const [head, ...rest] = parts
+  if (!rest.length) return head
+  // Keep trailing field names dotted (config.endpoint), collections chevroned.
+  const grouped: string[] = [head]
+  for (const part of rest) {
+    const isIndexed = /\s\d+$/.test(part) || part.startsWith('#')
+    if (!isIndexed && grouped.length > 0 && !/\s\d+$/.test(grouped[grouped.length - 1]) && !grouped[grouped.length - 1].startsWith('#')) {
+      grouped[grouped.length - 1] = `${grouped[grouped.length - 1]}.${part}`
+      continue
+    }
+    grouped.push(part)
+  }
+  return grouped.join(' › ')
+}
+
 /**
  * Format an API validation error body into a user-readable message.
  *