60 lines
1.9 KiB
TypeScript
60 lines
1.9 KiB
TypeScript
import { Table, TableBody, TableCaption, TableCell, TableHead, TableHeader, TableRow } from "@conusai-kit/ui/primitives"
|
|
// The imports applied so far. A server component: it holds no state, and every string is passed in.
|
|
|
|
import type { ReactElement } from "react"
|
|
import type { ImportView } from "../contract/index.js"
|
|
|
|
export interface ImportListLabels {
|
|
/** How many imports, already filled with the plural form. */
|
|
readonly count: string
|
|
readonly caption: string
|
|
readonly empty: string
|
|
readonly source: string
|
|
readonly status: string
|
|
readonly created: string
|
|
readonly updated: string
|
|
readonly unchanged: string
|
|
readonly refused: string
|
|
}
|
|
|
|
export function ImportList({
|
|
imports,
|
|
labels,
|
|
}: {
|
|
imports: readonly ImportView[]
|
|
labels: ImportListLabels
|
|
}): ReactElement {
|
|
return imports.length === 0 ? (
|
|
<p>{labels.empty}</p>
|
|
) : (
|
|
<>
|
|
<p>{labels.count}</p>
|
|
<Table>
|
|
<TableCaption>{labels.caption}</TableCaption>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead scope="col">{labels.source}</TableHead>
|
|
<TableHead scope="col">{labels.status}</TableHead>
|
|
<TableHead scope="col">{labels.created}</TableHead>
|
|
<TableHead scope="col">{labels.updated}</TableHead>
|
|
<TableHead scope="col">{labels.unchanged}</TableHead>
|
|
<TableHead scope="col">{labels.refused}</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{imports.map((row) => (
|
|
<TableRow key={row.importId}>
|
|
<TableHead scope="row">{row.sourceName}</TableHead>
|
|
<TableCell>{row.status}</TableCell>
|
|
<TableCell>{row.created}</TableCell>
|
|
<TableCell>{row.updated}</TableCell>
|
|
<TableCell>{row.unchanged}</TableCell>
|
|
<TableCell>{row.refused}</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
</>
|
|
)
|
|
}
|