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>
65 lines
1.9 KiB
TypeScript
65 lines
1.9 KiB
TypeScript
import { Table } from 'antd';
|
|
import format from 'date-fns/format';
|
|
import { SortOrder } from 'antd/lib/table/interface';
|
|
import { User } from '../types/chat';
|
|
import UserPopover from './user-popover';
|
|
import BanUserButton from './ban-user-button';
|
|
|
|
export function formatDisplayDate(date: string | Date) {
|
|
return format(new Date(date), 'MMM d H:mma');
|
|
}
|
|
export default function UserTable({ data }: UserTableProps) {
|
|
const columns = [
|
|
{
|
|
title: 'Last Known Display Name',
|
|
dataIndex: 'displayName',
|
|
key: 'displayName',
|
|
// eslint-disable-next-line react/destructuring-assignment
|
|
render: (displayName: string, user: User) => (
|
|
<UserPopover user={user}>
|
|
<span className="display-name">{displayName}</span>
|
|
</UserPopover>
|
|
),
|
|
},
|
|
{
|
|
title: 'Created',
|
|
dataIndex: 'createdAt',
|
|
key: 'createdAt',
|
|
render: (date: Date) => formatDisplayDate(date),
|
|
sorter: (a: any, b: any) => new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime(),
|
|
sortDirections: ['descend', 'ascend'] as SortOrder[],
|
|
},
|
|
{
|
|
title: 'Disabled at',
|
|
dataIndex: 'disabledAt',
|
|
key: 'disabledAt',
|
|
defaultSortOrder: 'descend' as SortOrder,
|
|
render: (date: Date) => (date ? formatDisplayDate(date) : null),
|
|
sorter: (a: any, b: any) =>
|
|
new Date(a.disabledAt).getTime() - new Date(b.disabledAt).getTime(),
|
|
sortDirections: ['descend', 'ascend'] as SortOrder[],
|
|
},
|
|
{
|
|
title: '',
|
|
key: 'block',
|
|
className: 'actions-col',
|
|
render: (_, user) => <BanUserButton user={user} isEnabled={!user.disabledAt} />,
|
|
},
|
|
];
|
|
|
|
return (
|
|
<Table
|
|
pagination={{ hideOnSinglePage: true }}
|
|
className="table-container"
|
|
columns={columns}
|
|
dataSource={data}
|
|
size="small"
|
|
rowKey="id"
|
|
/>
|
|
);
|
|
}
|
|
|
|
interface UserTableProps {
|
|
data: User[];
|
|
}
|