From 0a28c15747d58f7fcc2dfc860b4e216c8b604e8e Mon Sep 17 00:00:00 2001 From: "gitstart-app[bot]" <57568882+gitstart-app[bot]@users.noreply.github.com> Date: Thu, 24 Oct 2024 13:20:02 +0200 Subject: [PATCH] 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 Co-authored-by: Charles Bochet --- .../blocks/components/FileBlock.tsx | 2 +- .../components/EmailThreadBottomBar.tsx | 4 +- .../components/IntermediaryMessages.tsx | 3 +- .../components/RightDrawerEmailThread.tsx | 3 +- .../files/components/AttachmentDropdown.tsx | 2 +- .../files/components/Attachments.tsx | 2 +- .../activities/notes/components/Notes.tsx | 15 ++++--- .../tasks/components/AddTaskButton.tsx | 3 +- .../tasks/components/TaskGroups.tsx | 5 +-- .../components/TimelineCreateButtonGroup.tsx | 13 ++++--- .../rows/components/EventCardToggleButton.tsx | 4 +- .../sign-in-up/components/SignInUpForm.tsx | 24 +++++++----- .../command-menu/components/CommandMenu.tsx | 10 ++++- .../components/GenericErrorFallback.tsx | 3 +- .../components/InformationBanner.tsx | 3 +- .../components/KeyboardShortcutMenuDialog.tsx | 4 +- .../AddObjectFilterFromDetailsButton.tsx | 3 +- .../components/RecordBoardCard.tsx | 2 +- .../components/RecordBoardColumnHeader.tsx | 3 +- .../components/LightCopyIconButton.tsx | 3 +- .../input/components/MultiItemFieldInput.tsx | 3 +- .../RecordIndexPageKanbanAddButton.tsx | 3 +- .../components/RecordInlineCellEditButton.tsx | 8 ++-- .../RecordDetailRelationRecordsListItem.tsx | 2 +- .../RecordDetailRelationSection.tsx | 3 +- .../RecordTableEmptyStateDisplay.tsx | 2 +- .../components/RecordTableCellButton.tsx | 8 ++-- .../components/RecordTableHeaderCell.tsx | 3 +- .../SettingsAccountsBlocklistInput.tsx | 6 +-- .../SettingsAccountsBlocklistTableRow.tsx | 4 +- .../SettingsAccountsListEmptyStateCard.tsx | 3 +- .../SettingsAccountsRowDropdownMenu.tsx | 2 +- .../SaveAndCancelButtons/CancelButton.tsx | 2 +- .../SaveAndCancelButtons/SaveButton.tsx | 4 +- ...ngsDataModelNewFieldBreadcrumbDropDown.tsx | 3 +- ...ttingsDataModelFieldNumberDecimalInput.tsx | 3 +- .../SettingsDataModelFieldSelectForm.tsx | 3 +- ...tingsDataModelFieldSelectFormOptionRow.tsx | 2 +- .../components/SettingsDataModelOverview.tsx | 15 +++---- ...ettingsObjectFieldActiveActionDropdown.tsx | 2 +- ...tingsObjectFieldDisabledActionDropdown.tsx | 2 +- .../SettingsObjectFieldItemTableRow.tsx | 32 ++++++++------- .../components/SettingsObjectSummaryCard.tsx | 9 ++++- .../components/SettingsObjectCoverImage.tsx | 3 +- .../SettingsObjectInactiveMenuDropDown.tsx | 8 +++- .../developers/components/ApiKeyInput.tsx | 3 +- .../SettingsReadDocumentationButton.tsx | 4 +- .../SettingsIntegrationComponent.tsx | 5 +-- ...ingsIntegrationRemoteTableSchemaUpdate.tsx | 3 +- ...tegrationDatabaseConnectionSummaryCard.tsx | 15 ++++--- ...IntegrationDatabaseConnectionsListCard.tsx | 5 +-- .../profile/components/ChangePassword.tsx | 3 +- .../profile/components/DeleteAccount.tsx | 3 +- .../profile/components/DeleteWorkspace.tsx | 3 +- ...OIdentitiesProvidersListEmptyStateCard.tsx | 6 +-- .../components/SettingsSSOOIDCForm.tsx | 3 +- .../components/SettingsSSOSAMLForm.tsx | 2 +- .../SettingsSecuritySSORowDropdownMenu.tsx | 8 +++- .../SettingsServerlessFunctionsTableEmpty.tsx | 2 +- ...ettingsServerlessFunctionCodeEditorTab.tsx | 9 ++++- .../SettingsServerlessFunctionSettingsTab.tsx | 3 +- ...FunctionTabEnvironmentVariableTableRow.tsx | 22 +++++------ ...FunctionTabEnvironmentVariablesSection.tsx | 29 ++++++++------ .../SettingsServerlessFunctionTestTab.tsx | 3 +- .../components/ModalCloseButton.tsx | 3 +- .../components/StepNavigationButton.tsx | 2 +- .../UploadStep/components/DropZone.tsx | 2 +- .../ValidationStep/ValidationStep.tsx | 39 +++++++++---------- .../support/components/SupportButton.tsx | 3 +- .../ui/display/info/components/Info.tsx | 7 ++-- .../dialog-manager/components/Dialog.tsx | 2 +- .../snack-bar-manager/components/SnackBar.tsx | 4 +- .../ui/input/components/AutosizeTextInput.tsx | 6 +-- .../ui/input/components/IconPicker.tsx | 11 ++++-- .../ui/input/components/ImageInput.tsx | 3 +- .../components/AbsoluteDatePickerHeader.tsx | 3 +- .../__stories__/BottomBar.stories.tsx | 6 +-- .../components/DropdownMenuHeader.tsx | 6 +-- .../__stories__/DropdownMenu.stories.tsx | 3 +- .../modal/components/ConfirmationModal.tsx | 3 +- .../layout/page/components/PageAddButton.tsx | 4 +- .../page/components/PageFavoriteButton.tsx | 4 +- .../ui/layout/page/components/PageHeader.tsx | 2 +- .../RightDrawerTopBarCloseButton.tsx | 4 +- .../RightDrawerTopBarExpandButton.tsx | 3 +- .../RightDrawerTopBarMinimizeButton.tsx | 3 +- .../components/ShowPageAddButton.tsx | 3 +- .../components/ShowPageMoreButton.tsx | 8 +++- .../menu-item/components/MenuItem.tsx | 10 +++-- .../menu-item/components/MenuItemAvatar.tsx | 7 ++-- .../components/MenuItemDraggable.tsx | 4 +- .../NavigationDrawerCollapseButton.tsx | 2 +- .../components/UpdateViewButtonGroup.tsx | 4 +- .../components/ViewPickerCreateButton.tsx | 2 +- .../components/ViewPickerEditButton.tsx | 2 +- .../RecordShowPageWorkflowHeader.tsx | 2 +- .../RecordShowPageWorkflowVersionHeader.tsx | 9 ++++- .../WorkflowDiagramCreateStepNode.tsx | 3 +- .../WorkflowDiagramStepNodeEditable.tsx | 3 +- .../components/WorkspaceInviteLink.tsx | 3 +- .../components/WorkspaceInviteTeam.tsx | 3 +- .../twenty-front/src/pages/auth/Authorize.tsx | 6 +-- .../twenty-front/src/pages/auth/Invite.tsx | 10 ++--- .../src/pages/auth/PasswordReset.tsx | 26 ++++++------- .../src/pages/auth/SSOWorkspaceSelection.tsx | 2 +- .../src/pages/not-found/NotFound.tsx | 6 +-- .../src/pages/onboarding/ChooseYourPlan.tsx | 12 +++--- .../src/pages/onboarding/CreateProfile.tsx | 7 ++-- .../src/pages/onboarding/CreateWorkspace.tsx | 7 ++-- .../src/pages/onboarding/InviteTeam.tsx | 33 +++++++++------- .../src/pages/onboarding/PaymentSuccess.tsx | 16 +++++--- .../src/pages/onboarding/SyncEmails.tsx | 15 ++++--- .../src/pages/settings/SettingsBilling.tsx | 2 +- .../settings/SettingsWorkspaceMembers.tsx | 31 +++++++-------- .../SettingsObjectDetailPageContent.tsx | 3 +- .../data-model/SettingsObjectEdit.tsx | 16 ++++---- .../data-model/SettingsObjectFieldEdit.tsx | 20 +++++----- .../settings/data-model/SettingsObjects.tsx | 21 +++++----- .../developers/SettingsDevelopers.tsx | 8 ++-- .../SettingsDevelopersApiKeyDetail.tsx | 3 +- .../SettingsDevelopersWebhookDetail.tsx | 4 +- .../SettingsServerlessFunctions.tsx | 3 +- packages/twenty-front/tsup.ui.index.tsx | 10 ----- .../src}/input/button/components/Button.tsx | 3 +- .../input/button/components/ButtonGroup.tsx | 4 +- .../button/components/ColorPickerButton.tsx | 5 +-- .../button/components/FloatingButton.tsx | 2 +- .../button/components/FloatingButtonGroup.tsx | 4 +- .../button/components/FloatingIconButton.tsx | 2 +- .../components/FloatingIconButtonGroup.tsx | 4 +- .../input/button/components/IconButton.tsx | 2 +- .../button/components/IconButtonGroup.tsx | 4 +- .../input/button/components/LightButton.tsx | 4 +- .../button/components/LightIconButton.tsx | 4 +- .../components/LightIconButtonGroup.tsx | 4 +- .../input/button/components/MainButton.tsx | 2 +- .../button/components/RoundedIconButton.tsx | 2 +- .../components/__stories__/Button.docs.mdx | 0 .../components/__stories__/Button.stories.tsx | 5 +-- .../__stories__/ButtonGroup.stories.tsx | 7 +--- .../__stories__/ColorPickerButton.stories.tsx | 3 +- .../__stories__/FloatingButton.stories.tsx | 5 +-- .../FloatingButtonGroup.stories.tsx | 7 +--- .../FloatingIconButton.stories.tsx | 5 +-- .../FloatingIconButtonGroup.stories.tsx | 7 +--- .../__stories__/IconButton.stories.tsx | 5 +-- .../__stories__/IconButtonGroup.stories.tsx | 7 +--- .../__stories__/LightButton.stories.tsx | 5 +-- .../__stories__/LightIconButton.stories.tsx | 5 +-- .../__stories__/MainButton.stories.tsx | 4 +- .../__stories__/RoundedIconButton.stories.tsx | 4 +- packages/twenty-ui/src/input/index.ts | 14 +++++++ 152 files changed, 450 insertions(+), 505 deletions(-) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/Button.tsx (99%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/ButtonGroup.tsx (96%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/ColorPickerButton.tsx (88%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/FloatingButton.tsx (98%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/FloatingButtonGroup.tsx (96%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/FloatingIconButton.tsx (98%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/FloatingIconButtonGroup.tsx (97%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/IconButton.tsx (99%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/IconButtonGroup.tsx (96%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/LightButton.tsx (98%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/LightIconButton.tsx (98%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/LightIconButtonGroup.tsx (96%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/MainButton.tsx (98%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/RoundedIconButton.tsx (95%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/Button.docs.mdx (100%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/Button.stories.tsx (99%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/ButtonGroup.stories.tsx (95%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/ColorPickerButton.stories.tsx (90%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/FloatingButton.stories.tsx (96%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/FloatingButtonGroup.stories.tsx (93%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/FloatingIconButton.stories.tsx (96%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/FloatingIconButtonGroup.stories.tsx (92%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/IconButton.stories.tsx (98%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/IconButtonGroup.stories.tsx (94%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/LightButton.stories.tsx (97%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/LightIconButton.stories.tsx (97%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/MainButton.stories.tsx (93%) rename packages/{twenty-front/src/modules/ui => twenty-ui/src}/input/button/components/__stories__/RoundedIconButton.stories.tsx (89%) diff --git a/packages/twenty-front/src/modules/activities/blocks/components/FileBlock.tsx b/packages/twenty-front/src/modules/activities/blocks/components/FileBlock.tsx index d1d308dcd..5c8de0386 100644 --- a/packages/twenty-front/src/modules/activities/blocks/components/FileBlock.tsx +++ b/packages/twenty-front/src/modules/activities/blocks/components/FileBlock.tsx @@ -3,8 +3,8 @@ import styled from '@emotion/styled'; import { isNonEmptyString } from '@sniptt/guards'; import { ChangeEvent, useRef } from 'react'; -import { Button } from '@/ui/input/button/components/Button'; import { AppThemeProvider } from '@/ui/theme/components/AppThemeProvider'; +import { Button } from 'twenty-ui'; import { isDefined } from '~/utils/isDefined'; import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull'; diff --git a/packages/twenty-front/src/modules/activities/emails/components/EmailThreadBottomBar.tsx b/packages/twenty-front/src/modules/activities/emails/components/EmailThreadBottomBar.tsx index c010da2cd..902039f45 100644 --- a/packages/twenty-front/src/modules/activities/emails/components/EmailThreadBottomBar.tsx +++ b/packages/twenty-front/src/modules/activities/emails/components/EmailThreadBottomBar.tsx @@ -1,7 +1,5 @@ import styled from '@emotion/styled'; -import { IconArrowBackUp, IconUserCircle } from 'twenty-ui'; - -import { Button } from '@/ui/input/button/components/Button'; +import { Button, IconArrowBackUp, IconUserCircle } from 'twenty-ui'; const StyledThreadBottomBar = styled.div` align-items: center; diff --git a/packages/twenty-front/src/modules/activities/emails/right-drawer/components/IntermediaryMessages.tsx b/packages/twenty-front/src/modules/activities/emails/right-drawer/components/IntermediaryMessages.tsx index 3ef96d573..aee31f1e1 100644 --- a/packages/twenty-front/src/modules/activities/emails/right-drawer/components/IntermediaryMessages.tsx +++ b/packages/twenty-front/src/modules/activities/emails/right-drawer/components/IntermediaryMessages.tsx @@ -1,10 +1,9 @@ import styled from '@emotion/styled'; import { useState } from 'react'; -import { IconArrowsVertical } from 'twenty-ui'; +import { Button, IconArrowsVertical } from 'twenty-ui'; import { EmailThreadMessage } from '@/activities/emails/components/EmailThreadMessage'; import { EmailThreadMessageWithSender } from '@/activities/emails/types/EmailThreadMessageWithSender'; -import { Button } from '@/ui/input/button/components/Button'; const StyledButtonContainer = styled.div` border-bottom: 1px solid ${({ theme }) => theme.border.color.light}; diff --git a/packages/twenty-front/src/modules/activities/emails/right-drawer/components/RightDrawerEmailThread.tsx b/packages/twenty-front/src/modules/activities/emails/right-drawer/components/RightDrawerEmailThread.tsx index 42367f2f9..1ac7fb651 100644 --- a/packages/twenty-front/src/modules/activities/emails/right-drawer/components/RightDrawerEmailThread.tsx +++ b/packages/twenty-front/src/modules/activities/emails/right-drawer/components/RightDrawerEmailThread.tsx @@ -9,12 +9,11 @@ import { EmailThreadMessage } from '@/activities/emails/components/EmailThreadMe import { IntermediaryMessages } from '@/activities/emails/right-drawer/components/IntermediaryMessages'; import { useRightDrawerEmailThread } from '@/activities/emails/right-drawer/hooks/useRightDrawerEmailThread'; import { emailThreadIdWhenEmailThreadWasClosedState } from '@/activities/emails/states/lastViewableEmailThreadIdState'; -import { Button } from '@/ui/input/button/components/Button'; import { RIGHT_DRAWER_CLICK_OUTSIDE_LISTENER_ID } from '@/ui/layout/right-drawer/constants/RightDrawerClickOutsideListener'; import { messageThreadState } from '@/ui/layout/right-drawer/states/messageThreadState'; import { useClickOutsideListener } from '@/ui/utilities/pointer-event/hooks/useClickOutsideListener'; import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; -import { IconArrowBackUp } from 'twenty-ui'; +import { Button, IconArrowBackUp } from 'twenty-ui'; const StyledWrapper = styled.div` display: flex; diff --git a/packages/twenty-front/src/modules/activities/files/components/AttachmentDropdown.tsx b/packages/twenty-front/src/modules/activities/files/components/AttachmentDropdown.tsx index 7dc80b171..a52aa4c91 100644 --- a/packages/twenty-front/src/modules/activities/files/components/AttachmentDropdown.tsx +++ b/packages/twenty-front/src/modules/activities/files/components/AttachmentDropdown.tsx @@ -3,9 +3,9 @@ import { IconDownload, IconPencil, IconTrash, + LightIconButton, } from 'twenty-ui'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; diff --git a/packages/twenty-front/src/modules/activities/files/components/Attachments.tsx b/packages/twenty-front/src/modules/activities/files/components/Attachments.tsx index 0ab90a7e0..1cc6de187 100644 --- a/packages/twenty-front/src/modules/activities/files/components/Attachments.tsx +++ b/packages/twenty-front/src/modules/activities/files/components/Attachments.tsx @@ -6,6 +6,7 @@ import { AnimatedPlaceholderEmptySubTitle, AnimatedPlaceholderEmptyTextContainer, AnimatedPlaceholderEmptyTitle, + Button, EMPTY_PLACEHOLDER_TRANSITION_PROPS, IconPlus, } from 'twenty-ui'; @@ -16,7 +17,6 @@ import { DropZone } from '@/activities/files/components/DropZone'; import { useAttachments } from '@/activities/files/hooks/useAttachments'; import { useUploadAttachmentFile } from '@/activities/files/hooks/useUploadAttachmentFile'; import { ActivityTargetableObject } from '@/activities/types/ActivityTargetableEntity'; -import { Button } from '@/ui/input/button/components/Button'; import { isDefined } from '~/utils/isDefined'; const StyledAttachmentsContainer = styled.div` diff --git a/packages/twenty-front/src/modules/activities/notes/components/Notes.tsx b/packages/twenty-front/src/modules/activities/notes/components/Notes.tsx index de4e6cccc..c99a8e57c 100644 --- a/packages/twenty-front/src/modules/activities/notes/components/Notes.tsx +++ b/packages/twenty-front/src/modules/activities/notes/components/Notes.tsx @@ -1,3 +1,9 @@ +import { SkeletonLoader } from '@/activities/components/SkeletonLoader'; +import { useOpenCreateActivityDrawer } from '@/activities/hooks/useOpenCreateActivityDrawer'; +import { NoteList } from '@/activities/notes/components/NoteList'; +import { useNotes } from '@/activities/notes/hooks/useNotes'; +import { ActivityTargetableObject } from '@/activities/types/ActivityTargetableEntity'; +import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; import styled from '@emotion/styled'; import { AnimatedPlaceholder, @@ -5,18 +11,11 @@ import { AnimatedPlaceholderEmptySubTitle, AnimatedPlaceholderEmptyTextContainer, AnimatedPlaceholderEmptyTitle, + Button, EMPTY_PLACEHOLDER_TRANSITION_PROPS, IconPlus, } from 'twenty-ui'; -import { SkeletonLoader } from '@/activities/components/SkeletonLoader'; -import { useOpenCreateActivityDrawer } from '@/activities/hooks/useOpenCreateActivityDrawer'; -import { NoteList } from '@/activities/notes/components/NoteList'; -import { useNotes } from '@/activities/notes/hooks/useNotes'; -import { ActivityTargetableObject } from '@/activities/types/ActivityTargetableEntity'; -import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; -import { Button } from '@/ui/input/button/components/Button'; - const StyledNotesContainer = styled.div` display: flex; flex: 1; diff --git a/packages/twenty-front/src/modules/activities/tasks/components/AddTaskButton.tsx b/packages/twenty-front/src/modules/activities/tasks/components/AddTaskButton.tsx index 869e2f1ad..0004f351d 100644 --- a/packages/twenty-front/src/modules/activities/tasks/components/AddTaskButton.tsx +++ b/packages/twenty-front/src/modules/activities/tasks/components/AddTaskButton.tsx @@ -1,10 +1,9 @@ import { isNonEmptyArray } from '@sniptt/guards'; -import { IconPlus } from 'twenty-ui'; +import { Button, IconPlus } from 'twenty-ui'; import { useOpenCreateActivityDrawer } from '@/activities/hooks/useOpenCreateActivityDrawer'; import { ActivityTargetableObject } from '@/activities/types/ActivityTargetableEntity'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; -import { Button } from '@/ui/input/button/components/Button'; export const AddTaskButton = ({ activityTargetableObjects, diff --git a/packages/twenty-front/src/modules/activities/tasks/components/TaskGroups.tsx b/packages/twenty-front/src/modules/activities/tasks/components/TaskGroups.tsx index 03393d576..b32d17ed6 100644 --- a/packages/twenty-front/src/modules/activities/tasks/components/TaskGroups.tsx +++ b/packages/twenty-front/src/modules/activities/tasks/components/TaskGroups.tsx @@ -6,6 +6,7 @@ import { AnimatedPlaceholderEmptySubTitle, AnimatedPlaceholderEmptyTextContainer, AnimatedPlaceholderEmptyTitle, + Button, EMPTY_PLACEHOLDER_TRANSITION_PROPS, IconPlus, } from 'twenty-ui'; @@ -15,11 +16,9 @@ import { useOpenCreateActivityDrawer } from '@/activities/hooks/useOpenCreateAct import { TASKS_TAB_LIST_COMPONENT_ID } from '@/activities/tasks/constants/TasksTabListComponentId'; import { useTasks } from '@/activities/tasks/hooks/useTasks'; import { ActivityTargetableObject } from '@/activities/types/ActivityTargetableEntity'; -import { Button } from '@/ui/input/button/components/Button'; -import { useTabList } from '@/ui/layout/tab/hooks/useTabList'; - import { Task } from '@/activities/types/Task'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; +import { useTabList } from '@/ui/layout/tab/hooks/useTabList'; import groupBy from 'lodash.groupby'; import { AddTaskButton } from './AddTaskButton'; import { TaskList } from './TaskList'; diff --git a/packages/twenty-front/src/modules/activities/timeline-activities/components/TimelineCreateButtonGroup.tsx b/packages/twenty-front/src/modules/activities/timeline-activities/components/TimelineCreateButtonGroup.tsx index 4e8ec1c64..e5bc090bc 100644 --- a/packages/twenty-front/src/modules/activities/timeline-activities/components/TimelineCreateButtonGroup.tsx +++ b/packages/twenty-front/src/modules/activities/timeline-activities/components/TimelineCreateButtonGroup.tsx @@ -1,10 +1,13 @@ -import { useSetRecoilState } from 'recoil'; -import { IconCheckbox, IconNotes, IconPaperclip } from 'twenty-ui'; - -import { Button } from '@/ui/input/button/components/Button'; -import { ButtonGroup } from '@/ui/input/button/components/ButtonGroup'; import { TAB_LIST_COMPONENT_ID } from '@/ui/layout/show-page/components/ShowPageSubContainer'; import { useTabList } from '@/ui/layout/tab/hooks/useTabList'; +import { useSetRecoilState } from 'recoil'; +import { + Button, + ButtonGroup, + IconCheckbox, + IconNotes, + IconPaperclip, +} from 'twenty-ui'; export const TimelineCreateButtonGroup = ({ isInRightDrawer = false, diff --git a/packages/twenty-front/src/modules/activities/timeline-activities/rows/components/EventCardToggleButton.tsx b/packages/twenty-front/src/modules/activities/timeline-activities/rows/components/EventCardToggleButton.tsx index 44a2cb406..2e0795845 100644 --- a/packages/twenty-front/src/modules/activities/timeline-activities/rows/components/EventCardToggleButton.tsx +++ b/packages/twenty-front/src/modules/activities/timeline-activities/rows/components/EventCardToggleButton.tsx @@ -1,7 +1,5 @@ import styled from '@emotion/styled'; -import { IconChevronDown, IconChevronUp } from 'twenty-ui'; - -import { IconButton } from '@/ui/input/button/components/IconButton'; +import { IconButton, IconChevronDown, IconChevronUp } from 'twenty-ui'; type EventCardToggleButtonProps = { isOpen: boolean; diff --git a/packages/twenty-front/src/modules/auth/sign-in-up/components/SignInUpForm.tsx b/packages/twenty-front/src/modules/auth/sign-in-up/components/SignInUpForm.tsx index ba4add297..38856d33d 100644 --- a/packages/twenty-front/src/modules/auth/sign-in-up/components/SignInUpForm.tsx +++ b/packages/twenty-front/src/modules/auth/sign-in-up/components/SignInUpForm.tsx @@ -1,12 +1,3 @@ -import { useTheme } from '@emotion/react'; -import styled from '@emotion/styled'; -import { motion } from 'framer-motion'; -import { useMemo, useState } from 'react'; -import { Controller } from 'react-hook-form'; -import { useRecoilState, useRecoilValue } from 'recoil'; -import { Key } from 'ts-key-enum'; -import { ActionLink, IconGoogle, IconKey, IconMicrosoft } from 'twenty-ui'; - import { FooterNote } from '@/auth/sign-in-up/components/FooterNote'; import { HorizontalSeparator } from '@/auth/sign-in-up/components/HorizontalSeparator'; import { useHandleResetPassword } from '@/auth/sign-in-up/hooks/useHandleResetPassword'; @@ -19,8 +10,21 @@ import { isRequestingCaptchaTokenState } from '@/captcha/states/isRequestingCapt import { authProvidersState } from '@/client-config/states/authProvidersState'; import { captchaProviderState } from '@/client-config/states/captchaProviderState'; import { Loader } from '@/ui/feedback/loader/components/Loader'; -import { MainButton } from '@/ui/input/button/components/MainButton'; import { TextInput } from '@/ui/input/components/TextInput'; +import { useTheme } from '@emotion/react'; +import styled from '@emotion/styled'; +import { motion } from 'framer-motion'; +import { useMemo, useState } from 'react'; +import { Controller } from 'react-hook-form'; +import { useRecoilState, useRecoilValue } from 'recoil'; +import { Key } from 'ts-key-enum'; +import { + ActionLink, + IconGoogle, + IconKey, + IconMicrosoft, + MainButton, +} from 'twenty-ui'; import { isDefined } from '~/utils/isDefined'; const StyledContentContainer = styled.div` diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx index 2ad134409..02f636582 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx @@ -16,7 +16,6 @@ import { getCompanyDomainName } from '@/object-metadata/utils/getCompanyDomainNa import { useSearchRecords } from '@/object-record/hooks/useSearchRecords'; import { Opportunity } from '@/opportunities/types/Opportunity'; import { Person } from '@/people/types/Person'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { SelectableItem } from '@/ui/layout/selectable-list/components/SelectableItem'; import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList'; import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; @@ -30,7 +29,14 @@ import { isNonEmptyString } from '@sniptt/guards'; import { useMemo, useRef } from 'react'; import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'; import { Key } from 'ts-key-enum'; -import { Avatar, IconNotes, IconSparkles, IconX, isDefined } from 'twenty-ui'; +import { + Avatar, + IconNotes, + IconSparkles, + IconX, + LightIconButton, + isDefined, +} from 'twenty-ui'; import { useDebounce } from 'use-debounce'; import { getLogoUrlFromDomainName } from '~/utils'; diff --git a/packages/twenty-front/src/modules/error-handler/components/GenericErrorFallback.tsx b/packages/twenty-front/src/modules/error-handler/components/GenericErrorFallback.tsx index 9481fbcc4..9fcb32336 100644 --- a/packages/twenty-front/src/modules/error-handler/components/GenericErrorFallback.tsx +++ b/packages/twenty-front/src/modules/error-handler/components/GenericErrorFallback.tsx @@ -9,11 +9,10 @@ import { AnimatedPlaceholderEmptySubTitle, AnimatedPlaceholderEmptyTextContainer, AnimatedPlaceholderEmptyTitle, + Button, IconRefresh, THEME_LIGHT, } from 'twenty-ui'; - -import { Button } from '@/ui/input/button/components/Button'; import { isDeeplyEqual } from '~/utils/isDeeplyEqual'; type GenericErrorFallbackProps = FallbackProps; diff --git a/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx b/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx index 39d2437bf..2c951b2e0 100644 --- a/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx +++ b/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx @@ -1,6 +1,5 @@ -import { Button } from '@/ui/input/button/components/Button'; import styled from '@emotion/styled'; -import { Banner, BannerVariant, IconComponent } from 'twenty-ui'; +import { Banner, BannerVariant, Button, IconComponent } from 'twenty-ui'; const StyledBanner = styled(Banner)` position: absolute; diff --git a/packages/twenty-front/src/modules/keyboard-shortcut-menu/components/KeyboardShortcutMenuDialog.tsx b/packages/twenty-front/src/modules/keyboard-shortcut-menu/components/KeyboardShortcutMenuDialog.tsx index 80cc5c6b5..36c800f31 100644 --- a/packages/twenty-front/src/modules/keyboard-shortcut-menu/components/KeyboardShortcutMenuDialog.tsx +++ b/packages/twenty-front/src/modules/keyboard-shortcut-menu/components/KeyboardShortcutMenuDialog.tsx @@ -1,6 +1,4 @@ -import { IconX } from 'twenty-ui'; - -import { IconButton } from '@/ui/input/button/components/IconButton'; +import { IconButton, IconX } from 'twenty-ui'; import { StyledContainer, diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/AddObjectFilterFromDetailsButton.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/AddObjectFilterFromDetailsButton.tsx index 1fb257f79..21d407471 100644 --- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/AddObjectFilterFromDetailsButton.tsx +++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/AddObjectFilterFromDetailsButton.tsx @@ -1,8 +1,7 @@ -import { IconPlus } from 'twenty-ui'; +import { IconPlus, LightButton } from 'twenty-ui'; import { OBJECT_FILTER_DROPDOWN_ID } from '@/object-record/object-filter-dropdown/constants/ObjectFilterDropdownId'; import { useFilterDropdown } from '@/object-record/object-filter-dropdown/hooks/useFilterDropdown'; -import { LightButton } from '@/ui/input/button/components/LightButton'; import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; type AddObjectFilterFromDetailsButtonProps = { diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx index dd746b8a7..648fc221f 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx @@ -17,7 +17,6 @@ import { InlineCellHotkeyScope } from '@/object-record/record-inline-cell/types/ import { RecordValueSetterEffect } from '@/object-record/record-store/components/RecordValueSetterEffect'; import { recordStoreFamilyState } from '@/object-record/record-store/states/recordStoreFamilyState'; import { ObjectRecord } from '@/object-record/types/ObjectRecord'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Checkbox, CheckboxVariant } from '@/ui/input/components/Checkbox'; import { TextInput } from '@/ui/input/components/TextInput'; import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId'; @@ -33,6 +32,7 @@ import { ChipSize, IconEye, IconEyeOff, + LightIconButton, } from 'twenty-ui'; import { useDebouncedCallback } from 'use-debounce'; import { useAddNewCard } from '../../record-board-column/hooks/useAddNewCard'; diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeader.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeader.tsx index a36d73cd2..1f25864dd 100644 --- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeader.tsx +++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeader.tsx @@ -1,6 +1,6 @@ import styled from '@emotion/styled'; import { useContext, useState } from 'react'; -import { IconDotsVertical, IconPlus, Tag } from 'twenty-ui'; +import { IconDotsVertical, IconPlus, LightIconButton, Tag } from 'twenty-ui'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; import { RecordBoardContext } from '@/object-record/record-board/contexts/RecordBoardContext'; @@ -12,7 +12,6 @@ import { useIsOpportunitiesCompanyFieldDisabled } from '@/object-record/record-b import { RecordBoardColumnHotkeyScope } from '@/object-record/record-board/types/BoardColumnHotkeyScope'; import { RecordBoardColumnDefinitionType } from '@/object-record/record-board/types/RecordBoardColumnDefinition'; import { SingleEntitySelect } from '@/object-record/relation-picker/components/SingleEntitySelect'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope'; const StyledHeader = styled.div` diff --git a/packages/twenty-front/src/modules/object-record/record-field/components/LightCopyIconButton.tsx b/packages/twenty-front/src/modules/object-record/record-field/components/LightCopyIconButton.tsx index 61b6b0fb6..79ee5f222 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/components/LightCopyIconButton.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/components/LightCopyIconButton.tsx @@ -1,10 +1,9 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconCopy } from 'twenty-ui'; +import { IconCopy, LightIconButton } from 'twenty-ui'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; const StyledButtonContainer = styled.div` padding: 0 ${({ theme }) => theme.spacing(1)}; diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiItemFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiItemFieldInput.tsx index e416e50ce..7aa56379f 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiItemFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiItemFieldInput.tsx @@ -1,10 +1,9 @@ import styled from '@emotion/styled'; import React, { useRef, useState } from 'react'; import { Key } from 'ts-key-enum'; -import { IconCheck, IconPlus } from 'twenty-ui'; +import { IconCheck, IconPlus, LightIconButton } from 'twenty-ui'; import { PhoneRecord } from '@/object-record/record-field/types/FieldMetadata'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; import { DropdownMenuInput, diff --git a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexPageKanbanAddButton.tsx b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexPageKanbanAddButton.tsx index 4c3826fa8..3b8079909 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexPageKanbanAddButton.tsx +++ b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexPageKanbanAddButton.tsx @@ -7,7 +7,6 @@ import { RecordBoardColumnDefinition } from '@/object-record/record-board/types/ import { RecordIndexPageKanbanAddMenuItem } from '@/object-record/record-index/components/RecordIndexPageKanbanAddMenuItem'; import { RecordIndexRootPropsContext } from '@/object-record/record-index/contexts/RecordIndexRootPropsContext'; import { recordIndexKanbanFieldMetadataIdState } from '@/object-record/record-index/states/recordIndexKanbanFieldMetadataIdState'; -import { IconButton } from '@/ui/input/button/components/IconButton'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; @@ -15,7 +14,7 @@ import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; import styled from '@emotion/styled'; import { useCallback, useContext } from 'react'; import { useRecoilValue } from 'recoil'; -import { IconPlus } from 'twenty-ui'; +import { IconButton, IconPlus } from 'twenty-ui'; const StyledDropdownMenuItemsContainer = styled(DropdownMenuItemsContainer)` width: 100%; diff --git a/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellEditButton.tsx b/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellEditButton.tsx index c14742e8e..92bfdb84b 100644 --- a/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellEditButton.tsx +++ b/packages/twenty-front/src/modules/object-record/record-inline-cell/components/RecordInlineCellEditButton.tsx @@ -1,7 +1,9 @@ import styled from '@emotion/styled'; -import { AnimatedContainer, IconComponent } from 'twenty-ui'; - -import { FloatingIconButton } from '@/ui/input/button/components/FloatingIconButton'; +import { + AnimatedContainer, + FloatingIconButton, + IconComponent, +} from 'twenty-ui'; const StyledInlineCellButtonContainer = styled.div` align-items: center; diff --git a/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationRecordsListItem.tsx b/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationRecordsListItem.tsx index 1ed6c37fa..b1f16b08c 100644 --- a/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationRecordsListItem.tsx +++ b/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationRecordsListItem.tsx @@ -9,6 +9,7 @@ import { IconDotsVertical, IconTrash, IconUnlink, + LightIconButton, } from 'twenty-ui'; import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem'; @@ -33,7 +34,6 @@ import { RecordDetailRecordsListItem } from '@/object-record/record-show/record- import { RecordValueSetterEffect } from '@/object-record/record-store/components/RecordValueSetterEffect'; import { ObjectRecord } from '@/object-record/types/ObjectRecord'; import { isFieldCellSupported } from '@/object-record/utils/isFieldCellSupported'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; diff --git a/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationSection.tsx b/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationSection.tsx index 432ff14fe..0281cf306 100644 --- a/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationSection.tsx +++ b/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationSection.tsx @@ -2,7 +2,7 @@ import styled from '@emotion/styled'; import qs from 'qs'; import { useCallback, useContext } from 'react'; import { useRecoilValue } from 'recoil'; -import { IconForbid, IconPencil, IconPlus } from 'twenty-ui'; +import { IconForbid, IconPencil, IconPlus, LightIconButton } from 'twenty-ui'; import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem'; import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord'; @@ -26,7 +26,6 @@ import { EntityForSelect } from '@/object-record/relation-picker/types/EntityFor import { ObjectRecord } from '@/object-record/types/ObjectRecord'; import { usePrefetchedData } from '@/prefetch/hooks/usePrefetchedData'; import { PrefetchKey } from '@/prefetch/types/PrefetchKey'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; import { DropdownScope } from '@/ui/layout/dropdown/scopes/DropdownScope'; diff --git a/packages/twenty-front/src/modules/object-record/record-table/empty-state/components/RecordTableEmptyStateDisplay.tsx b/packages/twenty-front/src/modules/object-record/record-table/empty-state/components/RecordTableEmptyStateDisplay.tsx index 66affe2a2..1d97ed9f4 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/empty-state/components/RecordTableEmptyStateDisplay.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/empty-state/components/RecordTableEmptyStateDisplay.tsx @@ -1,6 +1,5 @@ import { isObjectMetadataReadOnly } from '@/object-metadata/utils/isObjectMetadataReadOnly'; import { RecordTableContext } from '@/object-record/record-table/contexts/RecordTableContext'; -import { Button } from '@/ui/input/button/components/Button'; import { useContext } from 'react'; import { AnimatedPlaceholder, @@ -9,6 +8,7 @@ import { AnimatedPlaceholderEmptyTextContainer, AnimatedPlaceholderEmptyTitle, AnimatedPlaceholderType, + Button, IconComponent, } from 'twenty-ui'; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellButton.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellButton.tsx index 957aa7484..101c8cb65 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellButton.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellButton.tsx @@ -1,7 +1,9 @@ import styled from '@emotion/styled'; -import { AnimatedContainer, IconComponent } from 'twenty-ui'; - -import { FloatingIconButton } from '@/ui/input/button/components/FloatingIconButton'; +import { + AnimatedContainer, + FloatingIconButton, + IconComponent, +} from 'twenty-ui'; const StyledButtonContainer = styled.div` margin: ${({ theme }) => theme.spacing(1)}; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx index 66cbddd5e..393dfd5f0 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx @@ -1,7 +1,7 @@ import styled from '@emotion/styled'; import { useCallback, useMemo, useState } from 'react'; import { useRecoilCallback, useRecoilState, useRecoilValue } from 'recoil'; -import { IconPlus } from 'twenty-ui'; +import { IconPlus, LightIconButton } from 'twenty-ui'; import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem'; import { isObjectMetadataReadOnly } from '@/object-metadata/utils/isObjectMetadataReadOnly'; @@ -12,7 +12,6 @@ import { useTableColumns } from '@/object-record/record-table/hooks/useTableColu import { RecordTableColumnHeadWithDropdown } from '@/object-record/record-table/record-table-header/components/RecordTableColumnHeadWithDropdown'; import { isRecordTableScrolledLeftComponentState } from '@/object-record/record-table/states/isRecordTableScrolledLeftComponentState'; import { ColumnDefinition } from '@/object-record/record-table/types/ColumnDefinition'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { useTrackPointer } from '@/ui/utilities/pointer-event/hooks/useTrackPointer'; import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue'; import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; diff --git a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsBlocklistInput.tsx b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsBlocklistInput.tsx index 9bb4fdd98..b082cfc08 100644 --- a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsBlocklistInput.tsx +++ b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsBlocklistInput.tsx @@ -1,12 +1,12 @@ -import { useEffect } from 'react'; -import { Controller, useForm } from 'react-hook-form'; import styled from '@emotion/styled'; import { zodResolver } from '@hookform/resolvers/zod'; +import { useEffect } from 'react'; +import { Controller, useForm } from 'react-hook-form'; import { Key } from 'ts-key-enum'; import { z } from 'zod'; -import { Button } from '@/ui/input/button/components/Button'; import { TextInput } from '@/ui/input/components/TextInput'; +import { Button } from 'twenty-ui'; import { isDomain } from '~/utils/is-domain'; const StyledContainer = styled.div` diff --git a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsBlocklistTableRow.tsx b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsBlocklistTableRow.tsx index 30cf3a37a..cb6966a1c 100644 --- a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsBlocklistTableRow.tsx +++ b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsBlocklistTableRow.tsx @@ -1,9 +1,7 @@ -import { IconX, OverflowingTextWithTooltip } from 'twenty-ui'; - import { BlocklistItem } from '@/accounts/types/BlocklistItem'; -import { IconButton } from '@/ui/input/button/components/IconButton'; import { TableCell } from '@/ui/layout/table/components/TableCell'; import { TableRow } from '@/ui/layout/table/components/TableRow'; +import { IconButton, IconX, OverflowingTextWithTooltip } from 'twenty-ui'; import { formatToHumanReadableDate } from '~/utils/date-utils'; type SettingsAccountsBlocklistTableRowProps = { diff --git a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsListEmptyStateCard.tsx b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsListEmptyStateCard.tsx index 6178caf68..981bbcb6d 100644 --- a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsListEmptyStateCard.tsx +++ b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsListEmptyStateCard.tsx @@ -1,8 +1,7 @@ import styled from '@emotion/styled'; -import { IconGoogle } from 'twenty-ui'; +import { Button, IconGoogle } from 'twenty-ui'; import { useTriggerGoogleApisOAuth } from '@/settings/accounts/hooks/useTriggerGoogleApisOAuth'; -import { Button } from '@/ui/input/button/components/Button'; import { Card } from '@/ui/layout/card/components/Card'; import { CardContent } from '@/ui/layout/card/components/CardContent'; import { CardHeader } from '@/ui/layout/card/components/CardHeader'; diff --git a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx index beba37f8b..743d191a6 100644 --- a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx +++ b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx @@ -5,13 +5,13 @@ import { IconMail, IconRefresh, IconTrash, + LightIconButton, } from 'twenty-ui'; import { ConnectedAccount } from '@/accounts/types/ConnectedAccount'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; import { useDestroyOneRecord } from '@/object-record/hooks/useDestroyOneRecord'; import { useTriggerGoogleApisOAuth } from '@/settings/accounts/hooks/useTriggerGoogleApisOAuth'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; diff --git a/packages/twenty-front/src/modules/settings/components/SaveAndCancelButtons/CancelButton.tsx b/packages/twenty-front/src/modules/settings/components/SaveAndCancelButtons/CancelButton.tsx index e93d27a83..8226db8c6 100644 --- a/packages/twenty-front/src/modules/settings/components/SaveAndCancelButtons/CancelButton.tsx +++ b/packages/twenty-front/src/modules/settings/components/SaveAndCancelButtons/CancelButton.tsx @@ -1,4 +1,4 @@ -import { LightButton } from '@/ui/input/button/components/LightButton'; +import { LightButton } from 'twenty-ui'; type CancelButtonProps = { onCancel?: () => void; diff --git a/packages/twenty-front/src/modules/settings/components/SaveAndCancelButtons/SaveButton.tsx b/packages/twenty-front/src/modules/settings/components/SaveAndCancelButtons/SaveButton.tsx index 01913ba96..a3553e5f0 100644 --- a/packages/twenty-front/src/modules/settings/components/SaveAndCancelButtons/SaveButton.tsx +++ b/packages/twenty-front/src/modules/settings/components/SaveAndCancelButtons/SaveButton.tsx @@ -1,6 +1,4 @@ -import { IconDeviceFloppy } from 'twenty-ui'; - -import { Button } from '@/ui/input/button/components/Button'; +import { Button, IconDeviceFloppy } from 'twenty-ui'; type SaveButtonProps = { onSave?: () => void; diff --git a/packages/twenty-front/src/modules/settings/data-model/components/SettingsDataModelNewFieldBreadcrumbDropDown.tsx b/packages/twenty-front/src/modules/settings/data-model/components/SettingsDataModelNewFieldBreadcrumbDropDown.tsx index ce41c5f56..4bdf2ee86 100644 --- a/packages/twenty-front/src/modules/settings/data-model/components/SettingsDataModelNewFieldBreadcrumbDropDown.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/components/SettingsDataModelNewFieldBreadcrumbDropDown.tsx @@ -1,5 +1,4 @@ import { SettingsFieldType } from '@/settings/data-model/types/SettingsFieldType'; -import { Button } from '@/ui/input/button/components/Button'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; @@ -13,7 +12,7 @@ import { useParams, useSearchParams, } from 'react-router-dom'; -import { IconChevronDown, isDefined } from 'twenty-ui'; +import { Button, IconChevronDown, isDefined } from 'twenty-ui'; const StyledContainer = styled.div` align-items: center; diff --git a/packages/twenty-front/src/modules/settings/data-model/fields/forms/number/components/SettingsDataModelFieldNumberDecimalInput.tsx b/packages/twenty-front/src/modules/settings/data-model/fields/forms/number/components/SettingsDataModelFieldNumberDecimalInput.tsx index 706bcea37..ce67a9bda 100644 --- a/packages/twenty-front/src/modules/settings/data-model/fields/forms/number/components/SettingsDataModelFieldNumberDecimalInput.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/fields/forms/number/components/SettingsDataModelFieldNumberDecimalInput.tsx @@ -1,8 +1,7 @@ import styled from '@emotion/styled'; -import { Button } from '@/ui/input/button/components/Button'; import { TextInput } from '@/ui/input/components/TextInput'; -import { IconInfoCircle, IconMinus, IconPlus } from 'twenty-ui'; +import { Button, IconInfoCircle, IconMinus, IconPlus } from 'twenty-ui'; import { castAsNumberOrNull } from '~/utils/cast-as-number-or-null'; type SettingsDataModelFieldNumberDecimalsInputProps = { diff --git a/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectForm.tsx b/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectForm.tsx index 038c2a143..f78a23b45 100644 --- a/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectForm.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectForm.tsx @@ -1,7 +1,7 @@ import styled from '@emotion/styled'; import { DropResult } from '@hello-pangea/dnd'; import { Controller, useFormContext } from 'react-hook-form'; -import { IconPlus, IconTool, MAIN_COLORS } from 'twenty-ui'; +import { IconPlus, IconTool, LightButton, MAIN_COLORS } from 'twenty-ui'; import { z } from 'zod'; import { @@ -14,7 +14,6 @@ import { selectFieldDefaultValueSchema } from '@/object-record/record-field/vali import { useSelectSettingsFormInitialValues } from '@/settings/data-model/fields/forms/select/hooks/useSelectSettingsFormInitialValues'; import { generateNewSelectOption } from '@/settings/data-model/fields/forms/select/utils/generateNewSelectOption'; import { isSelectOptionDefaultValue } from '@/settings/data-model/utils/isSelectOptionDefaultValue'; -import { LightButton } from '@/ui/input/button/components/LightButton'; import { CardContent } from '@/ui/layout/card/components/CardContent'; import { CardFooter } from '@/ui/layout/card/components/CardFooter'; import { DraggableItem } from '@/ui/layout/draggable-list/components/DraggableItem'; diff --git a/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx b/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx index d0c74e805..e41c012c1 100644 --- a/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx @@ -8,6 +8,7 @@ import { IconGripVertical, IconTrash, IconX, + LightIconButton, MAIN_COLOR_NAMES, } from 'twenty-ui'; import { v4 } from 'uuid'; @@ -16,7 +17,6 @@ import { FieldMetadataItemOption } from '@/object-metadata/types/FieldMetadataIt import { EXPANDED_WIDTH_ANIMATION_VARIANTS } from '@/settings/constants/ExpandedWidthAnimationVariants'; import { OPTION_VALUE_MAXIMUM_LENGTH } from '@/settings/data-model/constants/OptionValueMaximumLength'; import { getOptionValueFromLabel } from '@/settings/data-model/fields/forms/select/utils/getOptionValueFromLabel'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { TextInput } from '@/ui/input/components/TextInput'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; diff --git a/packages/twenty-front/src/modules/settings/data-model/graph-overview/components/SettingsDataModelOverview.tsx b/packages/twenty-front/src/modules/settings/data-model/graph-overview/components/SettingsDataModelOverview.tsx index 42f4fabd5..341fdb7d7 100644 --- a/packages/twenty-front/src/modules/settings/data-model/graph-overview/components/SettingsDataModelOverview.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/graph-overview/components/SettingsDataModelOverview.tsx @@ -1,3 +1,7 @@ +import { SettingsDataModelOverviewEffect } from '@/settings/data-model/graph-overview/components/SettingsDataModelOverviewEffect'; +import { SettingsDataModelOverviewObject } from '@/settings/data-model/graph-overview/components/SettingsDataModelOverviewObject'; +import { SettingsDataModelOverviewRelationMarkers } from '@/settings/data-model/graph-overview/components/SettingsDataModelOverviewRelationMarkers'; +import { calculateHandlePosition } from '@/settings/data-model/graph-overview/utils/calculateHandlePosition'; import styled from '@emotion/styled'; import { useCallback, useState } from 'react'; import ReactFlow, { @@ -13,6 +17,8 @@ import ReactFlow, { useReactFlow, } from 'reactflow'; import { + Button, + IconButtonGroup, IconLock, IconLockOpen, IconMaximize, @@ -20,17 +26,8 @@ import { IconPlus, IconX, } from 'twenty-ui'; - -import { SettingsDataModelOverviewEffect } from '@/settings/data-model/graph-overview/components/SettingsDataModelOverviewEffect'; -import { SettingsDataModelOverviewObject } from '@/settings/data-model/graph-overview/components/SettingsDataModelOverviewObject'; -import { SettingsDataModelOverviewRelationMarkers } from '@/settings/data-model/graph-overview/components/SettingsDataModelOverviewRelationMarkers'; -import { calculateHandlePosition } from '@/settings/data-model/graph-overview/utils/calculateHandlePosition'; -import { Button } from '@/ui/input/button/components/Button'; -import { IconButtonGroup } from '@/ui/input/button/components/IconButtonGroup'; import { isDefined } from '~/utils/isDefined'; -import 'reactflow/dist/style.css'; - const NodeTypes = { object: SettingsDataModelOverviewObject, }; diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown.tsx index 79e2cabb6..685198769 100644 --- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown.tsx @@ -4,9 +4,9 @@ import { IconEye, IconPencil, IconTextSize, + LightIconButton, } from 'twenty-ui'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown.tsx index a6b68c6b5..0dcd5be86 100644 --- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown.tsx @@ -4,9 +4,9 @@ import { IconEye, IconPencil, IconTrash, + LightIconButton, } from 'twenty-ui'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx index 6052b9f23..046064310 100644 --- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx @@ -1,22 +1,11 @@ -import { useTheme } from '@emotion/react'; -import styled from '@emotion/styled'; -import { useMemo } from 'react'; -import { IconMinus, IconPlus, isDefined, useIcons } from 'twenty-ui'; - -import { useGetRelationMetadata } from '@/object-metadata/hooks/useGetRelationMetadata'; -import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem'; -import { getObjectSlug } from '@/object-metadata/utils/getObjectSlug'; -import { isFieldTypeSupportedInSettings } from '@/settings/data-model/utils/isFieldTypeSupportedInSettings'; -import { TableCell } from '@/ui/layout/table/components/TableCell'; -import { TableRow } from '@/ui/layout/table/components/TableRow'; - -import { RELATION_TYPES } from '../../constants/RelationTypes'; - import { LABEL_IDENTIFIER_FIELD_METADATA_TYPES } from '@/object-metadata/constants/LabelIdentifierFieldMetadataTypes'; import { useFieldMetadataItem } from '@/object-metadata/hooks/useFieldMetadataItem'; +import { useGetRelationMetadata } from '@/object-metadata/hooks/useGetRelationMetadata'; import { useUpdateOneObjectMetadataItem } from '@/object-metadata/hooks/useUpdateOneObjectMetadataItem'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; +import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem'; import { getFieldSlug } from '@/object-metadata/utils/getFieldSlug'; +import { getObjectSlug } from '@/object-metadata/utils/getObjectSlug'; import { isLabelIdentifierField } from '@/object-metadata/utils/isLabelIdentifierField'; import { useDeleteRecordFromCache } from '@/object-record/cache/hooks/useDeleteRecordFromCache'; import { usePrefetchedData } from '@/prefetch/hooks/usePrefetchedData'; @@ -24,13 +13,26 @@ import { PrefetchKey } from '@/prefetch/types/PrefetchKey'; import { SettingsObjectFieldActiveActionDropdown } from '@/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown'; import { SettingsObjectFieldInactiveActionDropdown } from '@/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown'; import { settingsObjectFieldsFamilyState } from '@/settings/data-model/object-details/states/settingsObjectFieldsFamilyState'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; +import { isFieldTypeSupportedInSettings } from '@/settings/data-model/utils/isFieldTypeSupportedInSettings'; +import { TableCell } from '@/ui/layout/table/components/TableCell'; +import { TableRow } from '@/ui/layout/table/components/TableRow'; import { navigationMemorizedUrlState } from '@/ui/navigation/states/navigationMemorizedUrlState'; import { View } from '@/views/types/View'; +import { useTheme } from '@emotion/react'; +import styled from '@emotion/styled'; +import { useMemo } from 'react'; import { useNavigate } from 'react-router-dom'; import { useRecoilState } from 'recoil'; +import { + IconMinus, + IconPlus, + LightIconButton, + isDefined, + useIcons, +} from 'twenty-ui'; import { RelationDefinitionType } from '~/generated-metadata/graphql'; import { SettingsObjectDetailTableItem } from '~/pages/settings/data-model/types/SettingsObjectDetailTableItem'; +import { RELATION_TYPES } from '../../constants/RelationTypes'; import { SettingsObjectFieldDataType } from './SettingsObjectFieldDataType'; type SettingsObjectFieldItemTableRowProps = { diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectSummaryCard.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectSummaryCard.tsx index 22ae24fdb..6a0eb4823 100644 --- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectSummaryCard.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectSummaryCard.tsx @@ -1,6 +1,12 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconArchive, IconDotsVertical, IconPencil, useIcons } from 'twenty-ui'; +import { + IconArchive, + IconDotsVertical, + IconPencil, + LightIconButton, + useIcons, +} from 'twenty-ui'; import { useLastVisitedObjectMetadataItem } from '@/navigation/hooks/useLastVisitedObjectMetadataItem'; import { useLastVisitedView } from '@/navigation/hooks/useLastVisitedView'; @@ -8,7 +14,6 @@ import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem'; import { SettingsSummaryCard } from '@/settings/components/SettingsSummaryCard'; import { SettingsDataModelObjectTypeTag } from '@/settings/data-model/objects/components/SettingsDataModelObjectTypeTag'; import { getObjectTypeLabel } from '@/settings/data-model/utils/getObjectTypeLabel'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; diff --git a/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectCoverImage.tsx b/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectCoverImage.tsx index f2db34f27..d260936f3 100644 --- a/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectCoverImage.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectCoverImage.tsx @@ -1,7 +1,6 @@ import styled from '@emotion/styled'; -import { IconEye } from 'twenty-ui'; +import { FloatingButton, IconEye } from 'twenty-ui'; -import { FloatingButton } from '@/ui/input/button/components/FloatingButton'; import { Card } from '@/ui/layout/card/components/Card'; import { SettingsPath } from '@/types/SettingsPath'; diff --git a/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectInactiveMenuDropDown.tsx b/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectInactiveMenuDropDown.tsx index 77e39f8f1..7761b11b7 100644 --- a/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectInactiveMenuDropDown.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectInactiveMenuDropDown.tsx @@ -1,6 +1,10 @@ -import { IconArchiveOff, IconDotsVertical, IconTrash } from 'twenty-ui'; +import { + IconArchiveOff, + IconDotsVertical, + IconTrash, + LightIconButton, +} from 'twenty-ui'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; diff --git a/packages/twenty-front/src/modules/settings/developers/components/ApiKeyInput.tsx b/packages/twenty-front/src/modules/settings/developers/components/ApiKeyInput.tsx index 298d24d0f..d7523ab94 100644 --- a/packages/twenty-front/src/modules/settings/developers/components/ApiKeyInput.tsx +++ b/packages/twenty-front/src/modules/settings/developers/components/ApiKeyInput.tsx @@ -1,10 +1,9 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconCopy } from 'twenty-ui'; +import { Button, IconCopy } from 'twenty-ui'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { Button } from '@/ui/input/button/components/Button'; import { TextInput } from '@/ui/input/components/TextInput'; const StyledContainer = styled.div` diff --git a/packages/twenty-front/src/modules/settings/developers/components/SettingsReadDocumentationButton.tsx b/packages/twenty-front/src/modules/settings/developers/components/SettingsReadDocumentationButton.tsx index c4cc6432d..04d47f622 100644 --- a/packages/twenty-front/src/modules/settings/developers/components/SettingsReadDocumentationButton.tsx +++ b/packages/twenty-front/src/modules/settings/developers/components/SettingsReadDocumentationButton.tsx @@ -1,6 +1,4 @@ -import { IconBook2 } from 'twenty-ui'; - -import { Button } from '@/ui/input/button/components/Button'; +import { Button, IconBook2 } from 'twenty-ui'; export const SettingsReadDocumentationButton = () => { return ( 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 2aa04d320..d6e6286b4 100644 --- a/packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationComponent.tsx +++ b/packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationComponent.tsx @@ -1,11 +1,10 @@ -import { Link } from 'react-router-dom'; import { css } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconArrowUpRight, IconBolt, IconPlus, Pill } from 'twenty-ui'; +import { Link } from 'react-router-dom'; +import { Button, IconArrowUpRight, IconBolt, IconPlus, Pill } from 'twenty-ui'; import { SettingsIntegration } from '@/settings/integrations/types/SettingsIntegration'; import { Status } from '@/ui/display/status/components/Status'; -import { Button } from '@/ui/input/button/components/Button'; import { isDefined } from '~/utils/isDefined'; interface SettingsIntegrationComponentProps { diff --git a/packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationRemoteTableSchemaUpdate.tsx b/packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationRemoteTableSchemaUpdate.tsx index 6fc4d875f..e86bd5436 100644 --- a/packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationRemoteTableSchemaUpdate.tsx +++ b/packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationRemoteTableSchemaUpdate.tsx @@ -1,8 +1,7 @@ import { FetchResult } from '@apollo/client'; import styled from '@emotion/styled'; -import { IconReload } from 'twenty-ui'; +import { Button, IconReload } from 'twenty-ui'; -import { Button } from '@/ui/input/button/components/Button'; import { SyncRemoteTableSchemaChangesMutation } from '~/generated-metadata/graphql'; const StyledText = styled.h3` diff --git a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSummaryCard.tsx b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSummaryCard.tsx index ccc7dc0ab..b5d217790 100644 --- a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSummaryCard.tsx +++ b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSummaryCard.tsx @@ -1,19 +1,18 @@ +import { SettingsSummaryCard } from '@/settings/components/SettingsSummaryCard'; +import { SettingsIntegrationDatabaseConnectionSyncStatus } from '@/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSyncStatus'; +import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; +import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; +import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; +import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem'; import styled from '@emotion/styled'; import { IconDotsVertical, IconPencil, IconTrash, + LightIconButton, UndecoratedLink, } from 'twenty-ui'; -import { SettingsSummaryCard } from '@/settings/components/SettingsSummaryCard'; -import { SettingsIntegrationDatabaseConnectionSyncStatus } from '@/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSyncStatus'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; -import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; -import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; -import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; -import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem'; - type SettingsIntegrationDatabaseConnectionSummaryCardProps = { databaseLogoUrl: string; connectionId: string; diff --git a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionsListCard.tsx b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionsListCard.tsx index 04752ffdb..135861567 100644 --- a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionsListCard.tsx +++ b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionsListCard.tsx @@ -1,11 +1,10 @@ -import { useNavigate } from 'react-router-dom'; import styled from '@emotion/styled'; -import { IconChevronRight } from 'twenty-ui'; +import { useNavigate } from 'react-router-dom'; +import { IconChevronRight, LightIconButton } from 'twenty-ui'; import { SettingsListCard } from '@/settings/components/SettingsListCard'; import { SettingsIntegrationDatabaseConnectionSyncStatus } from '@/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSyncStatus'; import { SettingsIntegration } from '@/settings/integrations/types/SettingsIntegration'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { RemoteServer } from '~/generated-metadata/graphql'; type SettingsIntegrationDatabaseConnectionsListCardProps = { diff --git a/packages/twenty-front/src/modules/settings/profile/components/ChangePassword.tsx b/packages/twenty-front/src/modules/settings/profile/components/ChangePassword.tsx index 5c3344b40..9110cfb7b 100644 --- a/packages/twenty-front/src/modules/settings/profile/components/ChangePassword.tsx +++ b/packages/twenty-front/src/modules/settings/profile/components/ChangePassword.tsx @@ -1,10 +1,9 @@ import { useRecoilValue } from 'recoil'; -import { H2Title } from 'twenty-ui'; +import { Button, H2Title } from 'twenty-ui'; import { currentUserState } from '@/auth/states/currentUserState'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { Button } from '@/ui/input/button/components/Button'; import { useEmailPasswordResetLinkMutation } from '~/generated/graphql'; export const ChangePassword = () => { diff --git a/packages/twenty-front/src/modules/settings/profile/components/DeleteAccount.tsx b/packages/twenty-front/src/modules/settings/profile/components/DeleteAccount.tsx index 11c246173..f7e25c658 100644 --- a/packages/twenty-front/src/modules/settings/profile/components/DeleteAccount.tsx +++ b/packages/twenty-front/src/modules/settings/profile/components/DeleteAccount.tsx @@ -1,10 +1,9 @@ import { useState } from 'react'; import { useRecoilValue } from 'recoil'; -import { H2Title } from 'twenty-ui'; +import { Button, H2Title } from 'twenty-ui'; import { useAuth } from '@/auth/hooks/useAuth'; import { currentUserState } from '@/auth/states/currentUserState'; -import { Button } from '@/ui/input/button/components/Button'; import { ConfirmationModal } from '@/ui/layout/modal/components/ConfirmationModal'; import { useDeleteUserAccountMutation } from '~/generated/graphql'; diff --git a/packages/twenty-front/src/modules/settings/profile/components/DeleteWorkspace.tsx b/packages/twenty-front/src/modules/settings/profile/components/DeleteWorkspace.tsx index 190bd6016..f94f1fed4 100644 --- a/packages/twenty-front/src/modules/settings/profile/components/DeleteWorkspace.tsx +++ b/packages/twenty-front/src/modules/settings/profile/components/DeleteWorkspace.tsx @@ -1,12 +1,11 @@ import { useState } from 'react'; import { useRecoilValue } from 'recoil'; -import { H2Title, IconTrash } from 'twenty-ui'; +import { Button, H2Title, IconTrash } from 'twenty-ui'; import { useAuth } from '@/auth/hooks/useAuth'; import { currentUserState } from '@/auth/states/currentUserState'; import { ConfirmationModal } from '@/ui/layout/modal/components/ConfirmationModal'; import { useDeleteCurrentWorkspaceMutation } from '~/generated/graphql'; -import { Button } from '@/ui/input/button/components/Button'; export const DeleteWorkspace = () => { const [isDeleteWorkSpaceModalOpen, setIsDeleteWorkSpaceModalOpen] = useState(false); diff --git a/packages/twenty-front/src/modules/settings/security/components/SettingsSSOIdentitiesProvidersListEmptyStateCard.tsx b/packages/twenty-front/src/modules/settings/security/components/SettingsSSOIdentitiesProvidersListEmptyStateCard.tsx index 024fe70d9..f7bffb918 100644 --- a/packages/twenty-front/src/modules/settings/security/components/SettingsSSOIdentitiesProvidersListEmptyStateCard.tsx +++ b/packages/twenty-front/src/modules/settings/security/components/SettingsSSOIdentitiesProvidersListEmptyStateCard.tsx @@ -1,14 +1,12 @@ /* @license Enterprise */ -import styled from '@emotion/styled'; - import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Button } from '@/ui/input/button/components/Button'; import { Card } from '@/ui/layout/card/components/Card'; import { CardContent } from '@/ui/layout/card/components/CardContent'; import { CardHeader } from '@/ui/layout/card/components/CardHeader'; -import { IconKey } from 'twenty-ui'; +import styled from '@emotion/styled'; +import { Button, IconKey } from 'twenty-ui'; const StyledHeader = styled(CardHeader)` align-items: center; diff --git a/packages/twenty-front/src/modules/settings/security/components/SettingsSSOOIDCForm.tsx b/packages/twenty-front/src/modules/settings/security/components/SettingsSSOOIDCForm.tsx index 55d6cde7a..44dc1900b 100644 --- a/packages/twenty-front/src/modules/settings/security/components/SettingsSSOOIDCForm.tsx +++ b/packages/twenty-front/src/modules/settings/security/components/SettingsSSOOIDCForm.tsx @@ -2,13 +2,12 @@ import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { Button } from '@/ui/input/button/components/Button'; import { TextInput } from '@/ui/input/components/TextInput'; import { Section } from '@/ui/layout/section/components/Section'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { Controller, useFormContext } from 'react-hook-form'; -import { H2Title, IconCopy } from 'twenty-ui'; +import { Button, H2Title, IconCopy } from 'twenty-ui'; const StyledInputsContainer = styled.div` display: flex; diff --git a/packages/twenty-front/src/modules/settings/security/components/SettingsSSOSAMLForm.tsx b/packages/twenty-front/src/modules/settings/security/components/SettingsSSOSAMLForm.tsx index 72c5bdb73..ef0bf05e6 100644 --- a/packages/twenty-front/src/modules/settings/security/components/SettingsSSOSAMLForm.tsx +++ b/packages/twenty-front/src/modules/settings/security/components/SettingsSSOSAMLForm.tsx @@ -4,7 +4,6 @@ import { HorizontalSeparator } from '@/auth/sign-in-up/components/HorizontalSepa import { parseSAMLMetadataFromXMLFile } from '@/settings/security/utils/parseSAMLMetadataFromXMLFile'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { Button } from '@/ui/input/button/components/Button'; import { TextInput } from '@/ui/input/components/TextInput'; import { Section } from '@/ui/layout/section/components/Section'; import { useTheme } from '@emotion/react'; @@ -12,6 +11,7 @@ import styled from '@emotion/styled'; import { ChangeEvent, useRef } from 'react'; import { useFormContext } from 'react-hook-form'; import { + Button, H2Title, IconCheck, IconCopy, diff --git a/packages/twenty-front/src/modules/settings/security/components/SettingsSecuritySSORowDropdownMenu.tsx b/packages/twenty-front/src/modules/settings/security/components/SettingsSecuritySSORowDropdownMenu.tsx index fa619ef2c..3212c6dec 100644 --- a/packages/twenty-front/src/modules/settings/security/components/SettingsSecuritySSORowDropdownMenu.tsx +++ b/packages/twenty-front/src/modules/settings/security/components/SettingsSecuritySSORowDropdownMenu.tsx @@ -1,13 +1,17 @@ /* @license Enterprise */ -import { IconArchive, IconDotsVertical, IconTrash } from 'twenty-ui'; +import { + IconArchive, + IconDotsVertical, + IconTrash, + LightIconButton, +} from 'twenty-ui'; import { useDeleteSSOIdentityProvider } from '@/settings/security/hooks/useDeleteSSOIdentityProvider'; import { useUpdateSSOIdentityProvider } from '@/settings/security/hooks/useUpdateSSOIdentityProvider'; import { SSOIdentitiesProvidersState } from '@/settings/security/states/SSOIdentitiesProviders.state'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; diff --git a/packages/twenty-front/src/modules/settings/serverless-functions/components/SettingsServerlessFunctionsTableEmpty.tsx b/packages/twenty-front/src/modules/settings/serverless-functions/components/SettingsServerlessFunctionsTableEmpty.tsx index 77d854984..a67d4d358 100644 --- a/packages/twenty-front/src/modules/settings/serverless-functions/components/SettingsServerlessFunctionsTableEmpty.tsx +++ b/packages/twenty-front/src/modules/settings/serverless-functions/components/SettingsServerlessFunctionsTableEmpty.tsx @@ -1,6 +1,5 @@ import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Button } from '@/ui/input/button/components/Button'; import styled from '@emotion/styled'; import { AnimatedPlaceholder, @@ -8,6 +7,7 @@ import { AnimatedPlaceholderEmptySubTitle, AnimatedPlaceholderEmptyTextContainer, AnimatedPlaceholderEmptyTitle, + Button, EMPTY_PLACEHOLDER_TRANSITION_PROPS, IconPlus, } from 'twenty-ui'; diff --git a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionCodeEditorTab.tsx b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionCodeEditorTab.tsx index 22958b5ae..12fbbe1ec 100644 --- a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionCodeEditorTab.tsx +++ b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionCodeEditorTab.tsx @@ -6,7 +6,6 @@ import { SETTINGS_SERVERLESS_FUNCTION_TAB_LIST_COMPONENT_ID } from '@/settings/s import { SettingsServerlessFunctionHotkeyScope } from '@/settings/serverless-functions/types/SettingsServerlessFunctionHotKeyScope'; import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Button } from '@/ui/input/button/components/Button'; import { CoreEditorHeader } from '@/ui/input/code-editor/components/CodeEditorHeader'; import { Section } from '@/ui/layout/section/components/Section'; import { TabList } from '@/ui/layout/tab/components/TabList'; @@ -16,7 +15,13 @@ import styled from '@emotion/styled'; import { useNavigate } from 'react-router-dom'; import { useRecoilValue } from 'recoil'; import { Key } from 'ts-key-enum'; -import { H2Title, IconGitCommit, IconPlayerPlay, IconRestore } from 'twenty-ui'; +import { + Button, + H2Title, + IconGitCommit, + IconPlayerPlay, + IconRestore, +} from 'twenty-ui'; import { useHotkeyScopeOnMount } from '~/hooks/useHotkeyScopeOnMount'; const StyledTabList = styled(TabList)` diff --git a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionSettingsTab.tsx b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionSettingsTab.tsx index 5f14f4453..121827d78 100644 --- a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionSettingsTab.tsx +++ b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionSettingsTab.tsx @@ -4,14 +4,13 @@ import { ServerlessFunctionFormValues } from '@/settings/serverless-functions/ho import { SettingsServerlessFunctionHotkeyScope } from '@/settings/serverless-functions/types/SettingsServerlessFunctionHotKeyScope'; import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Button } from '@/ui/input/button/components/Button'; import { ConfirmationModal } from '@/ui/layout/modal/components/ConfirmationModal'; import { Section } from '@/ui/layout/section/components/Section'; import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; import { useState } from 'react'; import { useNavigate } from 'react-router-dom'; import { Key } from 'ts-key-enum'; -import { H2Title } from 'twenty-ui'; +import { Button, H2Title } from 'twenty-ui'; import { useHotkeyScopeOnMount } from '~/hooks/useHotkeyScopeOnMount'; import { SettingsServerlessFunctionTabEnvironmentVariablesSection } from '@/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariablesSection'; diff --git a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariableTableRow.tsx b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariableTableRow.tsx index da2dd2f79..eb8e380b7 100644 --- a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariableTableRow.tsx +++ b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariableTableRow.tsx @@ -1,23 +1,23 @@ -import { TableRow } from '@/ui/layout/table/components/TableRow'; -import { TableCell } from '@/ui/layout/table/components/TableCell'; +import { EnvironmentVariable } from '@/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariablesSection'; import { TextInputV2 } from '@/ui/input/components/TextInputV2'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; +import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; +import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; +import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; +import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; +import { TableCell } from '@/ui/layout/table/components/TableCell'; +import { TableRow } from '@/ui/layout/table/components/TableRow'; +import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem'; +import styled from '@emotion/styled'; +import { useState } from 'react'; import { IconCheck, IconDotsVertical, IconPencil, IconTrash, IconX, + LightIconButton, OverflowingTextWithTooltip, } from 'twenty-ui'; -import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; -import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; -import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; -import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem'; -import React, { useState } from 'react'; -import styled from '@emotion/styled'; -import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; -import { EnvironmentVariable } from '@/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariablesSection'; const StyledEditModeTableRow = styled(TableRow)` grid-template-columns: 180px auto 56px; diff --git a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariablesSection.tsx b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariablesSection.tsx index 4ba2b0f7a..00e8f6b37 100644 --- a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariablesSection.tsx +++ b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariablesSection.tsx @@ -1,16 +1,21 @@ -import dotenv from 'dotenv'; -import { H2Title, IconPlus, IconSearch, MOBILE_VIEWPORT } from 'twenty-ui'; -import { Table } from '@/ui/layout/table/components/Table'; -import { TableHeader } from '@/ui/layout/table/components/TableHeader'; -import { Section } from '@/ui/layout/section/components/Section'; -import { TextInput } from '@/ui/input/components/TextInput'; -import styled from '@emotion/styled'; -import React, { useMemo, useState } from 'react'; -import { TableBody } from '@/ui/layout/table/components/TableBody'; -import { Button } from '@/ui/input/button/components/Button'; -import { ServerlessFunctionFormValues } from '@/settings/serverless-functions/hooks/useServerlessFunctionUpdateFormState'; -import { TableRow } from '@/ui/layout/table/components/TableRow'; import { SettingsServerlessFunctionTabEnvironmentVariableTableRow } from '@/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariableTableRow'; +import { ServerlessFunctionFormValues } from '@/settings/serverless-functions/hooks/useServerlessFunctionUpdateFormState'; +import { TextInput } from '@/ui/input/components/TextInput'; +import { Section } from '@/ui/layout/section/components/Section'; +import { Table } from '@/ui/layout/table/components/Table'; +import { TableBody } from '@/ui/layout/table/components/TableBody'; +import { TableHeader } from '@/ui/layout/table/components/TableHeader'; +import { TableRow } from '@/ui/layout/table/components/TableRow'; +import styled from '@emotion/styled'; +import dotenv from 'dotenv'; +import { useMemo, useState } from 'react'; +import { + Button, + H2Title, + IconPlus, + IconSearch, + MOBILE_VIEWPORT, +} from 'twenty-ui'; import { v4 } from 'uuid'; const StyledSearchInput = styled(TextInput)` diff --git a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTestTab.tsx b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTestTab.tsx index 54a565215..257d13813 100644 --- a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTestTab.tsx +++ b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTestTab.tsx @@ -1,5 +1,5 @@ import { Section } from '@/ui/layout/section/components/Section'; -import { H2Title, IconPlayerPlay } from 'twenty-ui'; +import { Button, H2Title, IconPlayerPlay } from 'twenty-ui'; import { LightCopyIconButton } from '@/object-record/record-field/components/LightCopyIconButton'; import { SettingsServerlessFunctionCodeEditorContainer } from '@/settings/serverless-functions/components/SettingsServerlessFunctionCodeEditorContainer'; @@ -10,7 +10,6 @@ import { settingsServerlessFunctionOutputState } from '@/settings/serverless-fun import { SettingsServerlessFunctionHotkeyScope } from '@/settings/serverless-functions/types/SettingsServerlessFunctionHotKeyScope'; import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Button } from '@/ui/input/button/components/Button'; import { CodeEditor } from '@/ui/input/code-editor/components/CodeEditor'; import { CoreEditorHeader } from '@/ui/input/code-editor/components/CodeEditorHeader'; import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; diff --git a/packages/twenty-front/src/modules/spreadsheet-import/components/ModalCloseButton.tsx b/packages/twenty-front/src/modules/spreadsheet-import/components/ModalCloseButton.tsx index 5c03dc535..a04d344a9 100644 --- a/packages/twenty-front/src/modules/spreadsheet-import/components/ModalCloseButton.tsx +++ b/packages/twenty-front/src/modules/spreadsheet-import/components/ModalCloseButton.tsx @@ -1,10 +1,9 @@ import styled from '@emotion/styled'; -import { IconX } from 'twenty-ui'; +import { IconButton, IconX } from 'twenty-ui'; import { useSpreadsheetImportInitialStep } from '@/spreadsheet-import/hooks/useSpreadsheetImportInitialStep'; import { useSpreadsheetImportInternal } from '@/spreadsheet-import/hooks/useSpreadsheetImportInternal'; import { useDialogManager } from '@/ui/feedback/dialog-manager/hooks/useDialogManager'; -import { IconButton } from '@/ui/input/button/components/IconButton'; import { useStepBar } from '@/ui/navigation/step-bar/hooks/useStepBar'; const StyledCloseButtonContainer = styled.div` diff --git a/packages/twenty-front/src/modules/spreadsheet-import/components/StepNavigationButton.tsx b/packages/twenty-front/src/modules/spreadsheet-import/components/StepNavigationButton.tsx index 6462fcd8c..5e412dffc 100644 --- a/packages/twenty-front/src/modules/spreadsheet-import/components/StepNavigationButton.tsx +++ b/packages/twenty-front/src/modules/spreadsheet-import/components/StepNavigationButton.tsx @@ -1,7 +1,7 @@ import styled from '@emotion/styled'; import { CircularProgressBar } from '@/ui/feedback/progress-bar/components/CircularProgressBar'; -import { MainButton } from '@/ui/input/button/components/MainButton'; +import { MainButton } from 'twenty-ui'; import { Modal } from '@/ui/layout/modal/components/Modal'; import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull'; diff --git a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/UploadStep/components/DropZone.tsx b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/UploadStep/components/DropZone.tsx index 534deb1e0..e0d7ac6a2 100644 --- a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/UploadStep/components/DropZone.tsx +++ b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/UploadStep/components/DropZone.tsx @@ -7,7 +7,7 @@ import { useSpreadsheetImportInternal } from '@/spreadsheet-import/hooks/useSpre import { readFileAsync } from '@/spreadsheet-import/utils/readFilesAsync'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { MainButton } from '@/ui/input/button/components/MainButton'; +import { MainButton } from 'twenty-ui'; const StyledContainer = styled.div` align-items: center; diff --git a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/ValidationStep/ValidationStep.tsx b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/ValidationStep/ValidationStep.tsx index f74e6dcc7..12e89fd55 100644 --- a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/ValidationStep/ValidationStep.tsx +++ b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/ValidationStep/ValidationStep.tsx @@ -1,3 +1,20 @@ +import { Heading } from '@/spreadsheet-import/components/Heading'; +import { SpreadsheetImportTable } from '@/spreadsheet-import/components/SpreadsheetImportTable'; +import { StepNavigationButton } from '@/spreadsheet-import/components/StepNavigationButton'; +import { useSpreadsheetImportInternal } from '@/spreadsheet-import/hooks/useSpreadsheetImportInternal'; +import { + ColumnType, + Columns, +} from '@/spreadsheet-import/steps/components/MatchColumnsStep/MatchColumnsStep'; +import { SpreadsheetImportStep } from '@/spreadsheet-import/steps/types/SpreadsheetImportStep'; +import { SpreadsheetImportStepType } from '@/spreadsheet-import/steps/types/SpreadsheetImportStepType'; +import { + ImportValidationResult, + ImportedStructuredRow, +} from '@/spreadsheet-import/types'; +import { addErrorsAndRunHooks } from '@/spreadsheet-import/utils/dataMutations'; +import { useDialogManager } from '@/ui/feedback/dialog-manager/hooks/useDialogManager'; +import { Modal } from '@/ui/layout/modal/components/Modal'; import styled from '@emotion/styled'; import { Dispatch, @@ -8,28 +25,8 @@ import { } from 'react'; // @ts-expect-error Todo: remove usage of react-data-grid` import { RowsChangeData } from 'react-data-grid'; -import { IconTrash, Toggle } from 'twenty-ui'; - -import { Heading } from '@/spreadsheet-import/components/Heading'; -import { SpreadsheetImportTable } from '@/spreadsheet-import/components/SpreadsheetImportTable'; -import { StepNavigationButton } from '@/spreadsheet-import/components/StepNavigationButton'; -import { useSpreadsheetImportInternal } from '@/spreadsheet-import/hooks/useSpreadsheetImportInternal'; -import { - Columns, - ColumnType, -} from '@/spreadsheet-import/steps/components/MatchColumnsStep/MatchColumnsStep'; -import { - ImportedStructuredRow, - ImportValidationResult, -} from '@/spreadsheet-import/types'; -import { addErrorsAndRunHooks } from '@/spreadsheet-import/utils/dataMutations'; -import { useDialogManager } from '@/ui/feedback/dialog-manager/hooks/useDialogManager'; -import { Button } from '@/ui/input/button/components/Button'; +import { Button, IconTrash, Toggle } from 'twenty-ui'; import { isDefined } from '~/utils/isDefined'; - -import { SpreadsheetImportStep } from '@/spreadsheet-import/steps/types/SpreadsheetImportStep'; -import { SpreadsheetImportStepType } from '@/spreadsheet-import/steps/types/SpreadsheetImportStepType'; -import { Modal } from '@/ui/layout/modal/components/Modal'; import { generateColumns } from './components/columns'; import { ImportedStructuredRowMetadata } from './types'; diff --git a/packages/twenty-front/src/modules/support/components/SupportButton.tsx b/packages/twenty-front/src/modules/support/components/SupportButton.tsx index 9229232b6..5634c842d 100644 --- a/packages/twenty-front/src/modules/support/components/SupportButton.tsx +++ b/packages/twenty-front/src/modules/support/components/SupportButton.tsx @@ -1,9 +1,8 @@ import styled from '@emotion/styled'; -import { IconHelpCircle } from 'twenty-ui'; +import { Button, IconHelpCircle } from 'twenty-ui'; import { SupportButtonSkeletonLoader } from '@/support/components/SupportButtonSkeletonLoader'; import { useSupportChat } from '@/support/hooks/useSupportChat'; -import { Button } from '@/ui/input/button/components/Button'; const StyledButtonContainer = styled.div` display: flex; diff --git a/packages/twenty-front/src/modules/ui/display/info/components/Info.tsx b/packages/twenty-front/src/modules/ui/display/info/components/Info.tsx index e97dbbb43..9761daf68 100644 --- a/packages/twenty-front/src/modules/ui/display/info/components/Info.tsx +++ b/packages/twenty-front/src/modules/ui/display/info/components/Info.tsx @@ -1,11 +1,10 @@ -import React from 'react'; -import { Link } from 'react-router-dom'; import { css, useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconInfoCircle } from 'twenty-ui'; +import React from 'react'; +import { Link } from 'react-router-dom'; +import { Button, IconInfoCircle } from 'twenty-ui'; import { AppPath } from '@/types/AppPath'; -import { Button } from '@/ui/input/button/components/Button'; export type InfoAccent = 'blue' | 'danger'; export type InfoProps = { diff --git a/packages/twenty-front/src/modules/ui/feedback/dialog-manager/components/Dialog.tsx b/packages/twenty-front/src/modules/ui/feedback/dialog-manager/components/Dialog.tsx index c8e5d05cb..febaa3f08 100644 --- a/packages/twenty-front/src/modules/ui/feedback/dialog-manager/components/Dialog.tsx +++ b/packages/twenty-front/src/modules/ui/feedback/dialog-manager/components/Dialog.tsx @@ -3,8 +3,8 @@ import { motion } from 'framer-motion'; import { useCallback } from 'react'; import { Key } from 'ts-key-enum'; -import { Button } from '@/ui/input/button/components/Button'; import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; +import { Button } from 'twenty-ui'; import { isDefined } from '~/utils/isDefined'; import { DialogHotkeyScope } from '../types/DialogHotkeyScope'; diff --git a/packages/twenty-front/src/modules/ui/feedback/snack-bar-manager/components/SnackBar.tsx b/packages/twenty-front/src/modules/ui/feedback/snack-bar-manager/components/SnackBar.tsx index b1f663065..2ee43e5f2 100644 --- a/packages/twenty-front/src/modules/ui/feedback/snack-bar-manager/components/SnackBar.tsx +++ b/packages/twenty-front/src/modules/ui/feedback/snack-bar-manager/components/SnackBar.tsx @@ -7,13 +7,13 @@ import { IconInfoCircle, IconSquareRoundedCheck, IconX, + LightButton, + LightIconButton, MOBILE_VIEWPORT, } from 'twenty-ui'; import { ProgressBar } from '@/ui/feedback/progress-bar/components/ProgressBar'; import { useProgressAnimation } from '@/ui/feedback/progress-bar/hooks/useProgressAnimation'; -import { LightButton } from '@/ui/input/button/components/LightButton'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { isDefined } from '~/utils/isDefined'; export enum SnackBarVariant { diff --git a/packages/twenty-front/src/modules/ui/input/components/AutosizeTextInput.tsx b/packages/twenty-front/src/modules/ui/input/components/AutosizeTextInput.tsx index eb9afd68a..06aa24c1b 100644 --- a/packages/twenty-front/src/modules/ui/input/components/AutosizeTextInput.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/AutosizeTextInput.tsx @@ -1,12 +1,10 @@ +import styled from '@emotion/styled'; import { useRef, useState } from 'react'; import { HotkeysEvent } from 'react-hotkeys-hook/dist/types'; import TextareaAutosize from 'react-textarea-autosize'; -import styled from '@emotion/styled'; import { Key } from 'ts-key-enum'; -import { IconArrowRight } from 'twenty-ui'; +import { Button, IconArrowRight, RoundedIconButton } from 'twenty-ui'; -import { Button } from '@/ui/input/button/components/Button'; -import { RoundedIconButton } from '@/ui/input/button/components/RoundedIconButton'; import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope'; import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; diff --git a/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx b/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx index b0e8278b8..dd9191f0a 100644 --- a/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx @@ -1,7 +1,14 @@ import styled from '@emotion/styled'; import { useMemo, useState } from 'react'; import { useRecoilValue } from 'recoil'; -import { IconApps, IconComponent, useIcons } from 'twenty-ui'; +import { + IconApps, + IconComponent, + useIcons, + IconButton, + IconButtonVariant, + LightIconButton, +} from 'twenty-ui'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu'; @@ -14,8 +21,6 @@ import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectab import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope'; import { arrayToChunks } from '~/utils/array/arrayToChunks'; -import { IconButton, IconButtonVariant } from '../button/components/IconButton'; -import { LightIconButton } from '../button/components/LightIconButton'; import { IconPickerHotkeyScope } from '../types/IconPickerHotkeyScope'; export type IconPickerProps = { diff --git a/packages/twenty-front/src/modules/ui/input/components/ImageInput.tsx b/packages/twenty-front/src/modules/ui/input/components/ImageInput.tsx index 77779acc5..82f2695aa 100644 --- a/packages/twenty-front/src/modules/ui/input/components/ImageInput.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/ImageInput.tsx @@ -1,8 +1,7 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import React, { useMemo } from 'react'; -import { IconPhotoUp, IconTrash, IconUpload, IconX } from 'twenty-ui'; -import { Button } from '@/ui/input/button/components/Button'; +import { Button, IconPhotoUp, IconTrash, IconUpload, IconX } from 'twenty-ui'; import { getImageAbsoluteURI } from '~/utils/image/getImageAbsoluteURI'; import { isDefined } from '~/utils/isDefined'; diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/date/components/AbsoluteDatePickerHeader.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/date/components/AbsoluteDatePickerHeader.tsx index 1efc985d3..6ffeb3fc3 100644 --- a/packages/twenty-front/src/modules/ui/input/components/internal/date/components/AbsoluteDatePickerHeader.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/internal/date/components/AbsoluteDatePickerHeader.tsx @@ -1,8 +1,7 @@ import styled from '@emotion/styled'; import { DateTime } from 'luxon'; -import { IconChevronLeft, IconChevronRight } from 'twenty-ui'; +import { IconChevronLeft, IconChevronRight, LightIconButton } from 'twenty-ui'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { Select } from '@/ui/input/components/Select'; import { DateTimeInput } from '@/ui/input/components/internal/date/components/DateTimeInput'; diff --git a/packages/twenty-front/src/modules/ui/layout/bottom-bar/components/__stories__/BottomBar.stories.tsx b/packages/twenty-front/src/modules/ui/layout/bottom-bar/components/__stories__/BottomBar.stories.tsx index 8562f67cd..96f43c1bc 100644 --- a/packages/twenty-front/src/modules/ui/layout/bottom-bar/components/__stories__/BottomBar.stories.tsx +++ b/packages/twenty-front/src/modules/ui/layout/bottom-bar/components/__stories__/BottomBar.stories.tsx @@ -1,11 +1,9 @@ -import { Meta, StoryObj } from '@storybook/react'; -import { IconPlus } from 'twenty-ui'; - -import { Button } from '@/ui/input/button/components/Button'; import { BottomBar } from '@/ui/layout/bottom-bar/components/BottomBar'; import { isBottomBarOpenedComponentState } from '@/ui/layout/bottom-bar/states/isBottomBarOpenedComponentState'; import styled from '@emotion/styled'; +import { Meta, StoryObj } from '@storybook/react'; import { RecoilRoot } from 'recoil'; +import { Button, IconPlus } from 'twenty-ui'; const StyledContainer = styled.div` display: flex; diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuHeader.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuHeader.tsx index dd2d94dca..6356bbdd4 100644 --- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuHeader.tsx +++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuHeader.tsx @@ -1,9 +1,7 @@ -import { ComponentProps, MouseEvent } from 'react'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconComponent } from 'twenty-ui'; - -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; +import { ComponentProps, MouseEvent } from 'react'; +import { IconComponent, LightIconButton } from 'twenty-ui'; const StyledHeader = styled.li` align-items: center; diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/DropdownMenu.stories.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/DropdownMenu.stories.tsx index 69c9c7b9c..73b1c068a 100644 --- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/DropdownMenu.stories.tsx +++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/DropdownMenu.stories.tsx @@ -3,9 +3,8 @@ import { Decorator, Meta, StoryObj } from '@storybook/react'; import { expect, userEvent, waitFor, within } from '@storybook/test'; import { PlayFunction } from '@storybook/types'; import { useState } from 'react'; -import { Avatar, ComponentDecorator } from 'twenty-ui'; +import { Avatar, Button, ComponentDecorator } from 'twenty-ui'; -import { Button } from '@/ui/input/button/components/Button'; import { DropdownMenuSkeletonItem } from '@/ui/input/relation-picker/components/skeletons/DropdownMenuSkeletonItem'; import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem'; import { MenuItemMultiSelectAvatar } from '@/ui/navigation/menu-item/components/MenuItemMultiSelectAvatar'; diff --git a/packages/twenty-front/src/modules/ui/layout/modal/components/ConfirmationModal.tsx b/packages/twenty-front/src/modules/ui/layout/modal/components/ConfirmationModal.tsx index 3165ebce7..e49fcff27 100644 --- a/packages/twenty-front/src/modules/ui/layout/modal/components/ConfirmationModal.tsx +++ b/packages/twenty-front/src/modules/ui/layout/modal/components/ConfirmationModal.tsx @@ -1,10 +1,9 @@ import styled from '@emotion/styled'; import { AnimatePresence, LayoutGroup } from 'framer-motion'; import { ReactNode, useState } from 'react'; -import { H1Title, H1TitleFontColor } from 'twenty-ui'; +import { Button, ButtonAccent, H1Title, H1TitleFontColor } from 'twenty-ui'; import { useDebouncedCallback } from 'use-debounce'; -import { Button, ButtonAccent } from '@/ui/input/button/components/Button'; import { TextInput } from '@/ui/input/components/TextInput'; import { Modal, ModalVariants } from '@/ui/layout/modal/components/Modal'; diff --git a/packages/twenty-front/src/modules/ui/layout/page/components/PageAddButton.tsx b/packages/twenty-front/src/modules/ui/layout/page/components/PageAddButton.tsx index d6a977a18..3c1478f86 100644 --- a/packages/twenty-front/src/modules/ui/layout/page/components/PageAddButton.tsx +++ b/packages/twenty-front/src/modules/ui/layout/page/components/PageAddButton.tsx @@ -1,6 +1,4 @@ -import { IconPlus } from 'twenty-ui'; - -import { IconButton } from '@/ui/input/button/components/IconButton'; +import { IconButton, IconPlus } from 'twenty-ui'; type PageAddButtonProps = { onClick: () => void; diff --git a/packages/twenty-front/src/modules/ui/layout/page/components/PageFavoriteButton.tsx b/packages/twenty-front/src/modules/ui/layout/page/components/PageFavoriteButton.tsx index b66a73807..9d49b6f06 100644 --- a/packages/twenty-front/src/modules/ui/layout/page/components/PageFavoriteButton.tsx +++ b/packages/twenty-front/src/modules/ui/layout/page/components/PageFavoriteButton.tsx @@ -1,6 +1,4 @@ -import { IconHeart } from 'twenty-ui'; - -import { IconButton } from '@/ui/input/button/components/IconButton'; +import { IconButton, IconHeart } from 'twenty-ui'; type PageFavoriteButtonProps = { isFavorite: boolean; diff --git a/packages/twenty-front/src/modules/ui/layout/page/components/PageHeader.tsx b/packages/twenty-front/src/modules/ui/layout/page/components/PageHeader.tsx index 8cdb9cfea..db981feb4 100644 --- a/packages/twenty-front/src/modules/ui/layout/page/components/PageHeader.tsx +++ b/packages/twenty-front/src/modules/ui/layout/page/components/PageHeader.tsx @@ -3,6 +3,7 @@ import styled from '@emotion/styled'; import { ReactNode } from 'react'; import { useRecoilValue } from 'recoil'; import { + IconButton, IconChevronDown, IconChevronUp, IconComponent, @@ -11,7 +12,6 @@ import { OverflowingTextWithTooltip, } from 'twenty-ui'; -import { IconButton } from '@/ui/input/button/components/IconButton'; import { NavigationDrawerCollapseButton } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerCollapseButton'; import { isNavigationDrawerExpandedState } from '@/ui/navigation/states/isNavigationDrawerExpanded'; diff --git a/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarCloseButton.tsx b/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarCloseButton.tsx index 9a225f457..68bc57c0a 100644 --- a/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarCloseButton.tsx +++ b/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarCloseButton.tsx @@ -1,6 +1,4 @@ -import { IconX } from 'twenty-ui'; - -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; +import { IconX, LightIconButton } from 'twenty-ui'; import { useRightDrawer } from '../hooks/useRightDrawer'; diff --git a/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarExpandButton.tsx b/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarExpandButton.tsx index a0b96b050..d56a5f22f 100644 --- a/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarExpandButton.tsx +++ b/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarExpandButton.tsx @@ -1,6 +1,5 @@ -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { useRightDrawer } from '@/ui/layout/right-drawer/hooks/useRightDrawer'; -import { IconExternalLink, UndecoratedLink } from 'twenty-ui'; +import { IconExternalLink, LightIconButton, UndecoratedLink } from 'twenty-ui'; export const RightDrawerTopBarExpandButton = ({ to }: { to: string }) => { const { closeRightDrawer } = useRightDrawer(); diff --git a/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarMinimizeButton.tsx b/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarMinimizeButton.tsx index b95be3578..8f5635ec0 100644 --- a/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarMinimizeButton.tsx +++ b/packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawerTopBarMinimizeButton.tsx @@ -1,6 +1,5 @@ -import { IconMinus } from 'twenty-ui'; +import { IconMinus, LightIconButton } from 'twenty-ui'; -import { LightIconButton } from '@/ui/input/button/components/LightIconButton'; import { useRightDrawer } from '@/ui/layout/right-drawer/hooks/useRightDrawer'; export const RightDrawerTopBarMinimizeButton = () => { diff --git a/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageAddButton.tsx b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageAddButton.tsx index 9e5621d9d..eb0373618 100644 --- a/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageAddButton.tsx +++ b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageAddButton.tsx @@ -1,10 +1,9 @@ import styled from '@emotion/styled'; -import { IconCheckbox, IconNotes, IconPlus } from 'twenty-ui'; +import { IconButton, IconCheckbox, IconNotes, IconPlus } from 'twenty-ui'; import { useOpenCreateActivityDrawer } from '@/activities/hooks/useOpenCreateActivityDrawer'; import { ActivityTargetableObject } from '@/activities/types/ActivityTargetableEntity'; import { PageHotkeyScope } from '@/types/PageHotkeyScope'; -import { IconButton } from '@/ui/input/button/components/IconButton'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; import { SHOW_PAGE_ADD_BUTTON_DROPDOWN_ID } from '@/ui/layout/show-page/constants/ShowPageAddButtonDropdownId'; diff --git a/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageMoreButton.tsx b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageMoreButton.tsx index 8b44e1563..8cf27704d 100644 --- a/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageMoreButton.tsx +++ b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageMoreButton.tsx @@ -1,11 +1,15 @@ import styled from '@emotion/styled'; import { useNavigate } from 'react-router-dom'; import { useRecoilState, useRecoilValue } from 'recoil'; -import { IconDotsVertical, IconRestore, IconTrash } from 'twenty-ui'; +import { + IconButton, + IconDotsVertical, + IconRestore, + IconTrash, +} from 'twenty-ui'; import { useDeleteOneRecord } from '@/object-record/hooks/useDeleteOneRecord'; import { PageHotkeyScope } from '@/types/PageHotkeyScope'; -import { IconButton } from '@/ui/input/button/components/IconButton'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem'; diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItem.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItem.tsx index 5ff957ea0..bb54ce02f 100644 --- a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItem.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItem.tsx @@ -1,9 +1,11 @@ import { useTheme } from '@emotion/react'; import { FunctionComponent, MouseEvent, ReactElement, ReactNode } from 'react'; -import { IconChevronRight, IconComponent } from 'twenty-ui'; - -import { LightIconButtonProps } from '@/ui/input/button/components/LightIconButton'; -import { LightIconButtonGroup } from '@/ui/input/button/components/LightIconButtonGroup'; +import { + IconChevronRight, + IconComponent, + LightIconButtonGroup, + LightIconButtonProps, +} from 'twenty-ui'; import { MenuItemLeftContent } from '../internals/components/MenuItemLeftContent'; import { diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemAvatar.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemAvatar.tsx index c3c384bf3..a5829298b 100644 --- a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemAvatar.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemAvatar.tsx @@ -5,13 +5,12 @@ import { AvatarProps, IconChevronRight, IconComponent, - isDefined, + LightIconButtonGroup, + LightIconButtonProps, OverflowingTextWithTooltip, + isDefined, } from 'twenty-ui'; -import { LightIconButtonProps } from '@/ui/input/button/components/LightIconButton'; -import { LightIconButtonGroup } from '@/ui/input/button/components/LightIconButtonGroup'; - import { StyledHoverableMenuItemBase, StyledMenuItemLeftContent, diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemDraggable.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemDraggable.tsx index dfe895fd8..c324e8ec4 100644 --- a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemDraggable.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemDraggable.tsx @@ -1,6 +1,4 @@ -import { IconComponent } from 'twenty-ui'; - -import { LightIconButtonGroup } from '@/ui/input/button/components/LightIconButtonGroup'; +import { IconComponent, LightIconButtonGroup } from 'twenty-ui'; import { MenuItemLeftContent } from '../internals/components/MenuItemLeftContent'; import { StyledHoverableMenuItemBase } from '../internals/components/StyledMenuItemBase'; diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerCollapseButton.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerCollapseButton.tsx index 9be354732..348a3d6c8 100644 --- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerCollapseButton.tsx +++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerCollapseButton.tsx @@ -1,8 +1,8 @@ -import { IconButton } from '@/ui/input/button/components/IconButton'; import { isNavigationDrawerExpandedState } from '@/ui/navigation/states/isNavigationDrawerExpanded'; import styled from '@emotion/styled'; import { useSetRecoilState } from 'recoil'; import { + IconButton, IconLayoutSidebarLeftCollapse, IconLayoutSidebarRightCollapse, } from 'twenty-ui'; diff --git a/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx b/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx index ffe89f6b6..958e29ff9 100644 --- a/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx +++ b/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx @@ -1,8 +1,6 @@ import styled from '@emotion/styled'; -import { IconChevronDown, IconPlus } from 'twenty-ui'; +import { Button, ButtonGroup, IconChevronDown, IconPlus } from 'twenty-ui'; -import { Button } from '@/ui/input/button/components/Button'; -import { ButtonGroup } from '@/ui/input/button/components/ButtonGroup'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; diff --git a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerCreateButton.tsx b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerCreateButton.tsx index 2fb0cb4f4..b2bb66204 100644 --- a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerCreateButton.tsx +++ b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerCreateButton.tsx @@ -1,4 +1,3 @@ -import { Button } from '@/ui/input/button/components/Button'; import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2'; import { ViewType } from '@/views/types/ViewType'; import { useCreateViewFromCurrentState } from '@/views/view-picker/hooks/useCreateViewFromCurrentState'; @@ -8,6 +7,7 @@ import { useViewPickerMode } from '@/views/view-picker/hooks/useViewPickerMode'; import { viewPickerIsPersistingComponentState } from '@/views/view-picker/states/viewPickerIsPersistingComponentState'; import { viewPickerKanbanFieldMetadataIdComponentState } from '@/views/view-picker/states/viewPickerKanbanFieldMetadataIdComponentState'; import { viewPickerTypeComponentState } from '@/views/view-picker/states/viewPickerTypeComponentState'; +import { Button } from 'twenty-ui'; export const ViewPickerCreateButton = () => { const { availableFieldsForKanban, navigateToSelectSettings } = diff --git a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerEditButton.tsx b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerEditButton.tsx index a2f67dcab..16df5ea4a 100644 --- a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerEditButton.tsx +++ b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerEditButton.tsx @@ -1,4 +1,3 @@ -import { Button } from '@/ui/input/button/components/Button'; import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2'; import { ViewType } from '@/views/types/ViewType'; import { useCreateViewFromCurrentState } from '@/views/view-picker/hooks/useCreateViewFromCurrentState'; @@ -8,6 +7,7 @@ import { useViewPickerMode } from '@/views/view-picker/hooks/useViewPickerMode'; import { viewPickerIsPersistingComponentState } from '@/views/view-picker/states/viewPickerIsPersistingComponentState'; import { viewPickerKanbanFieldMetadataIdComponentState } from '@/views/view-picker/states/viewPickerKanbanFieldMetadataIdComponentState'; import { viewPickerTypeComponentState } from '@/views/view-picker/states/viewPickerTypeComponentState'; +import { Button } from 'twenty-ui'; export const ViewPickerEditButton = () => { const { availableFieldsForKanban, navigateToSelectSettings } = diff --git a/packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowHeader.tsx b/packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowHeader.tsx index c2000974e..2e741bcf3 100644 --- a/packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowHeader.tsx +++ b/packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowHeader.tsx @@ -1,9 +1,9 @@ -import { Button } from '@/ui/input/button/components/Button'; import { useActivateWorkflowVersion } from '@/workflow/hooks/useActivateWorkflowVersion'; import { useDeactivateWorkflowVersion } from '@/workflow/hooks/useDeactivateWorkflowVersion'; import { useDeleteOneWorkflowVersion } from '@/workflow/hooks/useDeleteOneWorkflowVersion'; import { useWorkflowWithCurrentVersion } from '@/workflow/hooks/useWorkflowWithCurrentVersion'; import { + Button, IconPlayerPlay, IconPlayerStop, IconPower, diff --git a/packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowVersionHeader.tsx b/packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowVersionHeader.tsx index e796c4a88..03c9c5a52 100644 --- a/packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowVersionHeader.tsx +++ b/packages/twenty-front/src/modules/workflow/components/RecordShowPageWorkflowVersionHeader.tsx @@ -1,7 +1,6 @@ import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords'; import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord'; -import { Button } from '@/ui/input/button/components/Button'; import { OverrideWorkflowDraftConfirmationModal } from '@/workflow/components/OverrideWorkflowDraftConfirmationModal'; import { useActivateWorkflowVersion } from '@/workflow/hooks/useActivateWorkflowVersion'; import { useCreateNewWorkflowVersion } from '@/workflow/hooks/useCreateNewWorkflowVersion'; @@ -10,7 +9,13 @@ import { useWorkflowVersion } from '@/workflow/hooks/useWorkflowVersion'; import { openOverrideWorkflowDraftConfirmationModalState } from '@/workflow/states/openOverrideWorkflowDraftConfirmationModalState'; import { Workflow, WorkflowVersion } from '@/workflow/types/Workflow'; import { useSetRecoilState } from 'recoil'; -import { IconPencil, IconPlayerStop, IconPower, isDefined } from 'twenty-ui'; +import { + Button, + IconPencil, + IconPlayerStop, + IconPower, + isDefined, +} from 'twenty-ui'; export const RecordShowPageWorkflowVersionHeader = ({ workflowVersionId, diff --git a/packages/twenty-front/src/modules/workflow/components/WorkflowDiagramCreateStepNode.tsx b/packages/twenty-front/src/modules/workflow/components/WorkflowDiagramCreateStepNode.tsx index 2e1b1328a..ec0614037 100644 --- a/packages/twenty-front/src/modules/workflow/components/WorkflowDiagramCreateStepNode.tsx +++ b/packages/twenty-front/src/modules/workflow/components/WorkflowDiagramCreateStepNode.tsx @@ -1,7 +1,6 @@ -import { IconButton } from '@/ui/input/button/components/IconButton'; import styled from '@emotion/styled'; import { Handle, Position } from '@xyflow/react'; -import { IconPlus } from 'twenty-ui'; +import { IconButton, IconPlus } from 'twenty-ui'; export const StyledTargetHandle = styled(Handle)` visibility: hidden; diff --git a/packages/twenty-front/src/modules/workflow/components/WorkflowDiagramStepNodeEditable.tsx b/packages/twenty-front/src/modules/workflow/components/WorkflowDiagramStepNodeEditable.tsx index cb8290fd7..579e3c923 100644 --- a/packages/twenty-front/src/modules/workflow/components/WorkflowDiagramStepNodeEditable.tsx +++ b/packages/twenty-front/src/modules/workflow/components/WorkflowDiagramStepNodeEditable.tsx @@ -1,4 +1,3 @@ -import { FloatingIconButton } from '@/ui/input/button/components/FloatingIconButton'; import { WorkflowDiagramStepNodeBase } from '@/workflow/components/WorkflowDiagramStepNodeBase'; import { useDeleteOneStep } from '@/workflow/hooks/useDeleteOneStep'; import { useWorkflowWithCurrentVersion } from '@/workflow/hooks/useWorkflowWithCurrentVersion'; @@ -6,7 +5,7 @@ import { workflowIdState } from '@/workflow/states/workflowIdState'; import { WorkflowDiagramStepNodeData } from '@/workflow/types/WorkflowDiagram'; import { assertWorkflowWithCurrentVersionIsDefined } from '@/workflow/utils/assertWorkflowWithCurrentVersionIsDefined'; import { useRecoilValue } from 'recoil'; -import { IconTrash } from 'twenty-ui'; +import { FloatingIconButton, IconTrash } from 'twenty-ui'; export const WorkflowDiagramStepNodeEditable = ({ id, diff --git a/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteLink.tsx b/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteLink.tsx index 92bdf69af..1e0a10aea 100644 --- a/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteLink.tsx +++ b/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteLink.tsx @@ -1,10 +1,9 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconCopy, IconLink } from 'twenty-ui'; +import { Button, IconCopy, IconLink } from 'twenty-ui'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { Button } from '@/ui/input/button/components/Button'; import { TextInput } from '@/ui/input/components/TextInput'; const StyledContainer = styled.div` diff --git a/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteTeam.tsx b/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteTeam.tsx index 4c007b518..7bff50204 100644 --- a/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteTeam.tsx +++ b/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteTeam.tsx @@ -3,12 +3,11 @@ import { zodResolver } from '@hookform/resolvers/zod'; import { useEffect } from 'react'; import { Controller, useForm } from 'react-hook-form'; import { Key } from 'ts-key-enum'; -import { IconSend } from 'twenty-ui'; +import { Button, IconSend } from 'twenty-ui'; import { z } from 'zod'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { Button } from '@/ui/input/button/components/Button'; import { TextInput } from '@/ui/input/components/TextInput'; import { sanitizeEmailList } from '@/workspace/utils/sanitizeEmailList'; import { isDefined } from '~/utils/isDefined'; diff --git a/packages/twenty-front/src/pages/auth/Authorize.tsx b/packages/twenty-front/src/pages/auth/Authorize.tsx index b97c31815..1019907d2 100644 --- a/packages/twenty-front/src/pages/auth/Authorize.tsx +++ b/packages/twenty-front/src/pages/auth/Authorize.tsx @@ -1,10 +1,8 @@ +import { AppPath } from '@/types/AppPath'; import styled from '@emotion/styled'; import { useEffect, useState } from 'react'; import { useNavigate, useSearchParams } from 'react-router-dom'; - -import { AppPath } from '@/types/AppPath'; -import { MainButton } from '@/ui/input/button/components/MainButton'; -import { UndecoratedLink } from 'twenty-ui'; +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/Invite.tsx b/packages/twenty-front/src/pages/auth/Invite.tsx index 0afef7d32..737faa344 100644 --- a/packages/twenty-front/src/pages/auth/Invite.tsx +++ b/packages/twenty-front/src/pages/auth/Invite.tsx @@ -1,7 +1,3 @@ -import styled from '@emotion/styled'; -import { useMemo } from 'react'; -import { useRecoilValue } from 'recoil'; - import { Logo } from '@/auth/components/Logo'; import { Title } from '@/auth/components/Title'; import { FooterNote } from '@/auth/sign-in-up/components/FooterNote'; @@ -10,10 +6,12 @@ import { useSignInUpForm } from '@/auth/sign-in-up/hooks/useSignInUpForm'; import { useWorkspaceFromInviteHash } from '@/auth/sign-in-up/hooks/useWorkspaceFromInviteHash'; import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState'; import { Loader } from '@/ui/feedback/loader/components/Loader'; -import { MainButton } from '@/ui/input/button/components/MainButton'; import { useWorkspaceSwitching } from '@/ui/navigation/navigation-drawer/hooks/useWorkspaceSwitching'; +import styled from '@emotion/styled'; +import { useMemo } from 'react'; import { useSearchParams } from 'react-router-dom'; -import { AnimatedEaseIn } from 'twenty-ui'; +import { useRecoilValue } from 'recoil'; +import { AnimatedEaseIn, MainButton } from 'twenty-ui'; import { useAddUserToWorkspaceByInviteTokenMutation, useAddUserToWorkspaceMutation, diff --git a/packages/twenty-front/src/pages/auth/PasswordReset.tsx b/packages/twenty-front/src/pages/auth/PasswordReset.tsx index 137810855..4be8e0444 100644 --- a/packages/twenty-front/src/pages/auth/PasswordReset.tsx +++ b/packages/twenty-front/src/pages/auth/PasswordReset.tsx @@ -1,15 +1,3 @@ -import { useTheme } from '@emotion/react'; -import styled from '@emotion/styled'; -import { zodResolver } from '@hookform/resolvers/zod'; -import { isNonEmptyString } from '@sniptt/guards'; -import { motion } from 'framer-motion'; -import { useState } from 'react'; -import { Controller, useForm } from 'react-hook-form'; -import Skeleton, { SkeletonTheme } from 'react-loading-skeleton'; -import { useNavigate, useParams } from 'react-router-dom'; -import { useSetRecoilState } from 'recoil'; -import { z } from 'zod'; - import { SKELETON_LOADER_HEIGHT_SIZES } from '@/activities/components/SkeletonLoader'; import { Logo } from '@/auth/components/Logo'; import { Title } from '@/auth/components/Title'; @@ -20,10 +8,20 @@ import { useReadCaptchaToken } from '@/captcha/hooks/useReadCaptchaToken'; 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 { MainButton } from '@/ui/input/button/components/MainButton'; import { TextInputV2 } from '@/ui/input/components/TextInputV2'; import { isDefaultLayoutAuthModalVisibleState } from '@/ui/layout/states/isDefaultLayoutAuthModalVisibleState'; -import { AnimatedEaseIn } from 'twenty-ui'; +import { useTheme } from '@emotion/react'; +import styled from '@emotion/styled'; +import { zodResolver } from '@hookform/resolvers/zod'; +import { isNonEmptyString } from '@sniptt/guards'; +import { motion } from 'framer-motion'; +import { useState } from 'react'; +import { Controller, useForm } from 'react-hook-form'; +import Skeleton, { SkeletonTheme } from 'react-loading-skeleton'; +import { useNavigate, useParams } from 'react-router-dom'; +import { useSetRecoilState } from 'recoil'; +import { AnimatedEaseIn, MainButton } from 'twenty-ui'; +import { z } from 'zod'; import { useUpdatePasswordViaResetTokenMutation, useValidatePasswordResetTokenQuery, diff --git a/packages/twenty-front/src/pages/auth/SSOWorkspaceSelection.tsx b/packages/twenty-front/src/pages/auth/SSOWorkspaceSelection.tsx index 6d3e604a5..1767b1342 100644 --- a/packages/twenty-front/src/pages/auth/SSOWorkspaceSelection.tsx +++ b/packages/twenty-front/src/pages/auth/SSOWorkspaceSelection.tsx @@ -5,10 +5,10 @@ import { HorizontalSeparator } from '@/auth/sign-in-up/components/HorizontalSepa import { useSSO } from '@/auth/sign-in-up/hooks/useSSO'; import { availableSSOIdentityProvidersState } from '@/auth/states/availableWorkspacesForSSO'; import { guessSSOIdentityProviderIconByUrl } from '@/settings/security/utils/guessSSOIdentityProviderIconByUrl'; -import { MainButton } from '@/ui/input/button/components/MainButton'; import { DEFAULT_WORKSPACE_NAME } from '@/ui/navigation/navigation-drawer/constants/DefaultWorkspaceName'; import styled from '@emotion/styled'; import { useRecoilValue } from 'recoil'; +import { MainButton } from 'twenty-ui'; const StyledContentContainer = styled.div` margin-bottom: ${({ theme }) => theme.spacing(8)}; diff --git a/packages/twenty-front/src/pages/not-found/NotFound.tsx b/packages/twenty-front/src/pages/not-found/NotFound.tsx index 3843244ae..dee24fc8c 100644 --- a/packages/twenty-front/src/pages/not-found/NotFound.tsx +++ b/packages/twenty-front/src/pages/not-found/NotFound.tsx @@ -1,16 +1,14 @@ -import styled from '@emotion/styled'; - import { SignInBackgroundMockPage } from '@/sign-in-background-mock/components/SignInBackgroundMockPage'; import { AppPath } from '@/types/AppPath'; -import { MainButton } from '@/ui/input/button/components/MainButton'; - import { PageTitle } from '@/ui/utilities/page-title/components/PageTitle'; +import styled from '@emotion/styled'; import { AnimatedPlaceholder, AnimatedPlaceholderEmptyTextContainer, AnimatedPlaceholderErrorContainer, AnimatedPlaceholderErrorSubTitle, AnimatedPlaceholderErrorTitle, + MainButton, UndecoratedLink, } from 'twenty-ui'; diff --git a/packages/twenty-front/src/pages/onboarding/ChooseYourPlan.tsx b/packages/twenty-front/src/pages/onboarding/ChooseYourPlan.tsx index d9e934e57..19f1521e1 100644 --- a/packages/twenty-front/src/pages/onboarding/ChooseYourPlan.tsx +++ b/packages/twenty-front/src/pages/onboarding/ChooseYourPlan.tsx @@ -1,8 +1,3 @@ -import styled from '@emotion/styled'; -import { isNonEmptyString, isNumber } from '@sniptt/guards'; -import { useState } from 'react'; -import { useRecoilValue } from 'recoil'; - import { SubTitle } from '@/auth/components/SubTitle'; import { Title } from '@/auth/components/Title'; import { useAuth } from '@/auth/hooks/useAuth'; @@ -13,9 +8,12 @@ import { AppPath } from '@/types/AppPath'; import { Loader } from '@/ui/feedback/loader/components/Loader'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { MainButton } from '@/ui/input/button/components/MainButton'; import { CardPicker } from '@/ui/input/components/CardPicker'; -import { ActionLink, CAL_LINK } from 'twenty-ui'; +import styled from '@emotion/styled'; +import { isNonEmptyString, isNumber } from '@sniptt/guards'; +import { useState } from 'react'; +import { useRecoilValue } from 'recoil'; +import { ActionLink, CAL_LINK, MainButton } from 'twenty-ui'; import { ProductPriceEntity, SubscriptionInterval, diff --git a/packages/twenty-front/src/pages/onboarding/CreateProfile.tsx b/packages/twenty-front/src/pages/onboarding/CreateProfile.tsx index f5faa4ff4..ebb0fbc1b 100644 --- a/packages/twenty-front/src/pages/onboarding/CreateProfile.tsx +++ b/packages/twenty-front/src/pages/onboarding/CreateProfile.tsx @@ -1,10 +1,10 @@ -import { useCallback, useState } from 'react'; -import { Controller, SubmitHandler, useForm } from 'react-hook-form'; import styled from '@emotion/styled'; import { zodResolver } from '@hookform/resolvers/zod'; +import { useCallback, useState } from 'react'; +import { Controller, SubmitHandler, useForm } from 'react-hook-form'; import { useRecoilState } from 'recoil'; import { Key } from 'ts-key-enum'; -import { H2Title } from 'twenty-ui'; +import { H2Title, MainButton } from 'twenty-ui'; import { z } from 'zod'; import { SubTitle } from '@/auth/components/SubTitle'; @@ -18,7 +18,6 @@ import { ProfilePictureUploader } from '@/settings/profile/components/ProfilePic import { PageHotkeyScope } from '@/types/PageHotkeyScope'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { MainButton } from '@/ui/input/button/components/MainButton'; import { TextInputV2 } from '@/ui/input/components/TextInputV2'; import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; import { WorkspaceMember } from '@/workspace-member/types/WorkspaceMember'; diff --git a/packages/twenty-front/src/pages/onboarding/CreateWorkspace.tsx b/packages/twenty-front/src/pages/onboarding/CreateWorkspace.tsx index b703ef13b..bb8f7d1d4 100644 --- a/packages/twenty-front/src/pages/onboarding/CreateWorkspace.tsx +++ b/packages/twenty-front/src/pages/onboarding/CreateWorkspace.tsx @@ -1,10 +1,10 @@ -import { useCallback } from 'react'; -import { Controller, SubmitHandler, useForm } from 'react-hook-form'; import styled from '@emotion/styled'; import { zodResolver } from '@hookform/resolvers/zod'; +import { useCallback } from 'react'; +import { Controller, SubmitHandler, useForm } from 'react-hook-form'; import { useSetRecoilState } from 'recoil'; import { Key } from 'ts-key-enum'; -import { H2Title } from 'twenty-ui'; +import { H2Title, MainButton } from 'twenty-ui'; import { z } from 'zod'; import { SubTitle } from '@/auth/components/SubTitle'; @@ -17,7 +17,6 @@ import { WorkspaceLogoUploader } from '@/settings/workspace/components/Workspace import { Loader } from '@/ui/feedback/loader/components/Loader'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { MainButton } from '@/ui/input/button/components/MainButton'; import { TextInputV2 } from '@/ui/input/components/TextInputV2'; import { OnboardingStatus, diff --git a/packages/twenty-front/src/pages/onboarding/InviteTeam.tsx b/packages/twenty-front/src/pages/onboarding/InviteTeam.tsx index 3b2a3ee94..42dac7188 100644 --- a/packages/twenty-front/src/pages/onboarding/InviteTeam.tsx +++ b/packages/twenty-front/src/pages/onboarding/InviteTeam.tsx @@ -1,3 +1,14 @@ +import { SubTitle } from '@/auth/components/SubTitle'; +import { Title } from '@/auth/components/Title'; +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'; +import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; import { zodResolver } from '@hookform/resolvers/zod'; @@ -10,22 +21,14 @@ import { } from 'react-hook-form'; import { useRecoilValue } from 'recoil'; import { Key } from 'ts-key-enum'; -import { ActionLink, AnimatedTranslation, IconCopy } from 'twenty-ui'; +import { + ActionLink, + AnimatedTranslation, + IconCopy, + LightButton, + MainButton, +} from 'twenty-ui'; import { z } from 'zod'; - -import { SubTitle } from '@/auth/components/SubTitle'; -import { Title } from '@/auth/components/Title'; -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 { LightButton } from '@/ui/input/button/components/LightButton'; -import { MainButton } from '@/ui/input/button/components/MainButton'; -import { TextInputV2 } from '@/ui/input/components/TextInputV2'; -import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; 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 e2fb35efc..0e2ed08f0 100644 --- a/packages/twenty-front/src/pages/onboarding/PaymentSuccess.tsx +++ b/packages/twenty-front/src/pages/onboarding/PaymentSuccess.tsx @@ -1,13 +1,17 @@ -import { useTheme } from '@emotion/react'; -import styled from '@emotion/styled'; -import { useRecoilValue } from 'recoil'; -import { AnimatedEaseIn, IconCheck, 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 { MainButton } from '@/ui/input/button/components/MainButton'; +import { useTheme } from '@emotion/react'; +import styled from '@emotion/styled'; +import { useRecoilValue } from 'recoil'; +import { + AnimatedEaseIn, + IconCheck, + MainButton, + RGBA, + UndecoratedLink, +} from 'twenty-ui'; 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 259f519e4..607e9fe80 100644 --- a/packages/twenty-front/src/pages/onboarding/SyncEmails.tsx +++ b/packages/twenty-front/src/pages/onboarding/SyncEmails.tsx @@ -1,10 +1,3 @@ -import { useTheme } from '@emotion/react'; -import styled from '@emotion/styled'; -import { useState } from 'react'; -import { useRecoilValue } from 'recoil'; -import { Key } from 'ts-key-enum'; -import { ActionLink, IconGoogle } from 'twenty-ui'; - import { SubTitle } from '@/auth/components/SubTitle'; import { Title } from '@/auth/components/Title'; import { currentUserState } from '@/auth/states/currentUserState'; @@ -13,8 +6,14 @@ import { useSetNextOnboardingStatus } from '@/onboarding/hooks/useSetNextOnboard import { useTriggerGoogleApisOAuth } from '@/settings/accounts/hooks/useTriggerGoogleApisOAuth'; import { AppPath } from '@/types/AppPath'; import { PageHotkeyScope } from '@/types/PageHotkeyScope'; -import { MainButton } from '@/ui/input/button/components/MainButton'; import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; +import { useTheme } from '@emotion/react'; +import styled from '@emotion/styled'; +import { useState } from 'react'; +import { useRecoilValue } from 'recoil'; +import { Key } from 'ts-key-enum'; +import { ActionLink, IconGoogle, MainButton } from 'twenty-ui'; + import { CalendarChannelVisibility, MessageChannelVisibility, diff --git a/packages/twenty-front/src/pages/settings/SettingsBilling.tsx b/packages/twenty-front/src/pages/settings/SettingsBilling.tsx index c1f3f4aa5..e30f3e88d 100644 --- a/packages/twenty-front/src/pages/settings/SettingsBilling.tsx +++ b/packages/twenty-front/src/pages/settings/SettingsBilling.tsx @@ -1,6 +1,7 @@ import { useState } from 'react'; import { useRecoilValue, useSetRecoilState } from 'recoil'; import { + Button, H2Title, IconCalendarEvent, IconCircleX, @@ -17,7 +18,6 @@ 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 { Button } from '@/ui/input/button/components/Button'; import { ConfirmationModal } from '@/ui/layout/modal/components/ConfirmationModal'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; import { Section } from '@/ui/layout/section/components/Section'; diff --git a/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx b/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx index 6d60faf1b..0986ea87e 100644 --- a/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx +++ b/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx @@ -1,18 +1,3 @@ -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, - IconMail, - IconReload, - IconTrash, - TooltipDelay, -} from 'twenty-ui'; - import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState'; import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; @@ -23,7 +8,6 @@ import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { IconButton } from '@/ui/input/button/components/IconButton'; import { ConfirmationModal } from '@/ui/layout/modal/components/ConfirmationModal'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; import { Section } from '@/ui/layout/section/components/Section'; @@ -32,7 +16,22 @@ 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'; diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetailPageContent.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetailPageContent.tsx index c40a6baea..3668087f8 100644 --- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetailPageContent.tsx +++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetailPageContent.tsx @@ -4,7 +4,6 @@ import { SettingsPageContainer } from '@/settings/components/SettingsPageContain import { SettingsObjectSummaryCard } from '@/settings/data-model/object-details/components/SettingsObjectSummaryCard'; import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Button } from '@/ui/input/button/components/Button'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; import { Section } from '@/ui/layout/section/components/Section'; import { isAdvancedModeEnabledState } from '@/ui/navigation/navigation-drawer/states/isAdvancedModeEnabledState'; @@ -12,7 +11,7 @@ import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled'; import styled from '@emotion/styled'; import { useNavigate } from 'react-router-dom'; import { useRecoilValue } from 'recoil'; -import { H2Title, IconPlus, UndecoratedLink } from 'twenty-ui'; +import { Button, H2Title, IconPlus, UndecoratedLink } from 'twenty-ui'; import { SettingsObjectFieldTable } from '~/pages/settings/data-model/SettingsObjectFieldTable'; import { SettingsObjectIndexTable } from '~/pages/settings/data-model/SettingsObjectIndexTable'; 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 06cc4999f..12e5cb4d6 100644 --- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectEdit.tsx +++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectEdit.tsx @@ -1,13 +1,5 @@ /* 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 { H2Title, IconArchive } from 'twenty-ui'; -import { z } from 'zod'; - import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems'; import { useUpdateOneObjectMetadataItem } from '@/object-metadata/hooks/useUpdateOneObjectMetadataItem'; import { getObjectSlug } from '@/object-metadata/utils/getObjectSlug'; @@ -26,9 +18,15 @@ import { AppPath } from '@/types/AppPath'; import { SettingsPath } from '@/types/SettingsPath'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { Button } from '@/ui/input/button/components/Button'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; import { Section } from '@/ui/layout/section/components/Section'; +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'; const objectEditFormSchema = z .object({}) 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 a08d6658c..d9be092b9 100644 --- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx +++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx @@ -1,13 +1,3 @@ -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 { 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'; @@ -31,9 +21,17 @@ import { AppPath } from '@/types/AppPath'; import { SettingsPath } from '@/types/SettingsPath'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { Button } from '@/ui/input/button/components/Button'; 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/data-model/SettingsObjects.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx index 03b3a60c3..fda857733 100644 --- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx +++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx @@ -1,13 +1,3 @@ -import { useTheme } from '@emotion/react'; -import styled from '@emotion/styled'; -import { - H2Title, - IconChevronRight, - IconPlus, - IconSearch, - UndecoratedLink, -} from 'twenty-ui'; - import { useDeleteOneObjectMetadataItem } from '@/object-metadata/hooks/useDeleteOneObjectMetadataItem'; import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems'; import { useUpdateOneObjectMetadataItem } from '@/object-metadata/hooks/useUpdateOneObjectMetadataItem'; @@ -23,7 +13,6 @@ import { SettingsObjectInactiveMenuDropDown } from '@/settings/data-model/object import { getObjectTypeLabel } from '@/settings/data-model/utils/getObjectTypeLabel'; import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Button } from '@/ui/input/button/components/Button'; import { TextInput } from '@/ui/input/components/TextInput'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; import { Section } from '@/ui/layout/section/components/Section'; @@ -32,8 +21,18 @@ import { Table } from '@/ui/layout/table/components/Table'; import { TableHeader } from '@/ui/layout/table/components/TableHeader'; import { TableSection } from '@/ui/layout/table/components/TableSection'; import { useSortedArray } from '@/ui/layout/table/hooks/useSortedArray'; +import { useTheme } from '@emotion/react'; +import styled from '@emotion/styled'; import { isNonEmptyArray } from '@sniptt/guards'; import { useMemo, useState } from 'react'; +import { + Button, + H2Title, + IconChevronRight, + IconPlus, + IconSearch, + UndecoratedLink, +} from 'twenty-ui'; import { SETTINGS_OBJECT_TABLE_METADATA } from '~/pages/settings/data-model/constants/SettingsObjectTableMetadata'; import { SettingsObjectTableItem } from '~/pages/settings/data-model/types/SettingsObjectTableItem'; diff --git a/packages/twenty-front/src/pages/settings/developers/SettingsDevelopers.tsx b/packages/twenty-front/src/pages/settings/developers/SettingsDevelopers.tsx index a200a8445..8cf5a0db5 100644 --- a/packages/twenty-front/src/pages/settings/developers/SettingsDevelopers.tsx +++ b/packages/twenty-front/src/pages/settings/developers/SettingsDevelopers.tsx @@ -1,16 +1,14 @@ -import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; -import styled from '@emotion/styled'; -import { H2Title, IconPlus, MOBILE_VIEWPORT } from 'twenty-ui'; - import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer'; import { SettingsApiKeysTable } from '@/settings/developers/components/SettingsApiKeysTable'; import { SettingsReadDocumentationButton } from '@/settings/developers/components/SettingsReadDocumentationButton'; import { SettingsWebhooksTable } from '@/settings/developers/components/SettingsWebhooksTable'; import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Button } from '@/ui/input/button/components/Button'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; import { Section } from '@/ui/layout/section/components/Section'; +import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile'; +import styled from '@emotion/styled'; +import { Button, H2Title, IconPlus, MOBILE_VIEWPORT } from 'twenty-ui'; const StyledButtonContainer = styled.div` display: flex; diff --git a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeyDetail.tsx b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeyDetail.tsx index 8d45c760c..51ae6756c 100644 --- a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeyDetail.tsx +++ b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeyDetail.tsx @@ -4,7 +4,7 @@ import { DateTime } from 'luxon'; import { useState } from 'react'; import { useNavigate, useParams } from 'react-router-dom'; import { useRecoilState } from 'recoil'; -import { H2Title, IconRepeat, IconTrash } from 'twenty-ui'; +import { Button, H2Title, IconRepeat, IconTrash } from 'twenty-ui'; import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular'; import { useCreateOneRecord } from '@/object-record/hooks/useCreateOneRecord'; @@ -21,7 +21,6 @@ import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar'; import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar'; -import { Button } from '@/ui/input/button/components/Button'; import { TextInput } from '@/ui/input/components/TextInput'; import { ConfirmationModal } from '@/ui/layout/modal/components/ConfirmationModal'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; diff --git a/packages/twenty-front/src/pages/settings/developers/webhooks/components/SettingsDevelopersWebhookDetail.tsx b/packages/twenty-front/src/pages/settings/developers/webhooks/components/SettingsDevelopersWebhookDetail.tsx index 706310296..83b87c390 100644 --- a/packages/twenty-front/src/pages/settings/developers/webhooks/components/SettingsDevelopersWebhookDetail.tsx +++ b/packages/twenty-front/src/pages/settings/developers/webhooks/components/SettingsDevelopersWebhookDetail.tsx @@ -2,8 +2,10 @@ import styled from '@emotion/styled'; import { useMemo, useState } from 'react'; import { useNavigate, useParams } from 'react-router-dom'; import { + Button, H2Title, IconBox, + IconButton, IconNorthStar, IconPlus, IconRefresh, @@ -25,8 +27,6 @@ import { SettingsDevelopersWebhookUsageGraph } from '@/settings/developers/webho import { SettingsDevelopersWebhookUsageGraphEffect } from '@/settings/developers/webhook/components/SettingsDevelopersWebhookUsageGraphEffect'; import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Button } from '@/ui/input/button/components/Button'; -import { IconButton } from '@/ui/input/button/components/IconButton'; import { Select, SelectOption } from '@/ui/input/components/Select'; import { TextArea } from '@/ui/input/components/TextArea'; import { TextInput } from '@/ui/input/components/TextInput'; diff --git a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctions.tsx b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctions.tsx index c694ad694..81aeb5663 100644 --- a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctions.tsx +++ b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctions.tsx @@ -1,10 +1,9 @@ import { SettingsServerlessFunctionsTable } from '@/settings/serverless-functions/components/SettingsServerlessFunctionsTable'; import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath'; import { SettingsPath } from '@/types/SettingsPath'; -import { Button } from '@/ui/input/button/components/Button'; import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer'; import { Section } from '@/ui/layout/section/components/Section'; -import { IconPlus, UndecoratedLink } from 'twenty-ui'; +import { Button, IconPlus, UndecoratedLink } from 'twenty-ui'; export const SettingsServerlessFunctions = () => { return ( diff --git a/packages/twenty-front/tsup.ui.index.tsx b/packages/twenty-front/tsup.ui.index.tsx index 01b5aea3d..597f9d2cd 100644 --- a/packages/twenty-front/tsup.ui.index.tsx +++ b/packages/twenty-front/tsup.ui.index.tsx @@ -4,16 +4,6 @@ export { ThemeProvider } from '@emotion/react'; export * from 'twenty-ui'; export * from './src/modules/ui/feedback/progress-bar/components/CircularProgressBar'; export * from './src/modules/ui/feedback/progress-bar/components/ProgressBar'; -export * from './src/modules/ui/input/button/components/Button'; -export * from './src/modules/ui/input/button/components/ButtonGroup'; -export * from './src/modules/ui/input/button/components/FloatingButton'; -export * from './src/modules/ui/input/button/components/FloatingButtonGroup'; -export * from './src/modules/ui/input/button/components/FloatingIconButton'; -export * from './src/modules/ui/input/button/components/FloatingIconButtonGroup'; -export * from './src/modules/ui/input/button/components/LightButton'; -export * from './src/modules/ui/input/button/components/LightIconButton'; -export * from './src/modules/ui/input/button/components/MainButton'; -export * from './src/modules/ui/input/button/components/RoundedIconButton'; export * from './src/modules/ui/input/color-scheme/components/ColorSchemeCard'; export * from './src/modules/ui/input/color-scheme/components/ColorSchemePicker'; export * from './src/modules/ui/input/components/AutosizeTextInput'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/Button.tsx b/packages/twenty-ui/src/input/button/components/Button.tsx similarity index 99% rename from packages/twenty-front/src/modules/ui/input/button/components/Button.tsx rename to packages/twenty-ui/src/input/button/components/Button.tsx index de07f8303..6a6b49b03 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/Button.tsx +++ b/packages/twenty-ui/src/input/button/components/Button.tsx @@ -1,9 +1,10 @@ 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 React from 'react'; import { Link } from 'react-router-dom'; -import { IconComponent, Pill } from 'twenty-ui'; export type ButtonSize = 'medium' | 'small'; export type ButtonPosition = 'standalone' | 'left' | 'middle' | 'right'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/ButtonGroup.tsx b/packages/twenty-ui/src/input/button/components/ButtonGroup.tsx similarity index 96% rename from packages/twenty-front/src/modules/ui/input/button/components/ButtonGroup.tsx rename to packages/twenty-ui/src/input/button/components/ButtonGroup.tsx index 9bac9d6dd..e0a8cff1d 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/ButtonGroup.tsx +++ b/packages/twenty-ui/src/input/button/components/ButtonGroup.tsx @@ -1,7 +1,7 @@ -import React, { ReactNode } from 'react'; import styled from '@emotion/styled'; +import React, { ReactNode } from 'react'; -import { isDefined } from '~/utils/isDefined'; +import { isDefined } from '@ui/utilities'; import { ButtonPosition, ButtonProps } from './Button'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/ColorPickerButton.tsx b/packages/twenty-ui/src/input/button/components/ColorPickerButton.tsx similarity index 88% rename from packages/twenty-front/src/modules/ui/input/button/components/ColorPickerButton.tsx rename to packages/twenty-ui/src/input/button/components/ColorPickerButton.tsx index 9a7f9fdb1..8b9506209 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/ColorPickerButton.tsx +++ b/packages/twenty-ui/src/input/button/components/ColorPickerButton.tsx @@ -1,11 +1,10 @@ import { css } from '@emotion/react'; import styled from '@emotion/styled'; -import { ColorSample, ColorSampleProps } from 'twenty-ui'; - +import { ColorSample, ColorSampleProps } from '@ui/display'; import { LightIconButton, LightIconButtonProps, -} from '@/ui/input/button/components/LightIconButton'; +} from '@ui/input/button/components/LightIconButton'; type ColorPickerButtonProps = Pick & Pick & { diff --git a/packages/twenty-front/src/modules/ui/input/button/components/FloatingButton.tsx b/packages/twenty-ui/src/input/button/components/FloatingButton.tsx similarity index 98% rename from packages/twenty-front/src/modules/ui/input/button/components/FloatingButton.tsx rename to packages/twenty-ui/src/input/button/components/FloatingButton.tsx index 820da15de..9b3aacc21 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/FloatingButton.tsx +++ b/packages/twenty-ui/src/input/button/components/FloatingButton.tsx @@ -1,8 +1,8 @@ import isPropValid from '@emotion/is-prop-valid'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; +import { IconComponent } from '@ui/display'; import { Link } from 'react-router-dom'; -import { IconComponent } from 'twenty-ui'; export type FloatingButtonSize = 'small' | 'medium'; export type FloatingButtonPosition = 'standalone' | 'left' | 'middle' | 'right'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/FloatingButtonGroup.tsx b/packages/twenty-ui/src/input/button/components/FloatingButtonGroup.tsx similarity index 96% rename from packages/twenty-front/src/modules/ui/input/button/components/FloatingButtonGroup.tsx rename to packages/twenty-ui/src/input/button/components/FloatingButtonGroup.tsx index db9485c17..29edea125 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/FloatingButtonGroup.tsx +++ b/packages/twenty-ui/src/input/button/components/FloatingButtonGroup.tsx @@ -1,7 +1,7 @@ -import React from 'react'; import styled from '@emotion/styled'; +import React from 'react'; -import { isDefined } from '~/utils/isDefined'; +import { isDefined } from '@ui/utilities'; import { FloatingButtonPosition, FloatingButtonProps } from './FloatingButton'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/FloatingIconButton.tsx b/packages/twenty-ui/src/input/button/components/FloatingIconButton.tsx similarity index 98% rename from packages/twenty-front/src/modules/ui/input/button/components/FloatingIconButton.tsx rename to packages/twenty-ui/src/input/button/components/FloatingIconButton.tsx index 40d0e8697..328e1b75b 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/FloatingIconButton.tsx +++ b/packages/twenty-ui/src/input/button/components/FloatingIconButton.tsx @@ -1,7 +1,7 @@ import { css, useTheme } from '@emotion/react'; import styled from '@emotion/styled'; +import { IconComponent } from '@ui/display'; import React from 'react'; -import { IconComponent } from 'twenty-ui'; export type FloatingIconButtonSize = 'small' | 'medium'; export type FloatingIconButtonPosition = diff --git a/packages/twenty-front/src/modules/ui/input/button/components/FloatingIconButtonGroup.tsx b/packages/twenty-ui/src/input/button/components/FloatingIconButtonGroup.tsx similarity index 97% rename from packages/twenty-front/src/modules/ui/input/button/components/FloatingIconButtonGroup.tsx rename to packages/twenty-ui/src/input/button/components/FloatingIconButtonGroup.tsx index 6d9a3ad60..cc7b6d96e 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/FloatingIconButtonGroup.tsx +++ b/packages/twenty-ui/src/input/button/components/FloatingIconButtonGroup.tsx @@ -1,6 +1,6 @@ -import { MouseEvent } from 'react'; import styled from '@emotion/styled'; -import { IconComponent } from 'twenty-ui'; +import { IconComponent } from '@ui/display'; +import { MouseEvent } from 'react'; import { FloatingIconButton, diff --git a/packages/twenty-front/src/modules/ui/input/button/components/IconButton.tsx b/packages/twenty-ui/src/input/button/components/IconButton.tsx similarity index 99% rename from packages/twenty-front/src/modules/ui/input/button/components/IconButton.tsx rename to packages/twenty-ui/src/input/button/components/IconButton.tsx index dae5a8f1b..759b1b7dd 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/IconButton.tsx +++ b/packages/twenty-ui/src/input/button/components/IconButton.tsx @@ -1,7 +1,7 @@ import { css, useTheme } from '@emotion/react'; import styled from '@emotion/styled'; +import { IconComponent } from '@ui/display'; import React from 'react'; -import { IconComponent } from 'twenty-ui'; export type IconButtonSize = 'medium' | 'small'; export type IconButtonPosition = 'standalone' | 'left' | 'middle' | 'right'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/IconButtonGroup.tsx b/packages/twenty-ui/src/input/button/components/IconButtonGroup.tsx similarity index 96% rename from packages/twenty-front/src/modules/ui/input/button/components/IconButtonGroup.tsx rename to packages/twenty-ui/src/input/button/components/IconButtonGroup.tsx index 32c989c68..9509debfd 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/IconButtonGroup.tsx +++ b/packages/twenty-ui/src/input/button/components/IconButtonGroup.tsx @@ -1,6 +1,6 @@ -import { MouseEvent } from 'react'; import styled from '@emotion/styled'; -import { IconComponent } from 'twenty-ui'; +import { IconComponent } from '@ui/display'; +import { MouseEvent } from 'react'; import { IconButton, IconButtonPosition, IconButtonProps } from './IconButton'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/LightButton.tsx b/packages/twenty-ui/src/input/button/components/LightButton.tsx similarity index 98% rename from packages/twenty-front/src/modules/ui/input/button/components/LightButton.tsx rename to packages/twenty-ui/src/input/button/components/LightButton.tsx index 982c77a5d..9fc383be8 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/LightButton.tsx +++ b/packages/twenty-ui/src/input/button/components/LightButton.tsx @@ -1,7 +1,7 @@ -import { MouseEvent } from 'react'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconComponent } from 'twenty-ui'; +import { IconComponent } from '@ui/display'; +import { MouseEvent } from 'react'; export type LightButtonAccent = 'secondary' | 'tertiary'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/LightIconButton.tsx b/packages/twenty-ui/src/input/button/components/LightIconButton.tsx similarity index 98% rename from packages/twenty-front/src/modules/ui/input/button/components/LightIconButton.tsx rename to packages/twenty-ui/src/input/button/components/LightIconButton.tsx index 868ed0c53..b81ee5b84 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/LightIconButton.tsx +++ b/packages/twenty-ui/src/input/button/components/LightIconButton.tsx @@ -1,7 +1,7 @@ -import { ComponentProps, MouseEvent } from 'react'; import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconComponent } from 'twenty-ui'; +import { IconComponent } from '@ui/display'; +import { ComponentProps, MouseEvent } from 'react'; export type LightIconButtonAccent = 'secondary' | 'tertiary'; export type LightIconButtonSize = 'small' | 'medium'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/LightIconButtonGroup.tsx b/packages/twenty-ui/src/input/button/components/LightIconButtonGroup.tsx similarity index 96% rename from packages/twenty-front/src/modules/ui/input/button/components/LightIconButtonGroup.tsx rename to packages/twenty-ui/src/input/button/components/LightIconButtonGroup.tsx index 7c0459252..6f6d530a4 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/LightIconButtonGroup.tsx +++ b/packages/twenty-ui/src/input/button/components/LightIconButtonGroup.tsx @@ -1,6 +1,6 @@ -import { FunctionComponent, MouseEvent, ReactElement } from 'react'; import styled from '@emotion/styled'; -import { IconComponent } from 'twenty-ui'; +import { IconComponent } from '@ui/display'; +import { FunctionComponent, MouseEvent, ReactElement } from 'react'; import { LightIconButton, LightIconButtonProps } from './LightIconButton'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/MainButton.tsx b/packages/twenty-ui/src/input/button/components/MainButton.tsx similarity index 98% rename from packages/twenty-front/src/modules/ui/input/button/components/MainButton.tsx rename to packages/twenty-ui/src/input/button/components/MainButton.tsx index cb9dbd271..ddfba85f2 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/MainButton.tsx +++ b/packages/twenty-ui/src/input/button/components/MainButton.tsx @@ -1,7 +1,7 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; +import { IconComponent } from '@ui/display'; import React from 'react'; -import { IconComponent } from 'twenty-ui'; export type MainButtonVariant = 'primary' | 'secondary'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/RoundedIconButton.tsx b/packages/twenty-ui/src/input/button/components/RoundedIconButton.tsx similarity index 95% rename from packages/twenty-front/src/modules/ui/input/button/components/RoundedIconButton.tsx rename to packages/twenty-ui/src/input/button/components/RoundedIconButton.tsx index 3d9e89a26..1ede7c239 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/RoundedIconButton.tsx +++ b/packages/twenty-ui/src/input/button/components/RoundedIconButton.tsx @@ -1,6 +1,6 @@ import { useTheme } from '@emotion/react'; import styled from '@emotion/styled'; -import { IconComponent } from 'twenty-ui'; +import { IconComponent } from '@ui/display'; const StyledIconButton = styled.button` align-items: center; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/Button.docs.mdx b/packages/twenty-ui/src/input/button/components/__stories__/Button.docs.mdx similarity index 100% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/Button.docs.mdx rename to packages/twenty-ui/src/input/button/components/__stories__/Button.docs.mdx diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/Button.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/Button.stories.tsx similarity index 99% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/Button.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/Button.stories.tsx index 3165cc5ee..d67f0d399 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/Button.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/Button.stories.tsx @@ -1,11 +1,10 @@ import { Meta, StoryObj } from '@storybook/react'; +import { IconSearch } from '@ui/display'; import { CatalogDecorator, CatalogStory, ComponentDecorator, - IconSearch, -} from 'twenty-ui'; - +} from '@ui/testing'; import { Button, ButtonAccent, diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/ButtonGroup.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/ButtonGroup.stories.tsx similarity index 95% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/ButtonGroup.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/ButtonGroup.stories.tsx index 803bbbb7d..ec4e492c7 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/ButtonGroup.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/ButtonGroup.stories.tsx @@ -1,13 +1,10 @@ import { Meta, StoryObj } from '@storybook/react'; +import { IconCheckbox, IconNotes, IconTimelineEvent } from '@ui/display'; import { CatalogDecorator, CatalogStory, ComponentDecorator, - IconCheckbox, - IconNotes, - IconTimelineEvent, -} from 'twenty-ui'; - +} from '@ui/testing'; import { Button, ButtonAccent, ButtonSize, ButtonVariant } from '../Button'; import { ButtonGroup } from '../ButtonGroup'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/ColorPickerButton.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/ColorPickerButton.stories.tsx similarity index 90% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/ColorPickerButton.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/ColorPickerButton.stories.tsx index e12c5d063..3d2879141 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/ColorPickerButton.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/ColorPickerButton.stories.tsx @@ -1,6 +1,5 @@ import { Meta, StoryObj } from '@storybook/react'; -import { ComponentDecorator } from 'twenty-ui'; - +import { ComponentDecorator } from '@ui/testing'; import { ColorPickerButton } from '../ColorPickerButton'; const meta: Meta = { diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingButton.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/FloatingButton.stories.tsx similarity index 96% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingButton.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/FloatingButton.stories.tsx index 5e9272318..b0ce9fc13 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingButton.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/FloatingButton.stories.tsx @@ -1,11 +1,10 @@ import { Meta, StoryObj } from '@storybook/react'; +import { IconSearch } from '@ui/display'; import { CatalogDecorator, CatalogStory, ComponentDecorator, - IconSearch, -} from 'twenty-ui'; - +} from '@ui/testing'; import { FloatingButton, FloatingButtonSize } from '../FloatingButton'; const meta: Meta = { diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingButtonGroup.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/FloatingButtonGroup.stories.tsx similarity index 93% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingButtonGroup.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/FloatingButtonGroup.stories.tsx index e3b8f0e28..248ed0c5e 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingButtonGroup.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/FloatingButtonGroup.stories.tsx @@ -1,13 +1,10 @@ import { Meta, StoryObj } from '@storybook/react'; +import { IconCheckbox, IconNotes, IconTimelineEvent } from '@ui/display'; import { CatalogDecorator, CatalogStory, ComponentDecorator, - IconCheckbox, - IconNotes, - IconTimelineEvent, -} from 'twenty-ui'; - +} from '@ui/testing'; import { FloatingButton, FloatingButtonSize } from '../FloatingButton'; import { FloatingButtonGroup } from '../FloatingButtonGroup'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingIconButton.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/FloatingIconButton.stories.tsx similarity index 96% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingIconButton.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/FloatingIconButton.stories.tsx index 6a0e973b7..71c4e0c56 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingIconButton.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/FloatingIconButton.stories.tsx @@ -1,11 +1,10 @@ import { Meta, StoryObj } from '@storybook/react'; +import { IconSearch } from '@ui/display'; import { CatalogDecorator, CatalogStory, ComponentDecorator, - IconSearch, -} from 'twenty-ui'; - +} from '@ui/testing'; import { FloatingIconButton, FloatingIconButtonSize, diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingIconButtonGroup.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/FloatingIconButtonGroup.stories.tsx similarity index 92% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingIconButtonGroup.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/FloatingIconButtonGroup.stories.tsx index 3317f6a06..494a644cb 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/FloatingIconButtonGroup.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/FloatingIconButtonGroup.stories.tsx @@ -1,13 +1,10 @@ import { Meta, StoryObj } from '@storybook/react'; +import { IconCheckbox, IconNotes, IconTimelineEvent } from '@ui/display'; import { CatalogDecorator, CatalogStory, ComponentDecorator, - IconCheckbox, - IconNotes, - IconTimelineEvent, -} from 'twenty-ui'; - +} from '@ui/testing'; import { FloatingIconButtonSize } from '../FloatingIconButton'; import { FloatingIconButtonGroup } from '../FloatingIconButtonGroup'; diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/IconButton.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/IconButton.stories.tsx similarity index 98% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/IconButton.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/IconButton.stories.tsx index 706335641..538a98753 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/IconButton.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/IconButton.stories.tsx @@ -1,11 +1,10 @@ import { Meta, StoryObj } from '@storybook/react'; +import { IconSearch } from '@ui/display'; import { CatalogDecorator, CatalogStory, ComponentDecorator, - IconSearch, -} from 'twenty-ui'; - +} from '@ui/testing'; import { IconButton, IconButtonAccent, diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/IconButtonGroup.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/IconButtonGroup.stories.tsx similarity index 94% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/IconButtonGroup.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/IconButtonGroup.stories.tsx index f4bc972e8..a9a431b4d 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/IconButtonGroup.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/IconButtonGroup.stories.tsx @@ -1,13 +1,10 @@ import { Meta, StoryObj } from '@storybook/react'; +import { IconCheckbox, IconNotes, IconTimelineEvent } from '@ui/display'; import { CatalogDecorator, CatalogStory, ComponentDecorator, - IconCheckbox, - IconNotes, - IconTimelineEvent, -} from 'twenty-ui'; - +} from '@ui/testing'; import { IconButtonAccent, IconButtonSize, diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/LightButton.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/LightButton.stories.tsx similarity index 97% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/LightButton.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/LightButton.stories.tsx index ddf9de2a2..d5a3ceacb 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/LightButton.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/LightButton.stories.tsx @@ -1,11 +1,10 @@ import { Meta, StoryObj } from '@storybook/react'; +import { IconSearch } from '@ui/display'; import { CatalogDecorator, CatalogStory, ComponentDecorator, - IconSearch, -} from 'twenty-ui'; - +} from '@ui/testing'; import { LightButton, LightButtonAccent } from '../LightButton'; const meta: Meta = { diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/LightIconButton.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/LightIconButton.stories.tsx similarity index 97% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/LightIconButton.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/LightIconButton.stories.tsx index 58069b57e..a2d40a79d 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/LightIconButton.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/LightIconButton.stories.tsx @@ -1,11 +1,10 @@ import { Meta, StoryObj } from '@storybook/react'; +import { IconSearch } from '@ui/display'; import { CatalogDecorator, CatalogStory, ComponentDecorator, - IconSearch, -} from 'twenty-ui'; - +} from '@ui/testing'; import { LightIconButton, LightIconButtonAccent, diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/MainButton.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/MainButton.stories.tsx similarity index 93% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/MainButton.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/MainButton.stories.tsx index 631d8258f..c1f715bd0 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/MainButton.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/MainButton.stories.tsx @@ -1,7 +1,7 @@ import { Meta, StoryObj } from '@storybook/react'; import { expect, fn, userEvent, within } from '@storybook/test'; -import { ComponentDecorator, IconBrandGoogle } from 'twenty-ui'; - +import { IconBrandGoogle } from '@ui/display'; +import { ComponentDecorator } from '@ui/testing'; import { MainButton } from '../MainButton'; const clickJestFn = fn(); diff --git a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/RoundedIconButton.stories.tsx b/packages/twenty-ui/src/input/button/components/__stories__/RoundedIconButton.stories.tsx similarity index 89% rename from packages/twenty-front/src/modules/ui/input/button/components/__stories__/RoundedIconButton.stories.tsx rename to packages/twenty-ui/src/input/button/components/__stories__/RoundedIconButton.stories.tsx index da2d19b82..e36e3eadd 100644 --- a/packages/twenty-front/src/modules/ui/input/button/components/__stories__/RoundedIconButton.stories.tsx +++ b/packages/twenty-ui/src/input/button/components/__stories__/RoundedIconButton.stories.tsx @@ -1,7 +1,7 @@ import { Meta, StoryObj } from '@storybook/react'; import { expect, fn, userEvent, within } from '@storybook/test'; -import { ComponentDecorator, IconArrowRight } from 'twenty-ui'; - +import { IconArrowRight } from '@ui/display'; +import { ComponentDecorator } from '@ui/testing'; import { RoundedIconButton } from '../RoundedIconButton'; const clickJestFn = fn(); diff --git a/packages/twenty-ui/src/input/index.ts b/packages/twenty-ui/src/input/index.ts index 133f82705..073309416 100644 --- a/packages/twenty-ui/src/input/index.ts +++ b/packages/twenty-ui/src/input/index.ts @@ -1 +1,15 @@ +export * from './button/components/Button'; +export * from './button/components/ButtonGroup'; +export * from './button/components/ColorPickerButton'; +export * from './button/components/FloatingButton'; +export * from './button/components/FloatingButtonGroup'; +export * from './button/components/FloatingIconButton'; +export * from './button/components/FloatingIconButtonGroup'; +export * from './button/components/IconButton'; +export * from './button/components/IconButtonGroup'; +export * from './button/components/LightButton'; +export * from './button/components/LightIconButton'; +export * from './button/components/LightIconButtonGroup'; +export * from './button/components/MainButton'; +export * from './button/components/RoundedIconButton'; export * from './components/Toggle';