-
Notifications
You must be signed in to change notification settings - Fork 2.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Workflow phone number field #9324
Conversation
b5849e4
to
3c7228e
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It works perfectly. Great job!
@@ -125,6 +128,8 @@ export const FormNumberFieldInput = ({ | |||
/> | |||
) : null} | |||
</FormFieldInputRowContainer> | |||
|
|||
{hint ? <FormFieldHint>{hint}</FormFieldHint> : null} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Great!
3c7228e
to
6ea4c2d
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
PR Summary
This PR adds comprehensive phone number field functionality with country code selection and proper formatting support.
- Added new
FormPhoneFieldInput
component in/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormPhoneFieldInput.tsx
combining country code selection and phone number input - Added
FormCountryCodeSelectInput
component with flag icons and calling codes display in/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormCountryCodeSelectInput.tsx
- Added
FormFieldHint
component in/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormFieldHint.tsx
for displaying helper text below form fields - Modified
Tag
component in/packages/twenty-ui/src/display/tag/components/Tag.tsx
to supportpreventPadding
for better form field integration - Added Storybook stories for testing and demonstrating the new phone field components
11 file(s) reviewed, 5 comment(s)
Edit PR Review Bot Settings | Greptile
.../src/modules/object-record/record-field/form-types/components/FormCountryCodeSelectInput.tsx
Show resolved
Hide resolved
...y-front/src/modules/object-record/record-field/form-types/components/FormPhoneFieldInput.tsx
Show resolved
Hide resolved
onPersist({ | ||
primaryPhoneCountryCode: newCountry, | ||
primaryPhoneCallingCode: newCallingCode, | ||
primaryPhoneNumber: '', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
style: resetting phone number on country change could lead to data loss - consider preserving it
const handleNumberChange = (number: string | number | null) => { | ||
onPersist({ | ||
primaryPhoneCountryCode: defaultValue?.primaryPhoneCountryCode || '', | ||
primaryPhoneCallingCode: defaultValue?.primaryPhoneCallingCode || '', | ||
primaryPhoneNumber: number ? `${number}` : '', | ||
}); | ||
}; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
style: handleNumberChange should validate phone number format before persisting
export const Default: Story = { | ||
args: { | ||
label: 'Phone', | ||
defaultValue: defaultPhoneValue, | ||
}, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
logic: Missing required onPersist prop in story args. This will cause runtime errors since FormPhoneFieldInput requires it.
Add phone number field