Organize directories

apps/metamigo-frontend/components/voice/providers/ProviderCreate.tsx

@@ -0,0 +1,33 @@
+import {
+  SimpleForm,
+  TextInput,
+  Create,
+  PasswordInput,
+  CreateProps,
+} from "react-admin";
+import { ProviderKindInput } from "./shared";
+
+import TextField from "@material-ui/core/TextField";
+
+const TwilioCredentialsInput = () => (
+  <span>
+    <TextField name="accountSid" label="Account Sid" />
+    <TextField name="authToken" label="Auth Token" />
+  </span>
+);
+
+const ProviderCreate = (props: CreateProps) => {
+  return (
+    <Create {...props} title="Create Providers">
+      <SimpleForm>
+        <ProviderKindInput />
+        <TextInput source="name" />
+        <TextInput source="credentials.accountSid" />
+        <TextInput source="credentials.apiKeySid" />
+        <PasswordInput source="credentials.apiKeySecret" />
+      </SimpleForm>
+    </Create>
+  );
+};
+
+export default ProviderCreate;

apps/metamigo-frontend/components/voice/providers/ProviderEdit.tsx

@@ -0,0 +1,31 @@
+import {
+  SimpleForm,
+  TextInput,
+  PasswordInput,
+  Edit,
+  EditProps,
+} from "react-admin";
+import { ProviderKindInput } from "./shared";
+
+const ProviderTitle = ({ record }: { record?: any }) => {
+  let title = "";
+  if (record) title = record.name ? record.name : record.email;
+  return <span>Provider {title}</span>;
+};
+
+const ProviderEdit = (props: EditProps) => {
+  return (
+    <Edit title={<ProviderTitle />} {...props}>
+      <SimpleForm>
+        <TextInput disabled source="id" />
+        <ProviderKindInput disabled />
+        <TextInput source="name" />
+        <TextInput source="credentials.accountSid" />
+        <TextInput source="credentials.apiKeySid" />
+        <PasswordInput source="credentials.apiKeySecret" />
+      </SimpleForm>
+    </Edit>
+  );
+};
+
+export default ProviderEdit;

apps/metamigo-frontend/components/voice/providers/ProviderList.tsx

@@ -0,0 +1,14 @@
+import { List, Datagrid, DateField, TextField, ListProps } from "react-admin";
+
+const ProviderList = (props: ListProps) => (
+  <List {...props} exporter={false}>
+    <Datagrid rowClick="edit">
+      <TextField source="kind" />
+      <TextField source="name" />
+      <DateField source="createdAt" />
+      <DateField source="updatedAt" />
+    </Datagrid>
+  </List>
+);
+
+export default ProviderList;

apps/metamigo-frontend/components/voice/providers/index.ts

@@ -0,0 +1,11 @@
+import ProviderIcon from "@material-ui/icons/Business";
+import ProviderList from "./ProviderList";
+import ProviderEdit from "./ProviderEdit";
+import ProviderCreate from "./ProviderCreate";
+
+export default {
+  list: ProviderList,
+  create: ProviderCreate,
+  edit: ProviderEdit,
+  icon: ProviderIcon,
+};

apps/metamigo-frontend/components/voice/providers/shared.tsx

@@ -0,0 +1,9 @@
+import { SelectInput } from "react-admin";
+
+export const ProviderKindInput = (props) => (
+  <SelectInput
+    source="kind"
+    choices={[{ id: "TWILIO", name: "Twilio" }]}
+    {...props}
+  />
+);