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

fix error messages margin (#11508)

Browse Source 
## Context
Fixing error messages margin in various places
Reset password
<img width="453" alt="Screenshot 2025-04-10 at 15 17 00"
src="https://github.com/user-attachments/assets/7a0fb090-4029-415f-8733-0c9e3aa3c3f2"
/>
Api key
<img width="543" alt="Screenshot 2025-04-10 at 15 16 21"
src="https://github.com/user-attachments/assets/d8f8a348-84d3-44d7-8cea-863c3ddb02fc"
/>

Also setting overflow on api key label in api keys table
<img width="580" alt="Screenshot 2025-04-10 at 15 16 15"
src="https://github.com/user-attachments/assets/207df981-c906-4926-a56d-38167628267f"
/>
This commit is contained in:
Weiko
2025-04-10 15:36:59 +02:00
committed by GitHub
parent b8d5f6d4b0
commit 63a165666a
6 changed files with 25 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
packages/twenty-front/src/modules/auth/sign-in-up/hooks/useSignInUpForm.ts
View File

@ -22,10 +22,7 @@ const makeValidationSchema = (signInUpStep: SignInUpStep) =>
signInUpStep === SignInUpStep.Password
? z
.string()
.regex(
PASSWORD_REGEX,
'Password must contain at least 8 characters',
)
.regex(PASSWORD_REGEX, 'Password must be min. 8 characters')
: z.string().optional(),
captchaToken: z.string().default(''),
})

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

@ -4,7 +4,10 @@ import styled from '@emotion/styled';
import { ApiFieldItem } from '@/settings/developers/types/api-key/ApiFieldItem';
import { TableCell } from '@/ui/layout/table/components/TableCell';
import { TableRow } from '@/ui/layout/table/components/TableRow';
import { IconChevronRight } from 'twenty-ui/display';
import {
IconChevronRight,
OverflowingTextWithTooltip,
} from 'twenty-ui/display';
import { MOBILE_VIEWPORT } from 'twenty-ui/theme';
export const StyledApisFieldTableRow = styled(TableRow)`
@ -41,7 +44,9 @@ export const SettingsApiKeysFieldItemTableRow = ({
return (
<StyledApisFieldTableRow to={to}>
<StyledNameTableCell>{fieldItem.name}</StyledNameTableCell>
<StyledNameTableCell>
<OverflowingTextWithTooltip text={fieldItem.name} />
</StyledNameTableCell>
<TableCell
color={
fieldItem.expiration === 'Expired'

12
packages/twenty-front/src/modules/settings/playground/components/PlaygroundSetupForm.tsx
View File

@ -9,16 +9,16 @@ import { zodResolver } from '@hookform/resolvers/zod';
import { useLingui } from '@lingui/react/macro';
import { Controller, useForm } from 'react-hook-form';
import { useRecoilState } from 'recoil';
import { z } from 'zod';
import { REACT_APP_SERVER_BASE_URL } from '~/config';
import { useNavigateSettings } from '~/hooks/useNavigateSettings';
import { Button } from 'twenty-ui/input';
import {
IconApi,
IconBracketsAngle,
IconBrandGraphql,
IconFolderRoot,
} from 'twenty-ui/display';
import { Button } from 'twenty-ui/input';
import { z } from 'zod';
import { REACT_APP_SERVER_BASE_URL } from '~/config';
import { useNavigateSettings } from '~/hooks/useNavigateSettings';
const playgroundSetupFormSchema = z.object({
apiKeyForPlayground: z.string(),
@ -81,9 +81,7 @@ export const PlaygroundSetupForm = () => {
return true;
} catch (error) {
throw new Error(
t`Failed to validate API key. Please check your API key and try again.`,
);
throw new Error(t`Invalid API key`);
}
};

2
packages/twenty-front/src/modules/ui/input/components/InputErrorHelper.tsx
View File

@ -4,6 +4,8 @@ import React from 'react';
const StyledInputErrorHelper = styled.div`
color: ${({ theme }) => theme.color.red};
font-size: ${({ theme }) => theme.font.size.xs};
position: absolute;
margin-top: ${({ theme }) => theme.spacing(0.25)};
`;
export const InputErrorHelper = ({