diff --git a/plugins/catalog-react/src/components/EntityRefLink/EntityRefLink.tsx b/plugins/catalog-react/src/components/EntityRefLink/EntityRefLink.tsx index 79c3d1464f..7ebd828a4c 100644 --- a/plugins/catalog-react/src/components/EntityRefLink/EntityRefLink.tsx +++ b/plugins/catalog-react/src/components/EntityRefLink/EntityRefLink.tsx @@ -35,6 +35,8 @@ import { Card, CardActions, makeStyles, + Box, + Chip, } from '@material-ui/core'; import { usePopupState, @@ -71,9 +73,18 @@ const useStyles = makeStyles(() => { popoverPaper: { width: '30em', }, + descriptionTypography: { + overflow: 'hidden', + textOverflow: 'ellipsis', + display: '-webkit-box', + WebkitLineClamp: 2, + WebkitBoxOrient: 'vertical', + }, }; }); +const maxTagChips = 4; + export const PeekAheadPopover = ({ popupState, entityRef, @@ -126,8 +137,21 @@ export const PeekAheadPopover = ({ {entity ? ( <> {entity.kind} - {entity.metadata.description} + + {entity.metadata.description} + {entity.spec?.type} + + {(entity.metadata.tags || []).slice(0, maxTagChips).map(tag => { + return ; + })} + {entity.metadata.tags?.length && + entity.metadata.tags?.length > maxTagChips && ( + + + + )} + ) : ( <>