Split off from #30047. Continuation of #29767; related: #29108.

Context

Until now, the process engine (BPE) has only had a traditional interface: the workflow administration in tl-bpe-modeler (BPMN editor, properties, Approve/Cancel, Upload, Copy, Export) and task management (Start process, Current tasks, Complete step with transition selection). Afterward, a React application can model and execute processes entirely without the classic interface.

Function

• Workflow administration as the “Workflows” section of the React administration interface: List of workflows, BPMN editor (bpmn-js) with Edit/Save/Cancel, properties of the element selected in the diagram, New, Upload BPML file, Update from BPML file, Copy, Approve/Withdraw, Delete, Export BPML file. Unsaved diagram changes are prompted when switching workflows; saving the properties also saves any open diagram changes. A selected connection is highlighted along its path when not being edited. A workflow from which processes have already been started cannot be deleted (not even in the classic modeler); instead, it is withdrawn.
• Step Views: For a manual task, a view of the React interface is stored in the process model (the ManualTask#view attribute, a BPML extension, is preserved when the workflow is exported or imported) and designed using the View Designer (“Design Step View”). A new step view begins with a form based on the process data fields.
• Task Processing (views from ` tl-bpe-view` that an application displays at a location of its choice, e.g., as a navigation item or embedded in its own view): own tasks, start the process with a form for the process data (required fields are validated)—optionally by selecting the workflow from a drop-down menu or fixed to a specific workflow via the application’s own start button (bpeStartEvent) — processing a step in its step view (or a standard form), completing the step by selecting the next step. Errors in a transition block it; warnings are acknowledged; if a transition requires additional information (form type of the edge), the completion dialog prompts for it.

Solution

General building blocks in tl-layout-view / tl-layout-react

• Data type tl.view:ViewDefinition: a view configuration in an attribute; TL-Script viewParse(xml) and viewFields(type).
• <dynamic-view>: embeds a view whose configuration is provided by a TL-Script expression (similar to <view-ref> with <bind>). Within a <form>, an embedded view divides the form.
• The View Designer works on design sources: files as before and a view in an object’s attribute (action <open-view-designer attribute="..."/>, saving with write permission check); saving confirms what has been saved.
• StateHandler.canSave(): An element whose changes the surrounding view saves causes the prompt for unsaved changes to offer only the option to discard. The prompt generally refers to changes rather than forms.

Breakdown of the BPE Modules

• tl-bpe: no user interface and no dependency on tl-layout-formeditor. The logic of the modeler commands (BPMLDefinitions: create, import, update, copy, export, approve/reject, deletable) and task processing (ProcessExecutions, Decision: tasks assigned to a person, startable events, workflow start event by name, start using a prepared process object, decisions with errors and warnings, complete) are provided as a Java API and TL-Script functions bpml* and bpe*. The classic commands use the same logic .
• tl-bpe-classic (new): classic task processing (com.top_logic.bpe.layout.*, layout templates, JSPs), PDF export with tl-layout-formeditor, naming schemes for test scripts. The class names remain unchanged.
• tl-bpe-modeler: classic modeler, depends on tl-bpe-classic.
• tl-bpe-view (new): <bpmn-editor>, workflow administration (React administration overlay), step view of the manual task, task processing views. The module does not add a navigation item; the developer article bpe/react-ui shows how an application integrates the views.

Additional Changes

• Migration scripts can explicitly drop a dependency that the module no longer has (<dropped-dependencies>); the check for dropped dependencies accepts exactly these, and the script generator adds them automatically. The next migration script for tl-bpe will drop tl-layout-formeditor in this way.
• InitialProcessSetup imports each workflow file in its own transaction; if a file contains errors, it is rolled back and retried on the next run, rather than leaving behind a partially imported workflow.
• A process’s label comes from a model annotation in ` tl.bpe.execution:ProcessExecution`, allowing a process type to define its own label.
• tl-demo-react contains the BPE with a demo process called “Vacation Request” (process data with required fields, step views, and rejection via a rejection form); the task page is located under Demos -> Processes, with a “Submit Vacation Request” button.

Migration

Applications with a classic user interface that integrate tl-bpe directly (not via tl-bpe-modeler) and use classic task processing (layout templates tl-bpe/startProcess*.template.xml, tl-bpe/advanceProcess*.template.xml, classes under com.top_logic.bpe.layout) or PDF export should add the tl-bpe-classic dependency:

{{{#!xml <dependency>

<groupId>com.top-logic</groupId>
<artifactId>tl-bpe-classic</artifactId>

</dependency> }}}

Applications built using tl-bpe-modeler or tl-bpe-app receive tl-bpe-classic transitively. A React application includes tl-bpe-view and displays the task page (bpe/tasks.view.xml) wherever it wants it to appear.

Additional changes that may affect your own dependencies and code:

• tl-bpe no longer includes tl-layout-formeditor. An application that uses classes or layouts from the form editor and previously obtained the module only via tl-bpe must now declare tl-layout-formeditor itself (or obtain it via tl-bpe-classic).
• com.top_logic.bpe.modeler.copy.DeepCopy is now called com.top_logic.bpe.util.DeepCopy ( tl-bpe module); adjust imports accordingly.
• BPMLUpdateCommand.updateCollaboration(Collaboration, Source, boolean) and BPMLUpdateCommand.updateCollaborationInTransaction(...) have been removed. The replacement is BPMLDefinitions.updateCollaboration(...) (with Source or BinaryContent); the caller opens the transaction themselves.

Verification

tl-demo-react (/view/, root / root1234): Administration -> Workflows (create, copy, and share a workflow; edit and save in the editor; view properties; configure the step view for “Review Request”), Demos -> Processes -> "Start Process" (select the workflow) or "Submit Vacation Request" (go directly to the start form), edit the step in its step view, and complete it by approving or rejecting (rejection form). Tested the Classic Modeler and Process Cockpit in tl-demo without any changes.