From 97f2b7aaa5968e9200b939a90e1f1235a684d98d Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 12:09:03 +0530 Subject: [PATCH 01/27] fix: empty string draftvalue doesn't resetting to undefined --- .../meta-types/input/components/TextFieldInput.tsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx index 087dc37f48de..e7c94120eb12 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx @@ -50,7 +50,12 @@ export const TextFieldInput = ({ }; const handleChange = (newText: string) => { - setDraftValue(newText); + // draft value when string getting "" isn't resettings to undefined -> need to have a look on how this can be generalised and when to put. + if (newText.trim() === '') { + setDraftValue(undefined); + } else { + setDraftValue(newText); + } }; return ( From 77d1ead354ddaf5a274fac55596bc70b9a901cbf Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 13:24:38 +0530 Subject: [PATCH 02/27] fix: Api Keys Input Name Field --- .../developers/api-keys/SettingsDevelopersApiKeyDetail.tsx | 5 ++++- .../developers/api-keys/SettingsDevelopersApiKeysNew.tsx | 3 ++- 2 files changed, 6 insertions(+), 2 deletions(-) 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 21919f09a4f5..0b4059a850ee 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 @@ -173,7 +173,10 @@ export const SettingsDevelopersApiKeyDetail = () => { apiKeyName={apiKeyName} apiKeyId={apiKeyData?.id} disabled={loading} - onNameUpdate={setApiKeyName} + onNameUpdate={(value: string) => { + const apiKeyNameValue = value.trim().length ? value : ''; + setApiKeyName(apiKeyNameValue); + }} />
diff --git a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx index 7a2207125022..fb78f2f67ca7 100644 --- a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx +++ b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx @@ -95,9 +95,10 @@ export const SettingsDevelopersApiKeysNew = () => { } }} onChange={(value) => { + const name = value.trim().length ? value : ''; setFormValues((prevState) => ({ ...prevState, - name: value, + name, })); }} fullWidth From fabb5439178dacbf2126f0d5167d1ffda38a8e1f Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 14:02:03 +0530 Subject: [PATCH 03/27] fix: input fields to not have whitespaces only with new string util --- .../src/modules/ui/input/components/TextInputV2.tsx | 3 ++- .../developers/api-keys/SettingsDevelopersApiKeyDetail.tsx | 4 ++-- .../developers/api-keys/SettingsDevelopersApiKeysNew.tsx | 4 ++-- .../src/utils/string/convertToEmptyStringForWhitespaces.ts | 3 +++ 4 files changed, 9 insertions(+), 5 deletions(-) create mode 100644 packages/twenty-front/src/utils/string/convertToEmptyStringForWhitespaces.ts diff --git a/packages/twenty-front/src/modules/ui/input/components/TextInputV2.tsx b/packages/twenty-front/src/modules/ui/input/components/TextInputV2.tsx index ca88e8ad4cba..563c8f1b7c25 100644 --- a/packages/twenty-front/src/modules/ui/input/components/TextInputV2.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/TextInputV2.tsx @@ -11,6 +11,7 @@ import { } from 'react'; import { IconComponent, IconEye, IconEyeOff } from 'twenty-ui'; import { useCombinedRefs } from '~/hooks/useCombinedRefs'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; const StyledContainer = styled.div< Pick @@ -185,7 +186,7 @@ const TextInputV2Component = ( onBlur={onBlur} type={passwordVisible ? 'text' : type} onChange={(event: ChangeEvent) => { - onChange?.(event.target.value); + onChange?.(convertToEmptyStringForWhitespaces(event.target.value)); }} onKeyDown={onKeyDown} {...{ 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 0b4059a850ee..2ef2dae5b79e 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 @@ -24,6 +24,7 @@ import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer' import { Section } from '@/ui/layout/section/components/Section'; import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb'; import { useGenerateApiKeyTokenMutation } from '~/generated/graphql'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; const StyledInfo = styled.span` color: ${({ theme }) => theme.font.color.light}; @@ -174,8 +175,7 @@ export const SettingsDevelopersApiKeyDetail = () => { apiKeyId={apiKeyData?.id} disabled={loading} onNameUpdate={(value: string) => { - const apiKeyNameValue = value.trim().length ? value : ''; - setApiKeyName(apiKeyNameValue); + setApiKeyName(convertToEmptyStringForWhitespaces(value)); }} />
diff --git a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx index fb78f2f67ca7..52c361401215 100644 --- a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx +++ b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx @@ -19,6 +19,7 @@ import { useSetRecoilState } from 'recoil'; import { Key } from 'ts-key-enum'; import { useGenerateApiKeyTokenMutation } from '~/generated/graphql'; import { isDefined } from '~/utils/isDefined'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; export const SettingsDevelopersApiKeysNew = () => { const [generateOneApiKeyToken] = useGenerateApiKeyTokenMutation(); @@ -95,10 +96,9 @@ export const SettingsDevelopersApiKeysNew = () => { } }} onChange={(value) => { - const name = value.trim().length ? value : ''; setFormValues((prevState) => ({ ...prevState, - name, + name: convertToEmptyStringForWhitespaces(value), })); }} fullWidth diff --git a/packages/twenty-front/src/utils/string/convertToEmptyStringForWhitespaces.ts b/packages/twenty-front/src/utils/string/convertToEmptyStringForWhitespaces.ts new file mode 100644 index 000000000000..c12a1108c087 --- /dev/null +++ b/packages/twenty-front/src/utils/string/convertToEmptyStringForWhitespaces.ts @@ -0,0 +1,3 @@ +export const convertToEmptyStringForWhitespaces = (value: string): string => { + return value.trim().length ? value : ''; +}; From 37cefe1ea25e4503eac3ea0ab9b8e747080ec8dd Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 14:44:36 +0530 Subject: [PATCH 04/27] fix: functions text input field and missing key in settings objects --- .../pages/settings/data-model/SettingsObjects.tsx | 1 + .../SettingsServerlessFunctionDetail.tsx | 15 ++++++++------- .../SettingsServerlessFunctionsNew.tsx | 5 +++-- 3 files changed, 12 insertions(+), 9 deletions(-) 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 30b148cdbd25..567364f892de 100644 --- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx +++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx @@ -128,6 +128,7 @@ export const SettingsObjects = () => { {SETTINGS_OBJECT_TABLE_METADATA.fields.map( (settingsObjectsTableMetadataField) => ( { const handleSave = useDebouncedCallback(save, 500); const onChange = (key: string) => { - return async (value: string | undefined) => { + return async (value: string) => { setFormValues((prevState) => ({ ...prevState, - [key]: value, + [key]: convertToEmptyStringForWhitespaces(value), })); await handleSave(); }; diff --git a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx index 9acdead88f6d..7519e0384b34 100644 --- a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx +++ b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx @@ -17,6 +17,7 @@ import { Key } from 'ts-key-enum'; import { IconFunction } from 'twenty-ui'; import { useHotkeyScopeOnMount } from '~/hooks/useHotkeyScopeOnMount'; import { isDefined } from '~/utils/isDefined'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; export const SettingsServerlessFunctionsNew = () => { const navigate = useNavigate(); @@ -46,10 +47,10 @@ export const SettingsServerlessFunctionsNew = () => { }; const onChange = (key: string) => { - return (value: string | undefined) => { + return (value: string) => { setFormValues((prevState) => ({ ...prevState, - [key]: value, + [key]: convertToEmptyStringForWhitespaces(value), })); }; }; From 76715b31ac62e996b5aadc44afa774984fced6ef Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 15:46:13 +0530 Subject: [PATCH 05/27] fix: disable email button when no correct email formats --- .../components/WorkspaceInviteTeam.tsx | 22 +++++++++++-------- 1 file changed, 13 insertions(+), 9 deletions(-) diff --git a/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteTeam.tsx b/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteTeam.tsx index 3bb6bbc0248f..ce5affce4fa7 100644 --- a/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteTeam.tsx +++ b/packages/twenty-front/src/modules/workspace/components/WorkspaceInviteTeam.tsx @@ -1,7 +1,7 @@ -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 { IconMail, IconSend } from 'twenty-ui'; import { z } from 'zod'; @@ -71,13 +71,16 @@ export const WorkspaceInviteTeam = () => { const { enqueueSnackBar } = useSnackBar(); const [sendInviteLink] = useSendInviteLinkMutation(); - const { reset, handleSubmit, control, formState } = useForm({ - mode: 'onSubmit', - resolver: zodResolver(validationSchema()), - defaultValues: { - emails: '', + const { reset, handleSubmit, control, formState, watch } = useForm( + { + mode: 'onSubmit', + resolver: zodResolver(validationSchema()), + defaultValues: { + emails: '', + }, }, - }); + ); + const isEmailsEmpty = !watch('emails'); const submit = handleSubmit(async (data) => { const emailsList = sanitizeEmailList(data.emails.split(',')); @@ -97,7 +100,7 @@ export const WorkspaceInviteTeam = () => { } }; - const { isSubmitSuccessful } = formState; + const { isSubmitSuccessful, errors } = formState; useEffect(() => { if (isSubmitSuccessful) { @@ -133,6 +136,7 @@ export const WorkspaceInviteTeam = () => { accent="blue" title="Invite" type="submit" + disabled={isEmailsEmpty || !!errors.emails} /> From e15c3ab458cdb7220a8c78d6c8f9517553234c99 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 17:50:02 +0530 Subject: [PATCH 06/27] fix: text field to tackle with white spaces --- .../input/components/TextFieldInput.tsx | 24 ++++++++++--------- 1 file changed, 13 insertions(+), 11 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx index e7c94120eb12..afd33cc990f2 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx @@ -4,6 +4,8 @@ import { TextAreaInput } from '@/ui/field/input/components/TextAreaInput'; import { usePersistField } from '../../../hooks/usePersistField'; import { useTextField } from '../../hooks/useTextField'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; +import { convertToUndefinedForWhitespaces } from '~/utils/string/convertToUndefinedForWhitespaces'; import { FieldInputEvent } from './DateTimeFieldInput'; export type TextFieldInputProps = { @@ -27,35 +29,35 @@ export const TextFieldInput = ({ const persistField = usePersistField(); const handleEnter = (newText: string) => { - onEnter?.(() => persistField(newText)); + // have change like handleChange here too + onEnter?.(() => persistField(convertToEmptyStringForWhitespaces(newText))); }; const handleEscape = (newText: string) => { - onEscape?.(() => persistField(newText)); + onEscape?.(() => persistField(convertToEmptyStringForWhitespaces(newText))); }; const handleClickOutside = ( event: MouseEvent | TouchEvent, newText: string, ) => { - onClickOutside?.(() => persistField(newText)); + onClickOutside?.(() => + persistField(convertToEmptyStringForWhitespaces(newText)), + ); }; const handleTab = (newText: string) => { - onTab?.(() => persistField(newText)); + onTab?.(() => persistField(convertToEmptyStringForWhitespaces(newText))); }; const handleShiftTab = (newText: string) => { - onShiftTab?.(() => persistField(newText)); + onShiftTab?.(() => + persistField(convertToEmptyStringForWhitespaces(newText)), + ); }; const handleChange = (newText: string) => { - // draft value when string getting "" isn't resettings to undefined -> need to have a look on how this can be generalised and when to put. - if (newText.trim() === '') { - setDraftValue(undefined); - } else { - setDraftValue(newText); - } + setDraftValue(convertToUndefinedForWhitespaces(newText)); }; return ( From 820c20786524dfeb9f791e87218eb21bda316aa8 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 17:52:30 +0530 Subject: [PATCH 07/27] chore: have convertToUndefinedForWhitespaces util --- .../src/utils/string/convertToUndefinedForWhitespaces.ts | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 packages/twenty-front/src/utils/string/convertToUndefinedForWhitespaces.ts diff --git a/packages/twenty-front/src/utils/string/convertToUndefinedForWhitespaces.ts b/packages/twenty-front/src/utils/string/convertToUndefinedForWhitespaces.ts new file mode 100644 index 000000000000..e829c4e7143d --- /dev/null +++ b/packages/twenty-front/src/utils/string/convertToUndefinedForWhitespaces.ts @@ -0,0 +1,5 @@ +export const convertToUndefinedForWhitespaces = ( + value: string, +): string | undefined => { + return value.trim() === '' ? undefined : value; +}; From 846e97d8beebbcaf4a6555558f165bd4e7a05f6f Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 18:35:41 +0530 Subject: [PATCH 08/27] fix: email field to handle whitespaces. --- .../meta-types/input/components/EmailFieldInput.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/EmailFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/EmailFieldInput.tsx index 29ed4b2f15c6..cb9f7bfa90b5 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/EmailFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/EmailFieldInput.tsx @@ -27,30 +27,30 @@ export const EmailFieldInput = ({ const persistField = usePersistField(); const handleEnter = (newText: string) => { - onEnter?.(() => persistField(newText)); + onEnter?.(() => persistField(newText.trim())); }; const handleEscape = (newText: string) => { - onEscape?.(() => persistField(newText)); + onEscape?.(() => persistField(newText.trim())); }; const handleClickOutside = ( event: MouseEvent | TouchEvent, newText: string, ) => { - onClickOutside?.(() => persistField(newText)); + onClickOutside?.(() => persistField(newText.trim())); }; const handleTab = (newText: string) => { - onTab?.(() => persistField(newText)); + onTab?.(() => persistField(newText.trim())); }; const handleShiftTab = (newText: string) => { - onShiftTab?.(() => persistField(newText)); + onShiftTab?.(() => persistField(newText.trim())); }; const handleChange = (newText: string) => { - setDraftValue(newText); + setDraftValue(newText.trim()); }; return ( From 22ad2111009420166b60b498d89b99e1b91d59ab Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 18:48:29 +0530 Subject: [PATCH 09/27] fix: fullName field to handle whitespaces --- .../meta-types/input/components/FullNameFieldInput.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx index e7f40c461a1c..6a9385a560bc 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx @@ -34,8 +34,8 @@ export const FullNameFieldInput = ({ const convertToFullName = (newDoubleText: FieldDoubleText) => { return { - firstName: newDoubleText.firstValue, - lastName: newDoubleText.secondValue, + firstName: newDoubleText.firstValue.trim(), + lastName: newDoubleText.secondValue.trim(), }; }; From 3ba10ae4dda3ce4aa3f4aab35c35f36906fa97d3 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 20:04:49 +0530 Subject: [PATCH 10/27] fix: fullName Field to not create object record with white spaces --- .../input/components/FullNameFieldInput.tsx | 40 +++++++++++++++---- 1 file changed, 33 insertions(+), 7 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx index 6a9385a560bc..c4480ff75cb6 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx @@ -32,6 +32,12 @@ export const FullNameFieldInput = ({ const persistField = usePersistField(); + const isTrimmedFieldDoubleTextEmpty = (newDoubleText: FieldDoubleText) => { + const { firstValue, secondValue } = newDoubleText; + const totalLength = firstValue.trim().length + secondValue.trim().length; + return totalLength ? false : true; + }; + const convertToFullName = (newDoubleText: FieldDoubleText) => { return { firstName: newDoubleText.firstValue.trim(), @@ -39,35 +45,55 @@ export const FullNameFieldInput = ({ }; }; + const getRequiredValuetoPersistFromDoubleText = ( + newDoubleText: FieldDoubleText, + ) => { + return isTrimmedFieldDoubleTextEmpty(newDoubleText) + ? undefined + : convertToFullName(newDoubleText); + }; + const handleEnter = (newDoubleText: FieldDoubleText) => { - onEnter?.(() => persistField(convertToFullName(newDoubleText))); + onEnter?.(() => + persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), + ); }; const handleEscape = (newDoubleText: FieldDoubleText) => { - onEscape?.(() => persistField(convertToFullName(newDoubleText))); + onEscape?.(() => + persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), + ); }; const handleClickOutside = ( event: MouseEvent | TouchEvent, newDoubleText: FieldDoubleText, ) => { - onClickOutside?.(() => persistField(convertToFullName(newDoubleText))); + onClickOutside?.(() => + persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), + ); }; const handleTab = (newDoubleText: FieldDoubleText) => { - onTab?.(() => persistField(convertToFullName(newDoubleText))); + onTab?.( + () => () => + persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), + ); }; const handleShiftTab = (newDoubleText: FieldDoubleText) => { - onShiftTab?.(() => persistField(convertToFullName(newDoubleText))); + onShiftTab?.( + () => () => + persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), + ); }; const handleChange = (newDoubleText: FieldDoubleText) => { - setDraftValue(convertToFullName(newDoubleText)); + setDraftValue(getRequiredValuetoPersistFromDoubleText(newDoubleText)); }; const handlePaste = (newDoubleText: FieldDoubleText) => { - setDraftValue(convertToFullName(newDoubleText)); + setDraftValue(getRequiredValuetoPersistFromDoubleText(newDoubleText)); }; return ( From b1560e25d0191beecba56b60b597bc8a32fca4c1 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Mon, 26 Aug 2024 20:31:32 +0530 Subject: [PATCH 11/27] fix: changes suggested by greptile --- .../meta-types/input/components/FullNameFieldInput.tsx | 10 ++++------ .../meta-types/input/components/TextFieldInput.tsx | 1 - 2 files changed, 4 insertions(+), 7 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx index c4480ff75cb6..de3b8f156052 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx @@ -75,16 +75,14 @@ export const FullNameFieldInput = ({ }; const handleTab = (newDoubleText: FieldDoubleText) => { - onTab?.( - () => () => - persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), + onTab?.(() => + persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), ); }; const handleShiftTab = (newDoubleText: FieldDoubleText) => { - onShiftTab?.( - () => () => - persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), + onShiftTab?.(() => + persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), ); }; diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx index afd33cc990f2..d1744ba41ceb 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx @@ -29,7 +29,6 @@ export const TextFieldInput = ({ const persistField = usePersistField(); const handleEnter = (newText: string) => { - // have change like handleChange here too onEnter?.(() => persistField(convertToEmptyStringForWhitespaces(newText))); }; From 16ab36243d439340197cd72b9b93e120814b1cb6 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Thu, 29 Aug 2024 13:40:22 +0530 Subject: [PATCH 12/27] fix: text input field with few changes --- .../input/components/TextFieldInput.tsx | 18 ++++++------------ .../field/input/components/TextAreaInput.tsx | 9 +++++---- 2 files changed, 11 insertions(+), 16 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx index d1744ba41ceb..d88faa02933e 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx @@ -4,7 +4,6 @@ import { TextAreaInput } from '@/ui/field/input/components/TextAreaInput'; import { usePersistField } from '../../../hooks/usePersistField'; import { useTextField } from '../../hooks/useTextField'; -import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; import { convertToUndefinedForWhitespaces } from '~/utils/string/convertToUndefinedForWhitespaces'; import { FieldInputEvent } from './DateTimeFieldInput'; @@ -27,36 +26,31 @@ export const TextFieldInput = ({ useTextField(); const persistField = usePersistField(); - const handleEnter = (newText: string) => { - onEnter?.(() => persistField(convertToEmptyStringForWhitespaces(newText))); + onEnter?.(() => persistField(newText.trim())); }; const handleEscape = (newText: string) => { - onEscape?.(() => persistField(convertToEmptyStringForWhitespaces(newText))); + onEscape?.(() => persistField(newText.trim())); }; const handleClickOutside = ( event: MouseEvent | TouchEvent, newText: string, ) => { - onClickOutside?.(() => - persistField(convertToEmptyStringForWhitespaces(newText)), - ); + onClickOutside?.(() => persistField(newText.trim())); }; const handleTab = (newText: string) => { - onTab?.(() => persistField(convertToEmptyStringForWhitespaces(newText))); + onTab?.(() => persistField(newText.trim())); }; const handleShiftTab = (newText: string) => { - onShiftTab?.(() => - persistField(convertToEmptyStringForWhitespaces(newText)), - ); + onShiftTab?.(() => persistField(newText.trim())); }; const handleChange = (newText: string) => { - setDraftValue(convertToUndefinedForWhitespaces(newText)); + setDraftValue(convertToUndefinedForWhitespaces(newText.trim())); }; return ( diff --git a/packages/twenty-front/src/modules/ui/field/input/components/TextAreaInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/TextAreaInput.tsx index b9a08ef1f87c..340f7b42f5d5 100644 --- a/packages/twenty-front/src/modules/ui/field/input/components/TextAreaInput.tsx +++ b/packages/twenty-front/src/modules/ui/field/input/components/TextAreaInput.tsx @@ -1,11 +1,12 @@ +import styled from '@emotion/styled'; import { ChangeEvent, useEffect, useRef, useState } from 'react'; import TextareaAutosize from 'react-textarea-autosize'; -import styled from '@emotion/styled'; import { TEXT_INPUT_STYLE } from 'twenty-ui'; import { LightCopyIconButton } from '@/object-record/record-field/components/LightCopyIconButton'; import { useRegisterInputEvents } from '@/object-record/record-field/meta-types/input/hooks/useRegisterInputEvents'; import { isDefined } from '~/utils/isDefined'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; export type TextAreaInputProps = { disabled?: boolean; @@ -67,10 +68,10 @@ export const TextAreaInput = ({ copyButton = true, }: TextAreaInputProps) => { const [internalText, setInternalText] = useState(value); - const handleChange = (event: ChangeEvent) => { - setInternalText(event.target.value); - onChange?.(event.target.value); + const targetValue = convertToEmptyStringForWhitespaces(event.target.value); + setInternalText(targetValue); + onChange?.(targetValue); }; const wrapperRef = useRef(null); From 4478c81f0b45bdd8c8fda75d7a32cafa0698cad4 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Thu, 29 Aug 2024 14:38:55 +0530 Subject: [PATCH 13/27] fix: apikeys with few changes --- .../src/modules/ui/field/input/components/TextInput.tsx | 9 ++++----- .../api-keys/SettingsDevelopersApiKeyDetail.tsx | 3 +-- .../developers/api-keys/SettingsDevelopersApiKeysNew.tsx | 3 +-- 3 files changed, 6 insertions(+), 9 deletions(-) diff --git a/packages/twenty-front/src/modules/ui/field/input/components/TextInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/TextInput.tsx index 1490e1f7d587..b932cbdc5fab 100644 --- a/packages/twenty-front/src/modules/ui/field/input/components/TextInput.tsx +++ b/packages/twenty-front/src/modules/ui/field/input/components/TextInput.tsx @@ -1,5 +1,5 @@ -import { ChangeEvent, useEffect, useRef, useState } from 'react'; import styled from '@emotion/styled'; +import { ChangeEvent, useEffect, useRef, useState } from 'react'; import { TEXT_INPUT_STYLE } from 'twenty-ui'; import { LightCopyIconButton } from '@/object-record/record-field/components/LightCopyIconButton'; @@ -44,12 +44,11 @@ export const TextInput = ({ const copyRef = useRef(null); const handleChange = (event: ChangeEvent) => { - setInternalText(event.target.value); - onChange?.(event.target.value); + setInternalText(event.target.value.trim()); + onChange?.(event.target.value.trim()); }; - useEffect(() => { - setInternalText(value); + setInternalText(value.trim()); }, [value]); useRegisterInputEvents({ 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 2ef2dae5b79e..59eae8c62080 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 @@ -24,7 +24,6 @@ import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer' import { Section } from '@/ui/layout/section/components/Section'; import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb'; import { useGenerateApiKeyTokenMutation } from '~/generated/graphql'; -import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; const StyledInfo = styled.span` color: ${({ theme }) => theme.font.color.light}; @@ -175,7 +174,7 @@ export const SettingsDevelopersApiKeyDetail = () => { apiKeyId={apiKeyData?.id} disabled={loading} onNameUpdate={(value: string) => { - setApiKeyName(convertToEmptyStringForWhitespaces(value)); + setApiKeyName(value); }} /> diff --git a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx index 52c361401215..7a2207125022 100644 --- a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx +++ b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx @@ -19,7 +19,6 @@ import { useSetRecoilState } from 'recoil'; import { Key } from 'ts-key-enum'; import { useGenerateApiKeyTokenMutation } from '~/generated/graphql'; import { isDefined } from '~/utils/isDefined'; -import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; export const SettingsDevelopersApiKeysNew = () => { const [generateOneApiKeyToken] = useGenerateApiKeyTokenMutation(); @@ -98,7 +97,7 @@ export const SettingsDevelopersApiKeysNew = () => { onChange={(value) => { setFormValues((prevState) => ({ ...prevState, - name: convertToEmptyStringForWhitespaces(value), + name: value, })); }} fullWidth From 89d053e765394b6cd970958a1092d710d871a028 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Thu, 29 Aug 2024 15:12:04 +0530 Subject: [PATCH 14/27] fix: core ui components instead --- .../src/modules/ui/input/components/TextArea.tsx | 7 +++++-- .../developers/api-keys/SettingsDevelopersApiKeyDetail.tsx | 4 +--- .../SettingsServerlessFunctionDetail.tsx | 2 +- .../SettingsServerlessFunctionsNew.tsx | 3 +-- 4 files changed, 8 insertions(+), 8 deletions(-) diff --git a/packages/twenty-front/src/modules/ui/input/components/TextArea.tsx b/packages/twenty-front/src/modules/ui/input/components/TextArea.tsx index aee5943e6e16..d58f076349ec 100644 --- a/packages/twenty-front/src/modules/ui/input/components/TextArea.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/TextArea.tsx @@ -1,9 +1,10 @@ +import styled from '@emotion/styled'; import { FocusEventHandler } from 'react'; import TextareaAutosize from 'react-textarea-autosize'; -import styled from '@emotion/styled'; import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; import { InputHotkeyScope } from '../types/InputHotkeyScope'; const MAX_ROWS = 5; @@ -75,7 +76,9 @@ export const TextArea = ({ maxRows={MAX_ROWS} minRows={computedMinRows} value={value} - onChange={(event) => onChange?.(event.target.value)} + onChange={(event) => + onChange?.(convertToEmptyStringForWhitespaces(event.target.value)) + } onFocus={handleFocus} onBlur={handleBlur} disabled={disabled} 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 59eae8c62080..21919f09a4f5 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 @@ -173,9 +173,7 @@ export const SettingsDevelopersApiKeyDetail = () => { apiKeyName={apiKeyName} apiKeyId={apiKeyData?.id} disabled={loading} - onNameUpdate={(value: string) => { - setApiKeyName(value); - }} + onNameUpdate={setApiKeyName} />
diff --git a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx index a6f01e6b4bac..7df3d6619f34 100644 --- a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx +++ b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx @@ -79,7 +79,7 @@ export const SettingsServerlessFunctionDetail = () => { return async (value: string) => { setFormValues((prevState) => ({ ...prevState, - [key]: convertToEmptyStringForWhitespaces(value), + [key]: value, })); await handleSave(); }; diff --git a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx index 7519e0384b34..92a5cb0f7387 100644 --- a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx +++ b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx @@ -17,7 +17,6 @@ import { Key } from 'ts-key-enum'; import { IconFunction } from 'twenty-ui'; import { useHotkeyScopeOnMount } from '~/hooks/useHotkeyScopeOnMount'; import { isDefined } from '~/utils/isDefined'; -import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; export const SettingsServerlessFunctionsNew = () => { const navigate = useNavigate(); @@ -50,7 +49,7 @@ export const SettingsServerlessFunctionsNew = () => { return (value: string) => { setFormValues((prevState) => ({ ...prevState, - [key]: convertToEmptyStringForWhitespaces(value), + [key]: value, })); }; }; From a271f90715009c767aa22803d2a0a2b16f638498 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Thu, 29 Aug 2024 15:28:10 +0530 Subject: [PATCH 15/27] fix: email field to remove redundant field --- .../meta-types/input/components/EmailFieldInput.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/EmailFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/EmailFieldInput.tsx index cb9f7bfa90b5..29ed4b2f15c6 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/EmailFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/EmailFieldInput.tsx @@ -27,30 +27,30 @@ export const EmailFieldInput = ({ const persistField = usePersistField(); const handleEnter = (newText: string) => { - onEnter?.(() => persistField(newText.trim())); + onEnter?.(() => persistField(newText)); }; const handleEscape = (newText: string) => { - onEscape?.(() => persistField(newText.trim())); + onEscape?.(() => persistField(newText)); }; const handleClickOutside = ( event: MouseEvent | TouchEvent, newText: string, ) => { - onClickOutside?.(() => persistField(newText.trim())); + onClickOutside?.(() => persistField(newText)); }; const handleTab = (newText: string) => { - onTab?.(() => persistField(newText.trim())); + onTab?.(() => persistField(newText)); }; const handleShiftTab = (newText: string) => { - onShiftTab?.(() => persistField(newText.trim())); + onShiftTab?.(() => persistField(newText)); }; const handleChange = (newText: string) => { - setDraftValue(newText.trim()); + setDraftValue(newText); }; return ( From 22d394ccaf684d8aa374d89173e0ea3222edf55c Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Thu, 29 Aug 2024 15:40:35 +0530 Subject: [PATCH 16/27] fix: name field to not make changes with empty input --- .../src/modules/settings/workspace/components/NameField.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/twenty-front/src/modules/settings/workspace/components/NameField.tsx b/packages/twenty-front/src/modules/settings/workspace/components/NameField.tsx index 3a921e92f658..31b5f31b3e79 100644 --- a/packages/twenty-front/src/modules/settings/workspace/components/NameField.tsx +++ b/packages/twenty-front/src/modules/settings/workspace/components/NameField.tsx @@ -1,10 +1,11 @@ -import { useCallback, useEffect, useState } from 'react'; import styled from '@emotion/styled'; +import { useCallback, useEffect, useState } from 'react'; import { useRecoilValue, useSetRecoilState } from 'recoil'; import { useDebouncedCallback } from 'use-debounce'; import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState'; import { TextInput } from '@/ui/input/components/TextInput'; +import isEmpty from 'lodash.isempty'; import { useUpdateWorkspaceMutation } from '~/generated/graphql'; import { isDefined } from '~/utils/isDefined'; import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull'; @@ -40,6 +41,7 @@ export const NameField = ({ // eslint-disable-next-line react-hooks/exhaustive-deps const debouncedUpdate = useCallback( useDebouncedCallback(async (name: string) => { + if (isEmpty(name)) return; // update local recoil state when workspace name is updated setCurrentWorkspace((currentValue) => { if (currentValue === null) { From d7a084ca05f38c57c10997433b857af1e3e990b0 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Thu, 29 Aug 2024 16:37:11 +0530 Subject: [PATCH 17/27] fix: Number Field --- .../meta-types/input/components/NumberFieldInput.tsx | 2 +- .../object-record/record-field/types/FieldInputDraftValue.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/NumberFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/NumberFieldInput.tsx index 336aefc99945..d5fead466f64 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/NumberFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/NumberFieldInput.tsx @@ -60,7 +60,7 @@ export const NumberFieldInput = ({ Date: Fri, 30 Aug 2024 12:14:03 +0530 Subject: [PATCH 18/27] fix: multiselect, select, selectinput, country --- .../meta-types/input/components/MultiSelectFieldInput.tsx | 7 ++++++- .../src/modules/ui/input/components/Select.tsx | 7 ++++++- .../src/modules/ui/input/components/SelectInput.tsx | 5 ++++- 3 files changed, 16 insertions(+), 3 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiSelectFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiSelectFieldInput.tsx index c6134f911a2d..937a305bb433 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiSelectFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiSelectFieldInput.tsx @@ -16,6 +16,7 @@ import { MenuItemMultiSelectTag } from '@/ui/navigation/menu-item/components/Men import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; import { useListenClickOutside } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside'; import { isDefined } from '~/utils/isDefined'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; const StyledRelationPickerContainer = styled.div` left: -1px; @@ -107,7 +108,11 @@ export const MultiSelectFieldInput = ({ setSearchFilter(event.currentTarget.value)} + onChange={(event) => + setSearchFilter( + convertToEmptyStringForWhitespaces(event.currentTarget.value), + ) + } autoFocus /> diff --git a/packages/twenty-front/src/modules/ui/input/components/Select.tsx b/packages/twenty-front/src/modules/ui/input/components/Select.tsx index c31a48a198ea..bff548d03c49 100644 --- a/packages/twenty-front/src/modules/ui/input/components/Select.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/Select.tsx @@ -10,6 +10,7 @@ import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownM import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; import { SelectHotkeyScope } from '../types/SelectHotkeyScope'; export type SelectOption = { @@ -155,7 +156,11 @@ export const Select = ({ setSearchInputValue(event.target.value)} + onChange={(event) => + setSearchInputValue( + convertToEmptyStringForWhitespaces(event.target.value), + ) + } /> )} {!!withSearchInput && !!filteredOptions.length && ( diff --git a/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx b/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx index e08131d9a147..db00ecd33ed6 100644 --- a/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx @@ -23,6 +23,7 @@ import { import { useEffect, useMemo, useRef, useState } from 'react'; import { Key } from 'ts-key-enum'; import { TagColor, isDefined } from 'twenty-ui'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; const StyledRelationPickerContainer = styled.div` left: -1px; @@ -144,7 +145,9 @@ export const SelectInput = ({ setSearchFilter(e.target.value)} + onChange={(e) => + setSearchFilter(convertToEmptyStringForWhitespaces(e.target.value)) + } autoFocus /> From 212e15d0e48dddae7603424c18d09a7d3a6319a9 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Fri, 30 Aug 2024 12:45:53 +0530 Subject: [PATCH 19/27] fix: revert changes which doesn't makes sense --- .../src/modules/ui/input/components/Select.tsx | 7 +------ .../src/modules/ui/input/components/SelectInput.tsx | 5 +---- .../SettingsServerlessFunctionDetail.tsx | 1 - 3 files changed, 2 insertions(+), 11 deletions(-) diff --git a/packages/twenty-front/src/modules/ui/input/components/Select.tsx b/packages/twenty-front/src/modules/ui/input/components/Select.tsx index bff548d03c49..c31a48a198ea 100644 --- a/packages/twenty-front/src/modules/ui/input/components/Select.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/Select.tsx @@ -10,7 +10,6 @@ import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownM import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown'; import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem'; -import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; import { SelectHotkeyScope } from '../types/SelectHotkeyScope'; export type SelectOption = { @@ -156,11 +155,7 @@ export const Select = ({ - setSearchInputValue( - convertToEmptyStringForWhitespaces(event.target.value), - ) - } + onChange={(event) => setSearchInputValue(event.target.value)} /> )} {!!withSearchInput && !!filteredOptions.length && ( diff --git a/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx b/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx index db00ecd33ed6..e08131d9a147 100644 --- a/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx @@ -23,7 +23,6 @@ import { import { useEffect, useMemo, useRef, useState } from 'react'; import { Key } from 'ts-key-enum'; import { TagColor, isDefined } from 'twenty-ui'; -import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; const StyledRelationPickerContainer = styled.div` left: -1px; @@ -145,9 +144,7 @@ export const SelectInput = ({ - setSearchFilter(convertToEmptyStringForWhitespaces(e.target.value)) - } + onChange={(e) => setSearchFilter(e.target.value)} autoFocus /> diff --git a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx index 7df3d6619f34..3c73392e91e4 100644 --- a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx +++ b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx @@ -24,7 +24,6 @@ import { useRecoilValue, useSetRecoilState } from 'recoil'; import { IconCode, IconFunction, IconSettings, IconTestPipe } from 'twenty-ui'; import { useDebouncedCallback } from 'use-debounce'; import { isDefined } from '~/utils/isDefined'; -import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; const TAB_LIST_COMPONENT_ID = 'serverless-function-detail'; From b23d0bed62d74505a113cde6930174bc34115ab9 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Fri, 30 Aug 2024 13:10:50 +0530 Subject: [PATCH 20/27] fix: FullNameFieldInput to handle whitespaces --- .../input/components/FullNameFieldInput.tsx | 25 ++++++------------- .../input/components/DoubleTextInput.tsx | 5 +++- 2 files changed, 11 insertions(+), 19 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx index de3b8f156052..cd43db48483a 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx @@ -3,8 +3,6 @@ import { FieldDoubleText } from '@/object-record/record-field/types/FieldDoubleT import { DoubleTextInput } from '@/ui/field/input/components/DoubleTextInput'; import { FieldInputOverlay } from '@/ui/field/input/components/FieldInputOverlay'; -import { usePersistField } from '../../../hooks/usePersistField'; - import { FieldInputEvent } from './DateTimeFieldInput'; const FIRST_NAME_PLACEHOLDER_WITH_SPECIAL_CHARACTER_TO_AVOID_PASSWORD_MANAGERS = @@ -28,9 +26,8 @@ export const FullNameFieldInput = ({ onTab, onShiftTab, }: FullNameFieldInputProps) => { - const { hotkeyScope, draftValue, setDraftValue } = useFullNameField(); - - const persistField = usePersistField(); + const { hotkeyScope, draftValue, setDraftValue, persistFullNameField } = + useFullNameField(); const isTrimmedFieldDoubleTextEmpty = (newDoubleText: FieldDoubleText) => { const { firstValue, secondValue } = newDoubleText; @@ -54,15 +51,11 @@ export const FullNameFieldInput = ({ }; const handleEnter = (newDoubleText: FieldDoubleText) => { - onEnter?.(() => - persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), - ); + onEnter?.(() => persistFullNameField(convertToFullName(newDoubleText))); }; const handleEscape = (newDoubleText: FieldDoubleText) => { - onEscape?.(() => - persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), - ); + onEscape?.(() => persistFullNameField(convertToFullName(newDoubleText))); }; const handleClickOutside = ( @@ -70,20 +63,16 @@ export const FullNameFieldInput = ({ newDoubleText: FieldDoubleText, ) => { onClickOutside?.(() => - persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), + persistFullNameField(convertToFullName(newDoubleText)), ); }; const handleTab = (newDoubleText: FieldDoubleText) => { - onTab?.(() => - persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), - ); + onTab?.(() => persistFullNameField(convertToFullName(newDoubleText))); }; const handleShiftTab = (newDoubleText: FieldDoubleText) => { - onShiftTab?.(() => - persistField(getRequiredValuetoPersistFromDoubleText(newDoubleText)), - ); + onShiftTab?.(() => persistFullNameField(convertToFullName(newDoubleText))); }; const handleChange = (newDoubleText: FieldDoubleText) => { diff --git a/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx index c0e312a92184..5a8e3df6df2b 100644 --- a/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx +++ b/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx @@ -169,7 +169,10 @@ export const DoubleTextInput = ({ const splittedName = name.split(' '); - onPaste?.({ firstValue: splittedName[0], secondValue: splittedName[1] }); + onPaste?.({ + firstValue: splittedName[0].trim(), + secondValue: splittedName[1].trim(), + }); }; return ( From 02f5a71e1338eb691f7012fb6f0500ff9ee37dec Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Fri, 30 Aug 2024 13:25:20 +0530 Subject: [PATCH 21/27] fix: naming convention --- .../meta-types/input/components/FullNameFieldInput.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx index cd43db48483a..ae90171bd91b 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/FullNameFieldInput.tsx @@ -42,7 +42,7 @@ export const FullNameFieldInput = ({ }; }; - const getRequiredValuetoPersistFromDoubleText = ( + const getRequiredDraftValueFromDoubleText = ( newDoubleText: FieldDoubleText, ) => { return isTrimmedFieldDoubleTextEmpty(newDoubleText) @@ -76,11 +76,11 @@ export const FullNameFieldInput = ({ }; const handleChange = (newDoubleText: FieldDoubleText) => { - setDraftValue(getRequiredValuetoPersistFromDoubleText(newDoubleText)); + setDraftValue(getRequiredDraftValueFromDoubleText(newDoubleText)); }; const handlePaste = (newDoubleText: FieldDoubleText) => { - setDraftValue(getRequiredValuetoPersistFromDoubleText(newDoubleText)); + setDraftValue(getRequiredDraftValueFromDoubleText(newDoubleText)); }; return ( From bc29337d031cc02468effc42ea1a27972885f3e0 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Fri, 30 Aug 2024 14:42:37 +0530 Subject: [PATCH 22/27] fix: changes suggested by greptile --- .../record-field/meta-types/input/components/TextFieldInput.tsx | 2 +- .../src/utils/string/convertToUndefinedForWhitespaces.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx index d88faa02933e..7cdfecc8506d 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/TextFieldInput.tsx @@ -50,7 +50,7 @@ export const TextFieldInput = ({ }; const handleChange = (newText: string) => { - setDraftValue(convertToUndefinedForWhitespaces(newText.trim())); + setDraftValue(convertToUndefinedForWhitespaces(newText)); }; return ( diff --git a/packages/twenty-front/src/utils/string/convertToUndefinedForWhitespaces.ts b/packages/twenty-front/src/utils/string/convertToUndefinedForWhitespaces.ts index e829c4e7143d..eae4da66587e 100644 --- a/packages/twenty-front/src/utils/string/convertToUndefinedForWhitespaces.ts +++ b/packages/twenty-front/src/utils/string/convertToUndefinedForWhitespaces.ts @@ -1,5 +1,5 @@ export const convertToUndefinedForWhitespaces = ( value: string, ): string | undefined => { - return value.trim() === '' ? undefined : value; + return value.trim() === '' ? undefined : value.trim(); }; From 917bc0ca83bf05ba09b0c259d0d354724a6aa0c7 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Fri, 30 Aug 2024 15:16:29 +0530 Subject: [PATCH 23/27] fix: key missing issue and spaces issue in fullName --- .../components/SingleEntitySelectMenuItems.tsx | 7 +++---- .../ui/field/input/components/DoubleTextInput.tsx | 11 +++++++++-- 2 files changed, 12 insertions(+), 6 deletions(-) diff --git a/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleEntitySelectMenuItems.tsx b/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleEntitySelectMenuItems.tsx index ac7d5c1ab6e0..eba9c8aaf331 100644 --- a/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleEntitySelectMenuItems.tsx +++ b/packages/twenty-front/src/modules/object-record/relation-picker/components/SingleEntitySelectMenuItems.tsx @@ -1,5 +1,5 @@ -import { useRef } from 'react'; import { isNonEmptyString } from '@sniptt/guards'; +import { Fragment, useRef } from 'react'; import { useRecoilValue } from 'recoil'; import { Key } from 'ts-key-enum'; import { IconComponent, IconPlus } from 'twenty-ui'; @@ -157,16 +157,15 @@ export const SingleEntitySelectMenuItems = ({ switch (entity.id) { case 'add-new': { return ( - <> + {entitiesToSelect.length > 0 && } - + ); } case 'select-none': { diff --git a/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx index 5a8e3df6df2b..91108e0faec5 100644 --- a/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx +++ b/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx @@ -13,6 +13,7 @@ import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; import { useListenClickOutside } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside'; import { isDefined } from '~/utils/isDefined'; +import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; import { StyledTextInput } from './TextInput'; const StyledContainer = styled.div` @@ -185,7 +186,10 @@ export const DoubleTextInput = ({ placeholder={firstValuePlaceholder} value={firstInternalValue} onChange={(event: ChangeEvent) => { - handleChange(event.target.value, secondInternalValue); + handleChange( + convertToEmptyStringForWhitespaces(event.target.value), + secondInternalValue, + ); }} onPaste={(event: ClipboardEvent) => handleOnPaste(event) @@ -198,7 +202,10 @@ export const DoubleTextInput = ({ placeholder={secondValuePlaceholder} value={secondInternalValue} onChange={(event: ChangeEvent) => { - handleChange(firstInternalValue, event.target.value); + handleChange( + firstInternalValue, + convertToEmptyStringForWhitespaces(event.target.value), + ); }} /> From 06f2db9185e1d607b3c1cb41057ba32fe85de3c8 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Fri, 30 Aug 2024 15:46:14 +0530 Subject: [PATCH 24/27] fix: paste of fullname to handle cases --- .../ui/field/input/components/DoubleTextInput.tsx | 7 ++++--- .../twenty-front/src/utils/format/spiltFullName.ts | 13 +++++++++++++ 2 files changed, 17 insertions(+), 3 deletions(-) create mode 100644 packages/twenty-front/src/utils/format/spiltFullName.ts diff --git a/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx index 91108e0faec5..f2a998c6feee 100644 --- a/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx +++ b/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx @@ -13,6 +13,7 @@ import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; import { useListenClickOutside } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside'; import { isDefined } from '~/utils/isDefined'; +import { splitFullName } from '~/utils/format/spiltFullName'; import { convertToEmptyStringForWhitespaces } from '~/utils/string/convertToEmptyStringForWhitespaces'; import { StyledTextInput } from './TextInput'; @@ -168,11 +169,11 @@ export const DoubleTextInput = ({ const name = event.clipboardData.getData('Text'); - const splittedName = name.split(' '); + const splittedName = splitFullName(name); onPaste?.({ - firstValue: splittedName[0].trim(), - secondValue: splittedName[1].trim(), + firstValue: splittedName[0], + secondValue: splittedName[1], }); }; diff --git a/packages/twenty-front/src/utils/format/spiltFullName.ts b/packages/twenty-front/src/utils/format/spiltFullName.ts new file mode 100644 index 000000000000..6ec1ac2d8ca8 --- /dev/null +++ b/packages/twenty-front/src/utils/format/spiltFullName.ts @@ -0,0 +1,13 @@ +export const splitFullName = (name: string) => { + const splittedName = name.trim().split(/\s+/); + + if (splittedName.length === 2) { + return splittedName; + } + + if (splittedName.length > 2) { + return [splittedName[0].trim(), splittedName[1].trim()]; + } + + return [name.trim(), '']; +}; From ad72c183b3edf411c809bab8bde3a95e4e48a1d6 Mon Sep 17 00:00:00 2001 From: Nabhag8848 Date: Sat, 31 Aug 2024 18:11:53 +0530 Subject: [PATCH 25/27] fix: more key errors --- .../settings/components/SettingsNavigationDrawerItems.tsx | 1 + .../src/modules/ui/input/components/TextInputV2.tsx | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/twenty-front/src/modules/settings/components/SettingsNavigationDrawerItems.tsx b/packages/twenty-front/src/modules/settings/components/SettingsNavigationDrawerItems.tsx index 6785415bcdf8..2818f9e840fe 100644 --- a/packages/twenty-front/src/modules/settings/components/SettingsNavigationDrawerItems.tsx +++ b/packages/twenty-front/src/modules/settings/components/SettingsNavigationDrawerItems.tsx @@ -108,6 +108,7 @@ export const SettingsNavigationDrawerItems = () => { /> {accountSubSettings.map((navigationItem, index) => ( )} Date: Thu, 19 Sep 2024 11:52:38 +0200 Subject: [PATCH 26/27] Fixed enter cannot save and zIndex of PageHeader --- .../src/modules/ui/layout/page/PageHeader.tsx | 1 - .../SettingsDevelopersWebhookDetail.tsx | 225 +++++++++--------- .../SettingsDevelopersWebhooksNew.tsx | 33 +-- 3 files changed, 127 insertions(+), 132 deletions(-) diff --git a/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx b/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx index f352d734372b..ed9586bf969a 100644 --- a/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx +++ b/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx @@ -30,7 +30,6 @@ const StyledTopBarContainer = styled.div<{ width?: number }>` padding: ${({ theme }) => theme.spacing(2)}; padding-left: 0; padding-right: ${({ theme }) => theme.spacing(3)}; - z-index: 20; width: ${({ width }) => width + 'px' || '100%'}; @media (max-width: ${MOBILE_VIEWPORT}px) { diff --git a/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhookDetail.tsx b/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhookDetail.tsx index c18292c4c4e1..a45227408fb5 100644 --- a/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhookDetail.tsx +++ b/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhookDetail.tsx @@ -87,125 +87,116 @@ export const SettingsDevelopersWebhooksDetail = () => { navigate(developerPath); }; + if (!webhookData?.targetUrl) { + return <>; + } + return ( - <> - {webhookData?.targetUrl && ( - { - navigate(developerPath); + { + navigate(developerPath); + }} + onSave={handleSave} + /> + } + > + +
+ + +
+
+ +