feat: add table to manage BCeID user access

app/containers/User/ManageBceidUserTable.tsx

@@ -0,0 +1,81 @@
+import React from "react";
+import { graphql, createFragmentContainer } from "react-relay";
+import { ManageBceidUserTable_query } from "ManageBceidUserTable_query.graphql";
+import ManageBceidUserTableRow from "./ManageBceidUserTableRow";
+import {
+  TableFilter,
+  TextFilter,
+  DisplayOnlyFilter,
+  NoHeaderFilter,
+} from "components/FilterableTable/Filters";
+import FilterableTable from "components/FilterableTable/FilterableTable";
+
+interface Props {
+  query: ManageBceidUserTable_query;
+}
+
+const filters: TableFilter[] = [
+  new TextFilter("First Name", "first_name"),
+  new TextFilter("Last Name", "last_name"),
+  new TextFilter("Email", "email_address"),
+  new DisplayOnlyFilter("View Access Requests"),
+  new NoHeaderFilter(),
+];
+
+export const ManageBceidUserTableComponent: React.FunctionComponent<Props> = (
+  props
+) => {
+  const { edges, totalCount } = props.query.allCiipUsers;
+
+  console.log(edges);
+
+  const body = (
+    <tbody>
+      {edges.map((edge) => (
+        <ManageBceidUserTableRow key={edge.node.id} user={edge.node} />
+      ))}
+    </tbody>
+  );
+  return (
+    <FilterableTable
+      body={body}
+      filters={filters}
+      paginated
+      totalCount={totalCount}
+    />
+  );
+};
+
+export default createFragmentContainer(ManageBceidUserTableComponent, {
+  query: graphql`
+    fragment ManageBceidUserTable_query on Query
+    @argumentDefinitions(
+      first_name: { type: "String" }
+      last_name: { type: "String" }
+      email_address: { type: "String" }
+      order_by: { type: "[CiipUsersOrderBy!]" }
+      pageSize: { type: "Int" }
+      offset: { type: "Int" }
+    ) {
+      allCiipUsers(
+        first: $pageSize
+        offset: $offset
+        filter: {
+          uuid: { notIncludesInsensitive: "idir" }
+          firstName: { includesInsensitive: $first_name }
+          lastName: { includesInsensitive: $last_name }
+          emailAddress: { includesInsensitive: $email_address }
+        }
+        orderBy: $order_by
+      ) {
+        edges {
+          node {
+            id
+            ...ManageBceidUserTableRow_user
+          }
+        }
+        totalCount
+      }
+    }
+  `,
+});

app/containers/User/ManageBceidUserTableRow.tsx

@@ -0,0 +1,77 @@
+import React from "react";
+import { Button } from "react-bootstrap";
+import { graphql, createFragmentContainer, RelayProp } from "react-relay";
+import { ManageBceidUserTableRow_user } from "ManageBceidUserTableRow_user.graphql";
+import updateUserMutation from "mutations/user/updateUserMutation";
+import Link from "next/link";
+
+interface Props {
+  relay: RelayProp;
+  user: ManageBceidUserTableRow_user;
+  key: string;
+}
+export const ManageBceidUserTableRowComponent: React.FunctionComponent<Props> = (
+  props
+) => {
+  const { user } = props;
+
+  const handleChange = async () => {
+    const variables = {
+      input: {
+        id: user.id,
+        ciipUserPatch: {
+          allowUuidUpdate: !user.allowUuidUpdate,
+        },
+      },
+    };
+    await updateUserMutation(props.relay.environment, variables);
+  };
+
+  const url = `/analyst/organisation-requests?filterArgs=${encodeURIComponent(
+    `{"user_id":${user.rowId}}`
+  )}`;
+
+  return (
+    <tr>
+      <td>{user.firstName}</td>
+      <td>{user.lastName}</td>
+      <td>{user.emailAddress}</td>
+      <td>
+        <Link href={`${url}`} passHref>
+          <a
+            href="#"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="alert-link"
+          >
+            Access Requests
+          </a>
+        </Link>
+      </td>
+      <td>
+        {user.allowUuidUpdate ? (
+          <Button variant="outline-primary" onClick={handleChange}>
+            Disable New Login
+          </Button>
+        ) : (
+          <Button variant="primary" onClick={handleChange}>
+            Enable New Login
+          </Button>
+        )}
+      </td>
+    </tr>
+  );
+};
+
+export default createFragmentContainer(ManageBceidUserTableRowComponent, {
+  user: graphql`
+    fragment ManageBceidUserTableRow_user on CiipUser {
+      id
+      rowId
+      firstName
+      lastName
+      emailAddress
+      allowUuidUpdate
+    }
+  `,
+});