Commit Graph

58 Commits

Author SHA1 Message Date
d0ff1ffd5f 8723 workflow add editor in serverless function code step (#8805)
- create a serverless function when creating a new workflow code step
- add code editor in workflow code step
- move workflowVersion steps management from frontend to backend
  - add a custom resolver for workflow-version management
  - fix optimistic rendering on frontend
- fix css
- delete serverless function when deleting workflow code step

TODO
- Don't update serverlessFunction if no code change
- Factorize what can be between crud trigger and crud step
- Publish serverless version when activating workflow
- delete serverless functions when deleting workflow or workflowVersion
- fix optimistic rendering for code updates
- Unify CRUD types

<img width="1279" alt="image"
src="https://github.com/user-attachments/assets/3d97ee9f-4b96-4abc-9d36-5c0280058be4">
2024-12-03 08:41:13 +00:00
b542b43878 Add record picker with variables (#8813)
- Add update actions
- Create a folder for workflow actions
- Add a SingleRecordPicker with variables handler



https://github.com/user-attachments/assets/9fd57ce1-1b8d-424a-8aa1-69468d684fa1
2024-11-29 20:33:45 +01:00
0136be65d1 Fix delete trigger node (#8806) 2024-11-29 13:58:23 +01:00
d73dc1a728 Create form field number (#8634)
- Refactor VariableTagInput to have a reusable low-level TipTap editor
- Create three primitive form fields:
  - Text
  - Number
  - Boolean

## Notes

- We should automatically recognize the placeholder to use for every
FormFieldInput, as it's done for FieldInputs.

## Design decisions

Our main challenge was for variables and inputs to be able to
communicate between each other. We chose an API that adds some
duplication but remains simple and doesn't rely on "hacks" to work.
Common styles are centralized.

## Demo

"Workflow" mode with variables:

![CleanShot 2024-11-26 at 10 43
25@2x](https://github.com/user-attachments/assets/cc17098a-ca27-4f97-b86a-bf88593e53db)

FormFieldInput mode, without variables:

![CleanShot 2024-11-26 at 10 44
26@2x](https://github.com/user-attachments/assets/fec07c36-5944-4a1d-a863-516fd77c8f55)

Behavior difference between fields that can contain variables and static
content, and inputs that can have either a variable value or a static
value:

![CleanShot 2024-11-26 at 10 47
13@2x](https://github.com/user-attachments/assets/1e562cd8-c362-46d0-b438-481215159da9)
2024-11-28 17:03:24 +00:00
3573d89c3c Add a few tests on workflow hooks (#8800)
As title
2024-11-28 16:54:41 +00:00
38b83f0866 Write more tests (#8799) 2024-11-28 17:43:15 +01:00
5ec6cb0e6f Make workflow step name editable (#8677)
- Use TextInput in header title
- add onTitleChange prop
- rename field name instead of label

To fix :
- padding right on title comes from current TextInput component. It
needs to be refactored


https://github.com/user-attachments/assets/535cd6d3-866b-4a61-9c5d-cdbe7710396a
2024-11-22 15:25:01 +00:00
eb66c019f5 Set initial step if only one root step (#8617) 2024-11-20 17:38:35 +00:00
c133129eb0 Fix state mutation serverless action (#8580)
In this PR:

- Ensure the `setNestedValue` does a deep copy of the provided object
and doesn't mutate it directly.
- Store the form's state in a `useState` instead of relying entirely on
the backend's state. This makes the form more resilient to slow network
connections.
- Ensure the input settings are reset when selecting another function.
- The Inner component now expects the serverless functions data to be
resolved before being mounted, so I split it.

Closes https://github.com/twentyhq/twenty/issues/8523
2024-11-20 09:15:55 +00:00
2773974459 Add disable state to variable tag component (#8586)
- add hover on variables
- add disable state with readonly props

Disabled
<img width="284" alt="Capture d’écran 2024-11-19 à 16 12 10"
src="https://github.com/user-attachments/assets/19b21429-8500-4cdc-9914-22a7968beb64">


Normal
<img width="284" alt="Capture d’écran 2024-11-19 à 16 12 30"
src="https://github.com/user-attachments/assets/bc3be00f-944d-488c-bf05-a9f7b9f134c4">
2024-11-19 17:15:32 +00:00
1e55010e26 8563 workflow workflow node does not open on step click (#8582)
- fix multiple node selection
- fix console error
- fix close right drawer no unselect nodes
- fix edges not selectable
- fix sometime node not selected when clicking

## After


https://github.com/user-attachments/assets/ceec847f-5b7d-4452-9685-81a845bbf21e
2024-11-19 14:51:52 +01:00
cdf0240ccb Fix active navigation tab + quick workflows fixes (#8567)
- Active navigation tab hovered in show page
- remove timeline tab + rename workflow tab
- remove {{variable}} placeholder
- fix margin
- Workflow Runs and Versions show page title

<img width="807" alt="Capture d’écran 2024-11-18 à 18 23 12"
src="https://github.com/user-attachments/assets/688dfc67-362e-4f04-b436-3ff94d7e3e4a">
2024-11-19 10:55:25 +00:00
c17e18b1e9 Add Record Create action in the frontend (#8514)
In this PR:

- Updated the front-end types for workflows to include CRUD actions and
global naming changes
- Allow users to create a Record Create action
- Scaffold the edit for Record Create action; for now, I render a
`<VariableTagInput />` component for every editable field; it's likely
we'll change it soon

Closes https://github.com/twentyhq/private-issues/issues/142

Demo:


https://github.com/user-attachments/assets/6f0b207a-b7d2-46d9-b5ab-9e32bde55d76
2024-11-18 18:23:46 +01:00
e3b327de8e Add missing Icons (#8562)
## Before

![image](https://github.com/user-attachments/assets/54fdddd6-4a48-4e7c-a654-30a6599f22ea)


## After

![image](https://github.com/user-attachments/assets/c4e0318d-f0b0-4fc5-84b7-14cc72447ac3)
2024-11-18 16:22:17 +01:00
9b2853bb01 Fix variable dropdown (#8521)
- fixed dropdown width
- add icons
- handle composite fields
## After

![image](https://github.com/user-attachments/assets/b9ac585e-2a39-4ab2-8620-739f83272b9b)

![image](https://github.com/user-attachments/assets/d9f7eabb-5693-4c1c-b81c-45a901479042)

![image](https://github.com/user-attachments/assets/9edced28-8a04-4951-913d-3e5561d4fcbe)
2024-11-15 18:08:03 +00:00
54b28ff7ed Enable workflow testing + fix header (#8512)
- clean execution header
- enable test on workflows + add snack bar
- display snack bar error if workflow cannot be tested

Behaviour still need to be validated by @Bonapara 
<img width="880" alt="Capture d’écran 2024-11-15 à 12 16 36"
src="https://github.com/user-attachments/assets/1dab0c3b-157c-449f-aee7-4c8cf2e369a6">
<img width="880" alt="Capture d’écran 2024-11-15 à 12 16 48"
src="https://github.com/user-attachments/assets/16279611-0a58-4fe6-b117-0192714a6d5c">
2024-11-15 18:38:39 +01:00
4f99b8eea1 8495 workflow display relevant columns in workflow related tables (#8502)
## After
### Workflows

![image](https://github.com/user-attachments/assets/535e0ff5-1276-41b9-aa52-d66150cd85ae)
### WorkflowRuns

![image](https://github.com/user-attachments/assets/8a7e076b-53ec-4b72-97d8-41bd77ed59ac)
### WorkflowVersions

![image](https://github.com/user-attachments/assets/7d2566b2-e6ea-4a3a-8e88-0f6850203219)

## Change Created By into Executed By in workflowRuns

![image](https://github.com/user-attachments/assets/b90b7a07-a4bc-4bd2-b7f5-ab7d2ae6ee45)
2024-11-15 10:13:36 +00:00
9ac949dec8 [Workflow] Add search in variable dropdown (#8479)
- fix Icon variable Plus
- add search input 
- fix dropdown height

## Before

![image](https://github.com/user-attachments/assets/49f73efd-21cc-4ecd-a494-f51edc34dc57)


## After

![image](https://github.com/user-attachments/assets/2af2c7ee-72fd-4dae-a1ef-19e75e1ac026)
2024-11-14 11:40:06 +01:00
ba79a1d324 Fix style (#8475)
## Before

![image](https://github.com/user-attachments/assets/1c96c30c-da06-4caa-a05d-1c58006dcfa5)

## After

![image](https://github.com/user-attachments/assets/523fac64-7521-4c0f-bfa8-457d48493628)
2024-11-13 13:32:40 +00:00
31f03764d6 Improve the layout of the Workflow Visualizer (#8372)
- Increase the dimensions of the ReactFlow nodes. This allows to ditch
scaling which made it hard to get the width of the nodes as they were
visually scaled by 1.3.
- Center the flow when the flow mounts and when the state of the right
drawer opens.
- Put the node type inside of the node so it doesn't overlap with the
arrow
- Make the edges non deletable

We'll have to make a refactor so the viewport can be animated properly:
https://github.com/twentyhq/twenty/issues/8387.


https://github.com/user-attachments/assets/69494a32-5403-4898-be75-7fc38058e263

---------

Co-authored-by: Félix Malfait <felix@twenty.com>
2024-11-12 17:52:12 +01:00
6d62dd9fd1 fix: object activate dropdown (#8438)
Fixes: #8436 
Fixes: #8435 
& other duplicate ```DropdownMenu```
2024-11-11 09:26:07 +01:00
354ee86cb9 8311 serverless function functions can be executed with any input (#8380)
- remove ts-morph
- update inputSchema shape

![image](https://github.com/user-attachments/assets/e62f3fdb-5be8-4666-8172-44f73a1981b9)


https://github.com/user-attachments/assets/913cd305-9e7c-48da-b20f-c974a8ac7cea

## TODO
- have inputTypes to match the inputSchema type (string, number,
boolean, etc...), only string for now
- handle required/optional inputs
- handle case when inputSchema changes, fix data reset when switching
function
2024-11-08 16:15:27 +00:00
f9c076df31 o365 calendar sync (#8044)
Implemented:

* Account Connect
* Calendar sync via delta ids then requesting single events


I think I would split the messaging part into a second pr - that's a
step more complex then the calendar :)

---------

Co-authored-by: bosiraphael <raphael.bosi@gmail.com>
2024-11-07 18:13:22 +01:00
6264d509bd Migrate to twenty-ui - navigation/menu-item (#8213)
This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-7536](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7536).

 --- 

### Description

Migrate all menu items components to twenty ui and update imports.

```typescript
MenuItem
MenuItemAvata
MenuItemCommand
MenuItemCommandHotKeys
MenuItemDraggable
MenuItemMultiSelect
MenuItemMultiSelectAvatar
MenuItemMultiSelectTag
MenuItemNavigate
MenuItemSelect
MenuItemSelectAvatar
MenuItemSelectColor
MenuItemSelectTag
MenuItemSuggestion
MenuItemToggle
```

\
Also migrate all other dependent components and utilities like
`Checkbox` & `Toggle`\
\
Fixes twentyhq/private-issues#82

---------

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: gitstart-twenty <140154534+gitstart-twenty@users.noreply.github.com>
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
2024-11-07 16:51:39 +00:00
117e502e80 Clean available fields in variable dropdown (#8371)
As title

We do not want relations yet in picker
2024-11-06 16:54:23 +01:00
7f51eb8c3c Add the possibility to run workflows with manual trigger from the command K with no records selected (#8342)
https://github.com/user-attachments/assets/9f094439-8d19-4a6b-883b-456294f691d8
2024-11-06 11:43:18 +01:00
be8141ce5e Infer function input in workflow step (#8308)
- add `inputSchema` column in serverless function. This is an array of
parameters, with their name and type
- on serverless function id update, get the `inputSchema` + store empty
settings in step
- from step settings, build the form 

TODO in next PR:
- use field type to decide what kind of form should be printed
- have a strategy to handle object as input



https://github.com/user-attachments/assets/ed96f919-24b5-4baf-a051-31f76f45e575
2024-11-05 14:57:06 +01:00
d1531aa1b6 8191 command k workflow trigger for selected record (#8315)
Closes #8191 


https://github.com/user-attachments/assets/694da229-cc91-4df2-97a0-49cd5dabcf12
2024-11-05 13:37:29 +01:00
409def8431 Fix manual trigger output schema (#8150)
- add schema for manual trigger
- split into sub functions
- handle case with no variables
2024-10-28 17:42:09 +00:00
2ba98ddadd Handle NBSP in tiptap parsing (#8148)
Tiptap uses non breaking spaces between nodes (like variables). Those
html characters are not properly handles in emails. Replacing by regular
spaces during parsing.

I tried to fix it in settings but looks like this is only for preserving
those nbsp and not for removal (see
https://github.com/ueberdosis/tiptap/pull/254)
2024-10-28 15:50:14 +01:00
9b6359984d Migrate to twenty-ui - input/code-editor (#8072)
This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-7062](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7062).

 --- 

### Description.  

Migrate `code-editor` component to twenty ui.\
\
Fixes twentyhq/private-issues#94

---------

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
2024-10-28 13:34:06 +01:00
1aa961dedf 101 featch available variables from previous steps (#8062)
- add outputSchema in workflow step settings
- use outputSchemas to compute step available variables


https://github.com/user-attachments/assets/6b851d8e-625c-49ff-b29c-074cd86cbfee
2024-10-28 11:25:29 +00:00
2e73d020a3 Text area using variables (#8034)
- Adding multiline props to component
- Update design and logic accordingly 
- Fix hotkey scope for right drawer



https://github.com/user-attachments/assets/65ff9641-71a4-4828-a62b-e09327b63150
2024-10-25 12:55:56 +00:00
0144553667 Add Manual Triggers (#8024)
In this PR:

- Add support for manual triggers in the backend
- Add a right drawer to let users select the type of trigger they want
- Create a specific right drawer for database event triggers
- Create a right drawer for manual triggers; let the user select where
the manual trigger should be made available
- Create a default trigger as soon as the user selects the type of
trigger they want. It prevents the user to see empty selects for record
type and event type. By default, the database event trigger will be set
to "company.created". It should be visible enough for users to
understand what happens and choose another record type or event type.



https://github.com/user-attachments/assets/29a21985-1823-4890-9eb3-e4f876459c7a
2024-10-25 14:24:56 +02:00
e44d525e83 Prevent workflow right drawer flickering when selecting an action type (#8028)
In this PR:

- Use a stable id for create-step nodes; it makes it possible to
preserve their selected attribute and keep them open even after the flow
is re-generated
- Preemptively open the WorkflowStepEdit right drawer for the created
action



https://github.com/user-attachments/assets/c19e6820-e198-4d06-98ae-898bd6e53e33

Fixes https://github.com/twentyhq/private-issues/issues/123
2024-10-24 17:27:56 +02:00
0a28c15747 Migrate to twenty-ui - input/button (#7994)
This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-7529](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7529).

 --- 

### Description

- Migrated all button components to `twenty-ui`    \
  \
  `Button`\
  `ButtonGroup`\
  `ColorPickerButton`\
  `FloatingButton`\
  `FloatingButtonGroup`\
  `FloatingIconButton`\
  `FloatingIconButtonGroup`\
  `IconButton`\
  `IconButtonGroup`\
  `LightButton`\
  `LightIconButton`\
  `LightIconButtonGroup`\
  `MainButton`\
  \
  Fixes twentyhq/private-issues#89

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
2024-10-24 13:20:02 +02:00
1f84e61da8 Added "Select an option" as default none selector on Workflow Visualizer (#7867)
## What does this PR do?
Shows "Select an option" as a default selector on the select component
for the trigger step in the workflow visualizer

Fixes #7432

<img width="1470" alt="Screenshot 2024-10-20 at 12 48 39 AM"
src="https://github.com/user-attachments/assets/189c2a7a-8abd-4411-90b4-d0e1de487fd5">
<img width="1470" alt="Screenshot 2024-10-20 at 12 48 50 AM"
src="https://github.com/user-attachments/assets/f451068c-0184-40cb-9cab-f139df400cc6">

---------

Co-authored-by: Devessier <baptiste@devessier.fr>
2024-10-24 10:54:22 +02:00
2e8b8452c1 Add available variables dropdown (#7964)
- Add variable dropdown
- Insert variables on click
- Save variable as `{{stepName.object.myVar}}` and display only `myVar`


https://github.com/user-attachments/assets/9b49e32c-15e6-4b64-9901-0e63664bc3e8
2024-10-23 18:32:10 +02:00
e7eeb3b820 Add Workflow Run show page (#7719)
In this PR:

- Display a workflow version visualizer for the version of the workflow
the run was executed on.
- Display the output of the run as code.


https://github.com/user-attachments/assets/d617300a-bff4-4328-a35c-291dc86d81cf
2024-10-21 12:04:44 +02:00
fc6748de0a Add modal to confirm workflow draft version overriding (#7758)
In this PR:

- Allow the `<ConfirmationModal />` to take additional buttons to
display between the cancel and the confirm buttons.
- Create a modal that's displayed when the user tries wants to use a
workflow version as draft while a draft version already exists. The
displayed modal contains a link to the current draft version and a
button to confirm the overriding of the current draft version.

A demo:


https://github.com/user-attachments/assets/6349f418-1b11-45b3-9f5e-061ca74c2966

Closes twentyhq/private-issues#114
2024-10-21 11:51:54 +02:00
eccf0bf8ba Enforce front project structure through ESLINT (#7863)
Fixes: https://github.com/twentyhq/twenty/issues/7329
2024-10-20 20:20:19 +02:00
36e59d80c4 Use the correct color for workflow nodes label (#7829)
Follow the design from the Figma about the color to use.

Big up to @Bonapara for doing great job on the Figma!

It was done on stream!

Fixes #7058
2024-10-19 10:59:04 +02:00
e811bae10e Execute variables in action input (#7715)
- send context from all previous steps rather than unique payload
- wrap input data in settings into input field
- add email into send email action settings
- update output shape

<img width="553" alt="Capture d’écran 2024-10-15 à 15 21 32"
src="https://github.com/user-attachments/assets/0f5ed004-0d6e-4a59-969b-a5710f3f3985">

<img width="761" alt="Capture d’écran 2024-10-15 à 15 20 09"
src="https://github.com/user-attachments/assets/ac140846-c383-483b-968a-eab469b76785">
2024-10-16 14:32:06 +02:00
521dd04d56 Fix issues with Apollo cache in workflow module (#7569)
Fixes #7523
2024-10-11 15:26:25 +02:00
9b9e03fbf6 Fix Storybook Build running out of memory (#7520)
Increases the node process memory to avoid `FATAL ERROR: Reached heap
limit Allocation failed - JavaScript heap out of memory` errors
2024-10-09 11:08:53 +02:00
f138a1cf6e 7417 workflows i can send emails using the email account (#7431)
- update `send-email.workflow-action.ts` so it send email via the google
sdk
- remove useless `workflow-action.email.ts`
- add `send` authorization to google api scopes
- update the front workflow email step form to provide a
`connectedAccountId` from the available connected accounts
- update the permissions of connected accounts: ask users to reconnect
when selecting missing send permission


![image](https://github.com/user-attachments/assets/fe3c329d-fd67-4d0d-8450-099c35933645)
2024-10-08 23:29:09 +02:00
1863636003 Create workflow version show page (#7466)
In this PR:

- Refactored components to clarify their behavior. For example, I
renamed the `Workflow` component to `WorkflowVisualizer`. This moved
forward the issue #7010.
- Create two variants of several workflow-related components: one
version for editing and another for viewing. For instance, there is
`WorkflowDiagramCanvasEditable.tsx` and
`WorkflowDiagramCanvasReadonly.tsx`
- Implement the show page for workflow versions. On this page, we
display a readonly workflow visualizer. Users can click on nodes and it
will expand the right drawer.
- I added buttons in the header of the RecordShowPage for workflow
versions: users can activate, deactivate or use the currently viewed
version as the next draft.

**There are many cache desynchronisation and I'll fix them really
soon.**

## Demo

(Turn sound on)


https://github.com/user-attachments/assets/97fafa48-8902-4dab-8b39-f40848bf041e
2024-10-08 18:16:36 +02:00
35361093bf Delete workflow step (#7373)
- Allows the deletion of triggers and steps in workflows. If the
workflow can not be edited right now, we create a new draft version.
- The workflow right drawer can now render nothing. It's necessary to
behave that way because a deleted step will still be displayed for a
short amount of time in the drawer. The drawer will be filled with blank
content when it disappears.


https://github.com/user-attachments/assets/abd5184e-d3db-4fe7-8870-ccc78ff23d41

Closes #7057
2024-10-01 18:14:54 +02:00
cde255a031 Add workflow email action (#7279)
- Add the SAVE_EMAIL action. This action requires more setting
parameters than the Serverless Function action.
- Changed the way we computed the workflow diagram. It now preserves
some properties, like the `selected` property. That's necessary to not
close the right drawer when the workflow back-end data change.
- Added the possibility to set a label to a TextArea. This uses a
`<label>` HTML element and the `useId()` hook to create an id linking
the label with the input.
2024-10-01 14:22:14 +02:00
5d1208f8af Set default zoom to workflows (#7331)
## Improvements

- This PR calls `fitView` when the Reactflow component inits. It tries
to fit the flow in a view with a fixed min and max zoom.
- Every time the WorkflowDiagramCanvas is rendered for a different
`workflowVersionId`, the `fitView` will be re-called. This is
implemented with a React `key`.
- The canvas will be re-rendered when an activated/deactivated version
is updated (and a new draft version is created.)
- It will also be re-rendered when the user selects another workflow
version and this doesn't cause the `WorkflowDiagramCanvas` component to
unmount. It happens if the user wants to go the previous or next
workflow or workflow version.

## Previous Behavior

![CleanShot 2024-09-30 at 10 32
06@2x](https://github.com/user-attachments/assets/ea43cd43-8c9c-491c-a535-8cca9168fb22)

## New Behavior

![CleanShot 2024-09-30 at 10 26
47@2x](https://github.com/user-attachments/assets/7bfb91b2-1782-47a1-ab5a-3eaa9f1be923)


https://github.com/user-attachments/assets/cb73f456-58b1-49c3-bd31-a1650810e9dd

## Notes

Closes #7047

This PR is a simplification of #7151. We'll have to improve the way we
manage zoom in another PR.
2024-09-30 11:24:57 +02:00