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

Display "Untitled" in MultipleRecordPicker (#12246)

Browse Source 
Fixes #11940 

Display untitled with the object name for untitled records in
`MultipleRecordPicker`:

![CleanShot 2025-05-23 at 11 29
20@2x](https://github.com/user-attachments/assets/062df33c-5c7a-4170-a973-8a1fc1b04729)
This commit is contained in:
Raphaël Bosi
2025-05-23 14:51:16 +02:00
committed by GitHub
parent c98439d76a
commit 5da446d7f7
1 changed files with 7 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerMenuItemContent.tsx
View File

@ -10,6 +10,7 @@ import { SelectableListItem } from '@/ui/layout/selectable-list/components/Selec
import { isSelectedItemIdComponentFamilySelector } from '@/ui/layout/selectable-list/states/selectors/isSelectedItemIdComponentFamilySelector'; import { isSelectedItemIdComponentFamilySelector } from '@/ui/layout/selectable-list/states/selectors/isSelectedItemIdComponentFamilySelector';
import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow'; import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
import { useRecoilComponentFamilyValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentFamilyValueV2'; import { useRecoilComponentFamilyValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentFamilyValueV2';
import { capitalize } from 'twenty-shared/utils';
import { Avatar } from 'twenty-ui/display'; import { Avatar } from 'twenty-ui/display';
import { MenuItemMultiSelectAvatar } from 'twenty-ui/navigation'; import { MenuItemMultiSelectAvatar } from 'twenty-ui/navigation';
import { SearchRecord } from '~/generated-metadata/graphql'; import { SearchRecord } from '~/generated-metadata/graphql';
@ -58,6 +59,10 @@ export const MultipleRecordPickerMenuItemContent = ({
}); });
}; };
const displayText =
searchRecord.label?.trim() ||
`Untitled ${capitalize(objectMetadataItem.nameSingular)}`;
return ( return (
<StyledSelectableItem <StyledSelectableItem
itemId={searchRecord.recordId} itemId={searchRecord.recordId}
@ -72,12 +77,12 @@ export const MultipleRecordPickerMenuItemContent = ({
<Avatar <Avatar
avatarUrl={searchRecord.imageUrl} avatarUrl={searchRecord.imageUrl}
placeholderColorSeed={searchRecord.recordId} placeholderColorSeed={searchRecord.recordId}
placeholder={searchRecord.label} placeholder={displayText}
size="md" size="md"
type={getAvatarType(objectMetadataItem.nameSingular) ?? 'rounded'} type={getAvatarType(objectMetadataItem.nameSingular) ?? 'rounded'}
/> />
} }
text={searchRecord.label} text={displayText}
/> />
</StyledSelectableItem> </StyledSelectableItem>
); );