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

69 lines
1.6 KiB
TypeScript
Raw Normal View History

2023-05-25 14:36:08 +00:00
import { makeStyles } from "@mui/styles";
2023-02-13 12:41:30 +00:00
import {
SimpleForm,
TextInput,
BooleanInput,
DateInput,
Edit,
Toolbar,
SaveButton,
DeleteButton,
useRedirect,
useRecordContext,
2023-02-13 12:41:30 +00:00
} from "react-admin";
import { useSession } from "next-auth/react";
import { UserRoleInput } from "./shared";
2023-05-25 07:03:57 +00:00
const useStyles = makeStyles((_theme: any) => ({
2023-02-13 12:41:30 +00:00
defaultToolbar: {
flex: 1,
display: "flex",
justifyContent: "space-between",
},
}));
2023-03-14 17:40:24 +00:00
const UserEditToolbar = (props: any) => {
const classes = useStyles();
2023-02-13 12:41:30 +00:00
const redirect = useRedirect();
const record = useRecordContext();
const {session} = props;
const shouldDisableDelete = !session || !session.user || session.user.id === record.id;
2023-02-13 12:41:30 +00:00
return (
<Toolbar className={classes.defaultToolbar}>
2023-02-13 12:41:30 +00:00
<SaveButton
label="save"
2023-03-15 12:17:43 +00:00
mutationOptions={{ onSuccess: () => redirect("/users") }}
2023-02-13 12:41:30 +00:00
/>
<DeleteButton disabled={shouldDisableDelete} />
2023-02-13 12:41:30 +00:00
</Toolbar>
);
};
const UserTitle = ({ record }: { record?: any }) => {
let title = "";
2023-03-15 12:17:43 +00:00
if (record) title = record.name ?? record.email;
2023-02-13 12:41:30 +00:00
return <span>User {title}</span>;
};
const UserEdit = () => {
2023-02-13 12:41:30 +00:00
const { data: session } = useSession();
return (
<Edit title={<UserTitle />}>
2023-02-13 12:41:30 +00:00
<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;