mirror of
https://github.com/owncast/owncast.git
synced 2024-10-24 21:45:59 +03:00
b10ba1dcc2
* First pass at displaying user data in admin * Hide chat blurb on home page if chat is disabled * Hide sidebar chat section if chat is disabled * Block/unblock user interface for https://github.com/owncast/owncast/issues/1096 * Simplify past display name handling * Updates to reflect the api access token change * Update paths * Clean up the new access token page * Fix linter * Update linter workflow action * Cleanup * Fix exception rendering table row * Commit next-env file that seems to be required with next 11 * chat refactor - admin adjustments (#250) * add useragent parser; clean up some html; * some ui changes - use modal instead of popover to confirm block/unblock user - update styles, table styles for consistency - rename some user/chat labels in nav and content * format user info modal a bit * add some sort of mild treatment and delay while processing ban of users * rename button to 'ban' * add some notes * Prettified Code! * fix disableChat toggle for nav bar * Support sorting the disabled user list * Fix linter error around table sorting * No longer restoring messages on unban so change message prompt * Standardize on forbiddenUsername terminology * The linter broke the webhooks page. Fixed it. Linter is probably pissed. * Move chat welcome message to chat config * Other submenus don't have icons so remove these ones Co-authored-by: gingervitis <omqmail@gmail.com> Co-authored-by: gabek <gabek@users.noreply.github.com>
80 lines
2.4 KiB
TypeScript
80 lines
2.4 KiB
TypeScript
import { Table } from 'antd';
|
|
import { SortOrder } from 'antd/lib/table/interface';
|
|
import { ColumnsType } from 'antd/es/table';
|
|
import { formatDistanceToNow } from 'date-fns';
|
|
import { Client } from '../types/chat';
|
|
import UserPopover from './user-popover';
|
|
import BanUserButton from './ban-user-button';
|
|
import { formatUAstring } from '../utils/format';
|
|
|
|
export default function ClientTable({ data }: ClientTableProps) {
|
|
const columns: ColumnsType<Client> = [
|
|
{
|
|
title: 'Display Name',
|
|
key: 'username',
|
|
// eslint-disable-next-line react/destructuring-assignment
|
|
render: (client: Client) => {
|
|
const { user, connectedAt, messageCount, userAgent } = client;
|
|
const connectionInfo = { connectedAt, messageCount, userAgent };
|
|
return (
|
|
<UserPopover user={user} connectionInfo={connectionInfo}>
|
|
<span className="display-name">{user.displayName}</span>
|
|
</UserPopover>
|
|
);
|
|
},
|
|
sorter: (a: any, b: any) => a.user.displayName - b.user.displayName,
|
|
sortDirections: ['descend', 'ascend'] as SortOrder[],
|
|
},
|
|
{
|
|
title: 'Messages sent',
|
|
dataIndex: 'messageCount',
|
|
key: 'messageCount',
|
|
className: 'number-col',
|
|
sorter: (a: any, b: any) => a.messageCount - b.messageCount,
|
|
sortDirections: ['descend', 'ascend'] as SortOrder[],
|
|
},
|
|
{
|
|
title: 'Connected Time',
|
|
dataIndex: 'connectedAt',
|
|
key: 'connectedAt',
|
|
defaultSortOrder: 'ascend',
|
|
render: (time: Date) => formatDistanceToNow(new Date(time)),
|
|
sorter: (a: any, b: any) =>
|
|
new Date(a.connectedAt).getTime() - new Date(b.connectedAt).getTime(),
|
|
sortDirections: ['descend', 'ascend'] as SortOrder[],
|
|
},
|
|
{
|
|
title: 'User Agent',
|
|
dataIndex: 'userAgent',
|
|
key: 'userAgent',
|
|
render: (ua: string) => formatUAstring(ua),
|
|
},
|
|
{
|
|
title: 'Location',
|
|
dataIndex: 'geo',
|
|
key: 'geo',
|
|
render: geo => (geo ? `${geo.regionName}, ${geo.countryCode}` : '-'),
|
|
},
|
|
{
|
|
title: '',
|
|
key: 'block',
|
|
className: 'actions-col',
|
|
render: (_, row) => <BanUserButton user={row.user} isEnabled={!row.user.disabledAt} />,
|
|
},
|
|
];
|
|
|
|
return (
|
|
<Table
|
|
className="table-container"
|
|
pagination={{ hideOnSinglePage: true }}
|
|
columns={columns}
|
|
dataSource={data}
|
|
size="small"
|
|
rowKey="id"
|
|
/>
|
|
);
|
|
}
|
|
|
|
interface ClientTableProps {
|
|
data: Client[];
|
|
}
|