diff --git a/src/client/components/facet_results/ObjectListCollapsible.js b/src/client/components/facet_results/ObjectListCollapsible.js index 1b3e92c7591068dcf4f93319e535a15cedd98518..d984cabb8964cdec7ac514a3e61e5685e5a8e2f9 100644 --- a/src/client/components/facet_results/ObjectListCollapsible.js +++ b/src/client/components/facet_results/ObjectListCollapsible.js @@ -53,7 +53,7 @@ const ObjectList = props => { return data } - const renderItem = ({ collapsed, itemData, isFirstValue = false }) => { + const renderItem = ({ addThreeDots, itemData, isFirstValue = false }) => { if (columnId === 'event') { return ( <> @@ -61,7 +61,7 @@ const ObjectList = props => { data={itemData} isFirstValue={isFirstValue} /> - {collapsed && <span> ...</span>} + {addThreeDots && <span> ...</span>} </> ) } else { @@ -75,7 +75,7 @@ const ObjectList = props => { isFirstValue={isFirstValue} collapsedMaxWords={collapsedMaxWords} /> - {collapsed && <span> ...</span>} + {addThreeDots && <span> ...</span>} {showSource && itemData.source && <ObjectListItemSources data={itemData.source} @@ -111,14 +111,14 @@ const ObjectList = props => { data = sortValues ? sortList(data) : data return ( <> - {!props.expanded && renderItem({ collapsed: true, itemData: data[0], isFirstValue: true })} + {!props.expanded && renderItem({ addThreeDots: true, itemData: data[0], isFirstValue: true })} <Collapse in={props.expanded} timeout='auto' unmountOnExit> {numberedList ? renderNumberedList(data) : renderBulletedList(data)} </Collapse> </> ) } else { - return renderItem({ collapsed: false, itemData: data, isFirstValue: true }) + return renderItem({ addThreeDots: data.shortenLabel, itemData: data }) } } diff --git a/src/client/components/facet_results/ObjectListItem.js b/src/client/components/facet_results/ObjectListItem.js index d0d883205a5c6cbf4cc2a647650d55adf6b29182..77435b1f5101bc62ff4680786eed0581279fc2d2 100644 --- a/src/client/components/facet_results/ObjectListItem.js +++ b/src/client/components/facet_results/ObjectListItem.js @@ -5,7 +5,7 @@ import ObjectListItemLink from './ObjectListItemLink' const ObjectListItem = props => { const { data, makeLink, externalLink, linkAsButton, isFirstValue, collapsedMaxWords } = props let label = Array.isArray(data.prefLabel) ? data.prefLabel[0] : data.prefLabel - if (isFirstValue && collapsedMaxWords) { + if ((isFirstValue || data.shortenLabel) && collapsedMaxWords) { const wordCount = label.split(' ').length if (wordCount > collapsedMaxWords) { label = label.trim().split(' ').splice(0, props.collapsedMaxWords).join(' ') diff --git a/src/client/components/facet_results/ResultTable.js b/src/client/components/facet_results/ResultTable.js index d0f108a1a054180298c014d58e9a0d5b387a7b13..ae1a353a662610c56846ecf70aae853b60be69af 100644 --- a/src/client/components/facet_results/ResultTable.js +++ b/src/client/components/facet_results/ResultTable.js @@ -203,13 +203,16 @@ class ResultTable extends React.Component { if (column.valueType === 'image' && Array.isArray(columnData)) { hasExpandableContent = false } - if (!isArray && - columnData !== '-' && - column.valueType === 'string' && - column.collapsedMaxWords && - columnData.split(' ').length > column.collapsedMaxWords - ) { - hasExpandableContent = true + // check if label should be shortened in ResultTableCell + if (!isArray && column.collapsedMaxWords && columnData !== '-') { + if (column.valueType === 'string' && columnData.split(' ').length > column.collapsedMaxWords) { + hasExpandableContent = true + columnData.shortenLabel = !expanded // shorten label only if the cell is not expanded + } + if (column.valueType === 'object' && columnData.prefLabel.split(' ').length > column.collapsedMaxWords) { + hasExpandableContent = true + columnData.shortenLabel = !expanded // shorten label only if the cell is not expanded + } } return ( <ResultTableCell