Implement searching and filtering for all records

src/components/applications/ApplicationFilter.js

@@ -0,0 +1,11 @@
+import React from "react";
+import { Filter, TextInput } from "react-admin";
+
+const ApplicationFilter = (props) => (
+  <Filter {...props}>
+    <TextInput label="Search by Name" source="applicationName" alwaysOn />
+    <TextInput label="Search by Organization" source="organizationName" />
+  </Filter>
+);
+
+export default ApplicationFilter;

src/components/applications/ApplicationList.js

@@ -1,17 +1,8 @@
 import React from "react";
 import { useMediaQuery } from "@material-ui/core";
-import {
-  List,
-  Datagrid,
-  TextField,
-  SimpleList,
-  Pagination,
-  ReferenceField,
-} from "react-admin";
-
-const ApplicationPagination = (props) => (
-  <Pagination rowsPerPageOptions={[10, 25, 50]} {...props} />
-);
+import { List, Datagrid, TextField, SimpleList } from "react-admin";
+import ApplicationFilter from "./ApplicationFilter";
+import Pagination from "../pagination";
 
 const ApplicationList = (props) => {
   const isSmall = useMediaQuery((theme) => theme.breakpoints.down("sm"));
@@ -20,7 +11,8 @@ const ApplicationList = (props) => {
     <List
       label="Applications"
       title="Applications"
-      pagination={<ApplicationPagination />}
+      pagination={<Pagination />}
+      filters={<ApplicationFilter />}
       {...props}
     >
       {isSmall ? (
@@ -31,14 +23,7 @@ const ApplicationList = (props) => {
       ) : (
         <Datagrid rowClick="show">
           <TextField label="Name" source="applicationName" />
-          <ReferenceField
-            link="show"
-            label="Organization"
-            source="orgId"
-            reference="Organizations"
-          >
-            <TextField label="Organization Name" source="organizationName" />
-          </ReferenceField>
+          <TextField label="Organization Name" source="organizationName" />
         </Datagrid>
       )}
     </List>

src/components/msadmins/AdminFilter.js

@@ -0,0 +1,12 @@
+import React from "react";
+import { Filter, TextInput } from "react-admin";
+
+const AdminFilter = (props) => (
+  <Filter {...props}>
+    <TextInput label="Search by Name" source="fullname" alwaysOn />
+    <TextInput label="Search by Email" source="email" />
+    <TextInput label="Search by Role" source="role" />
+  </Filter>
+);
+
+export default AdminFilter;

src/components/msadmins/AdminList.js

@@ -1,22 +1,8 @@
 import React from "react";
 import { useMediaQuery } from "@material-ui/core";
-import {
-  List,
-  Datagrid,
-  TextField,
-  EmailField,
-  SimpleList,
-  TopToolbar,
-  ExportButton,
-  CreateButton,
-} from "react-admin";
-
-const AdminListActions = ({ basePath, data, resource }) => (
-  <TopToolbar>
-    <CreateButton basePath={basePath} />
-    <ExportButton basePath={basePath} record={data} resource={resource} />
-  </TopToolbar>
-);
+import { List, Datagrid, TextField, EmailField, SimpleList } from "react-admin";
+import Pagination from "../pagination";
+import AdminFilter from "./AdminFilter";
 
 const AdminList = (props) => {
   const isSmall = useMediaQuery((theme) => theme.breakpoints.down("sm"));
@@ -25,7 +11,8 @@ const AdminList = (props) => {
     <List
       label="Admins"
       title="Admins"
-      actions={<AdminListActions />}
+      pagination={<Pagination />}
+      filters={<AdminFilter />}
       {...props}
     >
       {isSmall ? (
@@ -36,7 +23,7 @@ const AdminList = (props) => {
           tertiaryText={(record) => record.role}
         />
       ) : (
-        <Datagrid rowClick="show" isRowSelectable={(record) => false}>
+        <Datagrid rowClick="show">
           <TextField label="Name" source="fullname" />
           <EmailField source="email" />
           <TextField source="role" />

src/components/msadmins/AdminShow.js

@@ -5,12 +5,10 @@ import {
   TextField,
   TopToolbar,
   DeleteButton,
-  EditButton,
 } from "react-admin";
 
 const AdminShowActions = ({ basePath, data, resource }) => (
   <TopToolbar>
-    <EditButton basePath={basePath} record={data} />
     <DeleteButton basePath={basePath} record={data} resource={resource} />
   </TopToolbar>
 );

src/components/organizations/OrganizationFilter.js

@@ -0,0 +1,11 @@
+import React from "react";
+import { Filter, TextInput } from "react-admin";
+
+const OrganizationFilter = (props) => (
+  <Filter {...props}>
+    <TextInput label="Search by Name" source="organizationName" alwaysOn />
+    <TextInput label="Search by Email" source="organizationEmail" />
+  </Filter>
+);
+
+export default OrganizationFilter;

src/components/organizations/OrganizationList.js

@@ -1,17 +1,8 @@
 import React from "react";
 import { useMediaQuery } from "@material-ui/core";
-import {
-  List,
-  Datagrid,
-  TextField,
-  EmailField,
-  SimpleList,
-  Pagination,
-} from "react-admin";
-
-const OrganizationPagination = (props) => (
-  <Pagination rowsPerPageOptions={[10, 25, 50]} {...props} />
-);
+import { List, Datagrid, TextField, EmailField, SimpleList } from "react-admin";
+import OrganizationFilter from "./OrganizationFilter";
+import Pagination from "../pagination";
 
 const OrganizationList = (props) => {
   const isSmall = useMediaQuery((theme) => theme.breakpoints.down("sm"));
@@ -20,7 +11,8 @@ const OrganizationList = (props) => {
     <List
       label="Organizations"
       title="Organizations"
-      pagination={<OrganizationPagination />}
+      pagination={<Pagination />}
+      filters={<OrganizationFilter />}
       {...props}
     >
       {isSmall ? (

src/components/organizations/OrganizationShow.js

@@ -38,8 +38,8 @@ const OrganizationShow = (props) => {
           <ReferenceManyField
             link="show"
             label=""
-            reference="Applications"
-            target="organizationId"
+            reference="Organizations"
+            target="id"
           >
             <SimpleList
               className={classes.root}

src/components/pagination/index.js

@@ -0,0 +1,6 @@
+import React from "react";
+import { Pagination } from "react-admin";
+
+export default (props) => (
+  <Pagination rowsPerPageOptions={[10, 25, 50]} {...props} />
+);

src/components/plans/PlanFilter.js

@@ -0,0 +1,10 @@
+import React from "react";
+import { Filter, TextInput } from "react-admin";
+
+const PlanFilter = (props) => (
+  <Filter {...props}>
+    <TextInput label="Search by Name" source="planName" alwaysOn />
+  </Filter>
+);
+
+export default PlanFilter;

src/components/plans/PlanList.js

@@ -1,21 +1,8 @@
 import React from "react";
 import { useMediaQuery } from "@material-ui/core";
-import {
-  List,
-  Datagrid,
-  TextField,
-  SimpleList,
-  TopToolbar,
-  CreateButton,
-  ExportButton,
-} from "react-admin";
-
-const PlanListActions = ({ basePath, data, resource }) => (
-  <TopToolbar>
-    <CreateButton basePath={basePath} />
-    <ExportButton basePath={basePath} record={data} resource={resource} />
-  </TopToolbar>
-);
+import { List, Datagrid, TextField, SimpleList } from "react-admin";
+import Pagination from "../pagination";
+import PlanFilter from "./PlanFilter";
 
 const PlanList = (props) => {
   const isSmall = useMediaQuery((theme) => theme.breakpoints.down("sm"));
@@ -24,8 +11,8 @@ const PlanList = (props) => {
     <List
       label="Plans"
       title="Plans"
-      actions={<PlanListActions />}
-      pagination={null}
+      pagination={<Pagination />}
+      filters={<PlanFilter />}
       {...props}
     >
       {isSmall ? (

src/services/data-provider.js

@@ -1,7 +1,7 @@
 import { fetchUtils } from "react-admin";
 import endpoints from "../utils/endpoints";
 import { stringify } from "querystring";
-import getPaginateQuery from "../utils/pagination";
+import getPaginateQuery, { filter } from "../utils/pagination";
 import handleProfileData from "../utils/data/profile-data";
 import {
   GET_LIST,
@@ -29,7 +29,7 @@ export default {
     const endpoint = endpoints(GET_LIST, resource, params);
     return httpClient(`${endpoint.url}?${stringify(query)}`).then(
       ({ json }) => ({
-        data: endpoint.getData(json.data),
+        data: filter(endpoint.getData(json.data), params),
         total: json.data.pageInfo
           ? json.data.pageInfo.totalRecord
           : json.data.length,
@@ -56,12 +56,20 @@ export default {
 
   getManyReference: (resource, params) => {
     const endpoint = endpoints(GET_MANY_REFERENCE, resource, params);
-    return httpClient(endpoint.url).then(({ json }) => ({
-      data: endpoint.getData(json.data, endpoint.target, endpoint.targetId),
-      total: json.data.pageInfo
-        ? json.data.pageInfo.totalRecord
-        : json.data.length,
-    }));
+    console.log("REFERENCE", params);
+    const query = {
+      limit: 50,
+      sort: "ASC",
+      page: 1,
+    };
+    return httpClient(`${endpoint.url}?${stringify(query)}`).then(
+      ({ json }) => ({
+        data: endpoint.getData(json.data, endpoint.target, endpoint.targetId),
+        total: json.data.pageInfo
+          ? json.data.pageInfo.totalRecord
+          : json.data.length,
+      })
+    );
   },
 
   update: (resource, params) => {

src/utils/data/admin-data.js

@@ -1,6 +1,10 @@
 export default (data) => {
   if (data.records && Array.isArray(data.records)) {
-    return data.records.map((item) => ({ id: item.msAdminId, ...item }));
+    const profile = localStorage.getItem("profile");
+    const currentUserId = JSON.parse(profile).msAdminId;
+    return data.records
+      .filter((admin) => admin.msAdminId !== currentUserId)
+      .map((item) => ({ id: item.msAdminId, ...item }));
   } else if (data.msAdminId) {
     return { id: data.msAdminId, ...data };
   }

src/utils/data/application-data.js

@@ -1,14 +1,8 @@
-const getApplicationsData = (data, target, id) => {
+const getApplicationsData = (data) => {
   let mappedData = data;
 
   if (Array.isArray(data.records) && data.records[0].applicationId) {
     mappedData = data.records.map(mapApplicationIdToId);
-
-    if (target && id) {
-      mappedData = mappedData.filter((item) => {
-        return item[target]._id === id;
-      });
-    }
   }
 
   return mappedData;

src/utils/data/organizations-data.js

@@ -1,14 +1,10 @@
-const getOrganizationsData = (data, target, id) => {
+const getOrganizationsData = (data) => {
   let mappedData = data;
 
   if (Array.isArray(data.records) && data.records[0].organizationId) {
     mappedData = data.records.map(mapOrganizationIdToId);
   }
 
-  if (target && id) {
-    mappedData = mappedData.filter((item) => item[target] === id);
-  }
-
   return mappedData;
 };
 

src/utils/data/plans-data.js

@@ -1,4 +1,4 @@
-const getPlansData = (data, target, id) => {
+const getPlansData = (data) => {
   let mappedData = data;
 
   if (Array.isArray(data) && data[0].planId) {
@@ -7,10 +7,6 @@ const getPlansData = (data, target, id) => {
     mappedData = mapPlanIdToId(data);
   }
 
-  if (target && id) {
-    mappedData = mappedData.filter((item) => item[target] === id);
-  }
-
   return mappedData;
 };
 

src/utils/endpoints/admin-endpoints.js

@@ -6,7 +6,7 @@ import {
   UPDATE,
   DELETE,
   GET_MANY,
-  GET_MANY_REFERENCE,
+  DELETE_MANY,
 } from "react-admin";
 
 const apiUrl = "https://comments-microservice.herokuapp.com/v1";
@@ -28,11 +28,6 @@ export default (type, params) => {
         url: `${apiUrl}/msadmins`,
         getData: getData,
       };
-    case GET_MANY_REFERENCE:
-      return {
-        url: `${apiUrl}/msadmins`,
-        getData: getData,
-      };
     case UPDATE:
       return {
         url: `${apiUrl}/msadmins`,
@@ -57,6 +52,11 @@ export default (type, params) => {
         options: { method: "DELETE" },
         getData: getData,
       };
+    case DELETE_MANY:
+      return {
+        urls: params.ids.map((id) => `${apiUrl}/msadmins/${id}`),
+        getData: getData,
+      };
     default:
       throw new Error(`Unsupported Admin Data Provider request type ${type}`);
   }

src/utils/endpoints/application-endpoints.js

@@ -20,10 +20,8 @@ export default (type, params) => {
       };
     case GET_MANY_REFERENCE:
       return {
-        url: `${apiUrl}/msadmins/applications`,
-        getData: (data) => {
-          return getData(data, params.target, params.id);
-        },
+        url: `${apiUrl}/msadmins/applications/${params.id}`,
+        getData: getData,
       };
     case GET_ONE:
     case DELETE: