@@ -5,6 +5,8 @@ import { useGetSearchResultsLazyQuery } from '../../../../../../../graphql/searc
5
5
import { Container , Entity , EntityType } from '../../../../../../../types.generated' ;
6
6
import { useEnterKeyListener } from '../../../../../../shared/useEnterKeyListener' ;
7
7
import { useEntityRegistry } from '../../../../../../useEntityRegistry' ;
8
+ import { getParentEntities } from '../../../../../../search/filters/utils' ;
9
+ import ParentEntities from '../../../../../../search/filters/ParentEntities' ;
8
10
9
11
type Props = {
10
12
onCloseModal : ( ) => void ;
@@ -26,14 +28,18 @@ const StyleTag = styled(Tag)`
26
28
align-items: center;
27
29
` ;
28
30
29
- const PreviewImage = styled . img `
31
+ export const PreviewImage = styled . img `
30
32
max-height: 18px;
31
33
width: auto;
32
34
object-fit: contain;
33
35
background-color: transparent;
34
36
margin-right: 4px;
35
37
` ;
36
38
39
+ export const ParentWrapper = styled . div `
40
+ max-width: 400px;
41
+ ` ;
42
+
37
43
export const ContainerSelectModal = ( { onCloseModal, defaultValues, onOkOverride, titleOverride } : Props ) => {
38
44
const [ containerSearch , { data : platforSearchData } ] = useGetSearchResultsLazyQuery ( ) ;
39
45
const entityRegistry = useEntityRegistry ( ) ;
@@ -65,10 +71,16 @@ export const ContainerSelectModal = ({ onCloseModal, defaultValues, onOkOverride
65
71
// Renders a search result in the select dropdown.
66
72
const renderSearchResult = ( entity : Container ) => {
67
73
const displayName = entityRegistry . getDisplayName ( EntityType . Container , entity ) ;
74
+ const parentEntities : Entity [ ] = getParentEntities ( entity as Entity ) || [ ] ;
68
75
69
76
const truncatedDisplayName = displayName . length > 25 ? `${ displayName . slice ( 0 , 25 ) } ...` : displayName ;
70
77
return (
71
78
< Tooltip title = { displayName } >
79
+ { parentEntities . length > 0 && (
80
+ < ParentWrapper >
81
+ < ParentEntities parentEntities = { parentEntities } />
82
+ </ ParentWrapper >
83
+ ) }
72
84
< PreviewImage src = { entity . platform ?. properties ?. logoUrl || undefined } alt = { entity . properties ?. name } />
73
85
< span > { truncatedDisplayName } </ span >
74
86
</ Tooltip >
0 commit comments