pl-fe: migrate account actions to tanstack query

Signed-off-by: nicole mikołajczyk <git@mkljczk.pl>

packages/pl-fe/src/features/chats/components/chat-composer.tsx

@@ -1,7 +1,6 @@
 import React, { useState } from 'react';
 import { defineMessages, IntlShape, useIntl } from 'react-intl';
 
-import { unblockAccount } from 'pl-fe/actions/accounts';
 import Button from 'pl-fe/components/ui/button';
 import Combobox, { ComboboxInput, ComboboxList, ComboboxOption, ComboboxPopover } from 'pl-fe/components/ui/combobox';
 import HStack from 'pl-fe/components/ui/hstack';
@@ -11,9 +10,8 @@ import Text from 'pl-fe/components/ui/text';
 import { useChatContext } from 'pl-fe/contexts/chat-context';
 import UploadButton from 'pl-fe/features/compose/components/upload-button';
 import emojiSearch from 'pl-fe/features/emoji/search';
-import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch';
 import { useInstance } from 'pl-fe/hooks/use-instance';
-import { useRelationshipQuery } from 'pl-fe/queries/accounts/use-relationship';
+import { useRelationshipQuery, useUnblockAccountMutation } from 'pl-fe/queries/accounts/use-relationship';
 import { useModalsActions } from 'pl-fe/stores/modals';
 import { textAtCursorMatchesToken } from 'pl-fe/utils/suggestions';
 
@@ -76,11 +74,11 @@ const ChatComposer = React.forwardRef<HTMLTextAreaElement | null, IChatComposer>
   uploadProgress,
 }, ref) => {
   const intl = useIntl();
-  const dispatch = useAppDispatch();
 
   const { openModal } = useModalsActions();
   const { chat } = useChatContext();
   const { data: relationship } = useRelationshipQuery(chat?.account.id);
+  const { mutate: unblockAccount } = useUnblockAccountMutation(chat?.account.id!);
 
   const isBlocked = relationship?.blocked_by && false;
   const isBlocking = relationship?.blocking && false;
@@ -146,7 +144,7 @@ const ChatComposer = React.forwardRef<HTMLTextAreaElement | null, IChatComposer>
       message: intl.formatMessage(messages.unblockMessage),
       confirm: intl.formatMessage(messages.unblockConfirm),
       confirmationTheme: 'primary',
-      onConfirm: () => dispatch(unblockAccount(chat?.account.id as string)),
+      onConfirm: () => unblockAccount(),
     });
   };
 

packages/pl-fe/src/features/chats/components/chat-page/components/chat-page-main.tsx

@@ -2,7 +2,6 @@ import React, { useRef } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import { Link, useHistory, useParams } from 'react-router-dom';
 
-import { blockAccount, unblockAccount } from 'pl-fe/actions/accounts';
 import DropdownMenu, { type Menu } from 'pl-fe/components/dropdown-menu';
 import Avatar from 'pl-fe/components/ui/avatar';
 import HStack from 'pl-fe/components/ui/hstack';
@@ -11,9 +10,8 @@ import Stack from 'pl-fe/components/ui/stack';
 import Text from 'pl-fe/components/ui/text';
 import VerificationBadge from 'pl-fe/components/verification-badge';
 import { useChatContext } from 'pl-fe/contexts/chat-context';
-import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch';
 import { useFeatures } from 'pl-fe/hooks/use-features';
-import { useRelationshipQuery } from 'pl-fe/queries/accounts/use-relationship';
+import { useBlockAccountMutation, useUnblockAccountMutation, useRelationshipQuery } from 'pl-fe/queries/accounts/use-relationship';
 import { useChat, useChatActions, useChats } from 'pl-fe/queries/chats';
 import { useModalsActions } from 'pl-fe/stores/modals';
 
