GroupMembershipRequests: invalidate query upon authorize/reject

app/soapbox/features/group/group-membership-requests.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo } from 'react';
+import React from 'react';
 import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
 
 import Account from 'soapbox/components/account';
@@ -57,15 +57,7 @@ const GroupMembershipRequests: React.FC<IGroupMembershipRequests> = ({ params })
 
   const { group } = useGroup(id);
 
-  const {
+  const { accounts, authorize, reject, isLoading } = useGroupMembershipRequests(id);
-    accounts: entities,
-    isLoading,
-    authorize,
-    reject,
-    isFetching,
-  } = useGroupMembershipRequests(id);
-
-  const accounts = useMemo(() => entities, [isFetching]);
 
   if (!group || !group.relationship || isLoading) {
     return (
@@ -96,7 +88,7 @@ const GroupMembershipRequests: React.FC<IGroupMembershipRequests> = ({ params })
   }
 
   return (
-    <Column label={intl.formatMessage(messages.heading)} backHref={`/groups/${id}/manage`}>
+    <Column label={intl.formatMessage(messages.heading)}>
       <ScrollableList
         scrollKey='group_membership_requests'
         emptyMessage={<FormattedMessage id='empty_column.group_membership_requests' defaultMessage='There are no pending membership requests for this group.' />}

app/soapbox/hooks/api/groups/useGroupMembershipRequests.ts

@@ -1,5 +1,5 @@
 import { Entities } from 'soapbox/entity-store/entities';
-import { useDismissEntity, useEntities } from 'soapbox/entity-store/hooks';
+import { useEntities } from 'soapbox/entity-store/hooks';
 import { useApi } from 'soapbox/hooks/useApi';
 import { accountSchema } from 'soapbox/schemas';
 
@@ -9,20 +9,24 @@ function useGroupMembershipRequests(groupId: string) {
   const api = useApi();
   const path: ExpandedEntitiesPath = [Entities.ACCOUNTS, 'membership_requests', groupId];
 
-  const authorize = useDismissEntity(path, (accountId) => {
+  const { entities, invalidate, ...rest } = useEntities(
-    return api.post(`/api/v1/groups/${groupId}/membership_requests/${accountId}/authorize`);
-  });
-
-  const reject = useDismissEntity(path, (accountId) => {
-    return api.post(`/api/v1/groups/${groupId}/membership_requests/${accountId}/reject`);
-  });
-
-  const { entities, ...rest } = useEntities(
     path,
     `/api/v1/groups/${groupId}/membership_requests`,
     { schema: accountSchema },
   );
 
+  function authorize(accountId: string) {
+    return api
+      .post(`/api/v1/groups/${groupId}/membership_requests/${accountId}/authorize`)
+      .then(invalidate);
+  }
+
+  function reject(accountId: string) {
+    return api
+      .post(`/api/v1/groups/${groupId}/membership_requests/${accountId}/reject`)
+      .then(invalidate);
+  }
+
   return {
     accounts: entities,
     authorize,