Merge pull request #331 from outgrow/outgrow-allow-invitations-all-shops

Allow the Invitations table to show invitations for all shops
reactioncommerce · Oct 9, 2020 · ebd9300 · ebd9300
2 parents 784927a + 360075a
commit ebd9300
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 10 deletions.
diff --git a/imports/plugins/core/accounts/client/components/Accounts.js b/imports/plugins/core/accounts/client/components/Accounts.js
@@ -3,6 +3,7 @@ import i18next from "i18next";
 import Divider from "@material-ui/core/Divider";
 import Tab from "@material-ui/core/Tab";
 import Tabs from "@material-ui/core/Tabs";
+import useCurrentShopId from "/imports/client/ui/hooks/useCurrentShopId";
 import Customers from "./Customers";
 import GroupCards from "./GroupCards";
 import Invitations from "./Invitations";
@@ -14,6 +15,7 @@ import Invitations from "./Invitations";
  */
 function Accounts() {
   const [currentTab, setCurrentTab] = useState(0);
+  const [shopId] = useCurrentShopId();
 
   return (
     <Fragment>
@@ -34,7 +36,7 @@ function Accounts() {
       }
 
       {currentTab === 2 &&
-        <Invitations />
+        <Invitations shopId={shopId} />
       }
     </Fragment>
   );

diff --git a/imports/plugins/core/accounts/client/components/Invitations.js b/imports/plugins/core/accounts/client/components/Invitations.js
@@ -1,9 +1,9 @@
 import React, { useState, useMemo, useCallback } from "react";
+import PropTypes from "prop-types";
 import { useApolloClient } from "@apollo/react-hooks";
 import i18next from "i18next";
 import { Card, CardContent, makeStyles } from "@material-ui/core";
 import DataTable, { useDataTable } from "@reactioncommerce/catalyst/DataTable";
-import useCurrentShopId from "/imports/client/ui/hooks/useCurrentShopId";
 import { getAccountAvatar } from "/imports/plugins/core/accounts/client/helpers/helpers";
 import invitationsQuery from "../graphql/queries/invitations";
 
@@ -13,15 +13,13 @@ const useStyles = makeStyles(() => ({
   }
 }));
 
-
 /**
  * @summary Main invitations view
  * @name Invitations
  * @returns {React.Component} A React component
  */
-function Invitations() {
+function Invitations({ shopId }) {
   const apolloClient = useApolloClient();
-  const [shopId] = useCurrentShopId();
 
   // React-Table state
   const [isLoading, setIsLoading] = useState(false);
@@ -46,7 +44,7 @@ function Invitations() {
       id: "invitedBy"
     }, {
       Header: i18next.t("admin.invitationsTable.header.shop"),
-      accessor: (row) => row.shop.name,
+      accessor: (row) => row.shop?.name,
       id: "shop"
     }, {
       Header: i18next.t("admin.invitationsTable.header.groups"),
@@ -58,14 +56,11 @@ function Invitations() {
   const onFetchData = useCallback(async ({ pageIndex, pageSize }) => {
     // Wait for shop id to be available before fetching products.
     setIsLoading(true);
-    if (!shopId) {
-      return;
-    }
 
     const { data } = await apolloClient.query({
       query: invitationsQuery,
       variables: {
-        shopIds: [shopId],
+        shopIds: shopId ? [shopId] : [],
         first: pageSize,
         limit: (pageIndex + 1) * pageSize,
         offset: pageIndex * pageSize
@@ -101,4 +96,8 @@ function Invitations() {
   );
 }
 
+Invitations.propTypes = {
+  shopId: PropTypes.string
+};
+
 export default Invitations;