Add SettingsCard for Config Data Type and Accounts Settings #7093
Conversation
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
There was a problem hiding this comment.
PR Summary
This PR introduces a new SettingsCard component and updates the field type selection UI, addressing the enhancement requests from issue #6950.
- Renamed SettingsNavigationCard to SettingsCard in
packages/twenty-front/src/modules/settings/components/SettingsCard.tsx, adding support for padding sizes, descriptions, and hover effects - Updated
packages/twenty-front/src/modules/settings/data-model/fields/forms/components/SettingsDataModelFieldTypeSelect.tsxto use the new SettingsCard for field type options - Added
packages/twenty-ui/src/display/icon/components/IllustrationIconArray.tsxfor the new Array field type illustration - Modified
packages/twenty-front/src/modules/settings/data-model/constants/SettingsFieldTypeConfigs.tsto use IllustrationIconArray for the Array field type - Created Storybook story for SettingsCard in
packages/twenty-front/src/modules/settings/components/__stories__/SettingsCard.stories.tsx
7 file(s) reviewed, 2 comment(s)
Edit PR Review Bot Settings
| @@ -158,8 +141,8 @@ export const SettingsDataModelFieldTypeSelect = ({ | |||
| {fieldTypeConfigs | |||
| .filter(([, config]) => config.category === category) | |||
| .map(([key, config]) => ( | |||
| <StyledButtonContainer> | |||
| <StyledButton | |||
| <StyledCardContainer> | |||
There was a problem hiding this comment.
syntax: Add a unique 'key' prop to the StyledCardContainer
| <StyledButtonContainer> | ||
| <StyledButton | ||
| <StyledCardContainer> | ||
| <SettingsCard | ||
| key={key} |
There was a problem hiding this comment.
syntax: Remove redundant 'key' prop from SettingsCard
Icons3 things to fix:
CardCurrent behaviorPadding is 16px x 12px
The icon is not in a container
Desired behaviorThe padding should be 8px
There should be a fixed 24px x 24px icon container:
The card border-radius should be 8px
|
|
@anamarn thanks! Can you add a 2px padding around the icon on the object page?
Could we change the URL from
|
|
Thanks @anamarn for your contribution! |
#6950
Add new Settings Card for Config Data Type and accounts Settings
Before:
After: