cspace-ui
Version:
CollectionSpace user interface for browsers
71 lines (70 loc) • 2.05 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = SearchResultTableHeader;
var _react = _interopRequireDefault(require("react"));
var _reactRouterDom = require("react-router-dom");
var _propTypes = _interopRequireDefault(require("prop-types"));
var _qs = _interopRequireDefault(require("qs"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const propTypes = {
column: _propTypes.default.shape({
dataKey: _propTypes.default.string,
formatValue: _propTypes.default.func,
label: _propTypes.default.func
}),
sort: _propTypes.default.string
};
function SearchResultTableHeader({
column,
sort
}) {
const history = (0, _reactRouterDom.useHistory)();
const location = (0, _reactRouterDom.useLocation)();
function handleSortChange() {
let newSort;
if (sort === undefined || sort === 'desc') {
newSort = '';
} else {
newSort = ' desc';
}
const {
search
} = location;
const query = _qs.default.parse(search.substring(1));
query.sort = `${column.dataKey}${newSort}`;
const queryString = _qs.default.stringify(query);
history.push({
pathname: location.pathname,
search: `?${queryString}`,
state: location.state
});
}
let arrow;
if (sort === 'asc') {
arrow = /*#__PURE__*/_react.default.createElement("svg", {
width: 16,
height: 16,
viewBox: "0 0 24 24"
}, /*#__PURE__*/_react.default.createElement("path", {
d: "M 7 14 l5-5 5 5 z"
}));
} else if (sort === 'desc') {
arrow = /*#__PURE__*/_react.default.createElement("svg", {
width: 16,
height: 16,
viewBox: "0 0 24 24"
}, /*#__PURE__*/_react.default.createElement("path", {
d: "M 7 14 l5 5 5-5 z"
}));
}
return /*#__PURE__*/_react.default.createElement("th", {
style: {
textAlign: 'left'
},
onClick: () => handleSortChange(),
tabIndex: 0
}, column.label(), arrow);
}
SearchResultTableHeader.propTypes = propTypes;