Table cell sorting: add optional type conversion

src/client/components/facet_results/ObjectListCollapsible.js

@@ -30,7 +30,7 @@ const styles = () => ({
 
 const ObjectListCollapsible = props => {
   const {
-    sortValues, sortBy, makeLink, externalLink, linkAsButton, columnId, showSource,
+    sortValues, sortBy, sortByConvertDataTypeTo, makeLink, externalLink, linkAsButton, columnId, showSource,
     sourceExternalLink, numberedList, collapsedMaxWords, classes, shortenLabel
   } = props
   let { data } = props
@@ -46,6 +46,11 @@ const ObjectListCollapsible = props => {
     } else if (props.columnId === 'event') {
       data = orderBy(data, 'date')
     } else if (props.sortBy) {
+      if (sortByConvertDataTypeTo && sortByConvertDataTypeTo === 'integer') {
+        data.forEach(item => {
+          item[sortBy] = parseInt(item[sortBy])
+        })
+      }
       data = orderBy(data, sortBy)
     } else {
       data = orderBy(data, 'prefLabel')

src/client/components/facet_results/ResultTable.js

@@ -189,7 +189,7 @@ class ResultTable extends React.Component {
     let renderExpandButton
     const dataCells = this.props.data.properties.map(column => {
       const {
-        id, valueType, makeLink, externalLink, sortValues, sortBy, numberedList, minWidth,
+        id, valueType, makeLink, externalLink, sortValues, sortBy, sortByConvertDataTypeTo, numberedList, minWidth,
         height, linkAsButton, collapsedMaxWords, showExtraCollapseButton, sourceExternalLink, renderAsHTML, HTMLParserTask
       } = column
       let { previewImageHeight } = column
@@ -234,6 +234,7 @@ class ResultTable extends React.Component {
           externalLink={externalLink}
           sortValues={sortValues}
           sortBy={sortBy}
+          sortByConvertDataTypeTo={sortByConvertDataTypeTo}
           numberedList={numberedList}
           height={height}
           minWidth={minWidth}

src/client/components/facet_results/ResultTableCell.js

@@ -8,8 +8,8 @@ import ImageGallerySRL from '../main_layout/ImageGallerySRL'
 
 const ResultTableCell = props => {
   const {
-    data, tableData, valueType, makeLink, externalLink, sortValues, sortBy, numberedList, minWidth,
-    height, container, columnId, expanded, linkAsButton, collapsedMaxWords, showSource,
+    data, tableData, valueType, makeLink, externalLink, sortValues, sortBy, sortByConvertDataTypeTo,
+    numberedList, minWidth, height, container, columnId, expanded, linkAsButton, collapsedMaxWords, showSource,
     sourceExternalLink, renderAsHTML, HTMLParserTask, referencedTerm, previewImageHeight,
     onExpandClick, showExtraCollapseButton, rowId, shortenLabel = false
   } = props
@@ -30,6 +30,7 @@ const ResultTableCell = props => {
           externalLink={externalLink}
           sortValues={sortValues}
           sortBy={sortBy}
+          sortByConvertDataTypeTo={sortByConvertDataTypeTo}
           numberedList={numberedList}
           rowId={rowId}
           columnId={columnId}

src/client/components/main_layout/InstancePageTable.js

@@ -139,7 +139,7 @@ class InstancePageTable extends React.Component {
                 const label = intl.get(`perspectives.${perspectiveID}.properties.${row.id}.label`)
                 const description = intl.get(`perspectives.${perspectiveID}.properties.${row.id}.description`)
                 const {
-                  id, valueType, makeLink, externalLink, sortValues, sortBy, numberedList, minWidth,
+                  id, valueType, makeLink, externalLink, sortValues, sortBy, sortByConvertDataTypeTo, numberedList, minWidth,
                   linkAsButton, collapsedMaxWords, showSource, sourceExternalLink, renderAsHTML, HTMLParserTask
                 } = row
                 let { previewImageHeight } = row
@@ -185,6 +185,7 @@ class InstancePageTable extends React.Component {
                       externalLink={externalLink}
                       sortValues={sortValues}
                       sortBy={sortBy}
+                      sortByConvertDataTypeTo={sortByConvertDataTypeTo}
                       numberedList={numberedList}
                       minWidth={minWidth}
                       previewImageHeight={previewImageHeight}