forked from tl-its-umich-edu/canvas-course-manager-next
-
Notifications
You must be signed in to change notification settings - Fork 0
/
APIErrorsTable.tsx
42 lines (32 loc) · 1.32 KB
/
APIErrorsTable.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
import React, { useState } from 'react'
import CustomTable, { TableColumn } from './CustomTable.js'
import { ErrorDescription } from '../utils/handleErrors.js'
interface NumberedErrorDescription extends ErrorDescription {
rowNumber: number
}
const mainColumns: Array<TableColumn<NumberedErrorDescription>> = [
{ id: 'rowNumber', label: 'Error Number', minWidth: 25 },
{ id: 'input', label: 'Failed Input', minWidth: 50 },
{ id: 'errorText', label: 'Error Message', minWidth: 100 },
{ id: 'action', label: 'Recommended Action', minWidth: 100 }
]
const contextColumn: TableColumn<NumberedErrorDescription> = { id: 'context', label: 'Failed Process', minWidth: 100 }
interface APIErrorsTableProps {
errors: ErrorDescription[]
includeContext?: boolean
}
function APIErrorsTable (props: APIErrorsTableProps): JSX.Element {
const [page, setPage] = useState<number>(0)
const columnsToUse = props.includeContext === true
? [...mainColumns.slice(0, 1), contextColumn, ...mainColumns.slice(1)]
: mainColumns
const tableRows = props.errors.map((e, i) => ({ ...e, rowNumber: i + 1 }))
const caption = `${props.errors.length} API errors occurred.`
return (
<CustomTable<NumberedErrorDescription>
columns={columnsToUse}
{...{ tableRows, page, setPage, caption }}
/>
)
}
export default APIErrorsTable