Initial dev on DataTable component.

This commit is contained in:
Mike Cao 2023-08-25 11:54:44 -07:00
parent 7107336b49
commit d6a27b8e99
19 changed files with 223 additions and 53 deletions

View file

@ -1,11 +1,78 @@
import Link from 'next/link';
import { Button, Text, Icon, Icons } from 'react-basics';
import { Button, Text, Icon, Icons, GridTable, GridColumn } from 'react-basics';
import SettingsTable from 'components/common/SettingsTable';
import Empty from 'components/common/Empty';
import useMessages from 'components/hooks/useMessages';
import useUser from 'components/hooks/useUser';
import DataTable, { DataTableStyles } from 'components/common/DataTable';
export function WebsitesTable({
data = [],
filterValue,
showTeam,
showEditButton,
openExternal = false,
onChange,
}) {
const { formatMessage, labels } = useMessages();
const { user } = useUser();
const showTable = data && (filterValue || data?.data?.length !== 0);
return (
<DataTable onChange={onChange}>
{showTable && (
<GridTable data={data?.data}>
<GridColumn name="name" label={formatMessage(labels.name)} />
<GridColumn name="domain" label={formatMessage(labels.domain)} />
{showTeam && (
<GridColumn name="teamName" label={formatMessage(labels.teamName)}>
{row => row.teamWebsite[0]?.team.name}
</GridColumn>
)}
{showTeam && (
<GridColumn name="owner" label={formatMessage(labels.owner)}>
{row => row.user.username}
</GridColumn>
)}
<GridColumn name="action" label=" " className={DataTableStyles.action}>
{row => {
const {
id,
user: { id: ownerId },
} = row;
return (
<>
{showEditButton && (!showTeam || ownerId === user.id) && (
<Link href={`/settings/websites/${id}`}>
<Button>
<Icon>
<Icons.Edit />
</Icon>
<Text>{formatMessage(labels.edit)}</Text>
</Button>
</Link>
)}
<Link href={`/websites/${id}`} target={openExternal ? '_blank' : null}>
<Button>
<Icon>
<Icons.External />
</Icon>
<Text>{formatMessage(labels.view)}</Text>
</Button>
</Link>
</>
);
}}
</GridColumn>
</GridTable>
)}
</DataTable>
);
}
export function WebsitesTable2({
data = [],
filterValue,
onFilterChange,