Added ability to change auth level IO-550

client/src/components/shop-users/shop-users.component.jsx

@@ -0,0 +1,59 @@
+import { Button, Table } from "antd";
+import React from "react";
+import { useQuery } from "react-apollo";
+import { useTranslation } from "react-i18next";
+import { QUERY_SHOP_ASSOCIATIONS } from "../../graphql/user.queries";
+import AlertComponent from "../alert/alert.component";
+import RbacWrapper from "../rbac-wrapper/rbac-wrapper.component";
+import ShopUsersAuthEdit from "../shop-users-auth-edit/shop-users-auth-edit.component";
+
+export default function ShopInfoUsersComponent() {
+  const { t } = useTranslation();
+  const { loading, error, data } = useQuery(QUERY_SHOP_ASSOCIATIONS);
+  const columns = [
+    {
+      title: t("user.fields.email"),
+      dataIndex: "email",
+      key: "email",
+      render: (text, record) => record.user.email,
+    },
+    {
+      title: t("user.fields.authlevel"),
+      dataIndex: "authlevel",
+      key: "authlevel",
+      render: (text, record) => (
+        <RbacWrapper action="users:editaccess">
+          <ShopUsersAuthEdit association={record} />
+        </RbacWrapper>
+      ),
+    },
+    {
+      title: t("user.labels.actions"),
+      dataIndex: "actions",
+      key: "actions",
+      render: (text, record) => (
+        <div>
+          <Button disabled onClick={() => {}}>
+            {t("general.actions.delete")}
+          </Button>
+        </div>
+      ),
+    },
+  ];
+
+  if (error) {
+    return <AlertComponent type="error" message={JSON.stringify(error)} />;
+  }
+  return (
+    <div>
+      <Table
+        loading={loading}
+        size="small"
+        pagination={{ position: "top" }}
+        columns={columns.map((item) => ({ ...item }))}
+        rowKey="id"
+        dataSource={data && data.associations}
+      />
+    </div>
+  );
+}