From eb341c59819ff9d3d82a514367efa4360fb1c94d Mon Sep 17 00:00:00 2001 From: esikkala <esko.ikkala@aalto.fi> Date: Thu, 10 Jan 2019 12:06:37 +0200 Subject: [PATCH] Add more formatting options for result table cells --- src/client/components/ResultTable.js | 2 ++ src/client/components/ResultTableCell.js | 28 ++++++++++---------- src/client/reducers/search.js | 33 +++++++++++++++++------- 3 files changed, 38 insertions(+), 25 deletions(-) diff --git a/src/client/components/ResultTable.js b/src/client/components/ResultTable.js index 7864cd01..d6738ca6 100644 --- a/src/client/components/ResultTable.js +++ b/src/client/components/ResultTable.js @@ -112,6 +112,8 @@ class ResultTable extends React.Component { valueType={column.valueType} makeLink={column.makeLink} sortValues={column.sortValues} + numberedList={column.numberedList} + minWidth={column.minWidth} /> ); })} diff --git a/src/client/components/ResultTableCell.js b/src/client/components/ResultTableCell.js index 8506b659..5a944e1d 100644 --- a/src/client/components/ResultTableCell.js +++ b/src/client/components/ResultTableCell.js @@ -27,12 +27,6 @@ const styles = () => ({ listStyle: 'none', paddingLeft: 0 }, - withFilter: { - //minWidth: 170 - }, - wideColumn: { - minWidth: 170 - }, infoIcon: { paddingTop: 15 }, @@ -69,12 +63,13 @@ const ResultTableCell = props => { } }; - const objectListRenderer = (cell, makeLink, ordered) => { + const objectListRenderer = (cell, makeLink, sortValues, numberedList) => { if (cell == null || cell === '-'){ return '-'; } else if (Array.isArray(cell)) { - cell = orderBy(cell, 'prefLabel'); + cell = sortValues ? orderBy(cell, 'prefLabel') : cell; + const listItems = cell.map((item, i) => <li key={i}> {makeLink && @@ -88,7 +83,7 @@ const ResultTableCell = props => { {!makeLink && item.prefLabel} </li> ); - if (ordered) { + if (numberedList) { return ( <ol className={props.classes.valueList}> {listItems} @@ -159,13 +154,13 @@ const ResultTableCell = props => { } }; - const ownerRenderer = cell => { + const ownerRenderer = (cell, makeLink, sortValues, numberedList) => { if (cell == null || cell === '-'){ return '-'; } if (Array.isArray(cell)) { if (!has(cell[0], 'order')) { - return objectListRenderer(cell, true, false); + return objectListRenderer(cell, makeLink, sortValues, numberedList); } cell.map(item => { Array.isArray(item.order) ? item.earliestOrder = item.order[0] : item.earliestOrder = item.order; @@ -192,7 +187,7 @@ const ResultTableCell = props => { ); } else { if (!has(cell, 'order')) { - return objectListRenderer(cell, true, false); + return objectListRenderer(cell, makeLink, sortValues, numberedList); } return ( <span>{cell.date}<br />{cell.location}</span> @@ -200,8 +195,9 @@ const ResultTableCell = props => { } }; - const { data, valueType, makeLink, sortValues } = props; + const { data, valueType, makeLink, sortValues, numberedList, minWidth } = props; let renderer = null; + let cellStyle = minWidth == null ? {} : { minWidth: minWidth }; switch (valueType) { case 'object': renderer = objectListRenderer; @@ -218,8 +214,8 @@ const ResultTableCell = props => { } return( - <TableCell> - {renderer(data, makeLink, sortValues)} + <TableCell style={cellStyle}> + {renderer(data, makeLink, sortValues, numberedList)} </TableCell> ); }; @@ -230,6 +226,8 @@ ResultTableCell.propTypes = { valueType: PropTypes.string.isRequired, makeLink: PropTypes.bool.isRequired, sortValues: PropTypes.bool.isRequired, + numberedList: PropTypes.bool.isRequired, + minWidth: PropTypes.number }; export default withStyles(styles)(ResultTableCell); diff --git a/src/client/reducers/search.js b/src/client/reducers/search.js index 39ad15c4..e201da16 100644 --- a/src/client/reducers/search.js +++ b/src/client/reducers/search.js @@ -17,55 +17,68 @@ export const INITIAL_STATE = { id: 'source', valueType: 'object', makeLink: true, - sortValues: false + sortValues: true, + numberedList: false }, { id: 'prefLabel', valueType: 'string', makeLink: false, - sortValues: true + sortValues: true, + numberedList: false }, { id: 'author', valueType: 'object', makeLink: true, - sortValues: true + sortValues: true, + numberedList: false, + minWidth: 170 }, { id: 'productionPlace', valueType: 'object', makeLink: true, - sortValues: true + sortValues: true, + numberedList: false, + minWidth: 170, }, { id: 'timespan', valueType: 'object', - makeLink: true, - sortValues: false + makeLink: false, + sortValues: true, + numberedList: false }, { id: 'language', valueType: 'string', - makeLink: true, - sortValues: true + makeLink: false, + sortValues: true, + numberedList: false }, // { // id: 'material', // valueType: 'string', // makeLink: true, // sortValues: true + // numberedList: false // }, { id: 'event', valueType: 'event', makeLink: true, - sortValues: true + sortValues: true, + numberedList: false, + minWidth: 170, }, { id: 'owner', valueType: 'owner', makeLink: true, - sortValues: true + sortValues: true, + numberedList: false, + minWidth: 170 } ], places: [], -- GitLab