Move HorizontalSeparator to twenty-ui

packages/twenty-front/src/modules/auth/sign-in-up/components/SignInUpForm.tsx

@@ -1,5 +1,14 @@
 import { FooterNote } from '@/auth/sign-in-up/components/FooterNote';
-import { HorizontalSeparator } from '@/auth/sign-in-up/components/HorizontalSeparator';
+import {
+  HorizontalSeparator,
+  ActionLink,
+  IconGoogle,
+  IconKey,
+  IconMicrosoft,
+  Loader,
+  MainButton,
+  StyledText,
+} from 'twenty-ui';
 import { useHandleResetPassword } from '@/auth/sign-in-up/hooks/useHandleResetPassword';
 import { SignInUpMode, useSignInUp } from '@/auth/sign-in-up/hooks/useSignInUp';
 import {
@@ -20,15 +29,6 @@ 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,
-  Loader,
-  MainButton,
-  StyledText,
-} from 'twenty-ui';
 import { isDefined } from '~/utils/isDefined';
 
 const StyledContentContainer = styled.div`

packages/twenty-front/src/modules/settings/security/components/SettingsSSOSAMLForm.tsx

@@ -1,15 +1,7 @@
 /* @license Enterprise */
 
-import { HorizontalSeparator } from '@/auth/sign-in-up/components/HorizontalSeparator';
-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 { TextInput } from '@/ui/input/components/TextInput';
-import { useTheme } from '@emotion/react';
-import styled from '@emotion/styled';
-import { ChangeEvent, useRef } from 'react';
-import { useFormContext } from 'react-hook-form';
 import {
+  HorizontalSeparator,
   Button,
   H2Title,
   IconCheck,
@@ -18,6 +10,14 @@ import {
   IconUpload,
   Section,
 } from 'twenty-ui';
+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 { TextInput } from '@/ui/input/components/TextInput';
+import { useTheme } from '@emotion/react';
+import styled from '@emotion/styled';
+import { ChangeEvent, useRef } from 'react';
+import { useFormContext } from 'react-hook-form';
 import { REACT_APP_SERVER_BASE_URL } from '~/config';
 import { isDefined } from '~/utils/isDefined';
 

packages/twenty-front/src/modules/workflow/components/WorkflowEditActionFormServerlessFunction.tsx

@@ -7,12 +7,11 @@ import { WorkflowEditGenericFormBase } from '@/workflow/components/WorkflowEditG
 import VariableTagInput from '@/workflow/search-variables/components/VariableTagInput';
 import { WorkflowCodeStep } from '@/workflow/types/Workflow';
 import { useTheme } from '@emotion/react';
-import { IconCode, isDefined } from 'twenty-ui';
+import { IconCode, isDefined, HorizontalSeparator } from 'twenty-ui';
 import { useDebouncedCallback } from 'use-debounce';
 import { getDefaultFunctionInputFromInputSchema } from '@/workflow/utils/getDefaultFunctionInputFromInputSchema';
 import { FunctionInput } from '@/workflow/types/FunctionInput';
 import { mergeDefaultFunctionInputAndFunctionInput } from '@/workflow/utils/mergeDefaultFunctionInputAndFunctionInput';
-import { HorizontalSeparator } from 'packages/twenty-front/src/modules/auth/sign-in-up/components/HorizontalSeparator';
 
 const StyledContainer = styled.div`
   display: inline-flex;

packages/twenty-front/src/pages/auth/SSOWorkspaceSelection.tsx

@@ -1,14 +1,13 @@
 /* @license Enterprise */
 
 import { FooterNote } from '@/auth/sign-in-up/components/FooterNote';
-import { HorizontalSeparator } from '@/auth/sign-in-up/components/HorizontalSeparator';
+import { HorizontalSeparator, MainButton } from 'twenty-ui';
 import { useSSO } from '@/auth/sign-in-up/hooks/useSSO';
 import { availableSSOIdentityProvidersState } from '@/auth/states/availableWorkspacesForSSO';
 import { guessSSOIdentityProviderIconByUrl } from '@/settings/security/utils/guessSSOIdentityProviderIconByUrl';
 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)};

packages/twenty-ui/src/display/index.ts

@@ -50,6 +50,7 @@ export * from './info/components/Info';
 export * from './status/components/Status';
 export * from './tag/components/Tag';
 export * from './text/components/SeparatorLineText';
+export * from './text/components/HorizontalSeparator';
 export * from './tooltip/AppTooltip';
 export * from './tooltip/OverflowingTextWithTooltip';
 export * from './typography/components/H1Title';

packages/twenty-ui/src/display/text/components/__stories__/HorizontalSeparator.stories.tsx

@@ -0,0 +1,15 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { ComponentDecorator } from '@ui/testing';
+
+import { HorizontalSeparator } from '../HorizontalSeparator';
+
+const meta: Meta<typeof HorizontalSeparator> = {
+  title: 'UI/Display/Text/HorizontalSeparator',
+  component: HorizontalSeparator,
+  decorators: [ComponentDecorator],
+};
+
+export default meta;
+type Story = StoryObj<typeof HorizontalSeparator>;
+
+export const Default: Story = {};