fix: Set field type icon as the default icon for new fields (#7352) (#7579)
Closes #7352
**Summary**
Moved the `defaultIconsByFieldType` mapping from the
`SettingsObjectNewFieldConfigure` component to a separate constants
file. This change improves code organization and maintainability without
changing functionality.
**Changes Made**
- **Created a new constants file:** Added `FieldTypeIcons.ts`, located
in `src/pages/settings/data-model/constants/`, to store the mapping of
`FieldMetadataType` to default icons.
```
// FieldTypeIcons.ts
import { FieldMetadataType } from '~/generated-metadata/graphql';
export const defaultIconsByFieldType: Record<FieldMetadataType, string> = {
[FieldMetadataType.Address]: 'IconLocation',
[FieldMetadataType.Boolean]: 'IconCheckbox',
[FieldMetadataType.Currency]: 'IconCurrency',
[FieldMetadataType.Date]: 'IconCalendar',
[FieldMetadataType.DateTime]: 'IconClock',
[FieldMetadataType.Email]: 'IconMail',
[FieldMetadataType.FullName]: 'IconUser',
[FieldMetadataType.Link]: 'IconLink',
[FieldMetadataType.MultiSelect]: 'IconList',
[FieldMetadataType.Number]: 'IconNumber',
[FieldMetadataType.Phone]: 'IconPhone',
[FieldMetadataType.Rating]: 'IconStar',
[FieldMetadataType.RawJson]: 'IconCode',
[FieldMetadataType.Relation]: 'IconRelationOneToMany',
[FieldMetadataType.Select]: 'IconSelect',
[FieldMetadataType.Text]: 'IconTypography',
[FieldMetadataType.Uuid]: 'IconKey',
[FieldMetadataType.Array]: 'IconCodeDots',
[FieldMetadataType.Emails]: 'IconMail',
[FieldMetadataType.Links]: 'IconLink',
[FieldMetadataType.Phones]: 'IconPhone',
[FieldMetadataType.Actor]: 'IconUsers',
[FieldMetadataType.Numeric]: 'IconUsers',
[FieldMetadataType.Position]: 'IconUsers',
[FieldMetadataType.RichText]: 'IconUsers',
[FieldMetadataType.TsVector]: 'IconUsers',
// Add other field types as needed
};
```
- **Updated the import in the component:** In the file
`SettingsObjectNewFieldConfigure.tsx`, imported the mapping from the new
constants file.
```// SettingsObjectNewFieldConfigure.tsx
import { defaultIconsByFieldType } from
'~/pages/settings/data-model/constants/FieldTypeIcons';
- **Adjusted form configuration:** Modified `defaultValues` in `useForm`
and `useEffect` to use the imported mapping.
```
`const formConfig = useForm<SettingsDataModelNewFieldFormValues>({
mode: 'onTouched',
resolver: zodResolver(
settingsFieldFormSchema(
activeObjectMetadataItem?.fields.map((value) => value.name),
),
),
defaultValues: {
type: fieldType,
icon: defaultIconsByFieldType[fieldType] || 'IconUsers',
label: '',
description: '',
},
});
useEffect(() => {
formConfig.setValue('icon', defaultIconsByFieldType[fieldType] || 'IconUsers');
}, [fieldType, formConfig]);`
---------
Co-authored-by: Your Name <you@example.com>
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>