Add useFollow, useChangeEntity hooks

app/soapbox/api/hooks/accounts/useFollow.ts

@@ -0,0 +1,57 @@
+import { Entities } from 'soapbox/entity-store/entities';
+import { useChangeEntity } from 'soapbox/entity-store/hooks';
+import { useApi } from 'soapbox/hooks/useApi';
+import { type Account } from 'soapbox/schemas';
+
+function useChangeAccount() {
+  const { changeEntity: changeAccount } = useChangeEntity<Account>(Entities.ACCOUNTS);
+  return { changeAccount };
+}
+
+function useFollow() {
+  const api = useApi();
+  const { changeAccount } = useChangeAccount();
+
+  function incrementFollowers(accountId: string) {
+    changeAccount(accountId, (account) => ({
+      ...account,
+      followers_count: account.followers_count + 1,
+    }));
+  }
+
+  function decrementFollowers(accountId: string) {
+    changeAccount(accountId, (account) => ({
+      ...account,
+      followers_count: account.followers_count - 1,
+    }));
+  }
+
+  async function follow(accountId: string, options = {}) {
+    incrementFollowers(accountId);
+
+    try {
+      await api.post(`/api/v1/accounts/${accountId}/follow`, options);
+    } catch (e) {
+      decrementFollowers(accountId);
+    }
+  }
+
+  async function unfollow(accountId: string, options = {}) {
+    decrementFollowers(accountId);
+
+    try {
+      await api.post(`/api/v1/accounts/${accountId}/unfollow`, options);
+    } catch (e) {
+      incrementFollowers(accountId);
+    }
+  }
+
+  return {
+    follow,
+    unfollow,
+    incrementFollowers,
+    decrementFollowers,
+  };
+}
+
+export { useFollow };

app/soapbox/api/hooks/index.ts

@@ -1,13 +1,11 @@
 
-/**
+// Accounts
- * Accounts
- */
 export { useAccount } from './accounts/useAccount';
+export { useFollow } from './accounts/useFollow';
+export { useRelationships } from './accounts/useRelationships';
 export { usePatronUser } from './accounts/usePatronUser';
 
-/**
+// Groups
- * Groups
- */
 export { useBlockGroupMember } from './groups/useBlockGroupMember';
 export { useCancelMembershipRequest } from './groups/useCancelMembershipRequest';
 export { useCreateGroup, type CreateGroupParams } from './groups/useCreateGroup';
@@ -34,8 +32,3 @@ export { usePromoteGroupMember } from './groups/usePromoteGroupMember';
 export { useSuggestedGroups } from './groups/useSuggestedGroups';
 export { useUpdateGroup } from './groups/useUpdateGroup';
 export { useUpdateGroupTag } from './groups/useUpdateGroupTag';
-
-/**
- * Relationships
- */
-export { useRelationships } from './accounts/useRelationships';

app/soapbox/entity-store/hooks/index.ts

@@ -5,4 +5,5 @@ export { useEntityLookup } from './useEntityLookup';
 export { useCreateEntity } from './useCreateEntity';
 export { useDeleteEntity } from './useDeleteEntity';
 export { useDismissEntity } from './useDismissEntity';
-export { useIncrementEntity } from './useIncrementEntity';
+export { useIncrementEntity } from './useIncrementEntity';
+export { useChangeEntity } from './useChangeEntity';

app/soapbox/entity-store/hooks/useChangeEntity.ts

@@ -0,0 +1,24 @@
+import { importEntities } from 'soapbox/entity-store/actions';
+import { Entities } from 'soapbox/entity-store/entities';
+import { type Entity } from 'soapbox/entity-store/types';
+import { useAppDispatch, useGetState } from 'soapbox/hooks';
+
+type ChangeEntityFn<TEntity extends Entity> = (entity: TEntity) => TEntity
+
+function useChangeEntity<TEntity extends Entity = Entity>(entityType: Entities) {
+  const getState = useGetState();
+  const dispatch = useAppDispatch();
+
+  function changeEntity(entityId: string, change: ChangeEntityFn<TEntity>): void {
+    if (!entityId) return;
+    const entity = getState().entities[entityType]?.store[entityId] as TEntity | undefined;
+    if (entity) {
+      const newEntity = change(entity);
+      dispatch(importEntities([newEntity], entityType));
+    }
+  }
+
+  return { changeEntity };
+}
+
+export { useChangeEntity, type ChangeEntityFn };