2022-12-01 17:58:08 +03:00
{
2023-12-10 20:10:54 +03:00
"name" : "twenty-front" ,
2024-11-22 13:53:33 +03:00
"version" : "0.34.0-canary" ,
2022-12-01 17:58:08 +03:00
"private" : true ,
2023-12-10 18:22:43 +03:00
"type" : "module" ,
"scripts" : {
2024-08-27 18:35:50 +03:00
"build" : "VITE_DISABLE_TYPESCRIPT_CHECKER=true VITE_DISABLE_ESLINT_CHECKER=true NODE_OPTIONS=--max-old-space-size=3000 npx vite build && sh ./scripts/inject-runtime-env.sh" ,
2024-08-27 20:30:25 +03:00
"build:sourcemaps" : "VITE_BUILD_SOURCEMAP=true VITE_DISABLE_TYPESCRIPT_CHECKER=true VITE_DISABLE_ESLINT_CHECKER=true NODE_OPTIONS=--max-old-space-size=6000 npx vite build && sh ./scripts/inject-runtime-env.sh" ,
2024-04-18 12:24:39 +03:00
"start:prod" : "NODE_ENV=production npx vite --host" ,
"tsup" : "npx tsup"
2023-12-10 18:22:43 +03:00
} ,
"engines" : {
2024-01-05 16:59:58 +03:00
"node" : "^18.17.1" ,
2023-12-11 12:54:57 +03:00
"npm" : "please-use-yarn" ,
"yarn" : "^4.0.2"
2023-12-10 18:22:43 +03:00
} ,
"browserslist" : {
"production" : [
">0.2%" ,
"not dead" ,
"not op_mini all"
] ,
"development" : [
"last 1 chrome version" ,
"last 1 firefox version" ,
"last 1 safari version"
]
2023-05-29 12:02:38 +03:00
} ,
"msw" : {
"workerDirectory" : "public"
2024-04-23 14:37:29 +03:00
} ,
"dependencies" : {
2024-10-09 16:41:41 +03:00
"@nivo/calendar" : "^0.87.0" ,
"@nivo/core" : "^0.87.0" ,
"@nivo/line" : "^0.87.0" ,
2024-10-23 19:32:10 +03:00
"@tiptap/extension-document" : "^2.9.0" ,
"@tiptap/extension-paragraph" : "^2.9.0" ,
"@tiptap/extension-placeholder" : "^2.9.0" ,
"@tiptap/extension-text" : "^2.9.0" ,
"@tiptap/extension-text-style" : "^2.8.0" ,
"@tiptap/react" : "^2.8.0" ,
Visualize Workflows (#6697)
## Features
- Fetch a workflow and display it in a tree with the React Flow library
- The nodes are positioned by an algorithm
- The feature is put behind a feature flag. The `/workflow/:id` route is
disabled if the flag is off.
- I started implementing a right drawer. That's a big WIP and it will be
finished in another PR.
## How to test this feature
1. Create a workflow instance in the database through a GraphQL query.
See below for instructions.
2. After enabling the feature flag, you should be able to see the
workflow you created in the workflows list. To visualize the workflow,
go to the `/workflow/:id` page where the id is the id of the workflow.
See the video for a quick way to do so.
```gql
// First
mutation createWorkflow($data: WorkflowCreateInput!) {
createWorkflow(data: $data) {
id
}
}
// Result
{
"data": {
"name": "test"
}
}
// Second
mutation createWorkflowVersion($data: WorkflowVersionCreateInput!) {
createWorkflowVersion (data: $data) {
id
}
}
// Result
{
"data": {
"name": "v1",
"trigger": {
"name": "trigger",
"displayName": "New or Updated Row",
"type": "DATABASE_EVENT",
"settings": {
"eventName": "company.created",
"triggerName": "Company Created"
},
"nextAction": {
"name": "step_1",
"displayName": "Code",
"type": "CODE",
"valid": true,
"settings": {
"serverlessFunctionId": "function_id",
"errorHandlingOptions": {
"retryOnFailure": {
"value": false
},
"continueOnFailure": {
"value": false
}
}
}
}
},
"workflowId": "workflow_id"
}
}
```
https://github.com/user-attachments/assets/42bbd98c-5e13-447c-9307-461a18ac2195
2024-08-23 18:50:13 +03:00
"@xyflow/react" : "^12.0.4" ,
2024-04-23 14:37:29 +03:00
"transliteration" : "^2.3.5"
2023-12-10 20:10:54 +03:00
}
2024-02-05 17:01:37 +03:00
}