Metamigo frontend updates

apps/leafcutter/tsconfig.json

@@ -1,11 +1,7 @@
 {
   "compilerOptions": {
     "target": "es5",
-    "lib": [
+    "lib": ["dom", "dom.iterable", "esnext"],
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
@@ -20,10 +16,7 @@
     "incremental": true,
     "baseUrl": ".",
     "paths": {
-      "@/*": [
+      "@/*": ["./*", "../../node_modules/*"]
-        "./*",
-        "../../node_modules/*"
-      ]
     },
     "plugins": [
       {
@@ -31,13 +24,6 @@
       }
     ]
   },
-  "include": [
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
-    "next-env.d.ts",
+  "exclude": ["node_modules", "babel__core"]
-    "**/*.ts",
-    "**/*.tsx",
-    ".next/types/**/*.ts"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
 }

apps/metamigo-frontend/app/_components/accounts/AccountEdit.tsx

@@ -27,7 +27,7 @@ type AccountEditToolbarProps = {
   record?: any;
 };
 
-const AccountEditToolbar: FC<AccountEditToolbarProps> = (props: any) => {
+const AccountEditToolbar: FC<AccountEditToolbarProps> = (props) => {
   const { data: session } = useSession();
   const classes = useStyles(props);
   return (
@@ -43,7 +43,7 @@ const AccountTitle = ({ record }: { record?: any }) => {
   return <span>Account {title}</span>;
 };
 
-export const AccountEdit = (props: EditProps) => (
+export const AccountEdit: FC<EditProps> = (props) => (
   <Edit title={<AccountTitle />} {...props}>
     <SimpleForm toolbar={<AccountEditToolbar />}>
       <TextInput disabled source="id" />
@@ -58,4 +58,5 @@ export const AccountEdit = (props: EditProps) => (
     </SimpleForm>
   </Edit>
 );
+
 export default AccountEdit;

apps/metamigo-frontend/app/_components/accounts/AccountList.tsx

@@ -16,7 +16,7 @@ type DeleteNotSelfButtonProps = {
   record?: any;
 };
 
-const DeleteNotSelfButton: FC<DeleteNotSelfButtonProps> = (props: any) => {
+const DeleteNotSelfButton: FC<DeleteNotSelfButtonProps> = (props) => {
   const { data: session } = useSession();
   return (
     // @ts-ignore
@@ -27,7 +27,7 @@ const DeleteNotSelfButton: FC<DeleteNotSelfButtonProps> = (props: any) => {
   );
 };
 
-export const AccountList = (props: ListProps) => (
+export const AccountList: FC<ListProps> = (props) => (
   <List {...props} exporter={false}>
     <Datagrid rowClick="edit">
       <ReferenceField source="userId" reference="users">

apps/metamigo-frontend/app/_components/layout/AppBar.tsx

@@ -42,14 +42,19 @@ const CustomUserMenu = (props: any) => (
 const CustomAppBar = (props: any) => {
   const classes = useStyles();
   return (
-    <AppBar {...props} elevation={1} userMenu={<CustomUserMenu />}>
+    <AppBar
+      {...props}
+      elevation={1}
+      userMenu={<CustomUserMenu />}
+      position="sticky"
+      sx={{ mt: -1 }}
+    >
       <Typography
         variant="h6"
         color="inherit"
         className={classes.title}
         id="react-admin-title"
       />
-      <span className={classes.spacer} />
     </AppBar>
   );
 };

apps/metamigo-frontend/app/_components/signal/bots/SignalBotCreate.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { FC } from "react";
 import {
   SimpleForm,
   Create,
@@ -10,7 +11,7 @@ import {
 import { useSession } from "next-auth/react";
 import { validateE164Number } from "../../../_lib/phone-numbers";
 
-const SignalBotCreate = (props: CreateProps) => {
+const SignalBotCreate:FC<CreateProps> = (props) => {
   const { data: session } = useSession();
 
   return (

apps/metamigo-frontend/app/_components/signal/bots/SignalBotEdit.tsx

@@ -1,8 +1,9 @@
 "use client";
 
+import { FC } from "react";
 import { SimpleForm, Edit, TextInput, required, EditProps } from "react-admin";
 
-const SignalBotEdit = (props: EditProps) => (
+const SignalBotEdit: FC<EditProps> = (props) => (
   <Edit {...props} title="Edit Bot">
     <SimpleForm>
       <TextInput disabled source="phoneNumber" validate={[required()]} />

apps/metamigo-frontend/app/_components/signal/bots/SignalBotList.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { FC } from "react";
 import {
   List,
   Datagrid,
@@ -9,7 +10,7 @@ import {
   ListProps,
 } from "react-admin";
 
-const SignalBotList = (props: ListProps) => (
+const SignalBotList: FC<ListProps> = (props) => (
   <List {...props} exporter={false}>
     <Datagrid rowClick="show">
       <TextField source="phoneNumber" />

apps/metamigo-frontend/app/_components/signal/bots/SignalBotShow.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useState } from "react";
+import { FC, useEffect, useState } from "react";
 import {
   Show,
   SimpleShowLayout,
@@ -175,7 +175,7 @@ const VerificationCodeRequest = ({
   onSuccess,
   onError,
 }: any) => {
-  React.useEffect(() => {
+  useEffect(() => {
     (async () => {
       await handleRequestCode({
         verifyMode,
@@ -209,8 +209,8 @@ const VerificationCaptcha = ({
   onError,
   handleClose,
 }: any) => {
-  const [code, setCode] = React.useState(undefined);
+  const [code, setCode] = useState(undefined);
-  const [isSubmitting, setSubmitting] = React.useState(false);
+  const [isSubmitting, setSubmitting] = useState(false);
 
   const handleSubmitVerification = async () => {
     setSubmitting(true);
@@ -271,10 +271,10 @@ const VerificationCodeInput = ({
   handleRestartVerification,
   confirmVerification,
 }: any) => {
-  const [code, setValue] = React.useState("");
+  const [code, setValue] = useState("");
-  const [isSubmitting, setSubmitting] = React.useState(false);
+  const [isSubmitting, setSubmitting] = useState(false);
-  const [isValid, setValid] = React.useState(false);
+  const [isValid, setValid] = useState(false);
-  const [submissionError, setSubmissionError] = React.useState(undefined);
+  const [submissionError, setSubmissionError] = useState(undefined);
   const translate = useTranslate();
 
   const validator = (v: any) => v.trim().length === 6;
@@ -361,7 +361,7 @@ const VerificationCodeInput = ({
 };
 
 const VerificationCodeDialog = (props: any) => {
-  const [stage, setStage] = React.useState("request");
+  const [stage, setStage] = useState("request");
   const onRequestSuccess = () => setStage("verify");
   const onRestartVerification = () => setStage("request");
   const handleClose = () => {
@@ -412,8 +412,8 @@ const VerificationCodeDialog = (props: any) => {
 };
 
 const SignalBotShowActions = ({ data }: any) => {
-  const [open, setOpen] = React.useState(false);
+  const [open, setOpen] = useState(false);
-  const [verifyMode, setVerifyMode] = React.useState("");
+  const [verifyMode, setVerifyMode] = useState("");
   const refresh = useRefresh();
 
   const handleOpenSMS = () => {
@@ -458,7 +458,7 @@ const SignalBotShowActions = ({ data }: any) => {
   );
 };
 
-const SignalBotShow = (props: ShowProps) => (
+const SignalBotShow: FC<ShowProps> = (props) => (
   <Show
     actions={<SignalBotShowActions />}
     {...props}

apps/metamigo-frontend/app/_components/signal/bots/shared.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { FC } from "react";
 /* eslint-disable react/display-name */
 import {
   SelectInput,
@@ -9,21 +10,25 @@ import {
   TextField,
 } from "react-admin";
 
-export const SignalBotSelectInput = (source: string) => () =>
+export const SignalBotSelectInput =
-  (
+  (source: string): FC =>
-    <ReferenceInput
+  () =>
-      label="Signal Bot"
+    (
-      source={source}
+      <ReferenceInput
-      reference="signalBots"
+        label="Signal Bot"
-      validate={[required()]}
+        source={source}
-    >
+        reference="signalBots"
-      <SelectInput optionText="phoneNumber" />
+        validate={[required()]}
-    </ReferenceInput>
+      >
-  );
+        <SelectInput optionText="phoneNumber" />
+      </ReferenceInput>
+    );
 
-export const SignalBotField = (source: string) => () =>
+export const SignalBotField =
-  (
+  (source: string): FC =>
-    <ReferenceField label="Signal Bot" reference="signalBots" source={source}>
+  () =>
-      <TextField source="phoneNumber" />
+    (
-    </ReferenceField>
+      <ReferenceField label="Signal Bot" reference="signalBots" source={source}>
-  );
+        <TextField source="phoneNumber" />
+      </ReferenceField>
+    );