Flatten

apps/link/app/(main)/admin/metamigo/_components/users/UserCreate.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import { FC } from "react";
+import {
+  SimpleForm,
+  TextInput,
+  BooleanInput,
+  Create,
+  CreateProps,
+} from "react-admin";
+import { useSession } from "next-auth/react";
+import { UserRoleInput } from "./shared";
+
+const UserCreate: FC<CreateProps> = () => {
+  const { data: session } = useSession();
+  return (
+    <Create title="Create Users">
+      <SimpleForm>
+        <TextInput source="email" />
+        <TextInput source="name" />
+        <UserRoleInput session={session} initialValue="NONE" />
+        <BooleanInput source="isActive" defaultValue={true} />
+        <TextInput source="createdBy" defaultValue={session?.user?.name} />
+      </SimpleForm>
+    </Create>
+  );
+};
+
+export default UserCreate;

apps/link/app/(main)/admin/metamigo/_components/users/UserEdit.tsx

@@ -0,0 +1,73 @@
+"use client";
+
+// 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: any = {}; // = 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;

apps/link/app/(main)/admin/metamigo/_components/users/UserList.tsx

@@ -0,0 +1,30 @@
+"use client";
+
+import { FC } from "react";
+import {
+  List,
+  Datagrid,
+  ImageField,
+  DateField,
+  TextField,
+  EmailField,
+  BooleanField,
+} from "react-admin";
+
+const UserList: FC = () => (
+  <List exporter={false}>
+    <Datagrid rowClick="edit">
+      <EmailField source="email" />
+      <DateField source="emailVerified" />
+      <TextField source="name" />
+      <ImageField source="avatar" />
+      <TextField source="userRole" />
+      <BooleanField source="isActive" />
+      <DateField source="createdAt" />
+      <DateField source="updatedAt" />
+      <TextField source="createdBy" />
+    </Datagrid>
+  </List>
+);
+
+export default UserList;

apps/link/app/(main)/admin/metamigo/_components/users/index.ts

@@ -0,0 +1,14 @@
+"use client";
+
+import UserIcon from "@mui/icons-material/People";
+import UserList from "./UserList";
+import UserEdit from "./UserEdit";
+import UserCreate from "./UserCreate";
+
+// eslint-disable-next-line import/no-anonymous-default-export
+export default {
+  list: UserList,
+  create: UserCreate,
+  edit: UserEdit,
+  icon: UserIcon,
+};

apps/link/app/(main)/admin/metamigo/_components/users/shared.tsx

@@ -0,0 +1,19 @@
+"use client";
+
+import { SelectInput, useRecordContext } from "react-admin";
+
+export const UserRoleInput = (props: any) => {
+  const record = useRecordContext();
+  return (
+    <SelectInput
+      source="userRole"
+      choices={[
+        { id: "NONE", name: "None" },
+        { id: "USER", name: "User" },
+        { id: "ADMIN", name: "Admin" },
+      ]}
+      disabled={props.session.user.id === record.id}
+      {...props}
+    />
+  );
+};