Skip to content
Jump to bottom

Enhancement default sort order #161

Merged
merged 8 commits into from
Feb 2, 2021
Merged

Enhancement default sort order #161

Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
bb68f11
Implement logic for default sorting order of ItemTable
wrigh393 Jan 8, 2021
7373d88
Removed uncessary desc key from intialState.sortBy in the table optio…
wrigh393 Jan 8, 2021
ea9dec3
Removed unecesssary classes/props
wrigh393 Jan 12, 2021
02b9990
Removed unecessary class
wrigh393 Jan 12, 2021
55df82b
Added queue as one of the default sort props
wrigh393 Feb 1, 2021
9b8c010
Implemented InvertedSort prop for LastUpdated and DateRecieved columns
wrigh393 Feb 1, 2021
75b2ff3
Update venv-manager to allow 60 second for requirement installation
campb303 Feb 1, 2021
7af8823
Merge branch 'staging' into enhancement-default-sort-order
campb303 Feb 2, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 15 additions & 3 deletions src/components/ItemTable/ItemTable.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,8 @@ export default function ItemTable({ data, rowCanBeSelected }) {
const classes = useStyles();

const history = useHistory();

// See React Table Column Settings: https://react-table.tanstack.com/docs/api/useTable#column-properties
const columns = React.useMemo(
() => [
{ Header: 'Queue', accessor: 'queue', },
Expand All @@ -46,12 +48,15 @@ export default function ItemTable({ data, rowCanBeSelected }) {
{ Header: 'Subject', accessor: 'subject' },
{ Header: 'Status', accessor: 'status', },
{ Header: 'Priority', accessor: 'priority' },
{ Header: 'Last Updated', accessor: 'lastUpdated', sortInverted: true, Cell: ({ value }) => <RelativeTime value={value} /> },
{ Header: 'Department', accessor: 'department' },
{ Header: 'Building', accessor: 'building' },
{ Header: 'Date Received', accessor: 'dateReceived', sortInverted: true, Cell: ({ value }) => <RelativeTime value={value} /> },
{ Header: 'Last Updated', accessor: 'lastUpdated', },
{ Header: 'Department', accessor: 'department' },
{ Header: 'Building', accessor: 'building' },
{ Header: 'Date Received', accessor: 'dateReceived', },
], []);

const tableInstance = useTable(
{
columns,
Expand All @@ -68,13 +73,20 @@ export default function ItemTable({ data, rowCanBeSelected }) {
);
},
},
initialState: {
sortBy: [
{ id: "queue" },
{ id: 'number' },
{ id: 'lastUpdated' },
],
}
},
useFilters, useFlexLayout, useSortBy,
useFilters, useFlexLayout, useSortBy,
);
const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow, } = tableInstance;

return (
<TableContainer component={Paper}>
<TableContainer>
<Table
{...getTableProps}
aria-label="Table of Queue Items"
Expand Down