@ai-stack/payloadcms 3.68.0-beta.1 → 3.68.0-beta.3

package/dist/ui/Compose/hooks/menu/useMenu.js

@@ -1,6 +1,7 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useField } from '@payloadcms/ui';
+import { useForm } from '@payloadcms/ui';
+import { getSiblingData } from 'payload/shared';
 import React, { useEffect, useMemo, useState } from 'react';
 import { useFieldProps } from '../../../../providers/FieldProvider/useFieldProps.js';
 import { Compose, Proofread, Rephrase } from './items.js';
@@ -19,14 +20,27 @@ const getActiveComponent = (ac)=>{
     }
 };
 export const useMenu = (menuEvents, options)=>{
-    const { field: { type: fieldType } = {}, path: pathFromContext } = useFieldProps();
-    const field = useField({
-        path: pathFromContext ?? ''
-    });
+    const { field: { type: fieldType } = {}, path } = useFieldProps();
+    const { getData } = useForm();
     const [activeComponent, setActiveComponent] = useState('Rephrase');
-    const { initialValue, value } = field;
+    // Check value once on mount or when path/type changes
     useEffect(()=>{
-        if (!value) {
+        let hasValue = false;
+        try {
+            const data = getData();
+            if (path) {
+                const val = getSiblingData(data, path);
+                hasValue = val !== undefined && val !== null;
+                // For richTextFields, we might need a more robust check (e.g. check for root.children.length > 0)
+                // But for now, simple truthiness covers most cases or at least defaults safely
+                if (fieldType === 'richText' && val && typeof val === 'object' && 'root' in val) {
+                // Basic lexical check could go here if needed
+                }
+            }
+        } catch (e) {
+        // ignore
+        }
+        if (!hasValue) {
             setActiveComponent('Compose');
             return;
         }
@@ -34,15 +48,12 @@ export const useMenu = (menuEvents, options)=>{
             setActiveComponent('Compose');
             return;
         }
-        if (typeof value === 'string' && value !== initialValue) {
-            setActiveComponent('Proofread');
-        } else {
-            setActiveComponent('Rephrase');
-        }
+        // Default to Rephrase if value exists
+        setActiveComponent('Rephrase');
     }, [
-        initialValue,
-        value,
-        fieldType
+        fieldType,
+        getData,
+        path
     ]);
     const MemoizedActiveComponent = useMemo(()=>{
         return ({ isLoading, loadingLabel, stop })=>{

package/dist/ui/Compose/hooks/menu/useMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/ui/Compose/hooks/menu/useMenu.tsx"],"sourcesContent":["'use client'\n\nimport { useField } from '@payloadcms/ui'\nimport React, { useEffect, useMemo, useState } from 'react'\n\nimport type { ActionMenuItems, UseMenuEvents, UseMenuOptions } from '../../../../types.js'\n\nimport { useFieldProps } from '../../../../providers/FieldProvider/useFieldProps.js'\nimport { Compose, Proofread, Rephrase } from './items.js'\nimport { menuItemsMap } from './itemsMap.js'\nimport styles from './menu.module.scss'\n\nconst getActiveComponent = (ac: ActionMenuItems) => {\n  switch (ac) {\n    case 'Compose':\n      return Compose\n    case 'Proofread':\n      return Proofread\n    case 'Rephrase':\n      return Rephrase\n    default:\n      return Rephrase\n  }\n}\n\nexport const useMenu = (menuEvents: UseMenuEvents, options: UseMenuOptions) => {\n  const { field:{ type: fieldType } = {}, path: pathFromContext } = useFieldProps()\n  const field = useField({ path: pathFromContext ?? '' })\n  const [activeComponent, setActiveComponent] = useState<ActionMenuItems>('Rephrase')\n\n  const { initialValue, value } = field\n\n  useEffect(() => {\n    if (!value) {\n      setActiveComponent('Compose')\n      return\n    }\n\n    if (menuItemsMap.some((i) => i.excludedFor?.includes(fieldType ?? ''))) {\n      setActiveComponent('Compose')\n      return\n    }\n\n    if (typeof value === 'string' && value !== initialValue) {\n      setActiveComponent('Proofread')\n    } else {\n      setActiveComponent('Rephrase')\n    }\n  }, [initialValue, value, fieldType])\n\n  const MemoizedActiveComponent = useMemo(() => {\n    return ({ isLoading, loadingLabel, stop }: { isLoading: boolean; loadingLabel?: string; stop: () => void }) => {\n      const ActiveComponent = getActiveComponent(activeComponent)\n      const activeItem = menuItemsMap.find((i) => i.name === activeComponent)!\n      return (\n        <ActiveComponent\n          hideIcon\n          onClick={(data: unknown) => {\n            if (!isLoading) {\n              const trigger = menuEvents[`on${activeComponent}`]\n              if (typeof trigger === 'function') {\n                trigger(data)\n              } else {\n                console.error('No trigger found for', activeComponent)\n              }\n            } else {\n              stop()\n            }\n          }}\n          title={isLoading ? 'Click to stop' : activeItem.name}\n        >\n          {isLoading && (loadingLabel ?? activeItem.loadingText)}\n        </ActiveComponent>\n      )\n    }\n  }, [activeComponent, menuEvents])\n\n  const filteredMenuItems = useMemo(\n    () =>\n      menuItemsMap.filter((i) => {\n        if (i.name === 'Settings' && !options.isConfigAllowed) {\n          return false\n        } // Disable settings if a user role is not permitted\n        return i.name !== activeComponent && !i.excludedFor?.includes(fieldType ?? '')\n      }),\n    [activeComponent, fieldType, options.isConfigAllowed],\n  )\n\n  const MemoizedMenu = useMemo(() => {\n    return ({ isLoading, onClose }: { isLoading: boolean; onClose: () => void }) => (\n      <div className={styles.menu}>\n        {filteredMenuItems.map((i) => {\n          const Action = i.component\n          return (\n            <Action\n              disabled={isLoading}\n              key={i.name}\n              onClick={(data: unknown) => {\n                if (i.name !== 'Settings') {\n                  setActiveComponent(i.name)\n                }\n\n                menuEvents[`on${i.name}`]?.(data)\n                onClose()\n              }}\n            >\n              {isLoading && i.loadingText}\n            </Action>\n          )\n        })}\n      </div>\n    )\n  }, [filteredMenuItems, menuEvents])\n\n  return {\n    ActiveComponent: MemoizedActiveComponent,\n    Menu: MemoizedMenu,\n  }\n}\n"],"names":["useField","React","useEffect","useMemo","useState","useFieldProps","Compose","Proofread","Rephrase","menuItemsMap","styles","getActiveComponent","ac","useMenu","menuEvents","options","field","type","fieldType","path","pathFromContext","activeComponent","setActiveComponent","initialValue","value","some","i","excludedFor","includes","MemoizedActiveComponent","isLoading","loadingLabel","stop","ActiveComponent","activeItem","find","name","hideIcon","onClick","data","trigger","console","error","title","loadingText","filteredMenuItems","filter","isConfigAllowed","MemoizedMenu","onClose","div","className","menu","map","Action","component","disabled","Menu"],"mappings":"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"}
+{"version":3,"sources":["../../../../../src/ui/Compose/hooks/menu/useMenu.tsx"],"sourcesContent":["'use client'\n\nimport { useForm } from '@payloadcms/ui'\nimport { getSiblingData } from 'payload/shared'\nimport React, { useEffect, useMemo, useState } from 'react'\n\nimport type { ActionMenuItems, UseMenuEvents, UseMenuOptions } from '../../../../types.js'\n\nimport { useFieldProps } from '../../../../providers/FieldProvider/useFieldProps.js'\nimport { Compose, Proofread, Rephrase } from './items.js'\nimport { menuItemsMap } from './itemsMap.js'\nimport styles from './menu.module.scss'\n\nconst getActiveComponent = (ac: ActionMenuItems) => {\n  switch (ac) {\n    case 'Compose':\n      return Compose\n    case 'Proofread':\n      return Proofread\n    case 'Rephrase':\n      return Rephrase\n    default:\n      return Rephrase\n  }\n}\n\nexport const useMenu = (menuEvents: UseMenuEvents, options: UseMenuOptions) => {\n  const { field: { type: fieldType } = {}, path } = useFieldProps()\n  const { getData } = useForm()\n  const [activeComponent, setActiveComponent] = useState<ActionMenuItems>('Rephrase')\n\n  // Check value once on mount or when path/type changes\n  useEffect(() => {\n    let hasValue = false\n\n    try {\n      const data = getData()\n      if (path) {\n        const val = getSiblingData(data, path)\n        hasValue = val !== undefined && val !== null\n        // For richTextFields, we might need a more robust check (e.g. check for root.children.length > 0)\n        // But for now, simple truthiness covers most cases or at least defaults safely\n        if (fieldType === 'richText' && val && typeof val === 'object' && 'root' in val) {\n           // Basic lexical check could go here if needed\n        }\n      }\n    } catch (e) {\n      // ignore\n    }\n\n    if (!hasValue) {\n      setActiveComponent('Compose')\n      return\n    }\n\n    if (menuItemsMap.some((i) => i.excludedFor?.includes(fieldType ?? ''))) {\n      setActiveComponent('Compose')\n      return\n    }\n\n    // Default to Rephrase if value exists\n    setActiveComponent('Rephrase')\n  }, [fieldType, getData, path])\n\n  const MemoizedActiveComponent = useMemo(() => {\n    return ({ isLoading, loadingLabel, stop }: { isLoading: boolean; loadingLabel?: string; stop: () => void }) => {\n      const ActiveComponent = getActiveComponent(activeComponent)\n      const activeItem = menuItemsMap.find((i) => i.name === activeComponent)!\n      return (\n        <ActiveComponent\n          hideIcon\n          onClick={(data: unknown) => {\n            if (!isLoading) {\n              const trigger = menuEvents[`on${activeComponent}`]\n              if (typeof trigger === 'function') {\n                trigger(data)\n              } else {\n                console.error('No trigger found for', activeComponent)\n              }\n            } else {\n              stop()\n            }\n          }}\n          title={isLoading ? 'Click to stop' : activeItem.name}\n        >\n          {isLoading && (loadingLabel ?? activeItem.loadingText)}\n        </ActiveComponent>\n      )\n    }\n  }, [activeComponent, menuEvents])\n\n  const filteredMenuItems = useMemo(\n    () =>\n      menuItemsMap.filter((i) => {\n        if (i.name === 'Settings' && !options.isConfigAllowed) {\n          return false\n        } // Disable settings if a user role is not permitted\n        return i.name !== activeComponent && !i.excludedFor?.includes(fieldType ?? '')\n      }),\n    [activeComponent, fieldType, options.isConfigAllowed],\n  )\n\n  const MemoizedMenu = useMemo(() => {\n    return ({ isLoading, onClose }: { isLoading: boolean; onClose: () => void }) => (\n      <div className={styles.menu}>\n        {filteredMenuItems.map((i) => {\n          const Action = i.component\n          return (\n            <Action\n              disabled={isLoading}\n              key={i.name}\n              onClick={(data: unknown) => {\n                if (i.name !== 'Settings') {\n                  setActiveComponent(i.name)\n                }\n\n                menuEvents[`on${i.name}`]?.(data)\n                onClose()\n              }}\n            >\n              {isLoading && i.loadingText}\n            </Action>\n          )\n        })}\n      </div>\n    )\n  }, [filteredMenuItems, menuEvents])\n\n  return {\n    ActiveComponent: MemoizedActiveComponent,\n    Menu: MemoizedMenu,\n  }\n}\n\n"],"names":["useForm","getSiblingData","React","useEffect","useMemo","useState","useFieldProps","Compose","Proofread","Rephrase","menuItemsMap","styles","getActiveComponent","ac","useMenu","menuEvents","options","field","type","fieldType","path","getData","activeComponent","setActiveComponent","hasValue","data","val","undefined","e","some","i","excludedFor","includes","MemoizedActiveComponent","isLoading","loadingLabel","stop","ActiveComponent","activeItem","find","name","hideIcon","onClick","trigger","console","error","title","loadingText","filteredMenuItems","filter","isConfigAllowed","MemoizedMenu","onClose","div","className","menu","map","Action","component","disabled","Menu"],"mappings":"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"}

package/dist/ui/Compose/hooks/menu/useMenu.jsx

@@ -1,5 +1,6 @@
 'use client';
-import { useField } from '@payloadcms/ui';
+import { useForm } from '@payloadcms/ui';
+import { getSiblingData } from 'payload/shared';
 import React, { useEffect, useMemo, useState } from 'react';
 import { useFieldProps } from '../../../../providers/FieldProvider/useFieldProps.js';
 import { Compose, Proofread, Rephrase } from './items.js';
@@ -18,12 +19,28 @@ const getActiveComponent = (ac) => {
     }
 };
 export const useMenu = (menuEvents, options) => {
-    const { field: { type: fieldType } = {}, path: pathFromContext } = useFieldProps();
-    const field = useField({ path: pathFromContext ?? '' });
+    const { field: { type: fieldType } = {}, path } = useFieldProps();
+    const { getData } = useForm();
     const [activeComponent, setActiveComponent] = useState('Rephrase');
-    const { initialValue, value } = field;
+    // Check value once on mount or when path/type changes
     useEffect(() => {
-        if (!value) {
+        let hasValue = false;
+        try {
+            const data = getData();
+            if (path) {
+                const val = getSiblingData(data, path);
+                hasValue = val !== undefined && val !== null;
+                // For richTextFields, we might need a more robust check (e.g. check for root.children.length > 0)
+                // But for now, simple truthiness covers most cases or at least defaults safely
+                if (fieldType === 'richText' && val && typeof val === 'object' && 'root' in val) {
+                    // Basic lexical check could go here if needed
+                }
+            }
+        }
+        catch (e) {
+            // ignore
+        }
+        if (!hasValue) {
             setActiveComponent('Compose');
             return;
         }
@@ -31,13 +48,9 @@ export const useMenu = (menuEvents, options) => {
             setActiveComponent('Compose');
             return;
         }
-        if (typeof value === 'string' && value !== initialValue) {
-            setActiveComponent('Proofread');
-        }
-        else {
-            setActiveComponent('Rephrase');
-        }
-    }, [initialValue, value, fieldType]);
+        // Default to Rephrase if value exists
+        setActiveComponent('Rephrase');
+    }, [fieldType, getData, path]);
     const MemoizedActiveComponent = useMemo(() => {
         return ({ isLoading, loadingLabel, stop }) => {
             const ActiveComponent = getActiveComponent(activeComponent);

package/dist/ui/Compose/hooks/useGenerate.js

@@ -2,40 +2,35 @@ import { experimental_useObject as useObject } from '@ai-sdk/react';
 import { useEditorConfigContext } from '@payloadcms/richtext-lexical/client';
 import { toast, useConfig, useDocumentInfo, useField, useForm, useLocale } from '@payloadcms/ui';
 import { jsonSchema } from 'ai';
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { PLUGIN_AI_JOBS_TABLE, PLUGIN_API_ENDPOINT_GENERATE, PLUGIN_API_ENDPOINT_GENERATE_UPLOAD, PLUGIN_INSTRUCTIONS_TABLE, PLUGIN_NAME } from '../../../defaults.js';
+import { useCallback, useMemo, useRef } from 'react';
+import { PLUGIN_API_ENDPOINT_GENERATE, PLUGIN_INSTRUCTIONS_TABLE, PLUGIN_NAME } from '../../../defaults.js';
 import { useFieldProps } from '../../../providers/FieldProvider/useFieldProps.js';
 import { editorSchemaValidator } from '../../../utilities/editorSchemaValidator.js';
 import { fieldToJsonSchema } from '../../../utilities/fieldToJsonSchema.js';
 import { setSafeLexicalState } from '../../../utilities/setSafeLexicalState.js';
+import { useGenerateUpload } from './useGenerateUpload.js';
 import { useHistory } from './useHistory.js';
+import { useStreamingUpdate } from './useStreamingUpdate.js';
 export const useGenerate = ({ instructionId })=>{
-    // Create a ref to hold the current instructionId
     const instructionIdRef = useRef(instructionId);
-    // Update the ref whenever instructionId changes
-    useEffect(()=>{
-        instructionIdRef.current = instructionId;
-    }, [
-        instructionId
-    ]);
+    // Sync ref
+    instructionIdRef.current = instructionId;
     const { field, path: pathFromContext } = useFieldProps();
-    const editorConfigContext = useEditorConfigContext();
-    const { editor } = editorConfigContext;
+    const { editor } = useEditorConfigContext();
     const { config } = useConfig();
-    const { routes: { api }, serverURL } = config;
+    const { collections } = config;
+    // Use dispatchFields to update values without subscribing to them, avoiding re-renders during streaming
+    // dispatchFields is handled inside useStreamingUpdate now, so we don't need it here
+    // const { dispatchFields } = useForm()
+    // Keep setValue for non-streaming updates (one-off), but do NOT destructure 'value' to avoid subscriptions
     const { setValue } = useField({
         path: pathFromContext ?? ''
     });
     const { set: setHistory } = useHistory();
-    // Async job UI state
-    const [jobStatus, setJobStatus] = useState(undefined);
-    const [jobProgress, setJobProgress] = useState(0);
-    const [isJobActive, setIsJobActive] = useState(false);
     const { getData } = useForm();
-    const { id: documentId, collectionSlug } = useDocumentInfo();
+    const { id: documentId } = useDocumentInfo();
     const localFromContext = useLocale();
-    // Reuse config from above instead of calling useConfig again
-    const { collections } = config;
+    // Editor Schema Setup
     const collection = collections.find((collection)=>collection.slug === PLUGIN_INSTRUCTIONS_TABLE);
     const { custom: { [PLUGIN_NAME]: { editorConfig = {} } = {} } = {} } = collection?.admin ?? {};
     const { schema: editorSchema = {} } = editorConfig;
@@ -89,8 +84,15 @@ export const useGenerate = ({ instructionId })=>{
         onFinish: (result)=>{
             if (result.object && field) {
                 if (field.type === 'richText') {
+                    // Set state directly to editor first for immediate feedback
+                    setSafeLexicalState(result.object, editor);
+                    // Update history
                     setHistory(result.object);
-                    setValue(result.object);
+                    // Delay Payload's setValue slightly to ensure editor stability
+                    // and prevent field-level re-renders from interfering with the final state.
+                    setTimeout(()=>{
+                        setValue(result.object);
+                    }, 150);
                 } else if ('name' in field) {
                     setHistory(result.object[field.name]);
                     setValue(result.object[field.name]);
@@ -101,23 +103,17 @@ export const useGenerate = ({ instructionId })=>{
         },
         schema: activeSchema
     });
-    useEffect(()=>{
-        if (!object) {
-            return;
-        }
-        requestAnimationFrame(()=>{
-            if (field?.type === 'richText') {
-                setSafeLexicalState(object, editor);
-            } else if (field && 'name' in field && object[field.name]) {
-                setValue(object[field.name]);
-            }
-        });
-    }, [
-        object,
+    // Hook 1: Handle high-frequency streaming updates
+    useStreamingUpdate({
         editor,
-        field,
+        isLoading: loadingObject,
+        object
+    });
+    // Hook 2: Handle Upload generation and polling
+    const { generateUpload, isJobActive, jobProgress, jobStatus } = useGenerateUpload({
+        instructionIdRef,
         setValue
-    ]);
+    });
     const streamObject = useCallback(({ action = 'Compose', params })=>{
         const doc = getData();
         const currentInstructionId = instructionIdRef.current;
@@ -138,103 +134,10 @@ export const useGenerate = ({ instructionId })=>{
     }, [
         localFromContext?.code,
         instructionIdRef,
-        documentId
-    ]);
-    const generateUpload = useCallback(async ()=>{
-        const doc = getData();
-        const currentInstructionId = instructionIdRef.current;
-        return fetch(`${serverURL}${api}${PLUGIN_API_ENDPOINT_GENERATE_UPLOAD}`, {
-            body: JSON.stringify({
-                collectionSlug: collectionSlug ?? '',
-                doc,
-                documentId,
-                locale: localFromContext?.code,
-                options: {
-                    instructionId: currentInstructionId
-                }
-            }),
-            credentials: 'include',
-            headers: {
-                'Content-Type': 'application/json'
-            },
-            method: 'POST'
-        }).then(async (uploadResponse)=>{
-            if (uploadResponse.ok) {
-                const json = await uploadResponse.json();
-                const { job, result } = json || {};
-                if (result) {
-                    // Set the upload ID
-                    setValue(result?.id);
-                    setHistory(result?.id);
-                    // Show toast to prompt user to save
-                    toast.success('Image generated successfully! Click Save to see the preview.');
-                    return uploadResponse;
-                }
-                // Async job: poll AI Jobs collection for status/progress/result_id
-                if (job && job.id) {
-                    setIsJobActive(true);
-                    const cancelled = false;
-                    let attempts = 0;
-                    const maxAttempts = 600 // up to ~10 minutes @ 1s
-                    ;
-                    // Basic in-hook state via closure variables; UI will re-render off fetches below
-                    const poll = async ()=>{
-                        if (cancelled) {
-                            return;
-                        }
-                        try {
-                            const res = await fetch(`${serverURL}${api}/${PLUGIN_AI_JOBS_TABLE}/${job.id}`, {
-                                credentials: 'include'
-                            });
-                            if (res.ok) {
-                                const jobDoc = await res.json();
-                                const { progress, result_id, status } = jobDoc || {};
-                                setJobStatus(status);
-                                setJobProgress(progress ?? 0);
-                                // When result present, set field and finish
-                                if (status === 'completed' && result_id) {
-                                    // Force upload field to refetch by clearing then setting the ID
-                                    setValue(null);
-                                    setTimeout(()=>{
-                                        setValue(result_id);
-                                    }, 0);
-                                    setHistory(result_id);
-                                    setIsJobActive(false);
-                                    return;
-                                }
-                                if (status === 'failed') {
-                                    setIsJobActive(false);
-                                    throw new Error('Video generation failed');
-                                }
-                            }
-                        } catch (e) {
-                        // silent retry
-                        }
-                        attempts += 1;
-                        if (!cancelled && attempts < maxAttempts) {
-                            setTimeout(poll, 1000);
-                        }
-                    };
-                    setTimeout(poll, 1000);
-                    return uploadResponse;
-                }
-                throw new Error('generateUpload: Unexpected response');
-            } else {
-                const { errors = [] } = await uploadResponse.json();
-                const errStr = errors.map((error)=>error.message).join(', ');
-                throw new Error(errStr);
-            }
-        }).catch((error)=>{
-            toast.error(`Failed to generate: ${error.message}`);
-            console.error('Error generating or setting your upload, please set it manually if its saved in your media files.', error);
-        });
-    }, [
-        getData,
-        localFromContext?.code,
-        instructionIdRef,
-        setValue,
         documentId,
-        collectionSlug
+        getData,
+        submit,
+        editor
     ]);
     const generate = useCallback(async (options)=>{
         if (field?.type === 'upload') {

package/dist/ui/Compose/hooks/useGenerate.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/ui/Compose/hooks/useGenerate.ts"],"sourcesContent":["import { experimental_useObject as useObject } from '@ai-sdk/react'\nimport { useEditorConfigContext } from '@payloadcms/richtext-lexical/client'\nimport { toast, useConfig, useDocumentInfo, useField, useForm, useLocale } from '@payloadcms/ui'\nimport { jsonSchema } from 'ai'\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'react'\n\nimport type { ActionMenuItems, GenerateTextarea } from '../../../types.js'\n\nimport {\n  PLUGIN_AI_JOBS_TABLE,\n  PLUGIN_API_ENDPOINT_GENERATE,\n  PLUGIN_API_ENDPOINT_GENERATE_UPLOAD,\n  PLUGIN_INSTRUCTIONS_TABLE,\n  PLUGIN_NAME,\n} from '../../../defaults.js'\nimport { useFieldProps } from '../../../providers/FieldProvider/useFieldProps.js'\nimport { editorSchemaValidator } from '../../../utilities/editorSchemaValidator.js'\nimport { fieldToJsonSchema } from '../../../utilities/fieldToJsonSchema.js'\nimport { setSafeLexicalState } from '../../../utilities/setSafeLexicalState.js'\nimport { useHistory } from './useHistory.js'\n\ntype ActionCallbackParams = { action: ActionMenuItems; params?: unknown }\n\nexport const useGenerate = ({ instructionId }: { instructionId: string }) => {\n  // Create a ref to hold the current instructionId\n  const instructionIdRef = useRef(instructionId)\n\n  // Update the ref whenever instructionId changes\n  useEffect(() => {\n    instructionIdRef.current = instructionId\n  }, [instructionId])\n\n  const { field, path: pathFromContext } = useFieldProps()\n  const editorConfigContext = useEditorConfigContext()\n\n  const { editor } = editorConfigContext\n\n  const { config } = useConfig()\n  const {\n    routes: { api },\n    serverURL,\n  } = config\n\n  const { setValue } = useField<any>({\n    path: pathFromContext ?? '',\n  })\n\n  const { set: setHistory } = useHistory()\n\n  // Async job UI state\n  const [jobStatus, setJobStatus] = useState<string | undefined>(undefined)\n  const [jobProgress, setJobProgress] = useState<number>(0)\n  const [isJobActive, setIsJobActive] = useState<boolean>(false)\n\n  const { getData } = useForm()\n  const { id: documentId, collectionSlug } = useDocumentInfo()\n\n  const localFromContext = useLocale()\n  \n  // Reuse config from above instead of calling useConfig again\n  const { collections } = config\n\n  const collection = collections.find((collection) => collection.slug === PLUGIN_INSTRUCTIONS_TABLE)\n  const { custom: { [PLUGIN_NAME]: { editorConfig = {} } = {} } = {} } = collection?.admin ?? {}\n  const { schema: editorSchema = {} } = editorConfig\n\n  const memoizedValidator = useMemo(() => {\n    return editorSchemaValidator(editorSchema)\n  }, [editorSchema])\n\n  const memoizedSchema = useMemo(\n    () =>\n      jsonSchema(editorSchema, {\n        validate: (value) => {\n          const isValid = memoizedValidator(value)\n\n          if (isValid) {\n            return {\n              success: true,\n              value,\n            }\n          } else {\n            return {\n              error: new Error('Invalid schema'),\n              success: false,\n            }\n          }\n        },\n      }),\n    [memoizedValidator],\n  )\n\n  // Active JSON schema for useObject based on field type\n  const activeSchema = useMemo(() => {\n    const f = field as any\n    const fieldType = f?.type as string | undefined\n    if (fieldType === 'richText') {\n      return memoizedSchema\n    }\n    if (f && f.name && fieldType) {\n      const schemaJson = fieldToJsonSchema(f)\n      if (schemaJson && Object.keys(schemaJson).length > 0) {\n        return jsonSchema(schemaJson)\n      }\n    }\n    return undefined\n  }, [field, memoizedSchema])\n\n  const {\n    isLoading: loadingObject,\n    object,\n    stop: objectStop,\n    submit,\n  } = useObject({\n    api: `/api${PLUGIN_API_ENDPOINT_GENERATE}`,\n    onError: (error: any) => {\n      toast.error(`Failed to generate: ${error.message}`)\n      console.error('Error generating object:', error)\n    },\n    onFinish: (result) => {\n      if (result.object && field) {\n        if (field.type === 'richText') {\n          setHistory(result.object)\n          setValue(result.object)\n        } else if ('name' in field) {\n          setHistory(result.object[field.name])\n          setValue(result.object[field.name])\n        }\n      } else {\n        console.log('onFinish: result, field ', result, field)\n      }\n    },\n    schema: activeSchema as any,\n  })\n\n  useEffect(() => {\n    if (!object) {\n      return\n    }\n\n    requestAnimationFrame(() => {\n      if (field?.type === 'richText') {\n      setSafeLexicalState(object, editor)\n      } else if (field && 'name' in field && object[field.name]) {\n        setValue(object[field.name])\n      }\n    })\n  }, [object, editor, field, setValue])\n\n  const streamObject = useCallback(\n    ({ action = 'Compose', params }: ActionCallbackParams) => {\n      const doc = getData()\n\n      const currentInstructionId = instructionIdRef.current\n\n      const options = {\n        action,\n        actionParams: params,\n        instructionId: currentInstructionId,\n      }\n\n      submit({\n        allowedEditorNodes: Array.from(editor?._nodes?.keys() || []),\n        doc: {\n          ...doc,\n          id: documentId,\n        },\n        locale: localFromContext?.code,\n        options,\n      })\n    },\n    [localFromContext?.code, instructionIdRef, documentId],\n  )\n\n  const generateUpload = useCallback(async () => {\n    const doc = getData()\n    const currentInstructionId = instructionIdRef.current\n\n    return fetch(`${serverURL}${api}${PLUGIN_API_ENDPOINT_GENERATE_UPLOAD}`, {\n      body: JSON.stringify({\n        collectionSlug: collectionSlug ?? '',\n        doc,\n        documentId,\n        locale: localFromContext?.code,\n        options: {\n          instructionId: currentInstructionId,\n        },\n      } satisfies Parameters<GenerateTextarea>[0]),\n      credentials: 'include',\n      headers: {\n        'Content-Type': 'application/json',\n      },\n      method: 'POST',\n    })\n      .then(async (uploadResponse) => {\n        if (uploadResponse.ok) {\n          const json = await uploadResponse.json()\n          const { job, result } = json || {}\n          if (result) {\n            // Set the upload ID\n            setValue(result?.id)\n            setHistory(result?.id)\n            \n            // Show toast to prompt user to save\n            toast.success('Image generated successfully! Click Save to see the preview.')\n            \n            return uploadResponse\n          }\n\n          // Async job: poll AI Jobs collection for status/progress/result_id\n          if (job && job.id) {\n            setIsJobActive(true)\n            const cancelled = false\n            let attempts = 0\n            const maxAttempts = 600 // up to ~10 minutes @ 1s\n\n            // Basic in-hook state via closure variables; UI will re-render off fetches below\n            const poll = async (): Promise<void> => {\n              if (cancelled) {\n                return\n              }\n              try {\n                const res = await fetch(\n                  `${serverURL}${api}/${PLUGIN_AI_JOBS_TABLE}/${job.id}`,\n                  { credentials: 'include' },\n                )\n                if (res.ok) {\n                  const jobDoc = await res.json()\n                  const { progress, result_id, status } = jobDoc || {}\n                  setJobStatus(status)\n                  setJobProgress(progress ?? 0)\n                  // When result present, set field and finish\n                  if (status === 'completed' && result_id) {\n                    // Force upload field to refetch by clearing then setting the ID\n                    setValue(null)\n                    setTimeout(() => {\n                      setValue(result_id)\n                    }, 0)\n                    setHistory(result_id)\n                    setIsJobActive(false)\n                    return\n                  }\n                  if (status === 'failed') {\n                    setIsJobActive(false)\n                    throw new Error('Video generation failed')\n                  }\n                }\n              } catch (e) {\n                // silent retry\n              }\n\n              attempts += 1\n              if (!cancelled && attempts < maxAttempts) {\n                setTimeout(poll, 1000)\n              }\n            }\n            setTimeout(poll, 1000)\n            return uploadResponse\n          }\n\n          throw new Error('generateUpload: Unexpected response')\n        } else {\n          const { errors = [] } = await uploadResponse.json()\n          const errStr = errors.map((error: any) => error.message).join(', ')\n          throw new Error(errStr)\n        }\n      })\n      .catch((error) => {\n        toast.error(`Failed to generate: ${error.message}`)\n        console.error(\n          'Error generating or setting your upload, please set it manually if its saved in your media files.',\n          error,\n        )\n      })\n  }, [getData, localFromContext?.code, instructionIdRef, setValue, documentId, collectionSlug])\n\n  const generate = useCallback(\n    async (options?: ActionCallbackParams) => {\n      if ((field as any)?.type === 'upload') {\n        return generateUpload()\n      }\n      // All supported types use structured object generation when schema is provided server-side\n      return streamObject(options ?? { action: 'Compose' })\n    },\n    [generateUpload, streamObject, field],\n  )\n\n  const stop = useCallback(() => {\n    console.log('Stopping...')\n    objectStop()\n  }, [objectStop])\n\n  return {\n    generate,\n    isJobActive,\n    isLoading: loadingObject,\n    jobProgress,\n    jobStatus,\n    stop,\n  }\n}\n"],"names":["experimental_useObject","useObject","useEditorConfigContext","toast","useConfig","useDocumentInfo","useField","useForm","useLocale","jsonSchema","useCallback","useEffect","useMemo","useRef","useState","PLUGIN_AI_JOBS_TABLE","PLUGIN_API_ENDPOINT_GENERATE","PLUGIN_API_ENDPOINT_GENERATE_UPLOAD","PLUGIN_INSTRUCTIONS_TABLE","PLUGIN_NAME","useFieldProps","editorSchemaValidator","fieldToJsonSchema","setSafeLexicalState","useHistory","useGenerate","instructionId","instructionIdRef","current","field","path","pathFromContext","editorConfigContext","editor","config","routes","api","serverURL","setValue","set","setHistory","jobStatus","setJobStatus","undefined","jobProgress","setJobProgress","isJobActive","setIsJobActive","getData","id","documentId","collectionSlug","localFromContext","collections","collection","find","slug","custom","editorConfig","admin","schema","editorSchema","memoizedValidator","memoizedSchema","validate","value","isValid","success","error","Error","activeSchema","f","fieldType","type","name","schemaJson","Object","keys","length","isLoading","loadingObject","object","stop","objectStop","submit","onError","message","console","onFinish","result","log","requestAnimationFrame","streamObject","action","params","doc","currentInstructionId","options","actionParams","allowedEditorNodes","Array","from","_nodes","locale","code","generateUpload","fetch","body","JSON","stringify","credentials","headers","method","then","uploadResponse","ok","json","job","cancelled","attempts","maxAttempts","poll","res","jobDoc","progress","result_id","status","setTimeout","e","errors","errStr","map","join","catch","generate"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/ui/Compose/hooks/useGenerate.ts"],"sourcesContent":["import { experimental_useObject as useObject } from '@ai-sdk/react'\nimport { useEditorConfigContext } from '@payloadcms/richtext-lexical/client'\nimport { toast, useConfig, useDocumentInfo, useField, useForm, useLocale } from '@payloadcms/ui'\nimport { jsonSchema } from 'ai'\nimport { useCallback, useMemo, useRef } from 'react'\n\nimport type { ActionMenuItems } from '../../../types.js'\n\nimport { PLUGIN_API_ENDPOINT_GENERATE, PLUGIN_INSTRUCTIONS_TABLE, PLUGIN_NAME } from '../../../defaults.js'\nimport { useFieldProps } from '../../../providers/FieldProvider/useFieldProps.js'\nimport { editorSchemaValidator } from '../../../utilities/editorSchemaValidator.js'\nimport { fieldToJsonSchema } from '../../../utilities/fieldToJsonSchema.js'\nimport { setSafeLexicalState } from '../../../utilities/setSafeLexicalState.js'\nimport { useGenerateUpload } from './useGenerateUpload.js'\nimport { useHistory } from './useHistory.js'\nimport { useStreamingUpdate } from './useStreamingUpdate.js'\n\ntype ActionCallbackParams = { action: ActionMenuItems; params?: unknown }\n\nexport const useGenerate = ({ instructionId }: { instructionId: string }) => {\n  const instructionIdRef = useRef(instructionId)\n  // Sync ref\n  instructionIdRef.current = instructionId\n\n  const { field, path: pathFromContext } = useFieldProps()\n  const { editor } = useEditorConfigContext()\n\n  const { config } = useConfig()\n  const { collections } = config\n\n  // Use dispatchFields to update values without subscribing to them, avoiding re-renders during streaming\n  // dispatchFields is handled inside useStreamingUpdate now, so we don't need it here\n  // const { dispatchFields } = useForm()\n\n  // Keep setValue for non-streaming updates (one-off), but do NOT destructure 'value' to avoid subscriptions\n  const { setValue } = useField<any>({\n    path: pathFromContext ?? '',\n  })\n\n  const { set: setHistory } = useHistory()\n  const { getData } = useForm()\n  const { id: documentId } = useDocumentInfo()\n  const localFromContext = useLocale()\n\n  // Editor Schema Setup\n  const collection = collections.find((collection) => collection.slug === PLUGIN_INSTRUCTIONS_TABLE)\n  const { custom: { [PLUGIN_NAME]: { editorConfig = {} } = {} } = {} } = collection?.admin ?? {}\n  const { schema: editorSchema = {} } = editorConfig\n\n  const memoizedValidator = useMemo(() => {\n    return editorSchemaValidator(editorSchema)\n  }, [editorSchema])\n\n  const memoizedSchema = useMemo(\n    () =>\n      jsonSchema(editorSchema, {\n        validate: (value) => {\n          const isValid = memoizedValidator(value)\n\n          if (isValid) {\n            return {\n              success: true,\n              value,\n            }\n          } else {\n            return {\n              error: new Error('Invalid schema'),\n              success: false,\n            }\n          }\n        },\n      }),\n    [memoizedValidator],\n  )\n\n  // Active JSON schema for useObject based on field type\n  const activeSchema = useMemo(() => {\n    const f = field as any\n    const fieldType = f?.type as string | undefined\n    if (fieldType === 'richText') {\n      return memoizedSchema\n    }\n    if (f && f.name && fieldType) {\n      const schemaJson = fieldToJsonSchema(f)\n      if (schemaJson && Object.keys(schemaJson).length > 0) {\n        return jsonSchema(schemaJson)\n      }\n    }\n    return undefined\n  }, [field, memoizedSchema])\n\n  const {\n    isLoading: loadingObject,\n    object,\n    stop: objectStop,\n    submit,\n  } = useObject({\n    api: `/api${PLUGIN_API_ENDPOINT_GENERATE}`,\n    onError: (error: any) => {\n      toast.error(`Failed to generate: ${error.message}`)\n      console.error('Error generating object:', error)\n    },\n    onFinish: (result) => {\n      if (result.object && field) {\n        if (field.type === 'richText') {\n          // Set state directly to editor first for immediate feedback\n          setSafeLexicalState(result.object, editor)\n\n          // Update history\n          setHistory(result.object)\n\n          // Delay Payload's setValue slightly to ensure editor stability\n          // and prevent field-level re-renders from interfering with the final state.\n          setTimeout(() => {\n            setValue(result.object)\n          }, 150)\n        } else if ('name' in field) {\n          setHistory(result.object[field.name])\n          setValue(result.object[field.name])\n        }\n      } else {\n        console.log('onFinish: result, field ', result, field)\n      }\n    },\n    schema: activeSchema as any,\n  })\n\n  // Hook 1: Handle high-frequency streaming updates\n  useStreamingUpdate({\n    editor,\n    isLoading: loadingObject,\n    object,\n  })\n\n  // Hook 2: Handle Upload generation and polling\n  const { generateUpload, isJobActive, jobProgress, jobStatus } = useGenerateUpload({\n    instructionIdRef,\n    setValue,\n  })\n\n  const streamObject = useCallback(\n    ({ action = 'Compose', params }: ActionCallbackParams) => {\n      const doc = getData()\n\n      const currentInstructionId = instructionIdRef.current\n\n      const options = {\n        action,\n        actionParams: params,\n        instructionId: currentInstructionId,\n      }\n\n      submit({\n        allowedEditorNodes: Array.from(editor?._nodes?.keys() || []),\n        doc: {\n          ...doc,\n          id: documentId,\n        },\n        locale: localFromContext?.code,\n        options,\n      })\n    },\n    [localFromContext?.code, instructionIdRef, documentId, getData, submit, editor],\n  )\n\n  const generate = useCallback(\n    async (options?: ActionCallbackParams) => {\n      if ((field as any)?.type === 'upload') {\n        return generateUpload()\n      }\n      // All supported types use structured object generation when schema is provided server-side\n      return streamObject(options ?? { action: 'Compose' })\n    },\n    [generateUpload, streamObject, field],\n  )\n\n  const stop = useCallback(() => {\n    console.log('Stopping...')\n    objectStop()\n  }, [objectStop])\n\n  return {\n    generate,\n    isJobActive,\n    isLoading: loadingObject,\n    jobProgress,\n    jobStatus,\n    stop,\n  }\n}\n"],"names":["experimental_useObject","useObject","useEditorConfigContext","toast","useConfig","useDocumentInfo","useField","useForm","useLocale","jsonSchema","useCallback","useMemo","useRef","PLUGIN_API_ENDPOINT_GENERATE","PLUGIN_INSTRUCTIONS_TABLE","PLUGIN_NAME","useFieldProps","editorSchemaValidator","fieldToJsonSchema","setSafeLexicalState","useGenerateUpload","useHistory","useStreamingUpdate","useGenerate","instructionId","instructionIdRef","current","field","path","pathFromContext","editor","config","collections","setValue","set","setHistory","getData","id","documentId","localFromContext","collection","find","slug","custom","editorConfig","admin","schema","editorSchema","memoizedValidator","memoizedSchema","validate","value","isValid","success","error","Error","activeSchema","f","fieldType","type","name","schemaJson","Object","keys","length","undefined","isLoading","loadingObject","object","stop","objectStop","submit","api","onError","message","console","onFinish","result","setTimeout","log","generateUpload","isJobActive","jobProgress","jobStatus","streamObject","action","params","doc","currentInstructionId","options","actionParams","allowedEditorNodes","Array","from","_nodes","locale","code","generate"],"mappings":"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"}

package/dist/ui/Compose/hooks/useGenerateUpload.d.ts

@@ -0,0 +1,11 @@
+type UseGenerateUploadParams = {
+    instructionIdRef: React.MutableRefObject<string>;
+    setValue: (value: any) => void;
+};
+export declare const useGenerateUpload: ({ instructionIdRef, setValue }: UseGenerateUploadParams) => {
+    generateUpload: () => Promise<void | Response>;
+    isJobActive: boolean;
+    jobProgress: number;
+    jobStatus: string | undefined;
+};
+export {};

package/dist/ui/Compose/hooks/useGenerateUpload.js

@@ -0,0 +1,123 @@
+import { toast, useConfig, useDocumentInfo, useForm, useLocale } from '@payloadcms/ui';
+import { useCallback, useState } from 'react';
+import { PLUGIN_AI_JOBS_TABLE, PLUGIN_API_ENDPOINT_GENERATE_UPLOAD } from '../../../defaults.js';
+import { useHistory } from './useHistory.js';
+export const useGenerateUpload = ({ instructionIdRef, setValue })=>{
+    const { config } = useConfig();
+    const { routes: { api }, serverURL } = config;
+    const { id: documentId, collectionSlug } = useDocumentInfo();
+    const localFromContext = useLocale();
+    const { getData } = useForm();
+    const { set: setHistory } = useHistory();
+    // Async job UI state
+    const [jobStatus, setJobStatus] = useState(undefined);
+    const [jobProgress, setJobProgress] = useState(0);
+    const [isJobActive, setIsJobActive] = useState(false);
+    const generateUpload = useCallback(async ()=>{
+        const doc = getData();
+        const currentInstructionId = instructionIdRef.current;
+        return fetch(`${serverURL}${api}${PLUGIN_API_ENDPOINT_GENERATE_UPLOAD}`, {
+            body: JSON.stringify({
+                collectionSlug: collectionSlug ?? '',
+                doc,
+                documentId,
+                locale: localFromContext?.code,
+                options: {
+                    instructionId: currentInstructionId
+                }
+            }),
+            credentials: 'include',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            method: 'POST'
+        }).then(async (uploadResponse)=>{
+            if (uploadResponse.ok) {
+                const json = await uploadResponse.json();
+                const { job, result } = json || {};
+                if (result) {
+                    // Set the upload ID
+                    setValue(result?.id);
+                    setHistory(result?.id);
+                    // Show toast to prompt user to save
+                    toast.success('Image generated successfully! Click Save to see the preview.');
+                    return uploadResponse;
+                }
+                // Async job: poll AI Jobs collection for status/progress/result_id
+                if (job && job.id) {
+                    setIsJobActive(true);
+                    const cancelled = false;
+                    let attempts = 0;
+                    const maxAttempts = 600 // up to ~10 minutes @ 1s
+                    ;
+                    // Basic in-hook state via closure variables; UI will re-render off fetches below
+                    const poll = async ()=>{
+                        if (cancelled) {
+                            return;
+                        }
+                        try {
+                            const res = await fetch(`${serverURL}${api}/${PLUGIN_AI_JOBS_TABLE}/${job.id}`, {
+                                credentials: 'include'
+                            });
+                            if (res.ok) {
+                                const jobDoc = await res.json();
+                                const { progress, result_id, status } = jobDoc || {};
+                                setJobStatus(status);
+                                setJobProgress(progress ?? 0);
+                                // When result present, set field and finish
+                                if (status === 'completed' && result_id) {
+                                    // Force upload field to refetch by clearing then setting the ID
+                                    setValue(null);
+                                    setTimeout(()=>{
+                                        setValue(result_id);
+                                    }, 0);
+                                    setHistory(result_id);
+                                    setIsJobActive(false);
+                                    return;
+                                }
+                                if (status === 'failed') {
+                                    setIsJobActive(false);
+                                    throw new Error('Video generation failed');
+                                }
+                            }
+                        } catch (e) {
+                        // silent retry
+                        }
+                        attempts += 1;
+                        if (!cancelled && attempts < maxAttempts) {
+                            setTimeout(poll, 1000);
+                        }
+                    };
+                    setTimeout(poll, 1000);
+                    return uploadResponse;
+                }
+                throw new Error('generateUpload: Unexpected response');
+            } else {
+                const { errors = [] } = await uploadResponse.json();
+                const errStr = errors.map((error)=>error.message).join(', ');
+                throw new Error(errStr);
+            }
+        }).catch((error)=>{
+            toast.error(`Failed to generate: ${error.message}`);
+            console.error('Error generating or setting your upload, please set it manually if its saved in your media files.', error);
+        });
+    }, [
+        getData,
+        localFromContext?.code,
+        instructionIdRef,
+        setValue,
+        documentId,
+        collectionSlug,
+        serverURL,
+        api,
+        setHistory
+    ]);
+    return {
+        generateUpload,
+        isJobActive,
+        jobProgress,
+        jobStatus
+    };
+};
+
+//# sourceMappingURL=useGenerateUpload.js.map

package/dist/ui/Compose/hooks/useGenerateUpload.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/ui/Compose/hooks/useGenerateUpload.ts"],"sourcesContent":["import { toast, useConfig, useDocumentInfo, useForm, useLocale } from '@payloadcms/ui'\nimport { useCallback, useState } from 'react'\n\nimport type { GenerateTextarea } from '../../../types.js'\n\nimport { PLUGIN_AI_JOBS_TABLE, PLUGIN_API_ENDPOINT_GENERATE_UPLOAD } from '../../../defaults.js'\nimport { useHistory } from './useHistory.js'\n\ntype UseGenerateUploadParams = {\n  instructionIdRef: React.MutableRefObject<string>\n  setValue: (value: any) => void\n}\n\nexport const useGenerateUpload = ({ instructionIdRef, setValue }: UseGenerateUploadParams) => {\n  const { config } = useConfig()\n  const {\n    routes: { api },\n    serverURL,\n  } = config\n  const { id: documentId, collectionSlug } = useDocumentInfo()\n  const localFromContext = useLocale()\n  const { getData } = useForm()\n  const { set: setHistory } = useHistory()\n\n  // Async job UI state\n  const [jobStatus, setJobStatus] = useState<string | undefined>(undefined)\n  const [jobProgress, setJobProgress] = useState<number>(0)\n  const [isJobActive, setIsJobActive] = useState<boolean>(false)\n\n  const generateUpload = useCallback(async () => {\n    const doc = getData()\n    const currentInstructionId = instructionIdRef.current\n\n    return fetch(`${serverURL}${api}${PLUGIN_API_ENDPOINT_GENERATE_UPLOAD}`, {\n      body: JSON.stringify({\n        collectionSlug: collectionSlug ?? '',\n        doc,\n        documentId,\n        locale: localFromContext?.code,\n        options: {\n          instructionId: currentInstructionId,\n        },\n      } satisfies Parameters<GenerateTextarea>[0]),\n      credentials: 'include',\n      headers: {\n        'Content-Type': 'application/json',\n      },\n      method: 'POST',\n    })\n      .then(async (uploadResponse) => {\n        if (uploadResponse.ok) {\n          const json = await uploadResponse.json()\n          const { job, result } = json || {}\n          if (result) {\n            // Set the upload ID\n            setValue(result?.id)\n            setHistory(result?.id)\n\n            // Show toast to prompt user to save\n            toast.success('Image generated successfully! Click Save to see the preview.')\n\n            return uploadResponse\n          }\n\n          // Async job: poll AI Jobs collection for status/progress/result_id\n          if (job && job.id) {\n            setIsJobActive(true)\n            const cancelled = false\n            let attempts = 0\n            const maxAttempts = 600 // up to ~10 minutes @ 1s\n\n            // Basic in-hook state via closure variables; UI will re-render off fetches below\n            const poll = async (): Promise<void> => {\n              if (cancelled) {\n                return\n              }\n              try {\n                const res = await fetch(`${serverURL}${api}/${PLUGIN_AI_JOBS_TABLE}/${job.id}`, {\n                  credentials: 'include',\n                })\n                if (res.ok) {\n                  const jobDoc = await res.json()\n                  const { progress, result_id, status } = jobDoc || {}\n                  setJobStatus(status)\n                  setJobProgress(progress ?? 0)\n                  // When result present, set field and finish\n                  if (status === 'completed' && result_id) {\n                    // Force upload field to refetch by clearing then setting the ID\n                    setValue(null)\n                    setTimeout(() => {\n                      setValue(result_id)\n                    }, 0)\n                    setHistory(result_id)\n                    setIsJobActive(false)\n                    return\n                  }\n                  if (status === 'failed') {\n                    setIsJobActive(false)\n                    throw new Error('Video generation failed')\n                  }\n                }\n              } catch (e) {\n                // silent retry\n              }\n\n              attempts += 1\n              if (!cancelled && attempts < maxAttempts) {\n                setTimeout(poll, 1000)\n              }\n            }\n            setTimeout(poll, 1000)\n            return uploadResponse\n          }\n\n          throw new Error('generateUpload: Unexpected response')\n        } else {\n          const { errors = [] } = await uploadResponse.json()\n          const errStr = errors.map((error: any) => error.message).join(', ')\n          throw new Error(errStr)\n        }\n      })\n      .catch((error) => {\n        toast.error(`Failed to generate: ${error.message}`)\n        console.error(\n          'Error generating or setting your upload, please set it manually if its saved in your media files.',\n          error,\n        )\n      })\n  }, [\n    getData,\n    localFromContext?.code,\n    instructionIdRef,\n    setValue,\n    documentId,\n    collectionSlug,\n    serverURL,\n    api,\n    setHistory,\n  ])\n\n  return {\n    generateUpload,\n    isJobActive,\n    jobProgress,\n    jobStatus,\n  }\n}\n"],"names":["toast","useConfig","useDocumentInfo","useForm","useLocale","useCallback","useState","PLUGIN_AI_JOBS_TABLE","PLUGIN_API_ENDPOINT_GENERATE_UPLOAD","useHistory","useGenerateUpload","instructionIdRef","setValue","config","routes","api","serverURL","id","documentId","collectionSlug","localFromContext","getData","set","setHistory","jobStatus","setJobStatus","undefined","jobProgress","setJobProgress","isJobActive","setIsJobActive","generateUpload","doc","currentInstructionId","current","fetch","body","JSON","stringify","locale","code","options","instructionId","credentials","headers","method","then","uploadResponse","ok","json","job","result","success","cancelled","attempts","maxAttempts","poll","res","jobDoc","progress","result_id","status","setTimeout","Error","e","errors","errStr","map","error","message","join","catch","console"],"mappings":"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"}

package/dist/ui/Compose/hooks/useHistory.d.ts

@@ -1,7 +1,6 @@
 export declare const useHistory: () => {
     canRedo: boolean;
     canUndo: boolean;
-    currentValue: any;
     redo: () => any;
     set: (data: any) => any;
     undo: () => any;