webui/src/modules/manager/users/components/usersTable.tsx

110 lines
3.2 KiB
TypeScript

import React, { useCallback, useMemo } from "react";
import { useTranslation } from "react-i18next";
import Column from "../../../../components/common/columns";
import Table, {
PublishedTableProps,
} from "../../../../components/common/Table";
import { GetUser } from "../services/usersService";
import Button, { ButtonType } from "../../../../components/common/Button";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faEnvelope } from "@fortawesome/free-solid-svg-icons";
import authentication from "../../../frame/services/authenticationService";
export interface UsersTableProps extends PublishedTableProps<GetUser> {
resendConfirmEmail?: (user: GetUser) => void;
}
const UsersTable: React.FC<UsersTableProps> = ({
data,
sortColumn,
onChangePage,
onSearch,
onDelete,
onSort,
resendConfirmEmail,
}) => {
const { t } = useTranslation();
const canResendConfirmMail = authentication.hasAccess("ResendConfirmMail");
const resendConfirmEmailHandler = useCallback(
(keyValue: GetUser) => {
if (resendConfirmEmail != null) resendConfirmEmail(keyValue);
},
[resendConfirmEmail],
);
const columns: Column<GetUser>[] = useMemo(
() => [
{ key: "displayName", label: t("Name"), order: "asc" },
{ key: "email", label: t("Email"), order: "asc" },
{ key: "domainName", label: t("Domain"), order: "asc" },
{ key: "created", label: t("Created"), order: "asc" },
{ key: "lastUpdated", label: t("LastUpdated"), order: "asc" },
{
key: "emailConfirmed",
label: t("ResendConfirm"),
order: "asc",
searchable: false,
content: (item) => {
if (!item.emailConfirmed && canResendConfirmMail) {
return (
<Button
buttonType={ButtonType.secondary}
onClick={() => resendConfirmEmailHandler(item)}
>
<FontAwesomeIcon icon={faEnvelope} /> {t("Confirm")}
</Button>
);
}
return <></>;
},
},
],
[t, canResendConfirmMail, resendConfirmEmailHandler],
);
const raiseSort = (sortCol: Column<GetUser>) => {
if (onSort !== undefined) onSort(sortCol);
};
const handleAuditParams = (item: any) => {
return {
entityName: "e_suite.Database.Core.Tables.UserManager.User",
primaryKey: `{"Id":${item.id}}`,
};
};
const canDelete = (item: GetUser) => {
const user = authentication.getCurrentUser();
return item.id !== user!.primarysid;
};
const editPath = authentication.hasAccess("EditUser")
? "edit/{0}"
: undefined;
const doDelete = authentication.hasAccess("DeleteUser")
? onDelete
: undefined;
const showAudit = authentication.hasAccess("ViewAuditLog")
? handleAuditParams
: undefined;
return (
<Table
data={data}
keyName="id"
columns={columns}
sortColumn={sortColumn}
editPath={editPath}
onSort={raiseSort}
onChangePage={onChangePage}
onSearch={onSearch}
onDelete={doDelete}
onAuditParams={showAudit}
canDelete={canDelete}
/>
);
};
export default UsersTable;