NuKVM/xen-orchestra
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(xo-web/sorted-table): "valuePath" property (#3607)

Browse Source 
Fixes #3606
This commit is contained in:
badrAZ 2018-10-30 09:42:13 +01:00 committed by Pierre Donias
parent 75b7726fca
commit de397b63c5
2 changed files with 25 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
packages/xo-web/src/common/sorted-table/index.js
View File

@ -18,6 +18,7 @@ import {
filter, filter,
findIndex, findIndex,
forEach, forEach,
get as getProperty,
isEmpty, isEmpty,
isFunction, isFunction,
map, map,
@ -288,13 +289,24 @@ export default class SortedTable extends Component {
.isRequired, .isRequired,
columns: PropTypes.arrayOf( columns: PropTypes.arrayOf(
PropTypes.shape({ PropTypes.shape({
component: PropTypes.func,
default: PropTypes.bool, default: PropTypes.bool,
name: PropTypes.node, name: PropTypes.node,
itemRenderer: PropTypes.func,
sortCriteria: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), sortCriteria: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
sortOrder: PropTypes.string, sortOrder: PropTypes.string,
textAlign: PropTypes.string, textAlign: PropTypes.string,
// for the cell render, you can use component or itemRenderer or valuePath
//
// item and userData will be injected in the component as props
// component: <Component />
component: PropTypes.func,
// itemRenderer: (item, userData) => <span />
itemRenderer: PropTypes.func,
// the path to the value, it's also the sort criteria default value
// valuePath: 'a.b.c'
valuePath: PropTypes.string,
}) })
).isRequired, ).isRequired,
filterContainer: PropTypes.func, filterContainer: PropTypes.func,
@ -426,9 +438,10 @@ export default class SortedTable extends Component {
) )
), ),
createSelector( createSelector(
() => this._getSelectedColumn().valuePath,
() => this._getSelectedColumn().sortCriteria, () => this._getSelectedColumn().sortCriteria,
this._getUserData, this._getUserData,
(sortCriteria, userData) => (valuePath, sortCriteria = valuePath, userData) =>
typeof sortCriteria === 'function' typeof sortCriteria === 'function'
? object => sortCriteria(object, userData) ? object => sortCriteria(object, userData)
: sortCriteria : sortCriteria
@ -748,10 +761,12 @@ export default class SortedTable extends Component {
const columns = map( const columns = map(
props.columns, props.columns,
({ component: Component, itemRenderer, textAlign }, key) => ( ({ component: Component, itemRenderer, valuePath, textAlign }, key) => (
<td className={textAlign && `text-xs-${textAlign}`} key={key}> <td className={textAlign && `text-xs-${textAlign}`} key={key}>
{Component !== undefined ? ( {Component !== undefined ? (
<Component item={item} userData={userData} /> <Component item={item} userData={userData} />
) : valuePath !== undefined ? (
getProperty(item, valuePath)
) : ( ) : (
itemRenderer(item, userData) itemRenderer(item, userData)
)} )}
@ -950,7 +965,11 @@ export default class SortedTable extends Component {
columnId={key} columnId={key}
key={key} key={key}
name={column.name} name={column.name}
sort={column.sortCriteria && this._sort} sort={
(column.sortCriteria !== undefined ||
column.valuePath !== undefined) &&
this._sort
}
sortIcon={ sortIcon={
state.selectedColumn === key ? state.sortOrder : 'sort' state.selectedColumn === key ? state.sortOrder : 'sort'
} }

3
packages/xo-web/src/xo-app/backup-ng/index.js
View File

@ -157,8 +157,7 @@ class JobsTable extends React.Component {
name: _('jobId'), name: _('jobId'),
}, },
{ {
itemRenderer: _ => _.name, valuePath: 'name',
sortCriteria: 'name',
name: _('jobName'), name: _('jobName'),
default: true, default: true,
}, },