link-stack/apps/metamigo-frontend/components/users/UserEdit.tsx

68 lines
1.6 KiB
TypeScript

import { makeStyles } from "@mui/styles";
import {
SimpleForm,
TextInput,
BooleanInput,
DateInput,
Edit,
Toolbar,
SaveButton,
DeleteButton,
useRedirect,
useRecordContext,
} from "react-admin";
import { useSession } from "next-auth/react";
import { UserRoleInput } from "./shared";
const useStyles = makeStyles((_theme: any) => ({
defaultToolbar: {
flex: 1,
display: "flex",
justifyContent: "space-between",
},
}));
const UserEditToolbar = (props: any) => {
const classes = useStyles();
const redirect = useRedirect();
const record = useRecordContext();
const {session} = props;
const shouldDisableDelete = !session || !session.user || session.user.id === record.id;
return (
<Toolbar className={classes.defaultToolbar}>
<SaveButton
label="save"
mutationOptions={{ onSuccess: () => redirect("/users") }}
/>
<DeleteButton disabled={shouldDisableDelete} />
</Toolbar>
);
};
const UserTitle = ({ record }: { record?: any }) => {
let title = "";
if (record) title = record.name ?? record.email;
return <span>User {title}</span>;
};
const UserEdit = () => {
const { data: session } = useSession();
return (
<Edit title={<UserTitle />}>
<SimpleForm toolbar={<UserEditToolbar session={session} />}>
<TextInput disabled source="id" />
<TextInput source="email" />
<TextInput source="name" />
<UserRoleInput session={session} />
<DateInput source="emailVerified" />
<BooleanInput source="isActive" />
<TextInput source="createdBy" />
</SimpleForm>
</Edit>
);
};
export default UserEdit;