59876 frontend [ templates ] migrate template edit form to Formik

[aicarma-artyom-maslov]

Note

High Risk
Large change to how templates are edited, autosaved, and activated; incorrect persist or merge logic could lose edits or save stale state.

Overview
Template editing now keeps kickoff, tasks, and settings in a root Formik TemplateForm instead of dispatching setTemplate / patchTask from each child. TemplateEdit wires useTemplateForm, useTemplateEditInit, and useTemplateEditTasks; task/kickoff/settings components read and write via useTemplateField, useTaskForm, and TaskFormScopeProvider, with autosave handled by the persist layer (debounced saves and pending-change handling on enable/run).

Containers (WorkflowTaskFormContainer, KickoffReduxContainer, TemplateControllsContainer) stop using connect and mostly re-export the presentational components, which resolve data from context or optional props. KickoffRedux and TemplateControlls use wrapper/content splits so hooks stay stable when template context is missing.

Refactors: TaskForm is split into header/sections hooks; ReturnTo / TaskPerformers update tasks through useTaskForm. KickoffShareForm reads sharing fields from form values, batches updates with setValues, and moves shared/embedded UI into KickoffShareTabs with new tests. TemplateControlls is split into navigation, owners, notifications, and run/enable sections, merging pending form edits when activating. FileOutput uses a div wrapper instead of p for attachment markup.

Tests add coverage for Formik persist, share-form sync, hook-order guards, run-workflow without templateId, and RTL act helpers in several suites.

^{Reviewed by Cursor Bugbot for commit 5fdbc0f. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Migrate template edit form to Formik with context-driven state management

• Replaces Redux-connected components and direct Redux dispatches in the template editor with a Formik-backed TemplateForm context, routing all task and template field edits through form state via useTemplateField and useTaskForm hooks.
• Adds useTemplateForm to initialize and manage the Formik instance, preserve unsaved edits across Redux updates, apply reference cleanup, and trigger immediate deactivation when relevant fields change.
• Adds useTemplatePersistContextValue to coordinate autosave dispatches with debouncing and generation-scoped request tracking (persistRequest.ts) so stale autosave responses are discarded.
• Decomposes TemplateEdit, TemplateControlls, TaskForm, and KickoffRedux into focused hooks and components (useTemplateEditInit, useTemplateEditTasks, TaskFormHeader, TaskFormSections, TemplateNavigation, etc.) that read from Formik context instead of Redux props.
• Risk: Several containers (TemplateControllsContainer, KickoffReduxContainer, WorkflowTaskFormContainer) no longer inject Redux props via connect; consumers relying on those mapped props will receive undefined unless the component can resolve values from internal selectors or context.

Changes since #246 opened

• Extended reference cleanup detection to include fieldsets alongside fields for kickoff and task outputs [6037911]
• Extended template variables fingerprinting to include kickoff and task fieldsets [6037911]
• Fixed autosave to prevent re-dispatching identical edits after successful saves without Redux reinitialization [6037911]
• Changed setSettingsFieldValue in TemplateControlls to dispatch patchTemplate when Formik field context is absent [6037911]
• Added test coverage for fieldset-related fingerprint changes, reference cleanup detection, and autosave behavior [6037911]
• Updated TemplateEdit.test suite to use new selector mocks and test kickoff changes via a mocked KickoffRedux button [6517142]
• Updated test mocks across TemplateEdit-related component test suites [6517142]
• Changed KickoffOutputs.FileOutput component outer container from paragraph to div element [6517142]
• Modified useTemplateEditInit hook to pass a constrained object containing kickoff, tasks, and templateId to getVariables instead of passing the entire currentValues object, enabling variable metadata construction with knowledge of the templateId [82e3be2]
• Added test infrastructure and test case in TemplateEdit.test.tsx to verify that templateId is correctly propagated through variable synchronization and appears in variable metadata [82e3be2]
• Refactored KickoffShareForm component to derive UI state from template form values instead of local state, synchronizing active tab with sharing flags and persisting success URL changes immediately [3cff7af]
• Added test suite for KickoffShareForm component with mocked dependencies and test cases verifying success URL enablement reflection and active tab switching behavior [3cff7af]
• Replaced derived values with local state management in KickoffShareForm component for redirect URL functionality [480c3c0]
• Added interaction tests for redirect URL toggle and empty URL handling in KickoffShareForm test suite [480c3c0]
• Modified consumePendingChanges callback within useTemplatePersistContextValue hook to clear pending isActive deactivation flag when an explicit activation is applied [6b7e3a9]
• Added test case to TemplateFormPersistProvider test suite verifying pending deactivation does not persist after successful activation reinitialize [6b7e3a9]
• Migrated KickoffShareForm component at /components/TemplateEdit/KickoffRedux/KickoffShareForm/ from individual setFieldValue calls to batch setValues updates for template field modifications [4819f51]
• Updated test suite for KickoffShareForm component to support and verify batch form state updates [4819f51]
• Extended TSetValues type signature in useTemplateForm to accept either an ITemplateClient object or a function that receives current values and returns ITemplateClient, and implemented functional updater support in useTemplateFormHook.ts setValues callback by computing current values from Formik values overlaid with pending edits, invoking the function or using the object directly, applying applyImmediateDeactivation, updating pendingUserEditsRef via getChangedFields, and calling currentFormik.setValues with the result. [033b872]
• Modified KickoffShareForm component's editTemplate helper to call setValues with a functional updater that receives currentValues and merges templateFields into it, replacing the previous approach of spreading from the captured values variable. [033b872]
• Added test coverage in KickoffShareForm.test.tsx by updating renderShareForm to provide and return a mock setValues, modifying StatefulShareForm context setValues to support functional updaters by applying function arguments to current state, adding test case 'preserves synchronous edits that are newer than context values' to verify functional updater behavior, and updating rerenderWithValues to reuse the same setValues mock. [033b872]
• Added test coverage in useTemplateForm.test.tsx by extending ISpyHandle type to include setValues, capturing setValues from useTemplateField in TemplateFormHarness Spy, and adding test case 'applies functional full-form updates over synchronous pending edits' that performs setFieldValue followed by setValues with a functional updater and asserts both changes are present. [033b872]
• Added guard clause in TemplateControlls component's handleRunProcess handler to exit early when templateId is falsy, preventing execution of dataset loading, workflow computation, and modal opening [bfad8e7]
• Relocated lastTemplateIdentityRef.current assignment in useTemplateForm hook to execute after identity-change check and form reset on every render [bfad8e7]
• Modified useTemplateEditInit hook to track the last persisted template ID instead of a boolean sync flag and trigger immediate variables sync whenever the template ID changes [f7b0b08]
• Added test cases to verify immediate variables sync behavior when template ID changes in TemplateEdit component [f7b0b08]
• Refactored KickoffRedux and TemplateControlls components to split each into a wrapper component and a content component [107f9e4]
• Added tests verifying hook order stability when template context becomes unavailable [107f9e4]
• Modified useTemplateEditInit hook to skip users-dependent effect on initial mount [107f9e4]
• Added initialization test to prevent Formik snapshot from overwriting fresh create templates [107f9e4]
• Introduced resolveTemplateFormMountKey function in templateFormUtils and refactored TemplateEdit component to use it for determining TemplateForm mount keys [5fdbc0f]
• Added test suite for templateFormUtils covering hasTemplateIdentityChanged and resolveTemplateFormMountKey functions [5fdbc0f]

^{Macroscope summarized 09a07e5.}

[cursor]

Cursor Bugbot has reviewed your changes using default effort and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 09a07e5. Configure here.}