Commit Graph

511 Commits

Author SHA1 Message Date
Raphaël Bosi ef8cd0ed19 Add middleware boundary padding as a prop in dropdown (#15011)
Add middleware boundary padding as a prop in dropdown + fix bottom end
placement in graph editor
2025-10-09 14:18:22 +00:00
neo773 62a1de221b Message Folders Redesign and Import Policy (#14714) 2025-10-01 14:48:46 +02:00
nitin 4b87908752 [Dashboards]- Addition of tabs (#14756) 2025-09-30 11:23:52 +02:00
Arik Chakma 9a2766feae feat: rich text email body (#14482)
Co-authored-by: Raphaël Bosi <71827178+bosiraphael@users.noreply.github.com>
Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
Co-authored-by: Félix Malfait <felix@twenty.com>
2025-09-21 16:55:34 +02:00
Lucas Bordeau aff3a300fe Refactored table width and height constants (#14613)
This PR essentially refactors some hard-coded values for width and
height in the table.

It also fixes a few differences from the Figma design, on the checkbox
column width and the top bar and view bar left alignment with the table.

The blue color has been set like before the refactor of the focus portal
(`theme.adaptiveColors.blue4`)

Fixes in https://github.com/twentyhq/core-team-issues/issues/1490 : 
- Fix first drag and drop column width that has changed from main (see
Figma)
- Unify all widths, heights, z-index, etc. with constants
- Put same blue as before for focused portal

Also removed `focus-active` class because we now use a portal for the
focus.
2025-09-19 17:19:26 +02:00
Raphaël Bosi 3b868c3d2a Page layout refactoring (#14535)
In this PR:
- Refactored the page layout renderer
- Converted all the states to component states
- Removed the page layout edition in settings

TODOs in next PRs:
- Fix bug with the drag selector not taking the scroll into account to
display the dragged area
- Readd the tab edition in edit mode
2025-09-16 15:42:51 +00:00
Félix Malfait f7cde28dd6 🔧 Restore PRs #14348 and #14352 that were reverted by PR #14347 (#14359)
## Problem

**CRITICAL:** Two PRs were accidentally reverted when PR #14347 "Prevent
csv export injections" was merged:

1. **PR #14348** "[Page Layout] - Review Refactor" -  **RESTORED**
2. **PR #14352** "Fix wrong path used by backend" -  **RESTORED**

## Root Cause Analysis

During the merge of PR #14347, there was a complex merge conflict with
PR #14352 "Fix wrong path used by backend". The merge commit
`324d7204bb` in the PR #14347 branch brought in changes from PR #14352,
but during the conflict resolution, **BOTH PR #14348 and PR #14352's
changes were accidentally overwritten**.

## What This PR Restores

This PR restores **BOTH** PRs by cherry-picking their commits:

###  PR #14348 Changes Restored:
- `GraphWidgetRenderer.tsx` - was deleted, now restored
- `WidgetRenderer.tsx` - was missing, now restored  
- `SettingsPageLayoutTabsInstanceId.ts` - was deleted, now restored
- `useUpdatePageLayoutWidget.ts` - was renamed back, now restored with
correct name
- Multiple test files that were deleted
- Several hook files that were renamed/reverted
- File renames: `usePageLayoutWidgetUpdate.ts` →
`useUpdatePageLayoutWidget.ts`
- Hook refactoring and test file organization
- Page layout component improvements

###  PR #14352 Changes Restored:
- **Types moved to twenty-shared:**
  - `packages/twenty-shared/src/types/AppBasePath.ts`  RESTORED
  - `packages/twenty-shared/src/types/AppPath.ts`  RESTORED
  - `packages/twenty-shared/src/types/SettingsPath.ts`  RESTORED
- **Navigation utilities moved to twenty-shared:**
- `packages/twenty-shared/src/utils/navigation/getAppPath.ts`  RESTORED
- `packages/twenty-shared/src/utils/navigation/getSettingsPath.ts` 
RESTORED
- **200+ import statements updated** across the codebase to use
twenty-shared
- **Old type files deleted** from twenty-front/src/modules/types/

## Evidence of Complete Restoration

**Before (reverted state):**
-  Types were in `packages/twenty-front/src/modules/types/`
-  Page layout files missing
-  Hook files incorrectly named

**After (this PR):**
-  Types correctly in `packages/twenty-shared/src/types/`
-  All page layout files restored
-  Hook files correctly named
-  All import statements updated

## Verification

**Total changes:**
- PR #14348: 36 files changed, 863 insertions(+), 442 deletions(-)
- PR #14352: 243 files changed, 492 insertions(+), 461 deletions(-)
- **Combined: 279 files changed, 1355 insertions(+), 903 deletions(-)**

## Impact

This completely restores both PRs that were accidentally lost, ensuring:
1. Page layout refactoring work is back
2. Type organization and path utilities are correctly in twenty-shared
3. Backend email paths work correctly again
4. No functionality is lost

Fixes the reversion caused by the merge conflict in PR #14347.

---------

Co-authored-by: nitin <142569587+ehconitin@users.noreply.github.com>
2025-09-08 21:48:13 +02:00
Félix Malfait cebcf4f1f5 Prevent csv export injections (#14347)
**Small Security Issue:** CSV exports were vulnerable to formula
injection attacks when users entered values starting with =, +, -, or @.
(only happens if a logged-in user injects corrupted data)

Solution:
- Added ZWJ (Zero-Width Joiner) protection that prefixes dangerous
values with invisible Unicode character
- This is the best way to preserve original data while preventing Excel
from executing formulas
- Added import cleanup to restore original values when re-importing
 
Changes:
- New sanitizeValueForCSVExport() function for security
- Updated all CSV export paths to use both security + formatting
functions
- Added comprehensive tests covering attack vectors and international
characters
- Also added cursor rules for better code consistency

---------

Co-authored-by: Charles Bochet <charlesBochet@users.noreply.github.com>
2025-09-08 17:57:46 +02:00
Félix Malfait 502bd07db9 Fix wrong path used by backend (#14352)
After moving a section on the frontend, this broke the path that was
sent by email on the backend.
This kind of error comes back every ~2-3 month under different forms so
we need a more robust solution: I moved routes to the shared folder,
that way we will share one common source of truth between the frontend
and the backend.

Fixes #14343
2025-09-08 16:07:13 +02:00
nitin 894db2645a [Page Layout] - Review Refactor (#14348)
addressing the review on
https://github.com/twentyhq/twenty/pull/14318#pullrequestreview-3191930203
2025-09-08 12:20:43 +00:00
nitin ab9b5ca4c5 [Page Layouts] - Add tabs (#14318) 2025-09-06 11:27:37 +02:00
Félix Malfait d5f88e566c Get ready for 1000+ members (#14313)
The goal of this PR is to test if Twenty can support a large number of
members, a question which was raised by a large company that is
considering moving away from Salesforce.

I was expecting the currentWorkspaceMembersState to cause a lot more
issue. It would be very hard to get rid of it in the context of actors,
I think that would require a big refactoring. I thought we'd have to do
it but it turns out the perf are pretty good. One thing we need to
improve is the pagination on the roles page, we'll wait for @Bonapara to
update that
2025-09-05 12:37:22 +02:00
Balaji Krishnamurthy 7a999c8476 Format date displayed in Releases section (#14183)
Closes #14177 

I noticed a `formatDisplayDate` file being used in `twenty-website` and
created the same one for `twenty-front` as well. Unit tests for the same
have been added.

<img width="1438" height="770" alt="image"
src="https://github.com/user-attachments/assets/5aa6eef5-19c5-4108-bf3f-c582d0ca1b59"
/>
<img width="1275" height="785" alt="image"
src="https://github.com/user-attachments/assets/20a87ba6-fca4-472c-a691-362901505303"
/>

---------

Co-authored-by: Félix Malfait <felix@twenty.com>
2025-09-04 17:27:31 +02:00
nitin 1b2f079359 Page Layout - Addition of widgets (#14184)
https://github.com/user-attachments/assets/130f12d7-5cef-4b83-912f-a9d42241f69f

~~This could be considered a POC 😅~~

addressing - 
https://github.com/twentyhq/core-team-issues/issues/1400
https://github.com/twentyhq/core-team-issues/issues/1403
2025-09-02 10:20:28 +00:00
nitin 74eeb98293 Page Layout Initialization on Settings (#14156) 2025-08-29 20:50:23 +02:00
ahmedobaid23 76115309fa fix: scroll to selected element without animation when dropdown opens (#13969)
Fixes #13957 

### Changes made

- updated `scrollIntoView` options to `behavior: auto` and `block:
start` in the `SelectableListItem.tsx` component.

### New behaviour


https://github.com/user-attachments/assets/7e71e132-f6e3-4451-8ee0-fa59ae9edd67
2025-08-19 10:21:52 +02:00
Lucas Bordeau 3f0ee0139c Refactor record-field into ui sub-folder (#13888)
This PR prepares the refactor of record field definition and column
definition.

We need to separate the two concepts of FieldInput and FieldContext at
the cell level, and the new RecordField concept that will replace
FieldDefinition at the metadata and state level.

So we create a new ui sub-folder in the already existing record-field
folder, in order to separate those two concepts that are still very
close.
2025-08-13 11:31:39 +02:00
Charles Bochet b14063fe06 Re-add prettier (#13812)
Re add prettier in eslint.configs
2025-08-11 14:10:04 +02:00
Félix Malfait d29dbd473b Upgrade SWC Core and Storybook to v8 (#13799)
This is is a blocker for various sub-migrations
2025-08-11 12:02:33 +02:00
Félix Malfait 464a480043 Continue ESLINT9 Migration (#13795)
Might already fix #13793
2025-08-10 23:25:58 +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
Lucas Bordeau 04ed843aaf Field permission CRUD front-end implementation (#13524)
This PR implements what's needed to edit field permissions on a role.

Field permissions that aren't useful are kept in the database to avoid
the overhead of adding cleaning logics both in front end and back end.
They just won't be taken into account if object permission doesn't allow
it.

In this PR we also handle the case were there's no object permission
override but where there are only field permission overrides, which can
happen if an object inherits from a "all object can read" but restricts
read only on some fields.

<img width="547" height="642" alt="image"
src="https://github.com/user-attachments/assets/77d81f89-4af9-42b6-97f3-fae3a6ba1eeb"
/>


<img width="590" height="912" alt="image"
src="https://github.com/user-attachments/assets/69fab8ee-7252-401a-bc6f-8a8b7c7f6bc4"
/>

Fixes https://github.com/twentyhq/core-team-issues/issues/1152

This PR lowers unit test coverage because the essential unit tests for
this PR have been written and writing more tests would not be a great
tradeoff for this feature which has already taken a lot of efforts.
2025-08-05 11:50:23 +02:00
Lucas Bordeau d61eb1a951 Remove all legacy state management (#13476)
This PR removes every legacy state management logic left in the code
base, we only keep our last component state management logic.

Removed : 
- Scoped states logic
- Dropdown scope logic
- Scope id naming
- Component state v1
- Component state v2_alpha


# QA

| Component | Comments |
| --- | --- |
| AttachementDropdown | Ok |
| ObjectTasks | Ok |
| ActivityRichTextEditor | Ok |
| App | Ok dialogs work |
| AppRouterProviders | Ok dialogs work |
| RecordBoardScrollToFocusedCardEffect | Ok |
| RecordBoard | Ok |
| RecordBoardCard | OK |
| useSelectAllCards | Ok |
| RecordInlineCell | Ok |
| useInlineCell | Ok |
| RecordDetailRelationRecordsListItem | Ok |
| RecordDetailRelationSectionDropdownToMany | Ok |
| RecordDetailRelationSectionDropdownToOne | Ok |
| useHandleContainerMouseEnter | Ok |
| useResetTableRowSelection | Ok |
| useSelectAllRows | Ok |
| useSetRecordTableData | Ok |
| useRecordTable | Ok |
| useRecordTableMoveFocusedCell | Ok |
| useRecordTableMoveFocusedRow | Ok |
| useMoveHoverToCurrentCell | OK |
| useTriggerActionMenuDropdown | Ok |
| RecordTableBodyDragDropContextProvider | Ok |
| RecordTableHeaderCell | Ok |
| useSetCurrentRowSelected | Ok |
| useRecordTitleCell | Ok |
| SettingsObjectFieldActiveActionDropdown | Ok |
| SettingsObjectFieldInactiveActionDropdown | Ok |
| SettingsObjectFieldItemTableRow | Ok |
| SettingsObjectInactiveMenuDropDown | Ok |
| SettingsRoleEditEffect | Ok |
| SettingsRolesQueryEffect | Ok |
| Dropdown | Ok |
| useSelectableList | Ok |
| useSelectableListHotKeys | Ok |
| useSelectableListListenToEnterHotkeyOnItem | Ok |
| useNavigationSection | Ok |
| useCreateViewFromCurrentState | Ok |
| useDeleteViewFromCurrentState | Ok |
| useUpdateViewFromCurrentState | Ok |
| ViewPickerFavoriteFoldersDropdown | Ok |
| useCreateViewFromCurrentView | Ok |
| ViewBarDetails | Ok |
| WorkflowRunVisualizer | Ok |
| useHandleWorkflowRunDiagramCanvasInit | Ok |
| WorkflowDiagramCanvasBase | Ok |
| WorkflowRunVisualizerEffect | Ok |
| useRemoveStepFilter | Ok |
| useRemoveStepFilterGroup | Ok |
| useUpsertStepFilterSettings | Ok |
| WorkflowFindRecordsFilters | Ok |
| SettingsObjects | Ok |
2025-07-29 09:52:24 +00:00
Naifer 4eba13e9fb feat: add Google Place Autocomplete for address fields (#13450)
resolve #13253
This PR enables the use of Google Place Autocomplete and Place Details
APIs in the backend. It allows users to automatically fill in address
fields by typing into the address1 input. The input is debounced, then
the Autocomplete API is called. Once the user selects an address, the
Place Details API is used to parse and fill in the individual address
fields.


https://github.com/user-attachments/assets/e04b8474-25b8-48f5-83d0-2074f8d5fc94

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
Co-authored-by: Félix Malfait <felix@twenty.com>
2025-07-29 09:56:08 +02:00
Lucas Bordeau e53e09dfd3 Improved dropdown menu headers for filter and sorts (#13177)
This PR improves dropdown menu headers for filter and sort dropdown in
view bar and editable filter chips.

It adds what's necessary to navigate back or close the dropdown, so that
we don't rely solely on click outside to exit the dropdown.

This PR also refactors the components so that we clearly identify the
two code paths that can use filter dropdowns : view bar and filter chip,
everything that can be DRY stays in the object-filter-dropdown module
but we try to have our wrapping components in each distinct module
instead of blending everything with ternaries inside
object-filter-dropdown module.

The vector search input value wasn't correctly handled across the
different dropdowns, due to a wrong component instance management, since
the dropdown menu header improvement put this into light, I also
refactored the state management of the vector search input.

@Bonapara please check the QA video and tell me if it's ok, I didn't add
dropdown menu header on the advanced filter field list dropdown because
it's a select more than a standalone dropdown, what do you think ?

QA : 


https://github.com/user-attachments/assets/17080f32-f302-436c-937b-3577715b7e84


QA Vector search fix : 



https://github.com/user-attachments/assets/6367bbf6-8a98-4b53-86cf-6ba92be130eb

Fixes https://github.com/twentyhq/core-team-issues/issues/640
Fixes https://github.com/twentyhq/core-team-issues/issues/1206
2025-07-11 14:47:52 +00:00
Lucas Bordeau fd13bb0258 Fixes for production (#13164)
This PR fixes two bugs : 
- Some important push item to focus stack calls were setting global
hotkey conflicting keys to true (like open dropdown)
- Icon picker matrix items were broken
2025-07-10 15:47:09 +00:00
Jean-Baptiste Ronssin e6cdae5c27 feat: add auto-scroll to selected menu items in CustomSlashMenu (#13048)
to resolve the issue #13047 

It's my first contribution, I hope it's good enough!

When using the slash command (/) in the notes editor, a menu of commands
appears. When navigating this menu with the up and down arrow keys, the
selection changes, but the menu itself does not scroll. This means that
as the list of commands is long, items outside the visible area cannot
be seen when selected.


The issue was located in the [CustomSlashMenu.tsx] component. The menu
container didn't have vertical scrolling enabled, and there was no logic
to scroll the active item into the visible area.

The fix involved:

Adding overflow-y: auto to the menu's styled container in
[CustomSlashMenu.tsx].
Modifying the [DropdownMenuItemsContainer] component to accept and
forward a ref using React.forwardRef.
Implementing a useEffect hook in [CustomSlashMenu.tsx] that triggers on
selection change. This hook uses a ref to the items container to call
scrollIntoView({ block: 'nearest' }) on the currently selected menu
item.

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
2025-07-09 17:01:07 +00:00
Raphaël Bosi eba997be98 Replace hotkey scopes by focus stack (Part 6 - Remove Hotkey scopes 🫳🎤) (#13127)
# Replace hotkey scopes by focus stack (Part 6 - Remove Hotkey scopes)

This PR is the last part of a refactoring aiming to deprecate the hotkey
scopes api in favor of the new focus stack api which is more robust.
Part 1: https://github.com/twentyhq/twenty/pull/12673
Part 2: https://github.com/twentyhq/twenty/pull/12798
Part 3: https://github.com/twentyhq/twenty/pull/12910
Part 4: https://github.com/twentyhq/twenty/pull/12933
Part 5: https://github.com/twentyhq/twenty/pull/13106

In this part, we completely remove the hotkey scopes.
2025-07-09 17:21:14 +02:00
Félix Malfait 6ba6860e1c Frontend tests improvements (#13115)
Fix warnings and lower coverage by 0.1%
2025-07-09 09:23:26 +02:00
Lucas Bordeau 66b633e08e Removed useDropdown and its legacy states (#13111)
This PR removes useDropdown barrel hook and refactors the legacy
useDropdown states to the last version of our recoil component state
management.

---------

Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>
2025-07-08 20:16:15 +02:00
Raphaël Bosi c6e5bab4e9 Replace hotkey scopes by focus stack (Part 4 - Inputs) (#12933)
# Replace hotkey scopes by focus stack (Part 4 - Inputs)

This PR is the 4th part of a refactoring aiming to deprecate the hotkey
scopes api in favor of the new focus stack api which is more robust.
Part 1: https://github.com/twentyhq/twenty/pull/12673
Part 2: https://github.com/twentyhq/twenty/pull/12798
Part 3: https://github.com/twentyhq/twenty/pull/12910

In this part, I refactored all inputs in the app so that each input has
a unique id which can be used to track the focused element.
2025-07-07 15:42:12 +02:00
Jeremy Dawes 1386f344dd fix: align workspace switcher button in collapsed navigation drawer (#12893) (#12902)
## Summary
- Fixes #12893 - Workspace switcher button now aligns properly with
record index headers when navigation drawer is collapsed
- Maintains consistent button height in both expanded and collapsed
states
- Simple CSS fix that improves visual consistency

## Fix Details
The issue was caused by the workspace switcher button changing height
from 20px (expanded) to 16px (collapsed). This created misalignment with
the page headers.

Changed in `MultiWorkspacesDropdownStyles.tsx`:
```tsx
// Before - height changed based on drawer state
height: ${({ theme, isNavigationDrawerExpanded }) =>
  isNavigationDrawerExpanded ? theme.spacing(5) : theme.spacing(4)};

// After - consistent height
height: ${({ theme }) => theme.spacing(5)};
```

## Visual Alignment
- Workspace switcher button: 20px height (theme.spacing(5))
- Maintains alignment with record index headers in collapsed state
- Consistent with Figma design requirements

## Test Plan
- [x] Collapsed navigation drawer - workspace switcher aligns with
headers
- [x] Expanded navigation drawer - no visual regression
- [x] Button functionality remains unchanged

---

🤖 This fix was implemented using [Claude Code](https://claude.ai/code)
by Jez (Jeremy Dawes) and Claude working together\!

Thanks to the Twenty team for the great project\! 🚀

---------

Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: ehconitin <nitinkoche03@gmail.com>
Co-authored-by: nitin <142569587+ehconitin@users.noreply.github.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
2025-07-04 23:06:02 +02:00
Lucas Bordeau a7b9a0710e Replaced useDropdown calls by useCloseDropdown, useOpenDropdown and useToggleDropdown (#12958)
This PR replaces the many calls of useDropdown by the new standalone
hooks : useCloseDropdown, useOpenDropdown and useToggleDropdown.

This will allow to remove useDropdown and then the dropdown recoil
component state v1.

A big round of QA has been made, with some bugs caught along the way.

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

## QA

Component|Status|Comment
|---|---|---|
CurrentWorkspaceMemberFavorites|Ok|
FavoriteFolderPickerFooter|Ok|
AdvancedFilterAddFilterRuleSelect|Ok|
AdvancedFilterRecordFilterGroupOptionsDropdown|Ok|
AdvancedFilterRecordFilterOperandSelectContent|Ok|
AdvancedFilterRecordFilterOptionsDropdown|Ok|
useAdvancedFilterFieldSelectDropdown|Ok|
ObjectFilterDropdownBooleanSelect|Ok|
ObjectFilterDropdownOptionSelect|Ok|
ObjectOptionsDropdown|Ok|
ObjectOptionsDropdownLayoutContent|Ok|
ObjectSortDropdownButton|Ok|
useCloseSortDropdown|Ok|
FormDateTimeFieldInput|Ok|Bug detected, cannot select a month or a year,
see issue https://github.com/twentyhq/twenty/issues/12922
FormSingleRecordPicker|Ok|
MultiItemFieldMenuItem|Ok|
RecordDetailRelationRecordsListItem|Ok|
RecordDetailRelationSection|Ok|
RecordDetailRelationSectionDropdownToMany|Ok|
RecordDetailRelationSectionDropdownToOne|Ok|
RecordTableColumnAggregateFooterDropdownSubmenuContent|Ok|
RecordTableColumnAggregateFooterAggregateOperationMenuItems|Ok|
RecordTableColumnAggregateFooterMenuContent|Ok|
RecordTableColumnAggregateFooterValueCell|Ok|
RecordTableColumnHeadDropdownMenu|Ok|
RecordTableHeaderPlusButtonContent|Ok|
useTriggerActionMenuDropdown|Ok|
MultipleSelectDropdown|Ok|
RecordBoardColumnHeaderAggregateDropdownButton|Ok|
SettingsDataModelFieldSelectFormOptionRow|Ok|
SettingsDataModelNewFieldBreadcrumbDropDown|Ok|
SettingsObjectFieldActiveActionDropdown|Ok|
SettingsObjectFieldInactiveActionDropdown|Ok|
SettingsObjectInactiveMenuDropDown|Ok|
SettingsSecurityApprovedAccessDomainRowDropdownMenu|Couldn’t test|
SettingsSecuritySSORowDropdownMenu|Couldn’t test|
SettingsAccountsRowDropdownMenu|Ok|
SettingsRoleAssignment|Ok|
SettingsServerlessFunctionTabEnvironmentVariableTableRow|Couldn’t test|
MatchColumnToFieldSelect|Ok|
SubMatchingSelectDropdownButton|Ok|Removed conflicting duplicate open
dropdown
SubMatchingSelectRowRightDropdown|Ok|
CurrencyPickerDropdownButton|Ok|
IconPicker|Ok|
DateTimePicker|Ok|
PhoneCountryPickerDropdownButton|OK|
Select|Ok|
Dropdown|Ok|Not QAing all dropdowns in the app because the ones of this
QA are enough to show up that Dropdown is behaving correctly on a lot of
use cases
DropdownMenuInnerSelect|Ok|
TabList|Ok|Removed onClickOutside called in dropdown clickable
component, validated with Raph who recently worked on this
DateInput|Ok|
MultiWorkspaceDropdownDefaultComponents|Ok|
AdvancedFilterChip|Ok|
EditableFilterDropdownButton|Ok|
UpdateViewButtonGroup|Ok|
ViewBarDetailsAddFilterButton|Ok|
ViewBarFilterButton|Ok|
ViewBarFilterDropdown|Ok|
ViewBarFilterDropdownAdvancedFilterButton|Ok|
ViewPickerDropdown|Ok|
ViewPickerListContent|Ok|
ViewPickerOptionDropdown|Ok|
WorkflowEditTriggerDatabaseEventForm|Ok|
WorkflowVariablesDropdownWorkflowStepItems|Ok|
AttachmentDropdown|Ok|
SupportDropdown|Ok|

Co-authored-by: Charles Bochet <charlesBochet@users.noreply.github.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
2025-07-02 18:38:45 +02:00
Jeremy Lim 07f75180ae [#12744] UI Fix: Filter Section Separator Needs to Be Darker (#12945)
[#12744] UI Fix: Change text color in Filter Section Separator from
light to tertiary.

Before
<img width="316" alt="Screenshot 2025-06-29 at 6 10 50 PM"
src="https://github.com/user-attachments/assets/09c21571-24a2-4459-bf0f-4d7e7b4dcf04"
/>


After
<img width="322" alt="Screenshot 2025-06-29 at 6 11 15 PM"
src="https://github.com/user-attachments/assets/a4c486c9-34ae-4f10-83cb-918b15582dec"
/>
2025-07-02 17:50:10 +02:00
Lucas Bordeau 658cd46336 Refactor useDropdown states to component state V2 (#12911)
This PR is a follow-up of the first refactor of dropdown hooks :
https://github.com/twentyhq/twenty/pull/12875

In this PR we continue by focusing on the replacement of those two
states that are still using the v1 of component states :

- isDropdownOpenComponentState
- dropdownPlacementComponentState

When then remove those two old states and now only use the new component
state v2.

## QA


Component | Status | Comments
-- | -- | --
RecordDetailRelationSectionDropdownToMany | Ok |  
RecordDetailRelationSectionDropdownToOne | Ok |  
WorkflowVariablesDropdown | Ok |  
DropdownInternalContainer | Ok | Tested on tables and boards fields
2025-06-26 16:11:24 +02:00
Lucas Bordeau 22b4595b0b Refactor useDropdownV2 (#12875)
# What this PR does

This PR introduces what’s needed to progressively refactor the
useDropdown hooks we have.

It removes useDropdownV2 and renames useDropdown used for multi-page
dropdowns to useDropdownContextStateManagement

## The 3 useDropdown hooks

There are currently 3 useDropdown hooks : 

One is used for managing states in some dropdowns that have multiple
inner pages with contexts and without recoil. It is limited and would
need a separate refactoring, thus I just renamed it.

Then we have useDropdown and useDropdownV2, which followed our multiple
versions of recoil state management wrappers.

Now that the state management has been stabilized, we can merge
everything on the last version.

## What this refactor will allow next

This refactor will allow to refactor the legacy recoil state management,
because useDropdown is depending on legacy recoil states with scopeId.

Because there are only a dozen of those legacy states left, and the
dropdown’s ones are the harder to refactor, because swapping them as-is
causes a big QA, and if we have a big QA to do on all dropdowns, better
refactor the whole dropdown management and have everything clean.

After this refactor, we will be able to delete the legacy dropdown
states, and proceed with the other legacy states, then removing all the
legacy recoil state mangament.

## How do we allow progressive refactoring ?

There are many places where useDropdown is used.

To have an easier refactoring process, we want to merge multiple small
pull requests so that it is easier to QA and review.

For this we will maintain both legacy component state and component
state V2 in parallel for isDropdownOpen, so that the new hooks
`useOpenDropdown` , `useCloseDropdown` are doing the same thing than
`useDropdown` and `useDropdownV2` .

Thus for the moment, whether we use the legacy hooks or the new ones,
the effects are the same.

And we can have dropdowns operating on the old states and the new states
living side by side in the app.

## QA

Component | Status | Comments
-- | -- | --
CommandMenuActionMenuDropdown | Ok |  
RecordIndexActionMenuDropdown | Ok |  
RecordShowRightDrawerOpenRecordButton | Ok |  
useCloseActionMenu | Ok |  
CommandMenuContextChipGroups | Ok |  
useCommandMenuCloseAnimationCompleteCleanup | Ok |  
ObjectOptionsDropdown | Ok |  
ObjectOptionsDropdownContent | Ok |  
ObjectOptionsDropdownFieldsContent | Ok |  
ObjectOptionsDropdownHiddenFieldsContent | Ok |  
ObjectOptionsDropdownHiddenRecordGroupsContent | Ok |  
ObjectOptionsDropdownLayoutContent | Ok |  
ObjectOptionsDropdownLayoutOpenInContent | Ok |  
ObjectOptionsDropdownMenuContent | Ok |  
ObjectOptionsDropdownRecordGroupFieldsContent | Ok |  
ObjectOptionsDropdownRecordGroupsContent | Ok |  
ObjectOptionsDropdownRecordGroupSortContent | Ok |  
RecordBoardColumnHeaderAggregateDropdown | Ok |  
AggregateDropdownContent | Ok |  
RecordBoardColumnHeaderAggregateDropdownFieldsContent | Ok |  
RecordBoardColumnHeaderAggregateDropdownMenuContent | Ok |  
RecordBoardColumnHeaderAggregateDropdownMenuContent | Ok |  
RecordBoardColumnHeaderAggregateDropdownOptionsContent | Ok |  
RecordBoard | Ok | Used closeAnyOpenDropdown instead for a better UX
RecordBoardCard | Ok |  
useRecordBoardSelection | Ok |  
RecordTableColumnAggregateFooterDropdownContent | Ok |  
RecordTableColumnFooterWithDropdown | Ok |  
useOpenRecordFilterChipFromTableHeader | Ok |  
useCloseAnyOpenDropdown | Ok |  
useCloseDropdownFromOutside | Removed | Removed because unused
useDropdownV2 | Removed | Removed because all calls have been removed
useOpenDropdownFromOutside | Removed | Removed because unused
useCloseAndResetViewPicker | Ok |  
WorkflowVariablesDropdown | Ok |
2025-06-25 17:16:56 +02:00
Raphaël Bosi 1ab51d41aa Replace hotkey scopes by focus stack (Part 2 - Record Table, Rows and Cells) (#12798)
# Replace hotkey scopes by focus stack (Part 2 - Record Table, Rows and
Cells)

This PR is the second part of a refactoring aiming to deprecate the
hotkey scopes api in favor of the new focus stack api which is more
robust.
Part 1: https://github.com/twentyhq/twenty/pull/12673

The record table shortcuts are no longer centralized in the record
table, they now split and the focused element is in charge of applying
the desired shortcuts. (For instance: The rows are in charge of the row
navigation and the cells of the cells navigation).

## Video QA:


https://github.com/user-attachments/assets/f0bb9eed-8a2a-4b6d-a82f-1998e929f122


## Bugfixes:

### Fix record table click outside not working after opening and closing
a cell

Introduced by https://github.com/twentyhq/twenty/pull/11644

#### Before


https://github.com/user-attachments/assets/d28deda8-15e9-4ffe-b60a-e8b54625f8e5


#### After


https://github.com/user-attachments/assets/3f7e1ffc-15d9-4336-aeb0-bebd8ae0cbe0


### Fix ObjectFilterDropdownFilterInput hotkeys

Introduced by https://github.com/twentyhq/twenty/pull/12673

#### Before


https://github.com/user-attachments/assets/ab2039bd-ebe1-49ba-8377-a6b300664469


#### After


https://github.com/user-attachments/assets/90597453-dab2-426b-a134-0a24b0de0a6b
2025-06-25 13:18:51 +00:00
Lucas Bordeau 3cee2b796f Fixed record picker loading flickering (#12736)
This PR solves a flickering effect on record pickers on the different
loading state they can be in.

It was designed with @Bonapara to settle on a nice UX feeling.

## Before

With fast network (local) :


https://github.com/user-attachments/assets/58899934-c705-4b44-b7f6-289045032c11

With slow network : 


https://github.com/user-attachments/assets/9fb18d86-9da6-4e5d-a83f-00c810fab2dc

## After


https://github.com/user-attachments/assets/f4abb40f-5d42-4c46-88ab-aaef4f883f7f

Fixes https://github.com/twentyhq/twenty/issues/12680

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
2025-06-24 12:15:50 +02:00
Etienne 19fe508ec3 fix confirm close dialog + add restart confirm dialog (#12761)
Test: 
- On upload > No dialog at modal closing
- On match > Confirm cancel dialog at closing (escape, click outside,
cancel cross)
- On match > Restart dialog at Restart Import
- On validation > Confirm cancel dialog at closing (escape, click
outside, cancel cross)
- On import > Confirm cancel dialog at closing (escape, click outside,
cancel cross)
- On import > No confirm at import end

closes : https://github.com/twentyhq/core-team-issues/issues/1071
2025-06-20 15:20:17 +02:00
Raphaël Bosi cbc0d06a2f Replace hotkey scopes by focus stack (Part 1 - Dropdowns and Side Panel) (#12673)
This PR is the first part of a refactoring aiming to deprecate the
hotkey scopes api in favor of the new focus stack api which is more
robust.

The refactored components in this PR are the dropdowns and the side
panel/command menu.

- Replaced `useScopedHotkeys` by `useHotkeysOnFocusedElement` for all
dropdown components, selectable lists and the command menu
- Introduced `focusId` for all dropdowns and created a common hotkey
scope `DropdownHotkeyScope` for backward compatibility
- Replaced `setHotkeyScopeAndMemorizePreviousScope` occurrences with
`usePushFocusItemToFocusStack` and `goBackToPreviousHotkeyScope` with
`removeFocusItemFromFocusStack`

Note: Test that the shorcuts and arrow key navigation still work
properly when interacting with dropdowns and the command menu.

Bugs that I have spotted during the QA but which are already present on
main:
- Icon picker select with arrow keys doesn’t work inside dropdowns
- Some dropdowns are not selectable with arrow keys (no selectable list)
- Dropdowns in dropdowns don’t reset the hotkey scope correctly when
closing
- The table click outside is not triggered after closing a table cell
and clicking outside of the table
2025-06-19 14:53:18 +02:00
nitin a8fb039e65 poc - cal.com integration in onboarding flow (#12530) 2025-06-19 15:27:38 +05:30
Marie da5ae34109 [permissions] Filter tabs + registered actions according to permissions (#12657)
Note and task tabs in side panel should only show if user has reading
permission on them.

"Go to companies", "Go to workflows", etc. in command menu should only
show is user has reading permission on related objects.

<img width="507" alt="Capture d’écran 2025-06-17 à 11 09 50"
src="https://github.com/user-attachments/assets/3a2a4c25-0b9b-4ee6-b18f-b019b8a56d47"
/>
<img width="505" alt="Capture d’écran 2025-06-17 à 11 09 56"
src="https://github.com/user-attachments/assets/8a219955-cc8e-4dbf-a4f9-a50e1aaa4b59"
/>

**How to test** 
Assign a user with a custom role that has **no** read permissions on
notes/tasks/workflows/companies/opportunities/people (no need to test
them all but at least one between note and tasks; workflows; one between
companies/opportunities/people). Check that you don't see the related
tab / action.

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
2025-06-18 15:12:58 +00:00
Lucas Bordeau e922843afb Created DropdownMenuInnerSelect and implemented it for filter dropdowns (#12626)
This PR introduces a new generic UI component DropdownMenuInnerSelect,
that improves the UI by allowing to have both a dropdown menu header and
a select in the header.

In this PR we implement it just for filter dropdown components.

Fixes https://github.com/twentyhq/core-team-issues/issues/1001
2025-06-16 16:16:32 +02:00
Lucas Bordeau 5fed618528 Fixed overflow scroll bar in dropdowns (#12587)
Following-up PR https://github.com/twentyhq/twenty/pull/12547 which
introduced a last minute fix that broke the overflow UI.

Before : 

<img width="261" alt="image"
src="https://github.com/user-attachments/assets/e4345d7f-1f4e-4cca-9056-33b5f897ad8c"
/>

After : 

<img width="276" alt="image"
src="https://github.com/user-attachments/assets/ca31b50d-5656-43ca-9819-8d065ec5c005"
/>
2025-06-13 11:52:20 +02:00
nitin a5c0922399 Improve email validation modal design (#12490)
closes https://github.com/twentyhq/core-team-issues/issues/1020
2025-06-12 19:05:36 +02:00
martmull 3ba701812b Add display flex on pagePanel (#12568)
## Before


https://github.com/user-attachments/assets/06a4d6e9-7674-4748-937a-ee3bbe5ccc5a

## After


https://github.com/user-attachments/assets/6c2a903b-7720-4fcd-acb9-f106cb05f37b


https://github.com/user-attachments/assets/87b1f7dc-457f-48c6-8622-cb49c2ad3c28
2025-06-12 16:48:01 +02:00
Lucas Bordeau 333d7081ef Refactored and simplified DropdownMenuItemsContainer height management (#12547)
This PR refactors the `DropdownMenuItemsContainer` component and
simplifies its inner parts, which have been modified over months for
different needs without taking the time to have a global approach.

It should however be noted that due to the recent refactor of the
`DropdownContent`, it is now much easier to refactor
`DropdownMenuItemsContainer`, mainly because of the width management
being nicely handled by `DropdownContent` now.

Fixes https://github.com/twentyhq/twenty/issues/11766

# Changes

The `width` props of `DropdownMenuItemsContainer` and its usage in
calling components have been removed.

The multiple ternaries inside `DropdownMenuItemsContainer` have been
reduced to one ternary on `scrollable` props.

The `ScrollWrapper` usage has been removed from
`DropdownMenuItemsContainer`, because the only thing we need is to have
a simple `overflow-y: scroll;` CSS property.

Why ? Because it was previously relevant to have a `ScrollWrapper`, when
we were using an external library, but now that `ScrollWrapper` is a
simple `div` with overflowing, which only benefit is to expose a hook to
imperatively toggle this overflowing behavior from outside (mainly
useful for table fixed row and column), and that we don’t need this for
`DropdownMenuItemsContainer`, then it follows that we just need a simple
overflowing `div` container, which simplifies everything and boils down
our `DropdownMenuItemsContainer` to a straightforward and standard CSS
stack.

We remove the temporary `scrollWrapperHeightAuto` props that was used to
fix a bug in a previous PR, we also rollback `ScrollWrapper` to its
previous state with `width: 100%` and `height: 100%` and removed
`heightAuto` props.

The `hasMaxHeight` props is kept, but the `168` pixels value is
extracted in a constant.

# QA


Component | Comment
-- | --
CommandMenuActionDropdown | Reported bug
https://github.com/twentyhq/twenty/issues/12541
RecordIndexActionMenuDropdown |  
AttachmentDropdown | Cannot test because cannot add a file (currently
broken, maybe because of permissions ?)
CommandMenuContextChipGroups |  
FavoriteFolderNavigationDrawerItemDropdown |  
FavoriteFolderPicker |  
FavoriteFolderPickerFooter |  
AdvancedFilterAddFilterRuleSelect |  
AdvancedFilterFieldSelectMenu |  
AdvancedFilterRecordFilterGroupOptionsDropdown |  
AdvancedFilterRecordFilterOperandSelect |  
AdvancedFilterRecordFilterOptionsDropdown |  
AdvancedFilterSubFieldSelectMenu |  
ObjectFilterDropdownBooleanSelect |  
ObjectFilterDropdownCountrySelect |  
ObjectFilterDropdownCurrencySelect |  
ObjectFilterDropdownNumberInput |  
ObjectFilterDropdownOptionSelect | Fixed “No result” case
ObjectFilterDropdownRecordRemoveFilterMenuItem | Removed because unused
ObjectFilterDropdownTextInput |  
ObjectOptionsDropdownFieldsContent | Spotted bug with icon eye
https://github.com/twentyhq/twenty/issues/12545
ObjectOptionsDropdownHiddenFieldsContent | Spotted bug with icon eye
https://github.com/twentyhq/twenty/issues/12545
ObjectOptionsDropdownLayoutContent | Refactored
DropdownMenuItemsContainer usage with DropdownMenuSeparator, spotted bug
switch view type https://github.com/twentyhq/twenty/issues/12546
ObjectOptionsDropdownMenuContent | Refactored DropdownMenuItemsContainer
usage with DropdownMenuSeparator
ObjectOptionsDropdownLayoutOpenInContent |  
ObjectOptionsDropdownMenuViewName |  
ObjectOptionsDropdownRecordGroupFieldsContent |  
ObjectOptionsDropdownRecordGroupSortContent |  
ObjectSortDropdownButton |  
RecordBoardColumnDropdownMenu |  
RecordBoardColumnDropdownMenu |  
RecordBoardColumnHeaderAggregateDropdownFieldsContent |  
RecordBoardColumnHeaderAggregateDropdownMenuContent |  
RecordBoardColumnHeaderAggregateDropdownOptionsContent |  
MultiItemFieldInput | Added hasMaxHeight on list of items
MultiItemFieldMenuItem |  
RecordGroupsVisibilityDropdownSection |  
MultipleRecordPicker |  
MultipleRecordPickerMenuItems |  
SingleRecordPickerMenuItems |  
SingleRecordPickerMenuItemsWithSearch |  
RecordDetailRelationRecordsListItem |  
RecordTableColumnAggregateFooterDropdownSubmenuContent |  
RecordTableColumnAggregateFooterMenuContent |  
RecordTableHeaderPlusButtonContent |  
RecordTableHeaderPlusButtonContent |  
MultipleSelectDropdown |  
SettingsAccountsRowDropdownMenu |  
ConfigVariableDatabaseInput |  
ConfigVariableOptionsDropdownContent |  
SettingsDataModelNewFieldBreadcrumbDropDown |  
SettingsDataModelFieldSelectFormOptionRow |  
SettingsObjectFieldActiveActionDropdown |  
SettingsObjectFieldInactiveActionDropdown |  
SettingsObjectInactiveMenuDropDown |  
SettingsIntegrationDatabaseConnectionSummaryCard |  
SettingsRoleAssignmentWorkspaceMemberPickerDropdown |  
SettingsRolePermissionsObjectLevelObjectPickerDropdownContent | Cannot
test
SettingsSecurityApprovedAccessDomainRowDropdownMenu | Cannot test
SettingsSecuritySSORowDropdownMenu | Cannot test
SettingsServerlessFunctionTabEnvironmentVariableTableRow | Cannot test
MatchColumnSelectFieldSelectDropdownContent |  
MatchColumnSelectSubFieldSelectDropdownContent |  
SubMatchingSelectInput |  
SupportDropdown |  
IconPicker |  
Select |  
SelectInput |  
CurrencyPickerDropdownSelect |  
PhoneCountryPickerDropdownSelect |  
CustomSlashMenu |  
TabListDropdown | Cannot test
MultiWorkspaceDropdownDefaultComponents | Removed unnecessary
StyledDropdownMenuItemsContainer
MultiWorkspaceDropdownThemesComponents |  
MultiWorkspaceDropdownWorkspacesListComponents |  
UpdateViewButtonGroup |  
ViewBarFilterDropdownFieldSelectMenu |  
ViewFieldsVisibilityDropdownSection |  
ViewPickerContentCreateMode |  
ViewPickerContentEditMode |  
ViewPickerListContent | Add hasMaxHeight to limit the height of view
list
ViewPickerOptionDropdown |  
WorkflowEditTriggerDatabaseEventForm |  
WorkflowVariablesDropdownFieldItems |  
WorkflowVariablesDropdownObjectItems |  
WorkflowVariablesDropdownWorkflowStepItems |  


<!-- notionvc: a3a87101-9944-4b03-a29d-b2974d5ffa9d -->

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
2025-06-12 12:22:26 +02:00
nitin 4c81d60dc7 Fix workflow run tab not displaying when navigating from side panel to full page (#12531)
closes https://github.com/twentyhq/core-team-issues/issues/1076
## Problem
When opening a workflow run in the side panel and then navigating to the
full page view, the workflow visualizer tab wouldn't display until the
page was refreshed.

## Root Cause
- In the side panel, tabs are merged into a single "home" tab
- When navigating to full page, the activeTabId state persisted as
"home"
- But the full page view only has a "workflowRun"(flow) tab, not "home"
- TabList was trying to display a non-existent tab, resulting in blank
content

## Solution
Added validation in TabList to check if activeTabId exists in
visibleTabs. If not, it falls back to the first available tab.
2025-06-11 10:17:12 +02:00
Etienne a15318537f update import steps design (#12463)
closes https://github.com/twentyhq/core-team-issues/issues/916

![Screenshot 2025-06-05 at 10 52
58](https://github.com/user-attachments/assets/ba5b6d65-0c1f-4d63-a197-e61816ec2d55)
![Screenshot 2025-06-05 at 10 53
09](https://github.com/user-attachments/assets/4aed579e-5e0e-4570-9518-b6e8ac604ea6)
![Screenshot 2025-06-05 at 10 53
24](https://github.com/user-attachments/assets/6f716306-ba08-468c-875a-4279991c1abd)
2025-06-10 16:49:37 +02:00
Guillim b74f6901b4 modal fix (#12514)
issue was the modal was closing itself due to onclickoutside while it
should have been excluded

fixes https://github.com/twentyhq/twenty/issues/12512
2025-06-10 14:44:25 +02:00