Commit Graph

31 Commits

Author SHA1 Message Date
Lucky Goyal 659ed6b080 feat: add full path label tooltip for workflow filter field (#16580)
# Closes Issue: Can't distinguish between fields with identical names
(#16285)

There was a UX bug in the workflow filter interface where **two
variables coming from different steps but sharing the same field name**
were displayed identically. This made it difficult for users to tell
them apart when used in a filter group, leading to confusion when
building workflows.

---

# Fix: Add Full Path Label Tooltip for Workflow Filter Field

- Adds a **tooltip/label showing the complete path** so users can
distinguish fields from different workflow steps even if they share the
same name.

## UX Improvements
<img width="495" height="288" alt="image"
src="https://github.com/user-attachments/assets/fa26f381-835b-4d14-bf73-f04b59c8d0b5"
/>
2025-12-17 11:13:10 +01:00
Thomas Trompette 95e0793f81 Compute output schema on frontend (#16530)
Fixes https://github.com/twentyhq/core-team-issues/issues/1382

Current issue : all step output schemas are computed and stored on
backend side. Which means that, when the database schema is updated -
like a field creation - steps needs to be deleted an recreated. Which is
invisible to users.

Solution : schema generation is moved on frontend side

1. Coming on the page the first time, the schema is populated for all
steps except a few ones that are handled differently (Code, Webhook,
http node, Agent)

2. A separated state allow to determine if a step needs a recomputation.

3. The user only needs a refresh to see the whole schema re-computed

Follow-up:
- check if remaining backend steps could be moved to runtime
computation. But Code will still require storage.
- Clean backend service that is not used anymore
2025-12-15 16:20:35 +01:00
Etienne 208c0857ee common api - null equivalence (#15926)
closes https://github.com/twentyhq/core-team-issues/issues/1629

To do before requesting review : 
- filter update

Migration to come in an other PR


Strat : 
1/  Null transformation

- [x] Transform NULL equivalent value to NULL in field validation in
common api - pre-query - with feature flag
- [ ] Same logic in ORM (Not done, complex to handle feature flag here)
- [x] Transform NULL value to equivalent in data formatting in ORM -
post-query

2/ Migration (in other PR) for fieldMetadata not nullable with default
defaultValue (empty string, ...)

- [ ] Remove NOT NULL db constraint
- [ ] Update record value to NULL
- [ ] Update field metadata : isNullable:true
- [ ] Update uniqueIndex whereClause (also for standard uniqueIndex) 
- [ ] Activate feature flag

3/ Update metadata creation

- [x] No more default default value
- [x] Update standard field nullability
- [x] Remove index default whereClause for standard field

4/ Update filter

- [x] When filtering on NULL or empty string, be sure all records are
returned (the one with NULL + the one with "")

5/ Test

- [ ] Strat. to do
2025-11-24 18:57:47 +01:00
Abdul Rahman 04b0a65e73 feat: fix Command Menu Side Panel Layout (#15883)
[Figma
Design](https://www.figma.com/design/xt8O9mFeLl46C5InWwoMrN/Twenty?node-id=81380-344641&t=FpjWNOK2gZuDQQfr-0)

<!-- CURSOR_SUMMARY -->
---

> [!NOTE]
> Adds a side panel layout for the Command Menu, routes modals into a
local container, updates the top bar and context chips, and standardizes
small button sizes.
> 
> - **Command Menu**:
> - **Side Panel Layout**: Introduces `CommandMenuSidePanelLayout` with
animated width, hosts `CommandMenuRouter`, and provides a modal
container via `ModalContainerContext`.
> - **Top Bar**: Redesign (`CommandMenuTopBar`) with back icon, optional
AI sparkles action, compact height
(`COMMAND_MENU_SEARCH_BAR_HEIGHT=40`), and updated placeholder.
> - **Context Chips**: Adds `CommandMenuLastContextChip` and
`CommandMenuRecordInfo`; extends `CommandMenuContextChip` with `page`
prop; updates `CommandMenuContextChipGroups` to render last chip as
record info when applicable.
> - **Container Simplification**: `CommandMenuContainer` simplified to
just provide contexts and `AgentChatProvider`.
> - **Modal System**:
> - Adds `ModalContainerContext` and updates `Modal` to portal into
provided container; `Modal.Backdrop` supports `isInContainer`.
> - Updates usages (e.g., `UserOrMetadataLoader`, `ActionModal`) to
align with new modal behavior.
> - **Page Integration**:
> - Replaces `PageBody` with `CommandMenuSidePanelLayout` in
`RecordShowPage` and `RecordIndexContainerGater`.
> - Removes global `CommandMenuRouter` from `DefaultLayout` (keeps
keyboard shortcuts).
> - **UI/Styling**:
> - Standardizes several buttons to `size="small"` (e.g., command
actions, open record, options, reply, workflow footer).
> - Adjusts `ShowPageSubContainer` styling when rendered inside command
menu.
>   - Storybook tests updated for new placeholder text.
> 
> <sup>Written by [Cursor
Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit
81fcaa145618a2fa1c3e11e2dc88fe832c51374c. This will update automatically
on new commits. Configure
[here](https://cursor.com/dashboard?tab=bugbot).</sup>
<!-- /CURSOR_SUMMARY -->

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
Co-authored-by: Devessier <baptiste@devessier.fr>
Co-authored-by: Aman Raj <92664006+araj00@users.noreply.github.com>
Co-authored-by: Etienne <45695613+etiennejouan@users.noreply.github.com>
Co-authored-by: Paul Rastoin <45004772+prastoin@users.noreply.github.com>
2025-11-21 16:12:41 +01:00
Thomas Trompette d3f3f991a5 Infer array current item schema (#15115)
This PR allows to infer the schema of the current item of an iterator
step:
- iterator step receive a variable
- added an util that navigate to the array in schema -
navigateOutputSchemaProperty
- use the array value in schema to generate a new schema - used the
existing getFunctionOutputSchema that I renamed and moved to
twenty-shared

Also cleaned a bit the existing schema for AI.

Before


https://github.com/user-attachments/assets/9767fc89-3524-4bfb-b1ab-8abe92084767

After


https://github.com/user-attachments/assets/3650c1d2-14f2-44f9-b10c-e649fe04128d
2025-10-15 16:15:08 +00:00
Thomas Trompette 6d5635f4e2 Use variables within Iterators (#14604)
Variables were not working properly. Output schema was outdated and
parent steps were not calculated properly.

Before


https://github.com/user-attachments/assets/b070c1ff-41dd-4ea0-a590-25bb39027456

After


https://github.com/user-attachments/assets/baa43e69-0e7c-4697-8812-3ce523efba13
2025-09-18 23:13:57 +02:00
Thomas Trompette 2b59198a1b Migrate output schema to V2 (#14311)
Previous refacto was creating output schema V2 which has more specific
schemas based on the step type. Before we were using one common schema,
which was too complex when searching for variable informations.

This PR migrate the deprecated schemas and remove the old code:
- mark previous `BaseOutputSchema` as deprecated
- remove other previous schemas
- use V2 everywhere
- icon should not be stored in schema. Instead it should be generated
based on the fieldmetadata or the item type
2025-09-09 18:37:00 +02:00
Thomas Trompette e449e69f4c Add counter to filter (#14108)
See figma
https://www.figma.com/design/xt8O9mFeLl46C5InWwoMrN/Twenty?node-id=70822-35001&m=dev

<img width="75" height="61" alt="Capture d’écran 2025-08-27 à 16 57
46"
src="https://github.com/user-attachments/assets/e41290c8-3ec5-4d64-a5d2-d52bd14ccd57"
/>
<img width="75" height="61" alt="Capture d’écran 2025-08-27 à 16 57
58"
src="https://github.com/user-attachments/assets/710d5735-c256-47fc-ad2f-93e4f72b8002"
/>
<img width="121" height="89" alt="Capture d’écran 2025-08-27 à 16 16
33"
src="https://github.com/user-attachments/assets/0c8216b2-f251-4f0e-ad9f-f3a25229df40"
/>



https://github.com/user-attachments/assets/43156c0c-91b8-4386-a971-e37577e3c199
2025-08-27 15:25:18 +00:00
Thomas Trompette 293cf0be39 Search variables - finish the search by step type (#14046)
- Add a specific search and type for find records step. Will be mainly
useful when we start fetching list of records
- Same for forms
2025-08-25 13:48:12 +00:00
Thomas Trompette 4ecd275f5e Add separated types + build a search for records (#14014)
The code to search variables became too complex. This is mainly because
it tries to handle all use cases at once:
- steps returning records (MANUAL TRIGGER, CREATE RECORD...)
- steps returning record events
- primitive types (code, webhook...)
- forms

To make the code maintainable, let's make a few updates:
- clear schema output types for each steps
- group the output types that are similar and implement a search schema
function for each
- once this is implemented on frontend, let's remove the logic on
backend side. Schema should be recompute and not stored

This PR implement the refacto for steps returning records and events.
2025-08-22 10:20:07 +00:00
Kailash Rajput 5e905d3004 fix: Filter Selection Icon Missing #13901 (#13950)
Fixed issue #13901



https://github.com/user-attachments/assets/4aa7d0f3-88b8-474f-85e5-b2989ed8afdd

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
2025-08-18 16:54:26 +02:00
Thomas Trompette 954da6da9d Delete filter on branch deletion (#13834)
When the target is not in the direct next step ids of the source (step
or trigger), check if there is a filter between both. If yes, delete the
filter and remove it from source next step ids.

Also refactored the existing.
2025-08-12 12:30:08 +02:00
Félix Malfait 464a480043 Continue ESLINT9 Migration (#13795)
Might already fix #13793
2025-08-10 23:25:58 +02:00
Thomas Trompette 3e1c9295d9 Do not throw when no selected not found (#13727)
<img width="1299" height="713" alt="Capture d’écran 2025-08-07 à 15 25
23"
src="https://github.com/user-attachments/assets/b9c3c3d3-9521-442a-8493-54a06418ade0"
/>

Remove error from console. When deleting a step, we get the command menu
opened for a short time. We should simply return null until the command
menu gets closed

Fix
https://twenty-v7.sentry.io/issues/6795046867/?project=4507072563183616&referrer=github-open-pr-bot
2025-08-07 16:17:52 +02:00
Thomas Trompette 9cfd62f1ef Filter dropdown by types (#13703)
Allow to filter types in variable dropdown. This will avoid unsupported
types for filters (RICH_TEXT, ACTOR)
<img width="579" height="505" alt="Capture d’écran 2025-08-07 à 09 58
42"
src="https://github.com/user-attachments/assets/c3fbeb3f-61ab-4c2c-bb2c-6f2c6292ef9e"
/>
2025-08-07 10:38:46 +02:00
Baptiste Devessier b8cd4491c2 Replace useOnSelectionChange with onClick listeners for steps opening (#13672)
This PR cleans a few parts of the workflow features and fixes a few
improper behaviors.

Here is a non-exaustive list of improved things:

- Clicking on an action will always reset the command menu's navigation
stack. Previously, the behavior wasn't unified between workflows,
workflow versions and workflow runs.
- Opening a step in the side panel is now down in the `onClick` event
handler put on individual Reactflow nodes. This makes interoperability
between filters (which are buttons on edges) and traditional actions.
- Simplified the code that automatically opens pending forms in the side
panel. This feature should now work more predictably.
- Splitted the `WorkflowDiagramEmptyTrigger` component into
`WorkflowDiagramEmptyTriggerEditable` and
`WorkflowDiagramEmptyTriggerReadonly`. This makes handling events easier
as the behavior isn't the same in both cases.
- Dropped all `useOnSelectionChange` hooks that were used to open steps
in the side panel upon user selection.
- Created a specific `WorkflowRunDiagramStepNode` instead of using
`WorkflowDiagramStepNodeReadonly` in `WorkflowRunDiagramCanvas`
- Deleted `useHandleWorkflowRunDiagramCanvasInit` as it was used to open
the initially selected step in the command menu, which is now handled in
an effect that works for all cases, including workflow run's state
refreshing.

Closes https://github.com/twentyhq/core-team-issues/issues/1227
Closes https://github.com/twentyhq/twenty/issues/11923
2025-08-06 19:00:48 +02:00
Thomas Trompette d9dbfc4f7e Handle relations for filters (#13654)
- Refacto variable dropdown so it can display both objects and fields
- we do not filter on object name anymore to simplify the code
- add relation handler in filters



https://github.com/user-attachments/assets/e4f03f11-45cb-4d3f-b628-e996129dd996
2025-08-06 14:57:10 +02:00
Lucas Bordeau de802b1447 Removed all v2 in naming of state management logic (#13675)
This PR removes any V2 naming in state management logic and some minor
utils and hooks.

It has a lot of changes but nearly all of them were made by the rename
functionality of vscode which is deterministic, so it shouldn't
introduce any regression.

QA has been made on this PR on the main features of the app without any
noticeable issue.

Also renamed some other v2 naming related items : 
- TextInputV2 => TextInput
- TextInput => SettingsTextInput
- ObjectFilterDropdownFilterSelectMenuItemV2 =>
ObjectFilterDropdownFilterSelectMenuItem
- useInitDraftValueV2 => useInitDraftValue
- useOpenRecordTableCellV2 => useOpenRecordTableCell
2025-08-06 12:09:15 +02:00
Thomas Trompette 07cf1ed71d Variables not coming from a Record step should be available in Record Picker (#12708)
We want code and webhook variables available in Record Picker since
those can contains uuid.

This PR:
- update `WorkflowVariablesDropdownObjectItems.tsx` so it manages fields
properly
- factorise both dropdown into a commun hook
- update filterOutputSchema.ts so it does not filter fields that are not
FieldMetadata types
- set relation fields as record object in variable schema so those can
be selected as full record

Before


https://github.com/user-attachments/assets/f4f85402-c056-4fd8-8474-d86bef9d4bc3

After


https://github.com/user-attachments/assets/c6589e18-7dfa-4fc8-a525-3a580e265896
2025-06-19 11:33:21 +02:00
Félix Malfait 79b4b3f783 Improve lazy loading (#12186)
WIP, using preview app to test performance (which was very bad)
2025-05-22 15:07:01 +02:00
Thomas Trompette d8b2e1fb34 Start using next step ids (#11683)
- update workflow executor
- update next step ids on step creation/deletion
- use these in workflow run
- use these in variables
2025-04-29 16:29:25 +02:00
Paul Rastoin 9ad8287dbc [REFACTOR] twenty-shared multi barrel and CJS/ESM build with preconstruct (#11083)
# Introduction

In this PR we've migrated `twenty-shared` from a `vite` app
[libary-mode](https://vite.dev/guide/build#library-mode) to a
[preconstruct](https://preconstruct.tools/) "atomic" application ( in
the future would like to introduce preconstruct to handle of all our
atomic dependencies such as `twenty-emails` `twenty-ui` etc it will be
integrated at the monorepo's root directly, would be to invasive in the
first, starting incremental via `twenty-shared`)

For more information regarding the motivations please refer to nor:
- https://github.com/twentyhq/core-team-issues/issues/587
-
https://github.com/twentyhq/core-team-issues/issues/281#issuecomment-2630949682

close https://github.com/twentyhq/core-team-issues/issues/589
close https://github.com/twentyhq/core-team-issues/issues/590

## How to test
In order to ease the review this PR will ship all the codegen at the
very end, the actual meaning full diff is `+2,411 −114`
In order to migrate existing dependent packages to `twenty-shared` multi
barrel new arch you need to run in local:
```sh
yarn tsx packages/twenty-shared/scripts/migrateFromSingleToMultiBarrelImport.ts && \
npx nx run-many -t lint --fix -p twenty-front twenty-ui twenty-server twenty-emails twenty-shared twenty-zapier
```
Note that `migrateFromSingleToMultiBarrelImport` is idempotent, it's atm
included in the PR but should not be merged. ( such as codegen will be
added before merging this script will be removed )

## Misc
- related opened issue preconstruct
https://github.com/preconstruct/preconstruct/issues/617

## Closed related PR
- https://github.com/twentyhq/twenty/pull/11028
- https://github.com/twentyhq/twenty/pull/10993
- https://github.com/twentyhq/twenty/pull/10960

## Upcoming enhancement: ( in others dedicated PRs )
- 1/ refactor generate barrel to export atomic module instead of `*`
- 2/ generate barrel own package with several files and tests
- 3/ Migration twenty-ui the same way
- 4/ Use `preconstruct` at monorepo global level

## Conclusion
As always any suggestions are welcomed !
2025-03-22 19:16:06 +01:00
Thomas Trompette ddeba39a2c Reset step output schema when step is removed (#10762)
When a step is deleted in a draft version, its variable are still
available in the following steps. This is because step output schema was
not reset. We needed either to refresh or to change version so output
schema gets updated.

This PR:
- migrates to a family state global + context not linked to a component
- add a reset step output schema function
- reset when a step is removed
2025-03-11 16:38:47 +00:00
Thomas Trompette c981ae329e Add variable path (#10720)
<img width="537" alt="Capture d’écran 2025-03-07 à 09 44 21"
src="https://github.com/user-attachments/assets/52c4d292-01af-4389-aa66-551be2358dd7"
/>

- search through step output schema the variable
- build the variable path
- returns the variable label 
- display both
2025-03-10 13:44:58 +01:00
Thomas Trompette 5ddf7c6475 Set steps output schema in a recoil family state (#10688)
- Create a workflow version component family state for each workflow
version : `stepId` => `StepOutputSchema`
- Populate this state when reaching the workflow visualizer of the
workflow version
- Wrap the right drawer when in edit mode with the context. It is the
only one who needs this schema

Next step:
- read this state from the variables
2025-03-06 13:31:35 +00:00
Baptiste Devessier f74e4bedc4 Create a right drawer for viewing steps in workflow runs (#10366)
- Improve the type-safety of the objects mapping the id of a right
drawer or side panel view to a React component
- Improve the types of the `useTabList` hook to type the available tab
identifiers strictly
- Create a specialized `WorkflowRunDiagramCanvas` component to render a
`WorkflowRunDiagramCanvasEffect` component that opens
`RightDrawerPages.WorkflowRunStepView` when a step is selected
- Create a new side panel view specifically for workflow run step
details
- Create tab list in the new side panel; all the tabs are `Node`,
`Input` and `Output`
- Create a hook `useWorkflowSelectedNodeOrThrow` not to duplicate
throwing mechanisms

Closes https://github.com/twentyhq/core-team-issues/issues/432

## Demo


https://github.com/user-attachments/assets/8d5df7dc-0b99-49a2-9a54-d3eaee80a8e6
2025-02-26 16:48:24 +01:00
Baptiste Devessier 05d00e6604 Store the current flow definition in a state to not depend on a specific workflow version (#10352)
This PR introduces a new Recoil state to store the flow.

A few parts of the application need to know the definition of the
current flow. Previously, we stored the workflow version's ID and
fetched its definition with the `useWorkflowVersion` hook. However, we
must use another strategy to visualize workflow runs. Indeed, we now
store the definition of the workflow in the workflow run output when it
is executed. This is useful for draft versions, which can change between
the moment they were executed and the moment they are visualized.
2025-02-20 17:12:03 +01:00
Paul Rastoin 7fd89678b7 [CHORE] Avoid isDefined duplicated reference, move it to twenty-shared (#9967)
# Introduction
Avoid having multiple `isDefined` definition across our pacakges
Also avoid importing `isDefined` from `twenty-ui` which exposes a huge
barrel for a such little util function

## In a nutshell
Removed own `isDefined.ts` definition from `twenty-ui` `twenty-front`
and `twenty-server` to move it to `twenty-shared`.
Updated imports for each packages, and added explicit dependencies to
`twenty-shared` if not already in place

Related PR https://github.com/twentyhq/twenty/pull/9941
2025-02-01 12:10:10 +01:00
Thomas Trompette 07dec36976 Tt fast follows 24/01 (#9843)
- Add icons on steps
- Add search input on object selection
- Improve event label
<img width="503" alt="Capture d’écran 2025-01-24 à 17 59 34"
src="https://github.com/user-attachments/assets/4e5d31d6-6fe5-4f78-9112-3fbd6ee66743"
/>
<img width="503" alt="Capture d’écran 2025-01-24 à 17 59 54"
src="https://github.com/user-attachments/assets/7f37402f-3d1a-4bea-9082-05f50a711f35"
/>
<img width="503" alt="Capture d’écran 2025-01-24 à 18 00 08"
src="https://github.com/user-attachments/assets/fffabaff-9d5d-4584-9297-e21434333de0"
/>
2025-01-24 17:25:01 +00:00
Thomas Trompette 5da744ebc5 Continue workflow folders re-ordering (#9315)
- put actions in steps
- move hooks
- move states
2025-01-02 12:23:07 +00:00
Thomas Trompette 9e74ffae52 Refacto workflow folders (#9302)
- Create separated folders for sections
- Add components
- Add utils and clean old ones
- Add constants
- Rename search variables folder and components

Next steps:
- clean hooks
- clean states
2024-12-31 16:08:14 +00:00