From b09ecfbb8ca0ccdb0d9b1bc9567b1f158c3d6021 Mon Sep 17 00:00:00 2001 From: "gitstart-app[bot]" <57568882+gitstart-app[bot]@users.noreply.github.com> Date: Thu, 24 Oct 2024 17:50:14 +0200 Subject: [PATCH] Migrate to twenty-ui - display (#8004) This PR was created by [GitStart](https://gitstart.com/) to address the requirements from this ticket: [TWNTY-6871](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-6871). --- ### Description Migrate: - Info display component - Status display component - SeparatorLineText display component ### Demo ###### SeparatorLineText In Storybook ![](https://assets-service.gitstart.com/4814/c0a2cd49-e545-469a-b3d3-c02eb462b60d.png) Info Component on Storybook ![](https://assets-service.gitstart.com/4814/6f3019c5-99e0-4365-a81e-241294887f9e.png) Status Component on Storybook ![](https://assets-service.gitstart.com/4814/29b5142a-468f-4d7e-88ff-4f3bfdd5abda.png) ###### Fixes twentyhq/private-issues#95 --------- Co-authored-by: gitstart-twenty Co-authored-by: Charles Bochet --- .../src/__stories__/AppRouter.stories.tsx | 6 ++-- ...sePageChangeEffectNavigateLocation.test.ts | 1 + .../src/hooks/useCleanRecoilState.ts | 7 ++-- .../modules/apollo/hooks/useApolloFactory.ts | 2 +- .../effect-components/PageChangeEffect.tsx | 2 +- .../auth/sign-in-up/hooks/useSignInUp.tsx | 10 +++--- .../hooks/useWorkspaceFromInviteHash.ts | 3 +- .../AppNavigationDrawer.stories.tsx | 3 +- .../utils/__tests__/indexAppPath.test.ts | 1 - ...untsConnectedAccountsRowRightContainer.tsx | 2 +- .../hooks/useTriggerGoogleApisOAuth.ts | 2 +- .../SettingsIntegrationComponent.tsx | 13 ++++++-- ...ntegrationDatabaseConnectionSyncStatus.tsx | 2 +- ...tegrationEditDatabaseConnectionContent.tsx | 3 +- .../hooks/useDatabaseConnection.ts | 2 +- ...gsSSOIdentityProviderRowRightContainer.tsx | 2 +- .../hooks/useWorkspaceSwitching.ts | 14 ++++---- .../twenty-front/src/pages/auth/Authorize.tsx | 1 + .../pages/auth/__stories__/Invite.stories.tsx | 2 +- .../auth/__stories__/SignInUp.stories.tsx | 4 +-- .../pages/impersonate/ImpersonateEffect.tsx | 2 +- .../__stories__/ImpersonateEffect.stories.tsx | 2 +- .../src/pages/not-found/NotFound.tsx | 1 + .../src/pages/onboarding/InviteTeam.tsx | 3 +- .../src/pages/onboarding/PaymentSuccess.tsx | 9 ++--- .../src/pages/onboarding/SyncEmails.tsx | 19 ++++++----- .../__stories__/CreateProfile.stories.tsx | 2 +- .../__stories__/CreateWorkspace.stories.tsx | 2 +- .../__stories__/InviteTeam.stories.tsx | 4 +-- .../__stories__/PaymentSuccess.stories.tsx | 2 +- .../__stories__/SyncEmails.stories.tsx | 4 +-- .../src/pages/settings/SettingsBilling.tsx | 2 +- .../settings/SettingsWorkspaceMembers.tsx | 33 ++++++++++--------- .../data-model/SettingsObjectEdit.tsx | 19 ++++++----- .../data-model/SettingsObjectFieldEdit.tsx | 19 ++++++----- ...ttingsIntegrationNewDatabaseConnection.tsx | 2 +- packages/twenty-front/tsup.ui.index.tsx | 1 - packages/twenty-ui/src/display/index.ts | 3 ++ .../src}/display/info/components/Info.tsx | 8 ++--- .../components/__stories__/Info.stories.tsx | 8 +++-- .../src}/display/status/components/Status.tsx | 5 ++- .../components/__stories__/Status.stories.tsx | 5 ++- .../text/components/SeparatorLineText.tsx | 0 .../__stories__/SeparatorLineText.stories.tsx | 2 +- .../src/input/button/components/Button.tsx | 4 +-- 45 files changed, 133 insertions(+), 110 deletions(-) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/display/info/components/Info.tsx (93%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/display/info/components/__stories__/Info.stories.tsx (84%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/display/status/components/Status.tsx (91%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/display/status/components/__stories__/Status.stories.tsx (94%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/display/text/components/SeparatorLineText.tsx (100%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/display/text/components/__stories__/SeparatorLineText.stories.tsx (89%) diff --git a/packages/twenty-front/src/__stories__/AppRouter.stories.tsx b/packages/twenty-front/src/__stories__/AppRouter.stories.tsx index 9d2fe91a6..f322919ba 100644 --- a/packages/twenty-front/src/__stories__/AppRouter.stories.tsx +++ b/packages/twenty-front/src/__stories__/AppRouter.stories.tsx @@ -1,18 +1,18 @@ import { getOperationName } from '@apollo/client/utilities'; import { jest } from '@storybook/jest'; import { Meta, StoryObj } from '@storybook/react'; -import { graphql, HttpResponse } from 'msw'; +import { HttpResponse, graphql } from 'msw'; import { HelmetProvider } from 'react-helmet-async'; import { RecoilRoot } from 'recoil'; -import { IconsProvider } from 'twenty-ui'; import { AppErrorBoundary } from '@/error-handler/components/AppErrorBoundary'; import indexAppPath from '@/navigation/utils/indexAppPath'; -import { AppPath } from '@/types/AppPath'; import { SnackBarProviderScope } from '@/ui/feedback/snack-bar-manager/scopes/SnackBarProviderScope'; import { GET_CURRENT_USER } from '@/users/graphql/queries/getCurrentUser'; import { AppRouter } from '@/app/components/AppRouter'; +import { AppPath } from '@/types/AppPath'; +import { IconsProvider } from 'twenty-ui'; import { graphqlMocks } from '~/testing/graphqlMocks'; import { mockedUserData } from '~/testing/mock-data/users'; diff --git a/packages/twenty-front/src/hooks/__tests__/usePageChangeEffectNavigateLocation.test.ts b/packages/twenty-front/src/hooks/__tests__/usePageChangeEffectNavigateLocation.test.ts index 95c2a58b7..a7b683e66 100644 --- a/packages/twenty-front/src/hooks/__tests__/usePageChangeEffectNavigateLocation.test.ts +++ b/packages/twenty-front/src/hooks/__tests__/usePageChangeEffectNavigateLocation.test.ts @@ -2,6 +2,7 @@ import { useIsLogged } from '@/auth/hooks/useIsLogged'; import { useDefaultHomePagePath } from '@/navigation/hooks/useDefaultHomePagePath'; import { useOnboardingStatus } from '@/onboarding/hooks/useOnboardingStatus'; import { AppPath } from '@/types/AppPath'; + import { useSubscriptionStatus } from '@/workspace/hooks/useSubscriptionStatus'; import { OnboardingStatus, SubscriptionStatus } from '~/generated/graphql'; diff --git a/packages/twenty-front/src/hooks/useCleanRecoilState.ts b/packages/twenty-front/src/hooks/useCleanRecoilState.ts index 3f0a41df4..9da98c006 100644 --- a/packages/twenty-front/src/hooks/useCleanRecoilState.ts +++ b/packages/twenty-front/src/hooks/useCleanRecoilState.ts @@ -1,8 +1,9 @@ -import { useIsMatchingLocation } from '~/hooks/useIsMatchingLocation'; -import { SettingsPath } from '@/types/SettingsPath'; import { apiKeyTokenState } from '@/settings/developers/states/generatedApiKeyTokenState'; -import { useRecoilValue, useResetRecoilState } from 'recoil'; import { AppPath } from '@/types/AppPath'; +import { SettingsPath } from '@/types/SettingsPath'; +import { useRecoilValue, useResetRecoilState } from 'recoil'; +import { useIsMatchingLocation } from '~/hooks/useIsMatchingLocation'; + import { isDefined } from '~/utils/isDefined'; export const useCleanRecoilState = () => { diff --git a/packages/twenty-front/src/modules/apollo/hooks/useApolloFactory.ts b/packages/twenty-front/src/modules/apollo/hooks/useApolloFactory.ts index b70cbdd17..104364957 100644 --- a/packages/twenty-front/src/modules/apollo/hooks/useApolloFactory.ts +++ b/packages/twenty-front/src/modules/apollo/hooks/useApolloFactory.ts @@ -10,12 +10,12 @@ import { previousUrlState } from '@/auth/states/previousUrlState'; import { tokenPairState } from '@/auth/states/tokenPairState'; import { workspacesState } from '@/auth/states/workspaces'; import { isDebugModeState } from '@/client-config/states/isDebugModeState'; -import { AppPath } from '@/types/AppPath'; import { REACT_APP_SERVER_BASE_URL } from '~/config'; import { useIsMatchingLocation } from '~/hooks/useIsMatchingLocation'; import { useUpdateEffect } from '~/hooks/useUpdateEffect'; import { isDefined } from '~/utils/isDefined'; +import { AppPath } from '@/types/AppPath'; import { ApolloFactory, Options } from '../services/apollo.factory'; export const useApolloFactory = (options: Partial> = {}) => { diff --git a/packages/twenty-front/src/modules/app/effect-components/PageChangeEffect.tsx b/packages/twenty-front/src/modules/app/effect-components/PageChangeEffect.tsx index a8b05f4c0..261a04e0e 100644 --- a/packages/twenty-front/src/modules/app/effect-components/PageChangeEffect.tsx +++ b/packages/twenty-front/src/modules/app/effect-components/PageChangeEffect.tsx @@ -1,7 +1,6 @@ import { useEffect, useState } from 'react'; import { useLocation, useNavigate } from 'react-router-dom'; import { useRecoilValue } from 'recoil'; -import { IconCheckbox } from 'twenty-ui'; import { useOpenCreateActivityDrawer } from '@/activities/hooks/useOpenCreateActivityDrawer'; import { @@ -21,6 +20,7 @@ import { AppPath } from '@/types/AppPath'; import { PageHotkeyScope } from '@/types/PageHotkeyScope'; import { SettingsPath } from '@/types/SettingsPath'; import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope'; +import { IconCheckbox } from 'twenty-ui'; import { useCleanRecoilState } from '~/hooks/useCleanRecoilState'; import { useIsMatchingLocation } from '~/hooks/useIsMatchingLocation'; import { usePageChangeEffectNavigateLocation } from '~/hooks/usePageChangeEffectNavigateLocation'; diff --git a/packages/twenty-front/src/modules/auth/sign-in-up/hooks/useSignInUp.tsx b/packages/twenty-front/src/modules/auth/sign-in-up/hooks/useSignInUp.tsx index a80473854..53994713c 100644 --- a/packages/twenty-front/src/modules/auth/sign-in-up/hooks/useSignInUp.tsx +++ b/packages/twenty-front/src/modules/auth/sign-in-up/hooks/useSignInUp.tsx @@ -5,20 +5,20 @@ import { useParams, useSearchParams } from 'react-router-dom'; import { Form } from '@/auth/sign-in-up/hooks/useSignInUpForm'; import { useReadCaptchaToken } from '@/captcha/hooks/useReadCaptchaToken'; import { useRequestFreshCaptchaToken } from '@/captcha/hooks/useRequestFreshCaptchaToken'; -import { AppPath } from '@/types/AppPath'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { useIsMatchingLocation } from '~/hooks/useIsMatchingLocation'; import { useRecoilState, useSetRecoilState } from 'recoil'; +import { useIsMatchingLocation } from '~/hooks/useIsMatchingLocation'; import { isDefined } from '~/utils/isDefined'; -import { useAuth } from '../../hooks/useAuth'; +import { useSSO } from '@/auth/sign-in-up/hooks/useSSO'; +import { availableSSOIdentityProvidersState } from '@/auth/states/availableWorkspacesForSSO'; import { SignInUpStep, signInUpStepState, } from '@/auth/states/signInUpStepState'; -import { useSSO } from '@/auth/sign-in-up/hooks/useSSO'; -import { availableSSOIdentityProvidersState } from '@/auth/states/availableWorkspacesForSSO'; +import { AppPath } from '@/types/AppPath'; +import { useAuth } from '../../hooks/useAuth'; export enum SignInUpMode { SignIn = 'sign-in', diff --git a/packages/twenty-front/src/modules/auth/sign-in-up/hooks/useWorkspaceFromInviteHash.ts b/packages/twenty-front/src/modules/auth/sign-in-up/hooks/useWorkspaceFromInviteHash.ts index a51365b98..0e238c3ab 100644 --- a/packages/twenty-front/src/modules/auth/sign-in-up/hooks/useWorkspaceFromInviteHash.ts +++ b/packages/twenty-front/src/modules/auth/sign-in-up/hooks/useWorkspaceFromInviteHash.ts @@ -3,11 +3,12 @@ import { useNavigate, useParams } from 'react-router-dom'; import { useRecoilValue, useSetRecoilState } from 'recoil'; import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState'; -import { AppPath } from '@/types/AppPath'; + import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; import { isDefaultLayoutAuthModalVisibleState } from '@/ui/layout/states/isDefaultLayoutAuthModalVisibleState'; +import { AppPath } from '@/types/AppPath'; import { useGetWorkspaceFromInviteHashQuery } from '~/generated/graphql'; import { isDefined } from '~/utils/isDefined'; diff --git a/packages/twenty-front/src/modules/navigation/components/__stories__/AppNavigationDrawer.stories.tsx b/packages/twenty-front/src/modules/navigation/components/__stories__/AppNavigationDrawer.stories.tsx index 3bb6f1aca..b7db0bd26 100644 --- a/packages/twenty-front/src/modules/navigation/components/__stories__/AppNavigationDrawer.stories.tsx +++ b/packages/twenty-front/src/modules/navigation/components/__stories__/AppNavigationDrawer.stories.tsx @@ -4,13 +4,12 @@ import { MemoryRouter } from 'react-router-dom'; import { useSetRecoilState } from 'recoil'; import { currentMobileNavigationDrawerState } from '@/navigation/states/currentMobileNavigationDrawerState'; -import { AppPath } from '@/types/AppPath'; - import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; import { IconsProviderDecorator } from '~/testing/decorators/IconsProviderDecorator'; import { ObjectMetadataItemsDecorator } from '~/testing/decorators/ObjectMetadataItemsDecorator'; import { SnackBarDecorator } from '~/testing/decorators/SnackBarDecorator'; +import { AppPath } from '@/types/AppPath'; import { isNavigationDrawerExpandedState } from '@/ui/navigation/states/isNavigationDrawerExpanded'; import { AppNavigationDrawer, diff --git a/packages/twenty-front/src/modules/navigation/utils/__tests__/indexAppPath.test.ts b/packages/twenty-front/src/modules/navigation/utils/__tests__/indexAppPath.test.ts index 8920f6fa7..294dd6a5f 100644 --- a/packages/twenty-front/src/modules/navigation/utils/__tests__/indexAppPath.test.ts +++ b/packages/twenty-front/src/modules/navigation/utils/__tests__/indexAppPath.test.ts @@ -1,5 +1,4 @@ import { AppPath } from '@/types/AppPath'; - import indexAppPath from '../indexAppPath'; describe('getIndexAppPath', () => { diff --git a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsConnectedAccountsRowRightContainer.tsx b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsConnectedAccountsRowRightContainer.tsx index 2091be236..37ffe2a3c 100644 --- a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsConnectedAccountsRowRightContainer.tsx +++ b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsConnectedAccountsRowRightContainer.tsx @@ -2,7 +2,7 @@ import { ConnectedAccount } from '@/accounts/types/ConnectedAccount'; import { SettingsAccountsRowDropdownMenu } from '@/settings/accounts/components/SettingsAccountsRowDropdownMenu'; import { SyncStatus } from '@/settings/accounts/constants/SyncStatus'; import { computeSyncStatus } from '@/settings/accounts/utils/computeSyncStatus'; -import { Status } from '@/ui/display/status/components/Status'; +import { Status } from 'twenty-ui'; import styled from '@emotion/styled'; const StyledRowRightContainer = styled.div` diff --git a/packages/twenty-front/src/modules/settings/accounts/hooks/useTriggerGoogleApisOAuth.ts b/packages/twenty-front/src/modules/settings/accounts/hooks/useTriggerGoogleApisOAuth.ts index 921ebdea1..d17e4242a 100644 --- a/packages/twenty-front/src/modules/settings/accounts/hooks/useTriggerGoogleApisOAuth.ts +++ b/packages/twenty-front/src/modules/settings/accounts/hooks/useTriggerGoogleApisOAuth.ts @@ -1,6 +1,6 @@ +import { AppPath } from '@/types/AppPath'; import { useCallback } from 'react'; -import { AppPath } from '@/types/AppPath'; import { REACT_APP_SERVER_BASE_URL } from '~/config'; import { CalendarChannelVisibility, diff --git a/packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationComponent.tsx b/packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationComponent.tsx index d6e6286b4..ec2a4fcbf 100644 --- a/packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationComponent.tsx +++ b/packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationComponent.tsx @@ -1,10 +1,17 @@ import { css } from '@emotion/react'; import styled from '@emotion/styled'; -import { Link } from 'react-router-dom'; -import { Button, IconArrowUpRight, IconBolt, IconPlus, Pill } from 'twenty-ui'; +import { + Button, + IconArrowUpRight, + IconBolt, + IconPlus, + Pill, + Status, +} from 'twenty-ui'; import { SettingsIntegration } from '@/settings/integrations/types/SettingsIntegration'; -import { Status } from '@/ui/display/status/components/Status'; +import { Link } from 'react-router-dom'; + import { isDefined } from '~/utils/isDefined'; interface SettingsIntegrationComponentProps { diff --git a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSyncStatus.tsx b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSyncStatus.tsx index a0a0005a0..aa8162ce8 100644 --- a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSyncStatus.tsx +++ b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSyncStatus.tsx @@ -1,5 +1,5 @@ import { useGetDatabaseConnectionTables } from '@/databases/hooks/useGetDatabaseConnectionTables'; -import { Status } from '@/ui/display/status/components/Status'; +import { Status } from 'twenty-ui'; import { RemoteTableStatus } from '~/generated-metadata/graphql'; import { isDefined } from '~/utils/isDefined'; diff --git a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationEditDatabaseConnectionContent.tsx b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationEditDatabaseConnectionContent.tsx index 1a4d1a5d3..e125c0a27 100644 --- a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationEditDatabaseConnectionContent.tsx +++ b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationEditDatabaseConnectionContent.tsx @@ -10,7 +10,6 @@ import { import { SettingsIntegration } from '@/settings/integrations/types/SettingsIntegration'; import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Info } from '@/ui/display/info/components/Info'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; import { zodResolver } from '@hookform/resolvers/zod'; @@ -18,7 +17,7 @@ import { Section } from '@react-email/components'; import pick from 'lodash.pick'; import { FormProvider, useForm } from 'react-hook-form'; import { useNavigate } from 'react-router-dom'; -import { Breadcrumb, H2Title } from 'twenty-ui'; +import { Breadcrumb, H2Title, Info } from 'twenty-ui'; import { z } from 'zod'; import { RemoteServer, diff --git a/packages/twenty-front/src/modules/settings/integrations/database-connection/hooks/useDatabaseConnection.ts b/packages/twenty-front/src/modules/settings/integrations/database-connection/hooks/useDatabaseConnection.ts index 3353c39dd..ec3c73df0 100644 --- a/packages/twenty-front/src/modules/settings/integrations/database-connection/hooks/useDatabaseConnection.ts +++ b/packages/twenty-front/src/modules/settings/integrations/database-connection/hooks/useDatabaseConnection.ts @@ -1,6 +1,6 @@ +import { WatchQueryFetchPolicy } from '@apollo/client'; import { useEffect } from 'react'; import { useNavigate, useParams } from 'react-router-dom'; -import { WatchQueryFetchPolicy } from '@apollo/client'; import { useGetDatabaseConnection } from '@/databases/hooks/useGetDatabaseConnection'; import { useGetDatabaseConnectionTables } from '@/databases/hooks/useGetDatabaseConnectionTables'; diff --git a/packages/twenty-front/src/modules/settings/security/components/SettingsSSOIdentityProviderRowRightContainer.tsx b/packages/twenty-front/src/modules/settings/security/components/SettingsSSOIdentityProviderRowRightContainer.tsx index 64d8d1402..eab5f84d6 100644 --- a/packages/twenty-front/src/modules/settings/security/components/SettingsSSOIdentityProviderRowRightContainer.tsx +++ b/packages/twenty-front/src/modules/settings/security/components/SettingsSSOIdentityProviderRowRightContainer.tsx @@ -3,7 +3,7 @@ import { SettingsSecuritySSORowDropdownMenu } from '@/settings/security/components/SettingsSecuritySSORowDropdownMenu'; import { SSOIdentitiesProvidersState } from '@/settings/security/states/SSOIdentitiesProviders.state'; import { getColorBySSOIdentityProviderStatus } from '@/settings/security/utils/getColorBySSOIdentityProviderStatus'; -import { Status } from '@/ui/display/status/components/Status'; +import { Status } from 'twenty-ui'; import styled from '@emotion/styled'; import { UnwrapRecoilValue } from 'recoil'; diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/hooks/useWorkspaceSwitching.ts b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/hooks/useWorkspaceSwitching.ts index dfdd4082b..b7e7abf9f 100644 --- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/hooks/useWorkspaceSwitching.ts +++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/hooks/useWorkspaceSwitching.ts @@ -1,18 +1,18 @@ import { useRecoilValue, useSetRecoilState } from 'recoil'; +import { useAuth } from '@/auth/hooks/useAuth'; +import { useSSO } from '@/auth/sign-in-up/hooks/useSSO'; +import { availableSSOIdentityProvidersState } from '@/auth/states/availableWorkspacesForSSO'; import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState'; +import { + SignInUpStep, + signInUpStepState, +} from '@/auth/states/signInUpStepState'; import { tokenPairState } from '@/auth/states/tokenPairState'; import { AppPath } from '@/types/AppPath'; import { useGenerateJwtMutation } from '~/generated/graphql'; import { isDefined } from '~/utils/isDefined'; import { sleep } from '~/utils/sleep'; -import { useSSO } from '@/auth/sign-in-up/hooks/useSSO'; -import { - SignInUpStep, - signInUpStepState, -} from '@/auth/states/signInUpStepState'; -import { availableSSOIdentityProvidersState } from '@/auth/states/availableWorkspacesForSSO'; -import { useAuth } from '@/auth/hooks/useAuth'; export const useWorkspaceSwitching = () => { const setTokenPair = useSetRecoilState(tokenPairState); diff --git a/packages/twenty-front/src/pages/auth/Authorize.tsx b/packages/twenty-front/src/pages/auth/Authorize.tsx index 1019907d2..f2745a754 100644 --- a/packages/twenty-front/src/pages/auth/Authorize.tsx +++ b/packages/twenty-front/src/pages/auth/Authorize.tsx @@ -2,6 +2,7 @@ import { AppPath } from '@/types/AppPath'; import styled from '@emotion/styled'; import { useEffect, useState } from 'react'; import { useNavigate, useSearchParams } from 'react-router-dom'; + import { MainButton, UndecoratedLink } from 'twenty-ui'; import { useAuthorizeAppMutation } from '~/generated/graphql'; import { isDefined } from '~/utils/isDefined'; diff --git a/packages/twenty-front/src/pages/auth/__stories__/Invite.stories.tsx b/packages/twenty-front/src/pages/auth/__stories__/Invite.stories.tsx index 3d35bb0b1..85665e8be 100644 --- a/packages/twenty-front/src/pages/auth/__stories__/Invite.stories.tsx +++ b/packages/twenty-front/src/pages/auth/__stories__/Invite.stories.tsx @@ -3,7 +3,6 @@ import { Meta, StoryObj } from '@storybook/react'; import { fireEvent, within } from '@storybook/test'; import { HttpResponse, graphql } from 'msw'; -import { AppPath } from '@/types/AppPath'; import { GET_CURRENT_USER } from '@/users/graphql/queries/getCurrentUser'; import { GET_WORKSPACE_FROM_INVITE_HASH } from '@/workspace/graphql/queries/getWorkspaceFromInviteHash'; import { @@ -12,6 +11,7 @@ import { } from '~/testing/decorators/PageDecorator'; import { graphqlMocks } from '~/testing/graphqlMocks'; +import { AppPath } from '@/types/AppPath'; import { Invite } from '../Invite'; const meta: Meta = { diff --git a/packages/twenty-front/src/pages/auth/__stories__/SignInUp.stories.tsx b/packages/twenty-front/src/pages/auth/__stories__/SignInUp.stories.tsx index 3805d33ad..1ce73e337 100644 --- a/packages/twenty-front/src/pages/auth/__stories__/SignInUp.stories.tsx +++ b/packages/twenty-front/src/pages/auth/__stories__/SignInUp.stories.tsx @@ -1,9 +1,8 @@ import { getOperationName } from '@apollo/client/utilities'; import { Meta, StoryObj } from '@storybook/react'; import { fireEvent, within } from '@storybook/test'; -import { graphql, HttpResponse } from 'msw'; +import { HttpResponse, graphql } from 'msw'; -import { AppPath } from '@/types/AppPath'; import { GET_CURRENT_USER } from '@/users/graphql/queries/getCurrentUser'; import { PageDecorator, @@ -11,6 +10,7 @@ import { } from '~/testing/decorators/PageDecorator'; import { graphqlMocks } from '~/testing/graphqlMocks'; +import { AppPath } from '@/types/AppPath'; import { SignInUp } from '../SignInUp'; const meta: Meta = { diff --git a/packages/twenty-front/src/pages/impersonate/ImpersonateEffect.tsx b/packages/twenty-front/src/pages/impersonate/ImpersonateEffect.tsx index 897ab095f..6ac9d3f6c 100644 --- a/packages/twenty-front/src/pages/impersonate/ImpersonateEffect.tsx +++ b/packages/twenty-front/src/pages/impersonate/ImpersonateEffect.tsx @@ -1,6 +1,6 @@ +import { isNonEmptyString } from '@sniptt/guards'; import { useCallback, useEffect } from 'react'; import { useNavigate, useParams } from 'react-router-dom'; -import { isNonEmptyString } from '@sniptt/guards'; import { useRecoilState, useSetRecoilState } from 'recoil'; import { useIsLogged } from '@/auth/hooks/useIsLogged'; diff --git a/packages/twenty-front/src/pages/impersonate/__stories__/ImpersonateEffect.stories.tsx b/packages/twenty-front/src/pages/impersonate/__stories__/ImpersonateEffect.stories.tsx index 98fdde17b..b1b44773e 100644 --- a/packages/twenty-front/src/pages/impersonate/__stories__/ImpersonateEffect.stories.tsx +++ b/packages/twenty-front/src/pages/impersonate/__stories__/ImpersonateEffect.stories.tsx @@ -1,6 +1,5 @@ import { Meta, StoryObj } from '@storybook/react'; -import { AppPath } from '@/types/AppPath'; import { PageDecorator, PageDecoratorArgs, @@ -8,6 +7,7 @@ import { import { graphqlMocks } from '~/testing/graphqlMocks'; import { sleep } from '~/utils/sleep'; +import { AppPath } from '@/types/AppPath'; import { ImpersonateEffect } from '../ImpersonateEffect'; const meta: Meta = { diff --git a/packages/twenty-front/src/pages/not-found/NotFound.tsx b/packages/twenty-front/src/pages/not-found/NotFound.tsx index dee24fc8c..2d44a51e7 100644 --- a/packages/twenty-front/src/pages/not-found/NotFound.tsx +++ b/packages/twenty-front/src/pages/not-found/NotFound.tsx @@ -1,5 +1,6 @@ import { SignInBackgroundMockPage } from '@/sign-in-background-mock/components/SignInBackgroundMockPage'; import { AppPath } from '@/types/AppPath'; + import { PageTitle } from '@/ui/utilities/page-title/components/PageTitle'; import styled from '@emotion/styled'; import { diff --git a/packages/twenty-front/src/pages/onboarding/InviteTeam.tsx b/packages/twenty-front/src/pages/onboarding/InviteTeam.tsx index 42dac7188..c55be7111 100644 --- a/packages/twenty-front/src/pages/onboarding/InviteTeam.tsx +++ b/packages/twenty-front/src/pages/onboarding/InviteTeam.tsx @@ -4,7 +4,6 @@ import { currentUserState } from '@/auth/states/currentUserState'; import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState'; import { useSetNextOnboardingStatus } from '@/onboarding/hooks/useSetNextOnboardingStatus'; import { PageHotkeyScope } from '@/types/PageHotkeyScope'; -import { SeparatorLineText } from '@/ui/display/text/components/SeparatorLineText'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; import { TextInputV2 } from '@/ui/input/components/TextInputV2'; @@ -27,8 +26,10 @@ import { IconCopy, LightButton, MainButton, + SeparatorLineText, } from 'twenty-ui'; import { z } from 'zod'; + import { OnboardingStatus } from '~/generated/graphql'; import { isDefined } from '~/utils/isDefined'; import { useCreateWorkspaceInvitation } from '../../modules/workspace-invitation/hooks/useCreateWorkspaceInvitation'; diff --git a/packages/twenty-front/src/pages/onboarding/PaymentSuccess.tsx b/packages/twenty-front/src/pages/onboarding/PaymentSuccess.tsx index 0e2ed08f0..d4c51f4a2 100644 --- a/packages/twenty-front/src/pages/onboarding/PaymentSuccess.tsx +++ b/packages/twenty-front/src/pages/onboarding/PaymentSuccess.tsx @@ -1,7 +1,3 @@ -import { SubTitle } from '@/auth/components/SubTitle'; -import { Title } from '@/auth/components/Title'; -import { currentUserState } from '@/auth/states/currentUserState'; -import { AppPath } from '@/types/AppPath'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { useRecoilValue } from 'recoil'; @@ -12,6 +8,11 @@ import { RGBA, UndecoratedLink, } from 'twenty-ui'; + +import { SubTitle } from '@/auth/components/SubTitle'; +import { Title } from '@/auth/components/Title'; +import { currentUserState } from '@/auth/states/currentUserState'; +import { AppPath } from '@/types/AppPath'; import { OnboardingStatus } from '~/generated/graphql'; const StyledCheckContainer = styled.div` diff --git a/packages/twenty-front/src/pages/onboarding/SyncEmails.tsx b/packages/twenty-front/src/pages/onboarding/SyncEmails.tsx index 607e9fe80..4657a2aba 100644 --- a/packages/twenty-front/src/pages/onboarding/SyncEmails.tsx +++ b/packages/twenty-front/src/pages/onboarding/SyncEmails.tsx @@ -1,12 +1,3 @@ -import { SubTitle } from '@/auth/components/SubTitle'; -import { Title } from '@/auth/components/Title'; -import { currentUserState } from '@/auth/states/currentUserState'; -import { OnboardingSyncEmailsSettingsCard } from '@/onboarding/components/OnboardingSyncEmailsSettingsCard'; -import { useSetNextOnboardingStatus } from '@/onboarding/hooks/useSetNextOnboardingStatus'; -import { useTriggerGoogleApisOAuth } from '@/settings/accounts/hooks/useTriggerGoogleApisOAuth'; -import { AppPath } from '@/types/AppPath'; -import { PageHotkeyScope } from '@/types/PageHotkeyScope'; -import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { useState } from 'react'; @@ -14,6 +5,16 @@ import { useRecoilValue } from 'recoil'; import { Key } from 'ts-key-enum'; import { ActionLink, IconGoogle, MainButton } from 'twenty-ui'; +import { SubTitle } from '@/auth/components/SubTitle'; +import { Title } from '@/auth/components/Title'; +import { currentUserState } from '@/auth/states/currentUserState'; +import { OnboardingSyncEmailsSettingsCard } from '@/onboarding/components/OnboardingSyncEmailsSettingsCard'; +import { useSetNextOnboardingStatus } from '@/onboarding/hooks/useSetNextOnboardingStatus'; +import { useTriggerGoogleApisOAuth } from '@/settings/accounts/hooks/useTriggerGoogleApisOAuth'; +import { PageHotkeyScope } from '@/types/PageHotkeyScope'; +import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; + +import { AppPath } from '@/types/AppPath'; import { CalendarChannelVisibility, MessageChannelVisibility, diff --git a/packages/twenty-front/src/pages/onboarding/__stories__/CreateProfile.stories.tsx b/packages/twenty-front/src/pages/onboarding/__stories__/CreateProfile.stories.tsx index 19512ebe1..40afb5284 100644 --- a/packages/twenty-front/src/pages/onboarding/__stories__/CreateProfile.stories.tsx +++ b/packages/twenty-front/src/pages/onboarding/__stories__/CreateProfile.stories.tsx @@ -1,7 +1,7 @@ import { getOperationName } from '@apollo/client/utilities'; import { Meta, StoryObj } from '@storybook/react'; import { within } from '@storybook/test'; -import { graphql, HttpResponse } from 'msw'; +import { HttpResponse, graphql } from 'msw'; import { AppPath } from '@/types/AppPath'; import { GET_CURRENT_USER } from '@/users/graphql/queries/getCurrentUser'; diff --git a/packages/twenty-front/src/pages/onboarding/__stories__/CreateWorkspace.stories.tsx b/packages/twenty-front/src/pages/onboarding/__stories__/CreateWorkspace.stories.tsx index baccc13b2..1ac668210 100644 --- a/packages/twenty-front/src/pages/onboarding/__stories__/CreateWorkspace.stories.tsx +++ b/packages/twenty-front/src/pages/onboarding/__stories__/CreateWorkspace.stories.tsx @@ -1,7 +1,7 @@ import { getOperationName } from '@apollo/client/utilities'; import { Meta, StoryObj } from '@storybook/react'; import { within } from '@storybook/test'; -import { graphql, HttpResponse } from 'msw'; +import { HttpResponse, graphql } from 'msw'; import { AppPath } from '@/types/AppPath'; import { GET_CURRENT_USER } from '@/users/graphql/queries/getCurrentUser'; diff --git a/packages/twenty-front/src/pages/onboarding/__stories__/InviteTeam.stories.tsx b/packages/twenty-front/src/pages/onboarding/__stories__/InviteTeam.stories.tsx index e174fc517..a09846e27 100644 --- a/packages/twenty-front/src/pages/onboarding/__stories__/InviteTeam.stories.tsx +++ b/packages/twenty-front/src/pages/onboarding/__stories__/InviteTeam.stories.tsx @@ -1,10 +1,10 @@ +import { AppPath } from '@/types/AppPath'; import { getOperationName } from '@apollo/client/utilities'; import { Meta, StoryObj } from '@storybook/react'; import { within } from '@storybook/test'; -import { graphql, HttpResponse } from 'msw'; +import { HttpResponse, graphql } from 'msw'; import { OnboardingStatus } from '~/generated/graphql'; -import { AppPath } from '~/modules/types/AppPath'; import { GET_CURRENT_USER } from '~/modules/users/graphql/queries/getCurrentUser'; import { InviteTeam } from '~/pages/onboarding/InviteTeam'; import { diff --git a/packages/twenty-front/src/pages/onboarding/__stories__/PaymentSuccess.stories.tsx b/packages/twenty-front/src/pages/onboarding/__stories__/PaymentSuccess.stories.tsx index fccb1e3c6..22ed0e994 100644 --- a/packages/twenty-front/src/pages/onboarding/__stories__/PaymentSuccess.stories.tsx +++ b/packages/twenty-front/src/pages/onboarding/__stories__/PaymentSuccess.stories.tsx @@ -1,7 +1,7 @@ import { getOperationName } from '@apollo/client/utilities'; import { Meta, StoryObj } from '@storybook/react'; import { within } from '@storybook/testing-library'; -import { graphql, HttpResponse } from 'msw'; +import { HttpResponse, graphql } from 'msw'; import { AppPath } from '@/types/AppPath'; import { GET_CURRENT_USER } from '@/users/graphql/queries/getCurrentUser'; diff --git a/packages/twenty-front/src/pages/onboarding/__stories__/SyncEmails.stories.tsx b/packages/twenty-front/src/pages/onboarding/__stories__/SyncEmails.stories.tsx index 8d9b4261e..213ad3fa5 100644 --- a/packages/twenty-front/src/pages/onboarding/__stories__/SyncEmails.stories.tsx +++ b/packages/twenty-front/src/pages/onboarding/__stories__/SyncEmails.stories.tsx @@ -1,10 +1,10 @@ +import { AppPath } from '@/types/AppPath'; import { getOperationName } from '@apollo/client/utilities'; import { Meta, StoryObj } from '@storybook/react'; import { within } from '@storybook/test'; -import { graphql, HttpResponse } from 'msw'; +import { HttpResponse, graphql } from 'msw'; import { OnboardingStatus } from '~/generated/graphql'; -import { AppPath } from '~/modules/types/AppPath'; import { GET_CURRENT_USER } from '~/modules/users/graphql/queries/getCurrentUser'; import { SyncEmails } from '~/pages/onboarding/SyncEmails'; import { diff --git a/packages/twenty-front/src/pages/settings/SettingsBilling.tsx b/packages/twenty-front/src/pages/settings/SettingsBilling.tsx index e30f3e88d..bbb802add 100644 --- a/packages/twenty-front/src/pages/settings/SettingsBilling.tsx +++ b/packages/twenty-front/src/pages/settings/SettingsBilling.tsx @@ -6,6 +6,7 @@ import { IconCalendarEvent, IconCircleX, IconCreditCard, + Info, } from 'twenty-ui'; import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState'; @@ -15,7 +16,6 @@ import { SettingsPageContainer } from '@/settings/components/SettingsPageContain import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { AppPath } from '@/types/AppPath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Info } from '@/ui/display/info/components/Info'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; import { ConfirmationModal } from '@/ui/layout/modal/components/ConfirmationModal'; diff --git a/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx b/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx index 0986ea87e..6145485c2 100644 --- a/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx +++ b/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx @@ -1,3 +1,20 @@ +import { useTheme } from '@emotion/react'; +import styled from '@emotion/styled'; +import { isNonEmptyArray } from '@sniptt/guards'; +import { useState } from 'react'; +import { useRecoilValue, useSetRecoilState } from 'recoil'; +import { + AppTooltip, + Avatar, + H2Title, + IconButton, + IconMail, + IconReload, + IconTrash, + Status, + TooltipDelay, +} from 'twenty-ui'; + import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState'; import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; @@ -16,25 +33,9 @@ import { TableHeader } from '@/ui/layout/table/components/TableHeader'; import { WorkspaceMember } from '@/workspace-member/types/WorkspaceMember'; import { WorkspaceInviteLink } from '@/workspace/components/WorkspaceInviteLink'; import { WorkspaceInviteTeam } from '@/workspace/components/WorkspaceInviteTeam'; -import { useTheme } from '@emotion/react'; -import styled from '@emotion/styled'; -import { isNonEmptyArray } from '@sniptt/guards'; import { formatDistanceToNow } from 'date-fns'; -import { useState } from 'react'; -import { useRecoilValue, useSetRecoilState } from 'recoil'; -import { - AppTooltip, - Avatar, - H2Title, - IconButton, - IconMail, - IconReload, - IconTrash, - TooltipDelay, -} from 'twenty-ui'; import { useGetWorkspaceInvitationsQuery } from '~/generated/graphql'; import { isDefined } from '~/utils/isDefined'; -import { Status } from '../../modules/ui/display/status/components/Status'; import { TableCell } from '../../modules/ui/layout/table/components/TableCell'; import { TableRow } from '../../modules/ui/layout/table/components/TableRow'; import { useDeleteWorkspaceInvitation } from '../../modules/workspace-invitation/hooks/useDeleteWorkspaceInvitation'; diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectEdit.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectEdit.tsx index a4e7ab259..e8bbc303c 100644 --- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectEdit.tsx +++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectEdit.tsx @@ -1,4 +1,12 @@ /* eslint-disable react/jsx-props-no-spreading */ +import { zodResolver } from '@hookform/resolvers/zod'; +import pick from 'lodash.pick'; +import { useEffect } from 'react'; +import { FormProvider, useForm } from 'react-hook-form'; +import { useNavigate, useParams } from 'react-router-dom'; +import { Button, H2Title, IconArchive } from 'twenty-ui'; +import { z } from 'zod'; + import { useLastVisitedObjectMetadataItem } from '@/navigation/hooks/useLastVisitedObjectMetadataItem'; import { useLastVisitedView } from '@/navigation/hooks/useLastVisitedView'; import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems'; @@ -22,14 +30,7 @@ import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; import { Section } from '@/ui/layout/section/components/Section'; import { navigationMemorizedUrlState } from '@/ui/navigation/states/navigationMemorizedUrlState'; -import { zodResolver } from '@hookform/resolvers/zod'; -import pick from 'lodash.pick'; -import { useEffect } from 'react'; -import { FormProvider, useForm } from 'react-hook-form'; -import { useNavigate, useParams } from 'react-router-dom'; import { useSetRecoilState } from 'recoil'; -import { Button, H2Title, IconArchive } from 'twenty-ui'; -import { z } from 'zod'; import { computeMetadataNameFromLabelOrThrow } from '~/pages/settings/data-model/utils/compute-metadata-name-from-label.utils'; const objectEditFormSchema = z @@ -81,8 +82,8 @@ export const SettingsObjectEdit = () => { ) => { let values = formValues; if ( - formValues.shouldSyncLabelAndName ?? - activeObjectMetadataItem.shouldSyncLabelAndName + formValues.shouldSyncLabelAndName === true || + activeObjectMetadataItem.shouldSyncLabelAndName === true ) { values = { ...values, diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx index d9be092b9..1d355f08c 100644 --- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx +++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx @@ -1,3 +1,13 @@ +import { useApolloClient } from '@apollo/client'; +import { zodResolver } from '@hookform/resolvers/zod'; +import omit from 'lodash.omit'; +import pick from 'lodash.pick'; +import { useEffect } from 'react'; +import { FormProvider, useForm } from 'react-hook-form'; +import { useNavigate, useParams } from 'react-router-dom'; +import { Button, H2Title, IconArchive, IconArchiveOff } from 'twenty-ui'; +import { z } from 'zod'; + import { useFieldMetadataItem } from '@/object-metadata/hooks/useFieldMetadataItem'; import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems'; import { useGetRelationMetadata } from '@/object-metadata/hooks/useGetRelationMetadata'; @@ -23,15 +33,6 @@ import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/Snac import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; import { Section } from '@/ui/layout/section/components/Section'; -import { useApolloClient } from '@apollo/client'; -import { zodResolver } from '@hookform/resolvers/zod'; -import omit from 'lodash.omit'; -import pick from 'lodash.pick'; -import { useEffect } from 'react'; -import { FormProvider, useForm } from 'react-hook-form'; -import { useNavigate, useParams } from 'react-router-dom'; -import { Button, H2Title, IconArchive, IconArchiveOff } from 'twenty-ui'; -import { z } from 'zod'; import { FieldMetadataType } from '~/generated-metadata/graphql'; import { isDefined } from '~/utils/isDefined'; diff --git a/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationNewDatabaseConnection.tsx b/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationNewDatabaseConnection.tsx index 017eeb5c2..b3a0a5aaf 100644 --- a/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationNewDatabaseConnection.tsx +++ b/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationNewDatabaseConnection.tsx @@ -2,7 +2,6 @@ import { zodResolver } from '@hookform/resolvers/zod'; import { useEffect } from 'react'; import { FormProvider, useForm } from 'react-hook-form'; import { useNavigate, useParams } from 'react-router-dom'; -import { H2Title } from 'twenty-ui'; import { z } from 'zod'; import { useCreateOneDatabaseConnection } from '@/databases/hooks/useCreateOneDatabaseConnection'; @@ -23,6 +22,7 @@ import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/Snac import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; import { Section } from '@/ui/layout/section/components/Section'; +import { H2Title } from 'twenty-ui'; import { CreateRemoteServerInput } from '~/generated-metadata/graphql'; const createRemoteServerInputPostgresSchema = diff --git a/packages/twenty-front/tsup.ui.index.tsx b/packages/twenty-front/tsup.ui.index.tsx index b4f76b615..043ed4405 100644 --- a/packages/twenty-front/tsup.ui.index.tsx +++ b/packages/twenty-front/tsup.ui.index.tsx @@ -2,7 +2,6 @@ import { ThemeType } from 'twenty-ui'; export { ThemeProvider } from '@emotion/react'; export * from 'twenty-ui'; - export * from './src/modules/ui/input/components/AutosizeTextInput'; export * from './src/modules/ui/input/components/Checkbox'; export * from './src/modules/ui/input/components/EntityTitleDoubleTextInput'; diff --git a/packages/twenty-ui/src/display/index.ts b/packages/twenty-ui/src/display/index.ts index 3bab15bcf..b0f67a365 100644 --- a/packages/twenty-ui/src/display/index.ts +++ b/packages/twenty-ui/src/display/index.ts @@ -46,7 +46,10 @@ export * from './icon/hooks/useIcons'; export * from './icon/providers/IconsProvider'; export * from './icon/states/iconsState'; export * from './icon/types/IconComponent'; +export * from './info/components/Info'; +export * from './status/components/Status'; export * from './tag/components/Tag'; +export * from './text/components/SeparatorLineText'; export * from './tooltip/AppTooltip'; export * from './tooltip/OverflowingTextWithTooltip'; export * from './typography/components/H1Title'; diff --git a/packages/twenty-front/src/modules/ui/display/info/components/Info.tsx b/packages/twenty-ui/src/display/info/components/Info.tsx similarity index 93% rename from packages/twenty-front/src/modules/ui/display/info/components/Info.tsx rename to packages/twenty-ui/src/display/info/components/Info.tsx index 9761daf68..d865c7b63 100644 --- a/packages/twenty-front/src/modules/ui/display/info/components/Info.tsx +++ b/packages/twenty-ui/src/display/info/components/Info.tsx @@ -1,10 +1,10 @@ import { css, useTheme } from '@emotion/react'; import styled from '@emotion/styled'; +import { IconInfoCircle } from '@ui/display/icon/components/TablerIcons'; + +import { Button } from '@ui/input/button/components/Button'; import React from 'react'; import { Link } from 'react-router-dom'; -import { Button, IconInfoCircle } from 'twenty-ui'; - -import { AppPath } from '@/types/AppPath'; export type InfoAccent = 'blue' | 'danger'; export type InfoProps = { @@ -12,7 +12,7 @@ export type InfoProps = { text: string; buttonTitle?: string; onClick?: (event: React.MouseEvent) => void; - to?: AppPath; + to?: string; }; const StyledTextContainer = styled.div` diff --git a/packages/twenty-front/src/modules/ui/display/info/components/__stories__/Info.stories.tsx b/packages/twenty-ui/src/display/info/components/__stories__/Info.stories.tsx similarity index 84% rename from packages/twenty-front/src/modules/ui/display/info/components/__stories__/Info.stories.tsx rename to packages/twenty-ui/src/display/info/components/__stories__/Info.stories.tsx index 54fcdfe0b..18a4bff44 100644 --- a/packages/twenty-front/src/modules/ui/display/info/components/__stories__/Info.stories.tsx +++ b/packages/twenty-ui/src/display/info/components/__stories__/Info.stories.tsx @@ -1,7 +1,11 @@ import { Meta, StoryObj } from '@storybook/react'; -import { CatalogDecorator, CatalogStory, ComponentDecorator } from 'twenty-ui'; +import { + CatalogDecorator, + CatalogStory, + ComponentDecorator, +} from '@ui/testing'; -import { Info, InfoAccent } from '@/ui/display/info/components/Info'; +import { Info, InfoAccent } from '../Info'; const meta: Meta = { title: 'UI/Display/Info', diff --git a/packages/twenty-front/src/modules/ui/display/status/components/Status.tsx b/packages/twenty-ui/src/display/status/components/Status.tsx similarity index 91% rename from packages/twenty-front/src/modules/ui/display/status/components/Status.tsx rename to packages/twenty-ui/src/display/status/components/Status.tsx index 9a1bdaf16..7a0713573 100644 --- a/packages/twenty-front/src/modules/ui/display/status/components/Status.tsx +++ b/packages/twenty-ui/src/display/status/components/Status.tsx @@ -1,5 +1,8 @@ import styled from '@emotion/styled'; -import { Loader, ThemeColor, themeColorSchema } from 'twenty-ui'; +import { ThemeColor } from '@ui/theme'; +import { themeColorSchema } from '@ui/theme/utils/themeColorSchema'; + +import { Loader } from '@ui/feedback/loader/components/Loader'; const StyledStatus = styled.h3<{ color: ThemeColor; diff --git a/packages/twenty-front/src/modules/ui/display/status/components/__stories__/Status.stories.tsx b/packages/twenty-ui/src/display/status/components/__stories__/Status.stories.tsx similarity index 94% rename from packages/twenty-front/src/modules/ui/display/status/components/__stories__/Status.stories.tsx rename to packages/twenty-ui/src/display/status/components/__stories__/Status.stories.tsx index cd480d45a..9f98972ce 100644 --- a/packages/twenty-front/src/modules/ui/display/status/components/__stories__/Status.stories.tsx +++ b/packages/twenty-ui/src/display/status/components/__stories__/Status.stories.tsx @@ -4,9 +4,8 @@ import { CatalogDecorator, CatalogStory, ComponentDecorator, - MAIN_COLOR_NAMES, - ThemeColor, -} from 'twenty-ui'; +} from '@ui/testing'; +import { ThemeColor, MAIN_COLOR_NAMES } from '@ui/theme'; import { Status } from '../Status'; diff --git a/packages/twenty-front/src/modules/ui/display/text/components/SeparatorLineText.tsx b/packages/twenty-ui/src/display/text/components/SeparatorLineText.tsx similarity index 100% rename from packages/twenty-front/src/modules/ui/display/text/components/SeparatorLineText.tsx rename to packages/twenty-ui/src/display/text/components/SeparatorLineText.tsx diff --git a/packages/twenty-front/src/modules/ui/display/text/components/__stories__/SeparatorLineText.stories.tsx b/packages/twenty-ui/src/display/text/components/__stories__/SeparatorLineText.stories.tsx similarity index 89% rename from packages/twenty-front/src/modules/ui/display/text/components/__stories__/SeparatorLineText.stories.tsx rename to packages/twenty-ui/src/display/text/components/__stories__/SeparatorLineText.stories.tsx index 66e0cad72..d7b15a5ef 100644 --- a/packages/twenty-front/src/modules/ui/display/text/components/__stories__/SeparatorLineText.stories.tsx +++ b/packages/twenty-ui/src/display/text/components/__stories__/SeparatorLineText.stories.tsx @@ -1,5 +1,5 @@ import { Meta, StoryObj } from '@storybook/react'; -import { ComponentDecorator } from 'twenty-ui'; +import { ComponentDecorator } from '@ui/testing'; import { SeparatorLineText } from '../SeparatorLineText'; diff --git a/packages/twenty-ui/src/input/button/components/Button.tsx b/packages/twenty-ui/src/input/button/components/Button.tsx index 6a6b49b03..6487178e4 100644 --- a/packages/twenty-ui/src/input/button/components/Button.tsx +++ b/packages/twenty-ui/src/input/button/components/Button.tsx @@ -1,8 +1,8 @@ import isPropValid from '@emotion/is-prop-valid'; import { css, useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { Pill } from '@ui/components'; -import { IconComponent } from '@ui/display'; +import { Pill } from '@ui/components/Pill/Pill'; +import { IconComponent } from '@ui/display/icon/types/IconComponent'; import React from 'react'; import { Link } from 'react-router-dom';