feat: Revamp navigation bar (#6031)
closes: #4428 Testing for fetchMoreRecords is pending, along with component tests --------- Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
@ -1,13 +1,17 @@
|
||||
import { EntityChip, EntityChipVariant } from 'twenty-ui';
|
||||
import { AvatarChip, AvatarChipVariant } from 'twenty-ui';
|
||||
|
||||
import { useMapToObjectRecordIdentifier } from '@/object-metadata/hooks/useMapToObjectRecordIdentifier';
|
||||
import { getLinkToShowPage } from '@/object-metadata/utils/getLinkToShowPage';
|
||||
import { useRecordChipData } from '@/object-record/hooks/useRecordChipData';
|
||||
import { ObjectRecord } from '@/object-record/types/ObjectRecord';
|
||||
import { isNonEmptyString } from '@sniptt/guards';
|
||||
import { MouseEvent } from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
|
||||
export type RecordChipProps = {
|
||||
objectNameSingular: string;
|
||||
record: ObjectRecord;
|
||||
className?: string;
|
||||
variant?: EntityChipVariant;
|
||||
variant?: AvatarChipVariant;
|
||||
};
|
||||
|
||||
export const RecordChip = ({
|
||||
@ -16,19 +20,29 @@ export const RecordChip = ({
|
||||
className,
|
||||
variant,
|
||||
}: RecordChipProps) => {
|
||||
const { mapToObjectRecordIdentifier } = useMapToObjectRecordIdentifier({
|
||||
const navigate = useNavigate();
|
||||
|
||||
const { recordChipData } = useRecordChipData({
|
||||
objectNameSingular,
|
||||
record,
|
||||
});
|
||||
|
||||
const objectRecordIdentifier = mapToObjectRecordIdentifier(record);
|
||||
const handleAvatarChipClick = (event: MouseEvent) => {
|
||||
const linkToShowPage = getLinkToShowPage(objectNameSingular, record);
|
||||
|
||||
if (isNonEmptyString(linkToShowPage)) {
|
||||
event.stopPropagation();
|
||||
navigate(linkToShowPage);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<EntityChip
|
||||
entityId={record.id}
|
||||
name={objectRecordIdentifier.name}
|
||||
avatarType={objectRecordIdentifier.avatarType}
|
||||
avatarUrl={objectRecordIdentifier.avatarUrl ?? ''}
|
||||
linkToEntity={objectRecordIdentifier.linkToShowPage}
|
||||
<AvatarChip
|
||||
placeholderColorSeed={record.id}
|
||||
name={recordChipData.name}
|
||||
avatarType={recordChipData.avatarType}
|
||||
avatarUrl={recordChipData.avatarUrl ?? ''}
|
||||
onClick={handleAvatarChipClick}
|
||||
className={className}
|
||||
variant={variant}
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user