Commit Graph

72 Commits

Author SHA1 Message Date
e2febbccea onboarding - signout button on Choose your workspaces modal (#12794)
@AMoreaux changes - 
- Added secondary background color to `StyledWorkspaceContainer`.
- Updated border styles for child elements to handle bottom borders
correctly.
- Removed redundant border styling from `StyledWorkspaceItem`.
Fix #12859 

my changes - 
- Add a logout button on the `Choose your Workspace` modal
- Remove the footer from the `Choose your Workspace` modal

---------

Co-authored-by: Antoine Moreaux <moreaux.antoine@gmail.com>
2025-06-25 16:06:56 +02:00
adcf6107e7 Revert "fix(signinup): several issues (#12698)" (#12745)
This reverts commit 9612a4928d.

(Causes a google auth sign-up issue)
2025-06-19 18:15:15 +02:00
c48b80dfa6 fix(): add loader on signup (#12714)
Fix #12713
2025-06-19 16:07:10 +02:00
9612a4928d fix(signinup): several issues (#12698)
- Fixed an issue where you have invitations in your available workspaces
for signup.
- Corrected the URL display in the browser when hovering over the twenty
logo on the sign-in/up form.
- The workspace list is now displayed when you are logged into the
default domain.
2025-06-18 13:13:44 +02:00
b1af98f93d refactor(auth): add workspaces selection (#12098) 2025-06-13 16:17:35 +02:00
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
01b40e173b Refactored dropdown content and fixed all dropdown width bugs (#12334)
This PR refactors all the dropdown content wrapping mechanism across the
entire app.

It refactors the internals of the `Dropdown` component and introduces a
new generic `DropdownContent` component that is a generic wrapper used
for each dropdown.

## Why this PR ?

Because we’ve been experiencing continuous regressions for months on the
dropdown content width, with weird scrolling behaviors in some and not
in others, and every time a solution was found for a particular set of
dropdowns, it broke another set of dropdowns, which wasn’t noticed
because doing the QA of all dropdowns of the app is very difficult for
fixing an apparently small bug.

## Don’t we already have a `DropdownMenu` component ?

Indeed, this new `DropdownContent` is almost like `DropdownMenu` and
took inspiration from it but `DropdownContent` acts as a generic content
container that sets the width of the whole dropdown, whether we have a
menu or not.

## Why don’t we put it directly in Dropdown internals ?

Because the Dropdown component is using a complex logic with floating-ui
middleware to compute its position and size, and for this logic to work
correctly, it cannot be responsible for the “wanted” width of its
content, because the children components, which the dropdown is not
aware of, can request different widths after the dropdown has been
mounted.

A good example with multiple use cases inside the same dropdown can be
found in `AdvancedFilterDropdownFilterInput`

Thus, it is the responsibility of the content of the dropdown to
determine the width it wants to have.

## What is the difference with DropdownMenuItemsContainer ?

We can have multiple `DropdownMenuItemsContainer` in a dropdown,
alongside other components like `DropdownMenuSeparator` or
`DropdownMenuHeader`, and each of those components behaves differently
regarding to its width, paddings, etc. Therefore it is logical that the
`DropdownMenuItemsContainer` cannot be responsible for the whole
dropdown content width, and trying to do so has been the cause of many
regressions for months.

Now `DropdownMenuItemsContainer` is taking a width of `auto` by default,
which is the best to adapt to a parent which has a defined width.

## How do I set the width of my dropdown now ?

By passing a pixel width to the props `widthInPixels` of
`DropdownContent`, which only accepts numbers to avoid any confusion
with `auto` , `100%` or `160px` and other specific width variables.

The `dropdownWidth` props has been removed from `<Dropdown>` to avoid
any confusion.

Also the `DropdownMenuItemsContainer` is now using `auto` as its default
width to fill the available space inside `DropdownContent` .

It is highly recommended to use the enum `GenericDropdownContentWidt` to
define your width.

## Where to use this new `DropdownContent` component ?

There are two main use cases.

If the dropdown content is defined directly inline in the Dropdown
props, then it is recommended to use it here too.

On the other hand if the dropdown content is abstracted in another
component, it’s recommended to use this new component alongside the
others components like `DropdownMenuItemsContainer`.

A good rule of thumb is to place `DropdownContent` where
`DropdownMenuItemsContainer`, `DropdownMenuSearchInput`, etc. are
placed.

## What if I have a custom width ?

Just define a constant like `ICON_PICKER_DROPDOWN_CONTENT_WIDTH` and use
it with the props `widthInPixels` .

Otherwise there’s a `GenericDropdownContentWidth` enum. The default
value being `GenericDropdownContentWidth.Medium` (or 200px), which most
dropdowns use.

## QA 


Component | Comment
-- | --
AttachmentDropdown | Fixed overflowing (thanks to DropdownContent)
RecordIndexActionMenuDropdown |  
CommandMenuActionMenuDropdown |  
SupportDropdown | Fixed overflowing (thanks to DropdownContent)
MessageThreadSubscribersDropdownButton | Removed because unused
FavoriteFolderNavigationDrawerItemDropdown | Set width at Narrow
FavoriteFolderPicker |  
ViewPickerOptionDropdown |  
PageFavoriteFolderDropdown | Removed because unused
AdvancedFilterAddFilterRuleSelect |  
AdvancedFilterAddFilterRuleSelect |  
AdvancedFilterFieldSelectMenu |  
AdvancedFilterRecordFilterGroupOptionsDropdown |  
AdvancedFilterRecordFilterOperanceSelect | Set width at Narrow
AdvancedFilterLogicalOperatorDropdown | Set width at Narrow
AdvancedFilterRecordFilterOptionsDropdown |  
AdvancedFilterRootRecordFilterGroup | Fixed broken horizontal scrolling
behavior
AdvancedFilterSubFieldSelectMenu |  
AdvancedFilterDropdownFilterInput |  
ObjectFilterDropdownBooleanSelect |  
ObjectFilterDropdownCountrySelect | Fixed broken menu items container
ObjectFilterDropdownCurrencySelect | Set width to Large
ObjectFilterDropdownFilterInput |  
ObjectFilterDropdownOperandDropdown | Fixed width that was not fixed
ObjectFilterDropdownFilterInput | Fixed width that wasn’t the same for
EditableFilterChip
ObjectFilterDropdownOperandSelect | Refactored
ObjectOptionsDropdownRecordGroupFieldsContent | Added missing separator
ObjectOptionDropdownFieldsContent |  
ObjectOptionsDropdownHiddenFieldsContent |  
ObjectOptionsDropdownLayoutContent |  
ObjectOptionsDropdownLayoutOpenInContent |  
ObjectOptionsDropdownMenuContent |  
ObjectOptionsDropdownRecordGroupFieldsContent |  
ObjectOptionsDropdownRecordGroupsContent |  
ObjectOptionsDropdownRecordGroupSortContent |  
ObjectOptionsDropdownHiddenRecordGroupsContent | Removed unnecessary
DropdownMenuItemsContainer
RecordBoardColumnHeaderAggregateDropdown | Fixed overflowing (thanks to
DropdownContent)
RecordBoardColumnHeaderAggregateDropdownFieldsContent | Fixed
overflowing (thanks to DropdownContent)
RecordBoardColumnHeaderAggregateDropdownMenuContent | Fixed overflowing
(thanks to DropdownContent)
RecordBoardColumnHeaderAggregateDropdownOptionsContent | Fixed
overflowing (thanks to DropdownContent)
MultiItemFieldInput | Fixed overflowing (thanks to DropdownContent)
MultiItemFieldMenuItem |  
MultipleRecordPicker | Fixed overflowing (thanks to DropdownContent)
SingleRecordPicker |  
RecordTableColumnAggregateDropdownSubmenuContent |  
RecordTableColumnAggregateFooterMenuContent |  
RecordTableColumnHeadDropdownMenu | Fixed overflowing (thanks to
DropdownContent)
RecordTableHeaderPlusButtonContent |  
MultipleSelectDropdown | Broken width fixed
ObjectSortDropdownButton |  
RecordDetailRelationRecordsListItem |  
ConfigVariableDatabaseInput |  
ConfigVariableOptionsDropdownContent |  
SettingsObjectFieldActiveActionDropdown | Fixed overflowing (thanks to
DropdownContent)
SettingsObjectFieldDisabledActionDropdown | Set width at Narrow
SettingsObjectSummaryCard | Removed because unused
SettingsDataModelFieldSelectFormOptionRow |  
SettingsDataModelNewFieldBreadcrumbDropdown |  
SettingsObjectInactiveMenuDropDown |  
SettingsRoleAssignementWorkspaceMemberPickerDropdown |  
SettingsRolePermissionObjectLevelObjectPickerDropdownContent |  
SettingsSecurityApprovedAccessDomainRowDropdownMenu | Couldn’t test
SettingsSecuritySSORowDropdownMenu | Couldn’t test
SettingsAccountsRowDropdownMenu | Fixed overflowing (thanks to
DropdownContent)
SettingsIntegrationDatabaseConnectionSummaryCard | Couldn’t test
SettingsServerlessFunctionTablEnvironmentVariableTableRow | Deactivated
scope
MatchColumnSelectFieldSelectDropdownContent | Removed now unnecessary
width on DropdownMenuItemsContainer
MatchColumnSelectSubFieldSelectDropdownContent |  
SubMatchingSelectInput |  
CurrencyPickerDropdownSelect |  
IconPicker | Fixed overflowing (thanks to DropdownContent)
PhoneCountryPickerDropdownSelect |  
Select | Refactored to drilldown wanted width of content, in this case
it’s intended
ExpandedListDropdown |  
ShowPageAddButton | Removed because unused
MultiWorkspaceDropdownDefaultComponent |  
MultiWorkspaceDropdownThemesComponent |  
MultiWorkspaceDropdownWorkspacesListComponent |  
AdvancedFilterDropdownButton |  
EditableFilterChip |  
EditableFilterDropdownButton |  
UpdateViewButtonGroup |  
ViewBarFilterDropdown |  
ViewBarFilterDropdownFieldSelectMenu |  
ViewPickerContentCreateMode |  
ViewPickerContentEditMode |  
ViewPickerListContent |  
WorkflowEditTriggerDatabaseEventForm |  
WorkflowVariablesDropdownFieldItems |  
WorkflowVariablesDropdownObjectItems |  
WorkflowVariablesDropdownWorkflowStepItems |  
CommandMenuContextChipGroups |  
RecordBoardColumnDropdownMenu |  
MultiSelectInput |  
SelectInput |  
CustomSlashMenu |  
DropdownMenu | Removed and replaced by DropdownContent
OverlayContainer and around |  


<!-- notionvc: 1e23bdb8-2dda-4f8d-a64d-ecc829a768a2 -->

## Miscellaneous 

Side notes : 

- The `Select` component is now wrapping the `DropdownContent` because
it computes a dynamic width.
- The advanced filter dropdown has been fixed, it was broken when
resizing the window horizontally, we couldn’t scroll. This specific edge
case was taken into account when refactoring the whole dropdown content
system
- As discussed with Nitin, data-select-disable will probably be removed
entirely, so I let it as is, because right now it is not used by the
refactored d&d selection.
- Duplicate separators under DropdownMenuHeader have been removed.

Fixes : https://github.com/twentyhq/twenty/issues/12327
Fixes : https://github.com/twentyhq/core-team-issues/issues/951
2025-05-27 19:44:13 +02:00
54edcc0ea7 fix(auth): prevent unexpected form effect trigger (#12261)
Ensure the form effect is not erroneously triggered when the sign-in
step is not related to email or password. This resolves potential state
inconsistencies during the authentication flow.


Fix #12176
2025-05-23 17:50:03 +02:00
7461b7ac58 lowercase user and invitation emails (#12130)
### Solution

> After discussion with charles & weiko, we chose the long term
solution.
> 
> Fix FE to request checkUserExists resolver with lowercased emails
> Add a decorator on User (and AppToken for invitation), to lowercase
email at user (appToken) creation. ⚠️ It works for TypeOrm .save method
only (there is no user email update in codebase, but in future it
could..)
> Add email lowercasing logic in external auth controller
> Fix FE to request sendInvitations resolver with lowercased emails
> Add migration command to lowercase all existing user emails and
invitation emails

> For other BE resolvers, we let them permissive. For example, if you
made a request on CheckUserExists resolver with uppercased email, you
will not found any user. We will not transform input before checking for
existence.

[link to comment
](https://github.com/twentyhq/twenty/pull/12130#discussion_r2098062093)

### Test 🚧 
- sign-in and up from main subdomain and workspace sub domain > Google
Auth (lowercased email) ✔️ | Microsoft Auth (uppercased email ✔️ &
lowercased email) | LoginPassword (uppercased email ✔️& lowercased
email✔️)
- invite flow with uppercased and lowercased ✔️
- migration command + sign-in ( former uppercased microsoft email ✔️) /
sign-up ( former uppercased invited email ✔️)

closes https://github.com/twentyhq/private-issues/issues/278, closes
https://github.com/twentyhq/private-issues/issues/275, closes
https://github.com/twentyhq/private-issues/issues/279
2025-05-21 11:06:29 +02:00
6554947671 Modal API Refactoring (#12062)
# Modal API Refactoring

This PR refactors the modal system to use an imperative approach for
setting hotkey scopes, addressing race conditions that occurred with the
previous effect-based implementation.

Fixes #11986
Closes #12087

## Key Changes:

- **New Modal API**: Introduced a `useModal` hook with `openModal`,
`closeModal`, and `toggleModal` functions, similar to the existing
dropdown API
- **Modal Identification**: Added a `modalId` prop to uniquely identify
modals
- **State Management**: Introduced `isModalOpenedComponentState` and
removed individual boolean state atoms (like
`isRemoveSortingModalOpenState`)
- **Modal Constants**: Added consistent modal ID constants (e.g.,
`FavoriteFolderDeleteModalId`, `RecordIndexRemoveSortingModalId`) for
better maintainability
- **Mount Effects**: Created mount effect components (like
`AuthModalMountEffect`) to handle initial modal opening where needed

## Implementation Details:

- Modified `Modal` and `ConfirmationModal` components to accept the new
`modalId` prop
- Added a component-state-based approach using
`ModalComponentInstanceContext` to track modal state
- Introduced imperative modal handlers that properly manage hotkey
scopes
- Components like `ActionModal` and `AttachmentList` now use the new
`useModal` hook for better control over modal state

## Benefits:

- **Race Condition Prevention**: Hotkey scopes are now set imperatively,
eliminating race conditions
- **Consistent API**: Modal and dropdown now share similar patterns,
improving developer experience

## Tests to do before merging:

1. Action Modals (Modal triggered by an action, for example the delete
action)

2. Auth Modal (`AuthModal.tsx` and `AuthModalMountEffect.tsx`)
   - Test that auth modal opens automatically on mount
   - Verify authentication flow works properly

3. Email Verification Sent Modal (in `SignInUp.tsx`)
   - Verify this modal displays correctly

4. Attachment Preview Modal (in `AttachmentList.tsx`)
   - Test opening preview modal by clicking on attachments
   - Verify close, download functionality works
   - Test modal navigation and interactions

5. Favorite Folder Delete Modal (`CurrentWorkspaceMemberFavorites.tsx`)
   - Test deletion confirmation flow
- Check that modal opens when attempting to delete folders with
favorites

6. Record Board Remove Sorting Modal (`RecordBoard.tsx` using
`RecordIndexRemoveSortingModalId`)
- Test that modal appears when trying to drag records with sorting
enabled
   - Verify sorting removal works correctly

7. Record Group Reorder Confirmation Modal
(`RecordGroupReorderConfirmationModal.tsx`)
   - Test group reordering with sorting enabled
   - Verify confirmation modal properly handles sorting removal

8. Confirmation Modal (base component used by several modals)
   - Test all variants with different confirmation options

For each modal, verify:
- Opening/closing behavior
- Hotkey support (Esc to close, Enter to confirm where applicable)
- Click outside behavior
- Proper z-index stacking
- Any modal-specific functionality
2025-05-16 15:04:22 +00:00
8334fe9528 Add placeholder to signinup modal's secondary logo (#12079)
closes https://github.com/twentyhq/core-team-issues/issues/972

checks - 

- [x]  If we have an icon it should be displayed as `secondary`

<img width="1064" alt="Screenshot 2025-05-16 at 00 33 42"
src="https://github.com/user-attachments/assets/20716df3-28be-40c5-b0fc-2133fccdad83"
/>

- [x] If no icon is provided, display a placeholder

<img width="1062" alt="Screenshot 2025-05-16 at 00 33 09"
src="https://github.com/user-attachments/assets/0241dafe-3d31-4f8e-a9e4-321634f6d41c"
/>

- [x] Add story for auth logos
<img width="550" alt="Screenshot 2025-05-16 at 16 16 24"
src="https://github.com/user-attachments/assets/3859547d-32c5-469f-879b-a130a36a23fa"
/>

<img width="548" alt="Screenshot 2025-05-16 at 16 16 30"
src="https://github.com/user-attachments/assets/4937fa6a-459a-4c75-86ae-2080b1c8a5ae"
/>

<img width="487" alt="Screenshot 2025-05-16 at 16 16 16"
src="https://github.com/user-attachments/assets/2c634be1-4a51-4b06-a590-cdd7eff91b76"
/>

<img width="556" alt="Screenshot 2025-05-16 at 16 16 07"
src="https://github.com/user-attachments/assets/e4a518b4-c338-45c1-a329-5c9f85319c52"
/>
2025-05-16 14:21:24 +00:00
aa2f3438fa Fix email verification (#11660)
Email verification modal had been broken and looked bad

I also added stories to make it more evident if this happens again
2025-04-20 14:18:43 +02:00
ee5aa2393d fix billingCheckoutSession query param + enable redirect on workspace… (#11509)
… during onboarding



fixes : https://github.com/twentyhq/core-team-issues/issues/668
2025-04-10 16:47:40 +02:00
41674129c3 Fix sign-in-up sso buttons width (#11499)
## Context
An enforced width was introduced recently for error texts but broke
Microsoft sso placement due to its longer text.
I've replaced it by a min-width and introduced the missing one in global
signin/up.

Before
<img width="456" alt="Screenshot 2025-04-10 at 12 14 51"
src="https://github.com/user-attachments/assets/43f29c63-f257-4c1c-9c16-b0170343c43e"
/>

After
<img width="494" alt="Screenshot 2025-04-10 at 12 14 17"
src="https://github.com/user-attachments/assets/17c4362a-1336-4adc-aeb9-76c6dcd059c6"
/>
2025-04-10 13:51:21 +02:00
9e0402e691 Action menu refactoring (#11454)
# Description

Closes [#696](https://github.com/twentyhq/core-team-issues/issues/696)

- `useAction` hooks have been removed for all actions
- Every action can now declare a react component
- Some standard action components have been introduced: `Action`,
`ActionLink` and `ActionModal`
- The `ActionDisplay` component uses the new `displayType` prop of the
`ActionMenuContext` to render the right component for the action
according to its container: `ActionButton`, `ActionDropdownItem` or
`ActionListItem`
- The `ActionDisplayer` wraps the action component inside a context
which gives it all the information about the action
-`actionMenuEntriesComponenState` has been removed and now all actions
are computed directly using `useRegisteredAction`
- This computation is done inside `ActionMenuContextProvider` and the
actions are passed inside a context
- `actionMenuType` gives information about the container of the action,
so the action can know wether or not to close this container upon
execution
2025-04-09 13:12:49 +00:00
b6e344e7be Various fixes (#11448)
# Scrollbar fix

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

<img width="1512" alt="image"
src="https://github.com/user-attachments/assets/b13fe0f2-8c61-4ea8-9ea1-e61e571a90da"
/>

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
2025-04-09 01:03:43 +02:00
4a4e65fe4a [REFACTOR] Twenty UI multi barrel (#11301)
# Introduction
closes https://github.com/twentyhq/core-team-issues/issues/591
Same than for `twenty-shared` made in
https://github.com/twentyhq/twenty/pull/11083.

## TODO
- [x] Manual migrate twenty-website twenty-ui imports

## What's next:
- Generate barrel and migration script factorization within own package
+ tests
- Refactoring using preconstruct ? TimeBox
- Lint circular dependencies
- Lint import from barrel and forbid them

### Preconstruct
We need custom rollup plugins addition, but preconstruct does not expose
its rollup configuration. It might be possible to handle this using the
babel overrides. But was a big tunnel.
We could give it a try afterwards ! ( allowing cjs interop and stuff
like that )
Stuck to vite lib app

Closed related PRs:
- https://github.com/twentyhq/twenty/pull/11294
- https://github.com/twentyhq/twenty/pull/11203
2025-04-03 09:47:55 +00:00
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
2325e0ae0f fix(): include workspace in reset password flow (#10617)
Fix #10586
2025-03-03 16:47:33 +01:00
77d72e9b1c refactor(auth/sso): rename GetAuthorizationUrl for clarity (#10173)
- Rename `GetAuthorizationUrl` to `GetAuthorizationUrlForSSO`
- Move `GetAuthorizationUrlForSSO` from `sso.resolver.ts` to
`auth.resolver.ts` to avoid the permission guard and let users use an
SSO provider.
- Fix an issue in OIDC guard that breaks the connection if you have
multiple SSO providers + add tests for OIDC guard.
2025-02-13 11:15:22 +01:00
68183b7c85 feat(): enable custom domain usage (#9911)
# Content
- Introduce the `workspaceUrls` property. It contains two
sub-properties: `customUrl, subdomainUrl`. These endpoints are used to
access the workspace. Even if the `workspaceUrls` is invalid for
multiple reasons, the `subdomainUrl` remains valid.
- Introduce `ResolveField` workspaceEndpoints to avoid unnecessary URL
computation on the frontend part.
- Add a `forceSubdomainUrl` to avoid custom URL using a query parameter
2025-02-07 14:34:26 +01:00
005762c240 fix(auth): reset signInUp state when email change (#9990)
When you use a prefilled email the web app checks the db to know if the
user exists. If not the web app enter in signUp mode.
If you changed your email after, the signup mode was not reset.

This PR fixes that.

Fix the error with the message "Invalid sign in up params".
2025-02-06 19:53:31 +01:00
7a0f2f8c0a Add logged out translations (#9983)
Add translation for logged in / sub pages
2025-02-03 22:00:54 +01:00
eb0762dc58 refactor(auth): update SSO provider selection logic (#9975)
Refined the logic to check for SSO providers before setting the sign-in
step. Consolidated conditions to ensure clarity and avoid redundant
checks.
2025-02-03 14:12:56 +00:00
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
4edeb7f991 feat(auth): enhance SSO handling and workspace auth logic (#9858)
- Return only SSO providers with an `activate` status
- If only 1 SSO provider is enabled for auth, redirect the user to the
provider login page.
- if only SSO auth is available set the step to SSO selection.

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
2025-01-29 19:28:21 +01:00
e881616822 Fix captcha token not being loaded early enough (#9800)
I've re-investigated the captchaToken being invalid on workspace domain
url in case where email is passed in the URL.
We need to be a bit more granular
2025-01-22 18:11:21 +01:00
5902dbd0b4 Fix signup submit disabled when waiting for captcha without provider (#9796) 2025-01-22 17:49:11 +01:00
aef01816d7 fix(recaptcha|sso): recaptcha not generated issue (#9764)
Fix https://github.com/twentyhq/twenty/issues/9759
https://github.com/twentyhq/twenty/issues/9694
https://github.com/twentyhq/twenty/issues/9323
2025-01-21 17:07:20 +00:00
f722a2d619 Add Email Verification for non-Microsoft/Google Emails (#9288)
Closes twentyhq/twenty#8240 

This PR introduces email verification for non-Microsoft/Google Emails:

## Email Verification SignInUp Flow:

https://github.com/user-attachments/assets/740e9714-5413-4fd8-b02e-ace728ea47ef

The email verification link is sent as part of the
`SignInUpStep.EmailVerification`. The email verification token
validation is handled on a separate page (`AppPath.VerifyEmail`). A
verification email resend can be triggered from both pages.

## Email Verification Flow Screenshots (In Order):

![image](https://github.com/user-attachments/assets/d52237dc-fcc6-4754-a40f-b7d6294eebad)

![image](https://github.com/user-attachments/assets/263a4b6b-db49-406b-9e43-6c0f90488bb8)

![image](https://github.com/user-attachments/assets/0343ae51-32ef-48b8-8167-a96deb7db99e)

## Sent Email Details (Subject & Template):
![Screenshot 2025-01-05 at 11 56
56 PM](https://github.com/user-attachments/assets/475840d1-7d47-4792-b8c6-5c9ef5e02229)

![image](https://github.com/user-attachments/assets/a41b3b36-a36f-4a8e-b1f9-beeec7fe23e4)

### Successful Email Verification Redirect:

![image](https://github.com/user-attachments/assets/e2fad9e2-f4b1-485e-8f4a-32163c2718e7)

### Unsuccessful Email Verification (invalid token, invalid email, token
expired, user does not exist, etc.):

![image](https://github.com/user-attachments/assets/92f4b65e-2971-4f26-a9fa-7aafadd2b305)

### Force Sign In When Email Not Verified:

![image](https://github.com/user-attachments/assets/86d0f188-cded-49a6-bde9-9630fd18d71e)

# TODOs:

## Sign Up Process

- [x] Introduce server-level environment variable
IS_EMAIL_VERIFICATION_REQUIRED (defaults to false)
- [x] Ensure users joining an existing workspace through an invite are
not required to validate their email
- [x] Generate an email verification token
- [x] Store the token in appToken
- [x] Send email containing the verification link
  - [x] Create new email template for email verification
- [x] Create a frontend page to handle verification requests

## Sign In Process

- [x] After verifying user credentials, check if user's email is
verified and prompt to to verify
- [x] Show an option to resend the verification email

## Database

- [x] Rename the `emailVerified` colum on `user` to to `isEmailVerified`
for consistency

## During Deployment
- [x] Run a script/sql query to set `isEmailVerified` to `true` for all
users with a Google/Microsoft email and all users that show an
indication of a valid subscription (e.g. linked credit card)
- I have created a draft migration file below that shows one possible
approach to implementing this change:

```typescript
import { MigrationInterface, QueryRunner } from 'typeorm';

export class UpdateEmailVerifiedForActiveUsers1733318043628
  implements MigrationInterface
{
  name = 'UpdateEmailVerifiedForActiveUsers1733318043628';

  public async up(queryRunner: QueryRunner): Promise<void> {
    await queryRunner.query(`
      CREATE TABLE core."user_email_verified_backup" AS
      SELECT id, email, "isEmailVerified"
      FROM core."user"
      WHERE "deletedAt" IS NULL;
    `);

    await queryRunner.query(`
      -- Update isEmailVerified for users who have been part of workspaces with active subscriptions
      UPDATE core."user" u
      SET "isEmailVerified" = true
      WHERE EXISTS (
        -- Check if user has been part of a workspace through userWorkspace table
        SELECT 1 
        FROM core."userWorkspace" uw
        JOIN core."workspace" w ON uw."workspaceId" = w.id
        WHERE uw."userId" = u.id
        -- Check for valid subscription indicators
        AND (
          w."activationStatus" = 'ACTIVE'
          -- Add any other subscription-related conditions here
        )
      )
      AND u."deletedAt" IS NULL;
  `);
  }

  public async down(queryRunner: QueryRunner): Promise<void> {
    await queryRunner.query(`
      UPDATE core."user" u
      SET "isEmailVerified" = b."isEmailVerified"
      FROM core."user_email_verified_backup" b
      WHERE u.id = b.id;
    `);

    await queryRunner.query(`DROP TABLE core."user_email_verified_backup";`);
  }
}

```

---------

Co-authored-by: Antoine Moreaux <moreaux.antoine@gmail.com>
Co-authored-by: Félix Malfait <felix@twenty.com>
2025-01-15 18:43:40 +01:00
6e04a3b19f refactor(auth): integrate react-hook-form context (#9417)
Remove redundant validation logic and streamline form handling by
leveraging react-hook-form's context. Simplify component props and
enhance consistency across the sign-in/up flow.

Fix https://github.com/twentyhq/twenty/issues/9380
2025-01-07 17:09:45 +01:00
e1c99beaa4 Fix shrinked horizontal separator (#9192)
Related issue:
https://discord.com/channels/1130383047699738754/1317185369577492532/1317185369577492532.

TL;DR: When used in a flex container, the separators gets hidden when
the container becomes scrollable. We must ensure they can't shrink.

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
2024-12-30 17:03:21 +00:00
cd2946b670 refacto(*): remove everything about default workspace (#9157)
## Summary
- [x] Remove defaultWorkspace in user
- [x] Remove all occurrence of defaultWorkspace and defaultWorkspaceId
- [x] Improve activate workspace flow
- [x] Improve security on social login
- [x] Add `ImpersonateGuard`
- [x] Allow to use impersonation with couple `User/Workspace`
- [x] Prevent unexpected reload on activate workspace
- [x] Scope login token with workspaceId 

Fix https://github.com/twentyhq/twenty/issues/9033#event-15714863042
2024-12-24 11:47:41 +00:00
ee0282bcc8 refacto(auth): Simplify workspace lookup and cleanup UI logic (#9160)
Streamlined workspace selection by defaulting to the first available
workspace. Adjusted conditional rendering for a separator between
authentication providers, improving clarity and reducing redundancy.
Minor formatting changes were also applied for consistency.

Close #9094
2024-12-23 13:17:00 +01:00
093f627e1d fix(auth): adjust button variant based on sign-in-up step (#9188)
Update the button variant to dynamically switch between 'secondary' and
'primary' based on the current step in the sign-in-up flow. Ensures the
UI reflects the correct state, improving user experience and
consistency.
2024-12-23 11:30:36 +01:00
07bde4883e feat(auth): add default workspace support for user handling (#9099)
Introduce `defaultWorkspaceId` to improve workspace redirection logic.
Updated GraphQL schema, server logic, and frontend components
accordingly to prioritize default workspaces when available.

## Summary
This PR adds a mechanism to handle and prioritize default workspace
selection for users during authentication. It updates the logic in
multiple components and services to ensure users are redirected to their
default workspaces if no specific selection is provided.

### Main changes:
- **GraphQL Schema Updates**:
- Enhanced `UserExists` GraphQL entity with a new `defaultWorkspaceId`
field to specify the user's default workspace.
  - Updated queries and mutations to handle the `defaultWorkspaceId`.

- **Client-Side Updates**:
- Enhanced `useAuth` hook to include logic for managing default
workspace redirection.
- Adjusted UI logic in `SignInUpGlobalScopeForm` to utilize the
`defaultWorkspaceId`.

- **Server-Side Adjustments**:
- Modified `AuthService` to include `defaultWorkspaceId` in
`checkUserExists`.
- Default workspace logic added to the backend flow for consistent
handling.

- **Tests/Helpers**:
- Added utility and type changes to integrate the new backend response
changes (e.g., `UserExists` GraphQL).
- **Subsequent function lifecycle** was adjusted to include recheck for
workspace token states when performing sign-in flows.
2024-12-17 19:56:19 +01:00
7e67b1c5a6 Enforce system wide sso providers (#9058)
We have recently introduced the possibility to specify workspace
specific auth providers.
I'm:
- introducing system wide auth providers (provided by clientConfig)
- making sure workspace specific auth providers belong to system wide
auth providers set
2024-12-13 16:38:04 +01:00
f4c5d03b98 fix(): redirect loop + signout (#8899) 2024-12-05 16:24:24 +01:00
081ecbcfaf review(front): refacto url-manager (#8861)
Replace https://github.com/twentyhq/twenty/pull/8855
2024-12-05 11:47:51 +01:00
33e69805cb review(): from PR #8656 (#8870) 2024-12-05 10:46:13 +01:00
7943141d03 feat(*): allow to select auth providers + add multiworkspace with subdomain management (#8656)
## Summary
Add support for multi-workspace feature and adjust configurations and
states accordingly.
- Introduced new state isMultiWorkspaceEnabledState.
- Updated ClientConfigProviderEffect component to handle
multi-workspace.
- Modified GraphQL schema and queries to include multi-workspace related
configurations.
- Adjusted server environment variables and their respective
documentation to support multi-workspace toggle.
- Updated server-side logic to handle new multi-workspace configurations
and conditions.
2024-12-03 19:06:28 +01:00
86c2e9f0e4 fix: uncontrolled input to controlled in SigninUpForm (#8536)
Fixes: #8535

---------

Co-authored-by: Devessier <baptiste@devessier.fr>
2024-11-19 13:13:35 +00: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
b627c55b9a Add blue focus on text inputs (#8343)
We removed the blue focus on phone/domain/array/email floating inputs
but we want to keep it in the app settings.

<img width="644" alt="Screenshot 2024-11-05 at 15 55 04"
src="https://github.com/user-attachments/assets/afcbe6b2-2d6b-4e0d-8397-4268d529127c">
<img width="606" alt="Screenshot 2024-11-05 at 15 55 23"
src="https://github.com/user-attachments/assets/004becf8-41e7-45d6-9ad9-9e487b8db8f3">
<img width="351" alt="Screenshot 2024-11-05 at 15 55 33"
src="https://github.com/user-attachments/assets/6a4c06e6-04d3-46bf-940b-9fd61ee91995">
<img width="330" alt="Screenshot 2024-11-05 at 15 55 41"
src="https://github.com/user-attachments/assets/e6fc8bbd-eca3-47bc-93f1-d6ff8d3d8a13">
<img width="588" alt="Screenshot 2024-11-05 at 15 56 07"
src="https://github.com/user-attachments/assets/0d0f5e80-3501-4346-94a1-6ea4b77ee7ba">
<img width="211" alt="Screenshot 2024-11-05 at 15 56 31"
src="https://github.com/user-attachments/assets/9cd85f4d-8052-4c6b-a694-84c691c6217d">
2024-11-06 14:23:34 +01:00
69c24968c1 fix for horizontal bar while login in (#8073)
Fix for #8071

---------

Co-authored-by: martmull <martmull@hotmail.fr>
2024-10-28 17:07:00 +00:00
1296cea7e8 Add a helper to the password (#8078)
Fix #7601

---------

Co-authored-by: Weiko <corentin@twenty.com>
2024-10-27 15:09:37 +01:00
7edfa61571 feat: Disable Continue Button for Invalid Email in Sign in/Sign up (#8022)
This PR fixes #7967

Here's a preview of the working solution:


https://github.com/user-attachments/assets/8918e0ac-c45a-48d2-ac90-004b05ec76f3

---------

Co-authored-by: Félix Malfait <felix@twenty.com>
2024-10-24 21:30:54 +02:00
4ceee4ab8f Migrate to twenty-ui - feedback/loader (#7997)
This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-7528](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7528).

 --- 

### Description

- Move loader components to `twenty-ui`    
  
Fixes  twentyhq/private-issues#90

---------

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
2024-10-24 16:19:32 +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
430644448a Migrate to twenty-ui - navigation/link (#7837)
This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-7535](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7535).

 --- 

### Description.  

Migrate link components to `twenty-ui` \
\
Fixes #7535

---------

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: Charles Bochet <charles@twenty.com>
2024-10-22 17:36:26 +02:00