admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix(): several ui improvements (#10556)

Browse Source 
Close #10531

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
Co-authored-by: Etienne <45695613+etiennejouan@users.noreply.github.com>
Co-authored-by: Raphaël Bosi <71827178+bosiraphael@users.noreply.github.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Crowdin Bot <support+bot@crowdin.com>
Co-authored-by: github-actions <github-actions@twenty.com>
This commit is contained in:
Antoine Moreaux
2025-03-03 17:06:16 +01:00
committed by GitHub
parent a5d60919a7
commit e8b6b1b941
15 changed files with 88 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
packages/twenty-front/src/generated/graphql.tsx
View File

@ -2482,7 +2482,7 @@ export type GetSsoIdentityProvidersQueryVariables = Exact<{ [key: string]: never
export type GetSsoIdentityProvidersQuery = { __typename?: 'Query', getSSOIdentityProviders: Array<{ __typename?: 'FindAvailableSSOIDPOutput', type: IdentityProviderType, id: string, name: string, issuer: string, status: SsoIdentityProviderStatus }> };
export type UserQueryFragmentFragment = { __typename?: 'User', id: any, firstName: string, lastName: string, email: string, canAccessFullAdminPanel: boolean, canImpersonate: boolean, supportUserHash?: string | null, onboardingStatus?: OnboardingStatus | null, userVars: any, analyticsTinybirdJwts?: { __typename?: 'AnalyticsTinybirdJwtMap', getWebhookAnalytics: string, getPageviewsAnalytics: string, getUsersAnalytics: string, getServerlessFunctionDuration: string, getServerlessFunctionSuccessRate: string, getServerlessFunctionErrorCount: string } | null, workspaceMember?: { __typename?: 'WorkspaceMember', id: any, colorScheme: string, avatarUrl?: string | null, locale?: string | null, userEmail: string, timeZone?: string | null, dateFormat?: WorkspaceMemberDateFormatEnum | null, timeFormat?: WorkspaceMemberTimeFormatEnum | null, name: { __typename?: 'FullName', firstName: string, lastName: string } } | null, workspaceMembers?: Array<{ __typename?: 'WorkspaceMember', id: any, colorScheme: string, avatarUrl?: string | null, locale?: string | null, userEmail: string, timeZone?: string | null, dateFormat?: WorkspaceMemberDateFormatEnum | null, timeFormat?: WorkspaceMemberTimeFormatEnum | null, name: { __typename?: 'FullName', firstName: string, lastName: string } }> | null, currentUserWorkspace?: { __typename?: 'UserWorkspace', settingsPermissions?: Array<SettingsPermissions> | null, objectRecordsPermissions?: Array<PermissionsOnAllObjectRecords> | null } | null, currentWorkspace?: { __typename?: 'Workspace', id: any, displayName?: string | null, logo?: string | null, inviteHash?: string | null, allowImpersonation: boolean, activationStatus: WorkspaceActivationStatus, isPublicInviteLinkEnabled: boolean, isGoogleAuthEnabled: boolean, isMicrosoftAuthEnabled: boolean, isPasswordAuthEnabled: boolean, subdomain: string, hasValidEnterpriseKey: boolean, customDomain?: string | null, metadataVersion: number, workspaceMembersCount?: number | null, workspaceUrls: { __typename?: 'workspaceUrls', subdomainUrl: string, customUrl?: string | null }, featureFlags?: Array<{ __typename?: 'FeatureFlag', id: any, key: FeatureFlagKey, value: boolean, workspaceId: string }> | null, currentBillingSubscription?: { __typename?: 'BillingSubscription', id: any, status: SubscriptionStatus, interval?: SubscriptionInterval | null } | null, billingSubscriptions: Array<{ __typename?: 'BillingSubscription', id: any, status: SubscriptionStatus }>, defaultRole?: { __typename?: 'Role', id: string, label: string, description?: string | null, canUpdateAllSettings: boolean, isEditable: boolean, canReadAllObjectRecords: boolean, canUpdateAllObjectRecords: boolean, canSoftDeleteAllObjectRecords: boolean, canDestroyAllObjectRecords: boolean } | null } | null, workspaces: Array<{ __typename?: 'UserWorkspace', workspace?: { __typename?: 'Workspace', id: any, logo?: string | null, displayName?: string | null, subdomain: string, customDomain?: string | null, workspaceUrls: { __typename?: 'workspaceUrls', subdomainUrl: string, customUrl?: string | null } } | null }> };
export type UserQueryFragmentFragment = { __typename?: 'User', id: any, firstName: string, lastName: string, email: string, canAccessFullAdminPanel: boolean, canImpersonate: boolean, supportUserHash?: string | null, onboardingStatus?: OnboardingStatus | null, userVars: any, analyticsTinybirdJwts?: { __typename?: 'AnalyticsTinybirdJwtMap', getWebhookAnalytics: string, getPageviewsAnalytics: string, getUsersAnalytics: string, getServerlessFunctionDuration: string, getServerlessFunctionSuccessRate: string, getServerlessFunctionErrorCount: string } | null, workspaceMember?: { __typename?: 'WorkspaceMember', id: any, colorScheme: string, avatarUrl?: string | null, locale?: string | null, userEmail: string, timeZone?: string | null, dateFormat?: WorkspaceMemberDateFormatEnum | null, timeFormat?: WorkspaceMemberTimeFormatEnum | null, name: { __typename?: 'FullName', firstName: string, lastName: string } } | null, workspaceMembers?: Array<{ __typename?: 'WorkspaceMember', id: any, colorScheme: string, avatarUrl?: string | null, locale?: string | null, userEmail: string, timeZone?: string | null, dateFormat?: WorkspaceMemberDateFormatEnum | null, timeFormat?: WorkspaceMemberTimeFormatEnum | null, name: { __typename?: 'FullName', firstName: string, lastName: string } }> | null, currentUserWorkspace?: { __typename?: 'UserWorkspace', settingsPermissions?: Array<SettingsPermissions> | null, objectRecordsPermissions?: Array<PermissionsOnAllObjectRecords> | null } | null, currentWorkspace?: { __typename?: 'Workspace', id: any, displayName?: string | null, logo?: string | null, inviteHash?: string | null, allowImpersonation: boolean, activationStatus: WorkspaceActivationStatus, isPublicInviteLinkEnabled: boolean, isGoogleAuthEnabled: boolean, isMicrosoftAuthEnabled: boolean, isPasswordAuthEnabled: boolean, subdomain: string, hasValidEnterpriseKey: boolean, customDomain?: string | null, isCustomDomainEnabled: boolean, metadataVersion: number, workspaceMembersCount?: number | null, workspaceUrls: { __typename?: 'workspaceUrls', subdomainUrl: string, customUrl?: string | null }, featureFlags?: Array<{ __typename?: 'FeatureFlag', id: any, key: FeatureFlagKey, value: boolean, workspaceId: string }> | null, currentBillingSubscription?: { __typename?: 'BillingSubscription', id: any, status: SubscriptionStatus, interval?: SubscriptionInterval | null } | null, billingSubscriptions: Array<{ __typename?: 'BillingSubscription', id: any, status: SubscriptionStatus }>, defaultRole?: { __typename?: 'Role', id: string, label: string, description?: string | null, canUpdateAllSettings: boolean, isEditable: boolean, canReadAllObjectRecords: boolean, canUpdateAllObjectRecords: boolean, canSoftDeleteAllObjectRecords: boolean, canDestroyAllObjectRecords: boolean } | null } | null, workspaces: Array<{ __typename?: 'UserWorkspace', workspace?: { __typename?: 'Workspace', id: any, logo?: string | null, displayName?: string | null, subdomain: string, customDomain?: string | null, workspaceUrls: { __typename?: 'workspaceUrls', subdomainUrl: string, customUrl?: string | null } } | null }> };
export type DeleteUserAccountMutationVariables = Exact<{ [key: string]: never; }>;
@ -2499,7 +2499,7 @@ export type UploadProfilePictureMutation = { __typename?: 'Mutation', uploadProf
export type GetCurrentUserQueryVariables = Exact<{ [key: string]: never; }>;
export type GetCurrentUserQuery = { __typename?: 'Query', currentUser: { __typename?: 'User', id: any, firstName: string, lastName: string, email: string, canAccessFullAdminPanel: boolean, canImpersonate: boolean, supportUserHash?: string | null, onboardingStatus?: OnboardingStatus | null, userVars: any, analyticsTinybirdJwts?: { __typename?: 'AnalyticsTinybirdJwtMap', getWebhookAnalytics: string, getPageviewsAnalytics: string, getUsersAnalytics: string, getServerlessFunctionDuration: string, getServerlessFunctionSuccessRate: string, getServerlessFunctionErrorCount: string } | null, workspaceMember?: { __typename?: 'WorkspaceMember', id: any, colorScheme: string, avatarUrl?: string | null, locale?: string | null, userEmail: string, timeZone?: string | null, dateFormat?: WorkspaceMemberDateFormatEnum | null, timeFormat?: WorkspaceMemberTimeFormatEnum | null, name: { __typename?: 'FullName', firstName: string, lastName: string } } | null, workspaceMembers?: Array<{ __typename?: 'WorkspaceMember', id: any, colorScheme: string, avatarUrl?: string | null, locale?: string | null, userEmail: string, timeZone?: string | null, dateFormat?: WorkspaceMemberDateFormatEnum | null, timeFormat?: WorkspaceMemberTimeFormatEnum | null, name: { __typename?: 'FullName', firstName: string, lastName: string } }> | null, currentUserWorkspace?: { __typename?: 'UserWorkspace', settingsPermissions?: Array<SettingsPermissions> | null, objectRecordsPermissions?: Array<PermissionsOnAllObjectRecords> | null } | null, currentWorkspace?: { __typename?: 'Workspace', id: any, displayName?: string | null, logo?: string | null, inviteHash?: string | null, allowImpersonation: boolean, activationStatus: WorkspaceActivationStatus, isPublicInviteLinkEnabled: boolean, isGoogleAuthEnabled: boolean, isMicrosoftAuthEnabled: boolean, isPasswordAuthEnabled: boolean, subdomain: string, hasValidEnterpriseKey: boolean, customDomain?: string | null, metadataVersion: number, workspaceMembersCount?: number | null, workspaceUrls: { __typename?: 'workspaceUrls', subdomainUrl: string, customUrl?: string | null }, featureFlags?: Array<{ __typename?: 'FeatureFlag', id: any, key: FeatureFlagKey, value: boolean, workspaceId: string }> | null, currentBillingSubscription?: { __typename?: 'BillingSubscription', id: any, status: SubscriptionStatus, interval?: SubscriptionInterval | null } | null, billingSubscriptions: Array<{ __typename?: 'BillingSubscription', id: any, status: SubscriptionStatus }>, defaultRole?: { __typename?: 'Role', id: string, label: string, description?: string | null, canUpdateAllSettings: boolean, isEditable: boolean, canReadAllObjectRecords: boolean, canUpdateAllObjectRecords: boolean, canSoftDeleteAllObjectRecords: boolean, canDestroyAllObjectRecords: boolean } | null } | null, workspaces: Array<{ __typename?: 'UserWorkspace', workspace?: { __typename?: 'Workspace', id: any, logo?: string | null, displayName?: string | null, subdomain: string, customDomain?: string | null, workspaceUrls: { __typename?: 'workspaceUrls', subdomainUrl: string, customUrl?: string | null } } | null }> } };
export type GetCurrentUserQuery = { __typename?: 'Query', currentUser: { __typename?: 'User', id: any, firstName: string, lastName: string, email: string, canAccessFullAdminPanel: boolean, canImpersonate: boolean, supportUserHash?: string | null, onboardingStatus?: OnboardingStatus | null, userVars: any, analyticsTinybirdJwts?: { __typename?: 'AnalyticsTinybirdJwtMap', getWebhookAnalytics: string, getPageviewsAnalytics: string, getUsersAnalytics: string, getServerlessFunctionDuration: string, getServerlessFunctionSuccessRate: string, getServerlessFunctionErrorCount: string } | null, workspaceMember?: { __typename?: 'WorkspaceMember', id: any, colorScheme: string, avatarUrl?: string | null, locale?: string | null, userEmail: string, timeZone?: string | null, dateFormat?: WorkspaceMemberDateFormatEnum | null, timeFormat?: WorkspaceMemberTimeFormatEnum | null, name: { __typename?: 'FullName', firstName: string, lastName: string } } | null, workspaceMembers?: Array<{ __typename?: 'WorkspaceMember', id: any, colorScheme: string, avatarUrl?: string | null, locale?: string | null, userEmail: string, timeZone?: string | null, dateFormat?: WorkspaceMemberDateFormatEnum | null, timeFormat?: WorkspaceMemberTimeFormatEnum | null, name: { __typename?: 'FullName', firstName: string, lastName: string } }> | null, currentUserWorkspace?: { __typename?: 'UserWorkspace', settingsPermissions?: Array<SettingsPermissions> | null, objectRecordsPermissions?: Array<PermissionsOnAllObjectRecords> | null } | null, currentWorkspace?: { __typename?: 'Workspace', id: any, displayName?: string | null, logo?: string | null, inviteHash?: string | null, allowImpersonation: boolean, activationStatus: WorkspaceActivationStatus, isPublicInviteLinkEnabled: boolean, isGoogleAuthEnabled: boolean, isMicrosoftAuthEnabled: boolean, isPasswordAuthEnabled: boolean, subdomain: string, hasValidEnterpriseKey: boolean, customDomain?: string | null, isCustomDomainEnabled: boolean, metadataVersion: number, workspaceMembersCount?: number | null, workspaceUrls: { __typename?: 'workspaceUrls', subdomainUrl: string, customUrl?: string | null }, featureFlags?: Array<{ __typename?: 'FeatureFlag', id: any, key: FeatureFlagKey, value: boolean, workspaceId: string }> | null, currentBillingSubscription?: { __typename?: 'BillingSubscription', id: any, status: SubscriptionStatus, interval?: SubscriptionInterval | null } | null, billingSubscriptions: Array<{ __typename?: 'BillingSubscription', id: any, status: SubscriptionStatus }>, defaultRole?: { __typename?: 'Role', id: string, label: string, description?: string | null, canUpdateAllSettings: boolean, isEditable: boolean, canReadAllObjectRecords: boolean, canUpdateAllObjectRecords: boolean, canSoftDeleteAllObjectRecords: boolean, canDestroyAllObjectRecords: boolean } | null } | null, workspaces: Array<{ __typename?: 'UserWorkspace', workspace?: { __typename?: 'Workspace', id: any, logo?: string | null, displayName?: string | null, subdomain: string, customDomain?: string | null, workspaceUrls: { __typename?: 'workspaceUrls', subdomainUrl: string, customUrl?: string | null } } | null }> } };
export type ActivateWorkflowVersionMutationVariables = Exact<{
workflowVersionId: Scalars['String'];
@ -2793,6 +2793,7 @@ export const UserQueryFragmentFragmentDoc = gql`
subdomain
hasValidEnterpriseKey
customDomain
isCustomDomainEnabled
workspaceUrls {
subdomainUrl
customUrl

2
packages/twenty-front/src/index.css
View File

@ -14,7 +14,7 @@ button {
}
form {
width: 100%;
display: contents;
}
/* https://stackoverflow.com/questions/44543157/how-to-hide-the-google-invisible-recaptcha-badge */

1
packages/twenty-front/src/modules/auth/states/currentWorkspaceState.ts
View File

@ -19,6 +19,7 @@ export type CurrentWorkspace = Pick<
| 'isMicrosoftAuthEnabled'
| 'isPasswordAuthEnabled'
| 'hasValidEnterpriseKey'
| 'isCustomDomainEnabled'
| 'subdomain'
| 'customDomain'
| 'workspaceUrls'

2
packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useColumnDefinitionsFromFieldMetadata.test.ts
View File

@ -28,6 +28,8 @@ const Wrapper = getJestMetadataAndApolloMocksAndActionMenuWrapper({
isGoogleAuthEnabled: true,
isMicrosoftAuthEnabled: false,
isPasswordAuthEnabled: true,
customDomain: 'my-custom-domain.com',
isCustomDomainEnabled: true,
workspaceUrls: {
subdomainUrl: 'https://twenty.twenty.com',
customUrl: 'https://my-custom-domain.com',

9
packages/twenty-front/src/modules/settings/components/SettingsCard.tsx
View File

@ -24,10 +24,6 @@ const StyledCard = styled(Card)<{
cursor: ${({ disabled, onClick }) =>
disabled ? 'not-allowed' : onClick ? 'pointer' : 'default'};
width: 100%;
& :hover {
background-color: ${({ theme }) => theme.background.quaternary};
cursor: pointer;
}
`;
const StyledCardContent = styled(CardContent)<object>`
@ -35,6 +31,11 @@ const StyledCardContent = styled(CardContent)<object>`
flex-direction: column;
gap: ${({ theme }) => theme.spacing(2)};
padding: ${({ theme }) => theme.spacing(2, 2)};
&:hover {
background-color: ${({ theme }) => theme.background.quaternary};
cursor: pointer;
}
`;
const StyledHeader = styled.div`

1
packages/twenty-front/src/modules/settings/components/SettingsPageContainer.tsx
View File

@ -23,6 +23,7 @@ const StyledSettingsPageContainer = styled.div<{
return OBJECT_SETTINGS_WIDTH + 'px';
}};
padding-bottom: ${({ theme }) => theme.spacing(20)};
height: 100%;
`;
export const SettingsPageContainer = ({

16
packages/twenty-front/src/modules/ui/input/components/TextInputV2.tsx
View File

@ -11,13 +11,7 @@ import {
useRef,
useState,
} from 'react';
import {
AutogrowWrapper,
IconComponent,
IconEye,
IconEyeOff,
Loader,
} from 'twenty-ui';
import { AutogrowWrapper, IconComponent, IconEye, IconEyeOff } from 'twenty-ui';
import { useCombinedRefs } from '~/hooks/useCombinedRefs';
import { turnIntoEmptyStringIfWhitespacesOnly } from '~/utils/string/turnIntoEmptyStringIfWhitespacesOnly';
@ -202,7 +196,6 @@ export type TextInputV2ComponentProps = Omit<
dataTestId?: string;
sizeVariant?: TextInputV2Size;
inheritFontStyles?: boolean;
loading?: boolean;
rightAdornment?: string;
leftAdornment?: string;
};
@ -240,7 +233,6 @@ const TextInputV2Component = forwardRef<
inheritFontStyles = false,
dataTestId,
autoGrow = false,
loading = false,
rightAdornment,
leftAdornment,
},
@ -349,12 +341,6 @@ const TextInputV2Component = forwardRef<
<RightIcon size={theme.icon.size.md} />
</StyledTrailingIcon>
)}
{!error && type !== INPUT_TYPE_PASSWORD && !!loading && (
<StyledTrailingIcon>
<Loader color={'gray'} />
</StyledTrailingIcon>
)}
</StyledTrailingIconContainer>
</StyledInputContainer>
{!noErrorHelper && error && (

1
packages/twenty-front/src/modules/users/graphql/fragments/userQueryFragment.ts
View File

@ -45,6 +45,7 @@ export const USER_QUERY_FRAGMENT = gql`
subdomain
hasValidEnterpriseKey
customDomain
isCustomDomainEnabled
workspaceUrls {
subdomainUrl
customUrl

5
packages/twenty-front/src/pages/settings/SettingsWorkspace.tsx
View File

@ -56,8 +56,11 @@ export const SettingsWorkspace = () => {
title={t`Customize Domain`}
Icon={<IconWorld />}
Status={
currentWorkspace?.customDomain ? (
currentWorkspace?.customDomain &&
currentWorkspace?.isCustomDomainEnabled ? (
<Status text={'Active'} color={'turquoise'} />
) : currentWorkspace?.customDomain ? (
<Status text={'Inactive'} color={'orange'} />
) : undefined
}
/>

24
packages/twenty-front/src/pages/settings/workspace/SettingsCustomDomain.tsx
View File

@ -3,16 +3,21 @@ import { TextInputV2 } from '@/ui/input/components/TextInputV2';
import styled from '@emotion/styled';
import { useLingui } from '@lingui/react/macro';
import { Controller, useFormContext } from 'react-hook-form';
import { H2Title, Section } from 'twenty-ui';
import { Button, H2Title, IconReload, Section } from 'twenty-ui';
import { SettingsCustomDomainRecords } from '~/pages/settings/workspace/SettingsCustomDomainRecords';
import { SettingsCustomDomainRecordsStatus } from '~/pages/settings/workspace/SettingsCustomDomainRecordsStatus';
import { customDomainRecordsState } from '~/pages/settings/workspace/states/customDomainRecordsState';
import { useRecoilValue } from 'recoil';
import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
import { useCheckCustomDomainValidRecords } from '~/pages/settings/workspace/hooks/useCheckCustomDomainValidRecords';
const StyledDomainFormWrapper = styled.div`
align-items: center;
display: flex;
gap: ${({ theme }) => theme.spacing(2)};
`;
const StyledButton = styled(Button)`
align-self: flex-start;
`;
const StyledRecordsWrapper = styled.div`
@ -28,6 +33,12 @@ export const SettingsCustomDomain = () => {
customDomainRecordsState,
);
const { checkCustomDomainRecords } = useCheckCustomDomainValidRecords();
if (!customDomainRecords && !loading) {
checkCustomDomainRecords();
}
const currentWorkspace = useRecoilValue(currentWorkspaceState);
const { t } = useLingui();
@ -53,11 +64,18 @@ export const SettingsCustomDomain = () => {
onChange={onChange}
placeholder="crm.yourdomain.com"
error={error?.message}
loading={!!loading}
fullWidth
/>
)}
/>
<StyledButton
loading={loading}
Icon={IconReload}
title={t`Reload`}
variant="primary"
onClick={checkCustomDomainRecords}
type="button"
/>
</StyledDomainFormWrapper>
{currentWorkspace?.customDomain && (
<StyledRecordsWrapper>

48
packages/twenty-front/src/pages/settings/workspace/SettingsCustomDomainEffect.tsx
View File

@ -1,48 +0,0 @@
import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
import { useEffect, useCallback } from 'react';
import { useSetRecoilState, useRecoilValue } from 'recoil';
import { isDefined } from 'twenty-shared';
import { useCheckCustomDomainValidRecordsMutation } from '~/generated/graphql';
import { customDomainRecordsState } from '~/pages/settings/workspace/states/customDomainRecordsState';
export const SettingsCustomDomainEffect = () => {
const [checkCustomDomainValidRecords] =
useCheckCustomDomainValidRecordsMutation();
const setCustomDomainRecords = useSetRecoilState(customDomainRecordsState);
const currentWorkspace = useRecoilValue(currentWorkspaceState);
const checkCustomDomainValidRecordsPolling = useCallback(async () => {
setCustomDomainRecords((currentState) => ({
...currentState,
loading: true,
}));
checkCustomDomainValidRecords({
onCompleted: (data) => {
if (isDefined(data.checkCustomDomainValidRecords)) {
setCustomDomainRecords({
loading: false,
customDomainRecords: data.checkCustomDomainValidRecords,
});
}
},
});
}, [checkCustomDomainValidRecords, setCustomDomainRecords]);
useEffect(() => {
let pollIntervalFn: null | ReturnType<typeof setInterval> = null;
if (isDefined(currentWorkspace?.customDomain)) {
checkCustomDomainValidRecordsPolling();
pollIntervalFn = setInterval(checkCustomDomainValidRecordsPolling, 6000);
}
return () => {
if (isDefined(pollIntervalFn)) {
clearInterval(pollIntervalFn);
}
};
}, [checkCustomDomainValidRecordsPolling, currentWorkspace?.customDomain]);
return <></>;
};

16
packages/twenty-front/src/pages/settings/workspace/SettingsCustomDomainRecords.tsx
View File

@ -18,17 +18,21 @@ const StyledTable = styled(Table)`
const StyledTableCell = styled(TableCell)`
overflow: hidden;
padding: 0 ${({ theme }) => theme.spacing(3)} 0 0;
&:first-child {
padding-left: 0;
}
&:last-child {
padding-right: 0;
}
`;
const StyledButton = styled(Button)`
-moz-user-select: text;
-ms-user-select: text;
-webkit-user-select: text;
background-color: ${({ theme }) => theme.background.transparent.lighter};
border: 1px solid ${({ theme }) => theme.border.color.medium};
border-radius: ${({ theme }) => theme.border.radius.sm};
color: ${({ theme }) => theme.font.color.tertiary};
font-family: ${({ theme }) => theme.font.family};
font-weight: ${({ theme }) => theme.font.weight.regular};
height: ${({ theme }) => theme.spacing(6)};
overflow: hidden;

8
packages/twenty-front/src/pages/settings/workspace/SettingsDomain.tsx
View File

@ -24,7 +24,6 @@ import { zodResolver } from '@hookform/resolvers/zod';
import { SubMenuTopBarContainer } from '@/ui/layout/page/components/SubMenuTopBarContainer';
import { SettingsPath } from '@/types/SettingsPath';
import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
import { SettingsCustomDomainEffect } from '~/pages/settings/workspace/SettingsCustomDomainEffect';
import { isDefined } from 'twenty-shared';
export const SettingsDomain = () => {
@ -229,12 +228,7 @@ export const SettingsDomain = () => {
>
<SettingsPageContainer>
<SettingsSubdomain />
{isCustomDomainEnabled && (
<>
<SettingsCustomDomainEffect />
<SettingsCustomDomain />
</>
)}
{isCustomDomainEnabled && <SettingsCustomDomain />}
</SettingsPageContainer>
</SubMenuTopBarContainer>
</FormProvider>

19
packages/twenty-front/src/pages/settings/workspace/SettingsSubdomain.tsx
View File

@ -14,15 +14,6 @@ const StyledDomainFormWrapper = styled.div`
display: flex;
`;
const StyledDomain = styled.h2`
align-self: flex-start;
color: ${({ theme }) => theme.font.color.secondary};
font-size: ${({ theme }) => theme.font.size.md};
font-weight: ${({ theme }) => theme.font.weight.medium};
margin: ${({ theme }) => theme.spacing(2)};
white-space: nowrap;
`;
export const SettingsSubdomain = () => {
const domainConfiguration = useRecoilValue(domainConfigurationState);
const { t } = useLingui();
@ -51,13 +42,13 @@ export const SettingsSubdomain = () => {
onChange={onChange}
error={error?.message}
disabled={!!currentWorkspace?.customDomain}
rightAdornment={
isDefined(domainConfiguration.frontDomain)
? `.${domainConfiguration.frontDomain}`
: undefined
}
fullWidth
/>
{isDefined(domainConfiguration.frontDomain) && (
<StyledDomain>
{`.${domainConfiguration.frontDomain}`}
</StyledDomain>
)}
</>
)}
/>

32
packages/twenty-front/src/pages/settings/workspace/hooks/useCheckCustomDomainValidRecords.ts Normal file
View File

@ -0,0 +1,32 @@
import { customDomainRecordsState } from '~/pages/settings/workspace/states/customDomainRecordsState';
import { useCheckCustomDomainValidRecordsMutation } from '~/generated/graphql';
import { isDefined } from 'twenty-shared';
import { useSetRecoilState } from 'recoil';
export const useCheckCustomDomainValidRecords = () => {
const [checkCustomDomainValidRecords] =
useCheckCustomDomainValidRecordsMutation();
const setCustomDomainRecords = useSetRecoilState(customDomainRecordsState);
const checkCustomDomainRecords = () => {
setCustomDomainRecords((currentState) => ({
...currentState,
loading: true,
}));
checkCustomDomainValidRecords({
onCompleted: (data) => {
if (isDefined(data.checkCustomDomainValidRecords)) {
setCustomDomainRecords({
loading: false,
customDomainRecords: data.checkCustomDomainValidRecords,
});
}
},
});
};
return {
checkCustomDomainRecords,
};
};