Update workflow nodes configuration (#6861)
- Improve the design of the right drawer - Allow to update the trigger of the workflow: the object and the event listened to - Allow to update the selected serverless function that a code action should execute - Change how we determine which workflow version to display in the visualizer. We fetch the selected workflow's data, including whether it has a draft or a published version. If the workflow has a draft version, it gets displayed; otherwise, we display the last published version. - I used the type `WorkflowWithCurrentVersion` to forward the currently edited workflow with its _current_ version embedded across the app. - I created single-responsibility hooks like `useFindWorkflowWithCurrentVersion`, `useFindShowPageWorkflow`, `useUpdateWorkflowVersionTrigger` or `useUpdateWorkflowVersionStep`. - I updated the types for workflow related objects, like `Workflow` and `WorkflowVersion`. See `packages/twenty-front/src/modules/workflow/types/Workflow.ts`. - This introduced the possibility to have `null` values for triggers and steps. I made the according changes in the codebase and in the tests. - I created a utility function to extract both parts of object-event format (`company.created`): `packages/twenty-front/src/modules/workflow/utils/splitWorkflowTriggerEventName.ts`
This commit is contained in:
committed by
GitHub
parent
c55dfbde6e
commit
a2b1062db6
@ -1,47 +0,0 @@
|
||||
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
||||
import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
|
||||
import {
|
||||
Workflow,
|
||||
WorkflowStep,
|
||||
WorkflowVersion,
|
||||
} from '@/workflow/types/Workflow';
|
||||
import { getWorkflowLastVersion } from '@/workflow/utils/getWorkflowLastVersion';
|
||||
import { insertStep } from '@/workflow/utils/insertStep';
|
||||
import { isDefined } from 'twenty-ui';
|
||||
|
||||
export const useCreateNode = ({ workflow }: { workflow: Workflow }) => {
|
||||
const { updateOneRecord: updateOneWorkflowVersion } =
|
||||
useUpdateOneRecord<WorkflowVersion>({
|
||||
objectNameSingular: CoreObjectNameSingular.WorkflowVersion,
|
||||
});
|
||||
|
||||
const createNode = ({
|
||||
parentNodeId,
|
||||
nodeToAdd,
|
||||
}: {
|
||||
parentNodeId: string;
|
||||
nodeToAdd: WorkflowStep;
|
||||
}) => {
|
||||
const lastVersion = getWorkflowLastVersion(workflow);
|
||||
if (!isDefined(lastVersion)) {
|
||||
throw new Error(
|
||||
"Can't add a node when no version exists yet. Create a first workflow version before trying to add a node.",
|
||||
);
|
||||
}
|
||||
|
||||
return updateOneWorkflowVersion({
|
||||
idToUpdate: lastVersion.id,
|
||||
updateOneRecordInput: {
|
||||
steps: insertStep({
|
||||
steps: lastVersion.steps,
|
||||
parentStepId: parentNodeId,
|
||||
stepToAdd: nodeToAdd,
|
||||
}),
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return {
|
||||
createNode,
|
||||
};
|
||||
};
|
||||
@ -0,0 +1,83 @@
|
||||
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
||||
import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
|
||||
import { workflowCreateStepFromParentStepIdState } from '@/workflow/states/workflowCreateStepFromParentStepIdState';
|
||||
import { workflowDiagramTriggerNodeSelectionState } from '@/workflow/states/workflowDiagramTriggerNodeSelectionState';
|
||||
import {
|
||||
WorkflowStep,
|
||||
WorkflowStepType,
|
||||
WorkflowVersion,
|
||||
WorkflowWithCurrentVersion,
|
||||
} from '@/workflow/types/Workflow';
|
||||
import { getStepDefaultDefinition } from '@/workflow/utils/getStepDefaultDefinition';
|
||||
import { insertStep } from '@/workflow/utils/insertStep';
|
||||
import { useRecoilValue, useSetRecoilState } from 'recoil';
|
||||
import { isDefined } from 'twenty-ui';
|
||||
|
||||
export const useCreateStep = ({
|
||||
workflow,
|
||||
}: {
|
||||
workflow: WorkflowWithCurrentVersion;
|
||||
}) => {
|
||||
const workflowCreateStepFromParentStepId = useRecoilValue(
|
||||
workflowCreateStepFromParentStepIdState,
|
||||
);
|
||||
|
||||
const setWorkflowDiagramTriggerNodeSelection = useSetRecoilState(
|
||||
workflowDiagramTriggerNodeSelectionState,
|
||||
);
|
||||
|
||||
const { updateOneRecord: updateOneWorkflowVersion } =
|
||||
useUpdateOneRecord<WorkflowVersion>({
|
||||
objectNameSingular: CoreObjectNameSingular.WorkflowVersion,
|
||||
});
|
||||
|
||||
const insertNodeAndSave = ({
|
||||
parentNodeId,
|
||||
nodeToAdd,
|
||||
}: {
|
||||
parentNodeId: string;
|
||||
nodeToAdd: WorkflowStep;
|
||||
}) => {
|
||||
const currentVersion = workflow.currentVersion;
|
||||
if (!isDefined(currentVersion)) {
|
||||
throw new Error("Can't add a node when there is no current version.");
|
||||
}
|
||||
|
||||
return updateOneWorkflowVersion({
|
||||
idToUpdate: currentVersion.id,
|
||||
updateOneRecordInput: {
|
||||
steps: insertStep({
|
||||
steps: currentVersion.steps ?? [],
|
||||
parentStepId: parentNodeId,
|
||||
stepToAdd: nodeToAdd,
|
||||
}),
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const createStep = async (newStepType: WorkflowStepType) => {
|
||||
if (!isDefined(workflowCreateStepFromParentStepId)) {
|
||||
throw new Error('Select a step to create a new step from first.');
|
||||
}
|
||||
|
||||
const newStep = getStepDefaultDefinition(newStepType);
|
||||
|
||||
await insertNodeAndSave({
|
||||
parentNodeId: workflowCreateStepFromParentStepId,
|
||||
nodeToAdd: newStep,
|
||||
});
|
||||
|
||||
/**
|
||||
* After the step has been created, select it.
|
||||
* As the `insertNodeAndSave` function mutates the cached workflow before resolving,
|
||||
* we are sure that the new node will have been created at this stage.
|
||||
*
|
||||
* Selecting the node will cause a right drawer to open in order to edit the step.
|
||||
*/
|
||||
setWorkflowDiagramTriggerNodeSelection(newStep.id);
|
||||
};
|
||||
|
||||
return {
|
||||
createStep,
|
||||
};
|
||||
};
|
||||
@ -1,117 +0,0 @@
|
||||
import { useTabList } from '@/ui/layout/tab/hooks/useTabList';
|
||||
import { useCreateNode } from '@/workflow/hooks/useCreateNode';
|
||||
import { showPageWorkflowDiagramTriggerNodeSelectionState } from '@/workflow/states/showPageWorkflowDiagramTriggerNodeSelectionState';
|
||||
import { workflowCreateStepFromParentStepIdState } from '@/workflow/states/workflowCreateStepFromParentStepIdState';
|
||||
import { Workflow } from '@/workflow/types/Workflow';
|
||||
import { useRecoilValue, useSetRecoilState } from 'recoil';
|
||||
import {
|
||||
IconPlaystationSquare,
|
||||
IconPlug,
|
||||
IconPlus,
|
||||
IconSearch,
|
||||
IconSettingsAutomation,
|
||||
} from 'twenty-ui';
|
||||
import { v4 } from 'uuid';
|
||||
|
||||
export const useRightDrawerWorkflowSelectAction = ({
|
||||
tabListId,
|
||||
workflow,
|
||||
}: {
|
||||
tabListId: string;
|
||||
workflow: Workflow;
|
||||
}) => {
|
||||
const workflowCreateStepFromParentStepId = useRecoilValue(
|
||||
workflowCreateStepFromParentStepIdState,
|
||||
);
|
||||
|
||||
const setShowPageWorkflowDiagramTriggerNodeSelection = useSetRecoilState(
|
||||
showPageWorkflowDiagramTriggerNodeSelectionState,
|
||||
);
|
||||
|
||||
const { createNode } = useCreateNode({ workflow });
|
||||
|
||||
const allOptions: Array<{
|
||||
id: string;
|
||||
name: string;
|
||||
type: 'standard' | 'custom';
|
||||
icon: any;
|
||||
}> = [
|
||||
{
|
||||
id: 'create-record',
|
||||
name: 'Create Record',
|
||||
type: 'standard',
|
||||
icon: IconPlus,
|
||||
},
|
||||
{
|
||||
id: 'find-records',
|
||||
name: 'Find Records',
|
||||
type: 'standard',
|
||||
icon: IconSearch,
|
||||
},
|
||||
];
|
||||
|
||||
const tabs = [
|
||||
{
|
||||
id: 'all',
|
||||
title: 'All',
|
||||
Icon: IconSettingsAutomation,
|
||||
},
|
||||
{
|
||||
id: 'standard',
|
||||
title: 'Standard',
|
||||
Icon: IconPlaystationSquare,
|
||||
},
|
||||
{
|
||||
id: 'custom',
|
||||
title: 'Custom',
|
||||
Icon: IconPlug,
|
||||
},
|
||||
];
|
||||
|
||||
const { activeTabIdState } = useTabList(tabListId);
|
||||
const activeTabId = useRecoilValue(activeTabIdState);
|
||||
|
||||
const options = allOptions.filter(
|
||||
(option) => activeTabId === 'all' || option.type === activeTabId,
|
||||
);
|
||||
|
||||
const handleActionClick = async (actionId: string) => {
|
||||
if (workflowCreateStepFromParentStepId === undefined) {
|
||||
throw new Error('Select a step to create a new step from first.');
|
||||
}
|
||||
|
||||
const newNodeId = v4();
|
||||
|
||||
/**
|
||||
* FIXME: For now, the data of the node to create are mostly static.
|
||||
*/
|
||||
await createNode({
|
||||
parentNodeId: workflowCreateStepFromParentStepId,
|
||||
nodeToAdd: {
|
||||
id: newNodeId,
|
||||
name: actionId,
|
||||
type: 'CODE_ACTION',
|
||||
valid: true,
|
||||
settings: {
|
||||
serverlessFunctionId: '111',
|
||||
errorHandlingOptions: {
|
||||
continueOnFailure: {
|
||||
value: true,
|
||||
},
|
||||
retryOnFailure: {
|
||||
value: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
setShowPageWorkflowDiagramTriggerNodeSelection(newNodeId);
|
||||
};
|
||||
|
||||
return {
|
||||
tabs,
|
||||
options,
|
||||
handleActionClick,
|
||||
};
|
||||
};
|
||||
@ -0,0 +1,43 @@
|
||||
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
||||
import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
|
||||
import {
|
||||
WorkflowStep,
|
||||
WorkflowVersion,
|
||||
WorkflowWithCurrentVersion,
|
||||
} from '@/workflow/types/Workflow';
|
||||
import { replaceStep } from '@/workflow/utils/replaceStep';
|
||||
import { isDefined } from 'twenty-ui';
|
||||
|
||||
export const useUpdateWorkflowVersionStep = ({
|
||||
workflow,
|
||||
stepId,
|
||||
}: {
|
||||
workflow: WorkflowWithCurrentVersion;
|
||||
stepId: string;
|
||||
}) => {
|
||||
const { updateOneRecord: updateOneWorkflowVersion } =
|
||||
useUpdateOneRecord<WorkflowVersion>({
|
||||
objectNameSingular: CoreObjectNameSingular.WorkflowVersion,
|
||||
});
|
||||
|
||||
const updateStep = async (updatedStep: WorkflowStep) => {
|
||||
if (!isDefined(workflow.currentVersion)) {
|
||||
throw new Error('Can not update an undefined workflow version.');
|
||||
}
|
||||
|
||||
await updateOneWorkflowVersion({
|
||||
idToUpdate: workflow.currentVersion.id,
|
||||
updateOneRecordInput: {
|
||||
steps: replaceStep({
|
||||
steps: workflow.currentVersion.steps ?? [],
|
||||
stepId,
|
||||
stepToReplace: updatedStep,
|
||||
}),
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return {
|
||||
updateStep,
|
||||
};
|
||||
};
|
||||
@ -0,0 +1,36 @@
|
||||
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
||||
import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
|
||||
import {
|
||||
WorkflowTrigger,
|
||||
WorkflowVersion,
|
||||
WorkflowWithCurrentVersion,
|
||||
} from '@/workflow/types/Workflow';
|
||||
import { isDefined } from 'twenty-ui';
|
||||
|
||||
export const useUpdateWorkflowVersionTrigger = ({
|
||||
workflow,
|
||||
}: {
|
||||
workflow: WorkflowWithCurrentVersion;
|
||||
}) => {
|
||||
const { updateOneRecord: updateOneWorkflowVersion } =
|
||||
useUpdateOneRecord<WorkflowVersion>({
|
||||
objectNameSingular: CoreObjectNameSingular.WorkflowVersion,
|
||||
});
|
||||
|
||||
const updateTrigger = async (updatedTrigger: WorkflowTrigger) => {
|
||||
if (!isDefined(workflow.currentVersion)) {
|
||||
throw new Error('Can not update an undefined workflow version.');
|
||||
}
|
||||
|
||||
await updateOneWorkflowVersion({
|
||||
idToUpdate: workflow.currentVersion.id,
|
||||
updateOneRecordInput: {
|
||||
trigger: updatedTrigger,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return {
|
||||
updateTrigger,
|
||||
};
|
||||
};
|
||||
@ -0,0 +1,55 @@
|
||||
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
||||
import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
|
||||
import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord';
|
||||
import {
|
||||
Workflow,
|
||||
WorkflowVersion,
|
||||
WorkflowWithCurrentVersion,
|
||||
} from '@/workflow/types/Workflow';
|
||||
import { isDefined } from 'twenty-ui';
|
||||
|
||||
export const useWorkflowWithCurrentVersion = (
|
||||
workflowId: string | undefined,
|
||||
): WorkflowWithCurrentVersion | undefined => {
|
||||
const { record: workflow } = useFindOneRecord<Workflow>({
|
||||
objectNameSingular: CoreObjectNameSingular.Workflow,
|
||||
objectRecordId: workflowId,
|
||||
recordGqlFields: {
|
||||
id: true,
|
||||
name: true,
|
||||
statuses: true,
|
||||
},
|
||||
skip: !isDefined(workflowId),
|
||||
});
|
||||
|
||||
const { records: mostRecentWorkflowVersions } =
|
||||
useFindManyRecords<WorkflowVersion>({
|
||||
objectNameSingular: CoreObjectNameSingular.WorkflowVersion,
|
||||
filter: {
|
||||
workflowId: {
|
||||
eq: workflowId,
|
||||
},
|
||||
},
|
||||
orderBy: [
|
||||
{
|
||||
createdAt: 'DescNullsLast',
|
||||
},
|
||||
],
|
||||
limit: 1,
|
||||
skip: !isDefined(workflowId),
|
||||
});
|
||||
|
||||
if (!isDefined(workflow)) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const currentVersion = mostRecentWorkflowVersions?.[0];
|
||||
if (!isDefined(currentVersion)) {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
return {
|
||||
...workflow,
|
||||
currentVersion,
|
||||
};
|
||||
};
|
||||
Reference in New Issue
Block a user