@@ -38,7 +36,6 @@ const messages = defineMessages({
 });
 
 const ChatPageMain = () => {
-  const dispatch = useAppDispatch();
   const intl = useIntl();
   const features = useFeatures();
   const history = useHistory();
@@ -50,6 +47,9 @@ const ChatPageMain = () => {
   const { currentChatId } = useChatContext();
   const { chatsQuery: { data: chats, isLoading } } = useChats();
 
+  const { mutate: blockAccount } = useBlockAccountMutation(chat?.account.id!);
+  const { mutate: unblockAccount } = useUnblockAccountMutation(chat?.account.id!);
+
   const inputRef = useRef<HTMLTextAreaElement | null>(null);
 
   const { deleteChat } = useChatActions(chat?.id as string);
@@ -62,7 +62,7 @@ const ChatPageMain = () => {
       message: intl.formatMessage(messages.blockMessage),
       confirm: intl.formatMessage(messages.blockConfirm),
       confirmationTheme: 'primary',
-      onConfirm: () => dispatch(blockAccount(chat?.account.id as string)),
+      onConfirm: () => blockAccount(),
     });
   };
 
@@ -72,7 +72,7 @@ const ChatPageMain = () => {
       message: intl.formatMessage(messages.unblockMessage),
       confirm: intl.formatMessage(messages.unblockConfirm),
       confirmationTheme: 'primary',
-      onConfirm: () => dispatch(unblockAccount(chat?.account.id as string)),
+      onConfirm: () => unblockAccount(),
     });
   };
 

packages/pl-fe/src/features/chats/components/chat-widget/chat-settings.tsx

@@ -1,16 +1,14 @@
 import React from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 
-import { blockAccount, unblockAccount } from 'pl-fe/actions/accounts';
 import Avatar from 'pl-fe/components/ui/avatar';
 import HStack from 'pl-fe/components/ui/hstack';
 import Icon from 'pl-fe/components/ui/icon';
 import Stack from 'pl-fe/components/ui/stack';
 import Text from 'pl-fe/components/ui/text';
 import { ChatWidgetScreens, useChatContext } from 'pl-fe/contexts/chat-context';
-import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch';
 import { useFeatures } from 'pl-fe/hooks/use-features';
-import { useRelationshipQuery } from 'pl-fe/queries/accounts/use-relationship';
+import { useBlockAccountMutation, useUnblockAccountMutation, useRelationshipQuery } from 'pl-fe/queries/accounts/use-relationship';
 import { useChatActions } from 'pl-fe/queries/chats';
 import { useModalsActions } from 'pl-fe/stores/modals';
 
@@ -33,7 +31,6 @@ const messages = defineMessages({
 });
 
 const ChatSettings = () => {
-  const dispatch = useAppDispatch();
   const intl = useIntl();
   const features = useFeatures();
 
@@ -41,6 +38,9 @@ const ChatSettings = () => {
   const { chat, changeScreen, toggleChatPane } = useChatContext();
   const { deleteChat } = useChatActions(chat?.id as string);
 
+  const { mutate: blockAccount } = useBlockAccountMutation(chat?.account.id!);
+  const { mutate: unblockAccount } = useUnblockAccountMutation(chat?.account.id!);
+
   const isBlocked = !!useRelationshipQuery(chat?.account.id).data?.blocked_by;
 
   const closeSettings = () => {
@@ -58,7 +58,7 @@ const ChatSettings = () => {
       message: intl.formatMessage(messages.blockMessage),
       confirm: intl.formatMessage(messages.blockConfirm),
       confirmationTheme: 'primary',
-      onConfirm: () => dispatch(blockAccount(chat?.account.id as string)),
+      onConfirm: () => blockAccount(),
     });
   };
 
@@ -68,7 +68,7 @@ const ChatSettings = () => {
       message: intl.formatMessage(messages.unblockMessage),
       confirm: intl.formatMessage(messages.unblockConfirm),
       confirmationTheme: 'primary',
-      onConfirm: () => dispatch(unblockAccount(chat?.account.id as string)),
+      onConfirm: () => unblockAccount(),
     });
   };