twenty/packages/twenty-front
Baptiste Devessier e49acae851
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 17:50:13 +02:00
..
__mocks__ Fix overlay scroll gaps (#4512) 2024-03-31 10:53:37 +02:00
.storybook feat: soft delete (#6576) 2024-08-16 21:20:02 +02:00
public Serverless function UI (#6388) 2024-07-29 13:03:09 +02:00
scripts feat: add SENTRY_RELEASE env (#4912) 2024-04-11 16:53:15 +02:00
src Visualize Workflows (#6697) 2024-08-23 17:50:13 +02:00
.env.example Delete auth/file front variables (#4455) 2024-03-19 22:19:40 +01:00
.eslintrc-ci.cjs chore: enable no-console eslint rule for tests and stories (#4816) 2024-04-04 18:36:39 +02:00
.eslintrc.cjs Activity as standard object (#6219) 2024-07-31 15:36:11 +02:00
.gitignore Feat/put target object identifier on use activities (#4682) 2024-04-01 13:12:37 +02:00
.prettierignore Update twenty-front commands (#4667) 2024-04-17 18:06:02 +02:00
.swcrc Migrate to a monorepo structure (#2909) 2023-12-10 18:10:54 +01:00
codegen-metadata.cjs Serverless function UI (#6388) 2024-07-29 13:03:09 +02:00
codegen.cjs Serverless function UI (#6388) 2024-07-29 13:03:09 +02:00
index.html Migrate to a monorepo structure (#2909) 2023-12-10 18:10:54 +01:00
jest.config.ts Fix frontend tests (#6585) 2024-08-09 08:38:01 +02:00
nyc.config.cjs Added Linaria for performance optimization (#5693) 2024-06-12 16:31:07 +02:00
package.json Visualize Workflows (#6697) 2024-08-23 17:50:13 +02:00
project.json added typechecking for all ts files (#6466) 2024-08-20 11:05:13 +02:00
README.md Migrate to a monorepo structure (#2909) 2023-12-10 18:10:54 +01:00
setupTests.ts chore: setup twenty-ui absolute path alias (#4732) 2024-04-04 15:38:01 +02:00
tsconfig.build.json added typechecking for all ts files (#6466) 2024-08-20 11:05:13 +02:00
tsconfig.dev.json added typechecking for all ts files (#6466) 2024-08-20 11:05:13 +02:00
tsconfig.json Fix webhook issue (#6711) 2024-08-21 15:33:38 +02:00
tsconfig.spec.json fix: fix root start script (#5032) 2024-04-19 18:28:02 +02:00
tsconfig.storybook.json fix: fix root start script (#5032) 2024-04-19 18:28:02 +02:00
tsup.config.ts Fix frontend tests (#6585) 2024-08-09 08:38:01 +02:00
tsup.ui.index.tsx feat: implement new SnackBar design (#5515) 2024-05-23 12:19:50 +02:00
vite.config.ts added typechecking for all ts files (#6466) 2024-08-20 11:05:13 +02:00

Run yarn dev while server running on port 3000