wassname/Open-Assistant
1
0
Fork 0
mirror of https://github.com/wassname/Open-Assistant.git synced 2026-07-21 12:20:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

handle error

Browse Source
This commit is contained in:
notmd
2023-01-21 23:56:21 +07:00
parent aebfaacac8
commit 15acd1c64e
2 changed files with 64 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website/src/components/DataTable.tsx
+49 -45
View File
@@ -1,6 +1,8 @@
import {
Box,
Button,
Card,
CardBody,
Flex,
FormControl,
FormLabel,
@@ -77,51 +79,53 @@ export const DataTable = <T,>({
onFilterChange(newValues);
};
return (
<>
<Flex mb="2">
<Button onClick={onPreviousClick} disabled={disablePrevious}>
Previous
</Button>
<Spacer />
<Button onClick={onNextClick} disabled={disableNext}>
Next
</Button>
</Flex>
<TableContainer>
<Table variant="simple">
<TableCaption>{caption}</TableCaption>
<Thead>
{getHeaderGroups().map((headerGroup) => (
<Tr key={headerGroup.id}>
{headerGroup.headers.map((header) => (
<Th key={header.id}>
<Box display="flex" alignItems="center">
{header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}
{(header.column.columnDef as DataTableColumnDef<T>).filterable && (
<FilterModal
value={filterValues.find((value) => value.id === header.id)?.value ?? ""}
onChange={(value) => handleFilterChange({ id: header.id, value })}
label={flexRender(header.column.columnDef.header, header.getContext())}
></FilterModal>
)}
</Box>
</Th>
))}
</Tr>
))}
</Thead>
<Tbody>
{getRowModel().rows.map((row) => (
<Tr key={row.id}>
{row.getVisibleCells().map((cell) => (
<Td key={cell.id}>{flexRender(cell.column.columnDef.cell, cell.getContext())}</Td>
))}
</Tr>
))}
</Tbody>
</Table>
</TableContainer>
</>
<Card>
<CardBody>
<Flex mb="2">
<Button onClick={onPreviousClick} disabled={disablePrevious}>
Previous
</Button>
<Spacer />
<Button onClick={onNextClick} disabled={disableNext}>
Next
</Button>
</Flex>
<TableContainer>
<Table variant="simple">
<TableCaption>{caption}</TableCaption>
<Thead>
{getHeaderGroups().map((headerGroup) => (
<Tr key={headerGroup.id}>
{headerGroup.headers.map((header) => (
<Th key={header.id}>
<Box display="flex" alignItems="center">
{header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}
{(header.column.columnDef as DataTableColumnDef<T>).filterable && (
<FilterModal
value={filterValues.find((value) => value.id === header.id)?.value ?? ""}
onChange={(value) => handleFilterChange({ id: header.id, value })}
label={flexRender(header.column.columnDef.header, header.getContext())}
></FilterModal>
)}
</Box>
</Th>
))}
</Tr>
))}
</Thead>
<Tbody>
{getRowModel().rows.map((row) => (
<Tr key={row.id}>
{row.getVisibleCells().map((cell) => (
<Td key={cell.id}>{flexRender(cell.column.columnDef.cell, cell.getContext())}</Td>
))}
</Tr>
))}
</Tbody>
</Table>
</TableContainer>
</CardBody>
</Card>
);
};
website/src/components/UserTable.tsx
+15 -19
View File
@@ -1,4 +1,4 @@
import { Card, CardBody, IconButton } from "@chakra-ui/react";
import { IconButton } from "@chakra-ui/react";
import { createColumnHelper } from "@tanstack/react-table";
import Link from "next/link";
import { memo, useState } from "react";
@@ -90,23 +90,19 @@ export const UserTable = memo(function UserTable() {
};
return (
<Card>
<CardBody>
{data && (
<DataTable
data={data.items}
columns={columns}
caption="Users"
onNextClick={toNextPage}
onPreviousClick={toPreviousPage}
disableNext={!data.next}
disablePrevious={!data.prev}
filterValues={filterValues}
onFilterChange={handleFilterValuesChange}
></DataTable>
)}
{error && "Unable to load users."}
</CardBody>
</Card>
<>
<DataTable
data={data?.items || []}
columns={columns}
caption="Users"
onNextClick={toNextPage}
onPreviousClick={toPreviousPage}
disableNext={!data?.next}
disablePrevious={!data?.prev}
filterValues={filterValues}
onFilterChange={handleFilterValuesChange}
></DataTable>
{error && "Unable to load users."}
</>
);
});