Dashboard: hooks cleanup

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>

src/features/admin/domains.tsx

@@ -1,8 +1,8 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
 
 import { openModal } from 'soapbox/actions/modals';
-import { useDeleteDomain, useDomains } from 'soapbox/api/hooks/admin';
+import { useDomains } from 'soapbox/api/hooks/admin';
 import { dateFormatOptions } from 'soapbox/components/relative-timestamp';
 import ScrollableList from 'soapbox/components/scrollable-list';
 import { Button, Column, HStack, Stack, Text } from 'soapbox/components/ui';
@@ -30,8 +30,7 @@ const Domain: React.FC<IDomain> = ({ domain }) => {
   const intl = useIntl();
   const dispatch = useAppDispatch();
 
-  const { mutate: deleteDomain } = useDeleteDomain();
-  const { refetch } = useDomains();
+  const { deleteDomain } = useDomains();
 
   const handleEditDomain = (domain: DomainEntity) => () => {
     dispatch(openModal('EDIT_DOMAIN', { domainId: domain.id }));
@@ -43,10 +42,11 @@ const Domain: React.FC<IDomain> = ({ domain }) => {
       message: intl.formatMessage(messages.deleteMessage),
       confirm: intl.formatMessage(messages.deleteConfirm),
       onConfirm: () => {
-        deleteDomain(domain.id).then(() => {
-          toast.success(messages.domainDeleteSuccess);
-          refetch();
-        }).catch(() => {});
+        deleteDomain(domain.id, {
+          onSuccess: () => {
+            toast.success(messages.domainDeleteSuccess);
+          },
+        });
       },
     }));
   };
@@ -103,12 +103,16 @@ const Domains: React.FC = () => {
   const intl = useIntl();
   const dispatch = useAppDispatch();
 
-  const { data: domains, isFetching } = useDomains();
+  const { data: domains, isFetching, refetch } = useDomains();
 
   const handleCreateDomain = () => {
     dispatch(openModal('EDIT_DOMAIN'));
   };
 
+  useEffect(() => {
+    if (!isFetching) refetch();
+  }, []);
+
   const emptyMessage = <FormattedMessage id='empty_column.admin.domains' defaultMessage='There are no domains yet.' />;
 
   return (

src/features/admin/relays.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
 
-import { useCreateRelay, useDeleteRelay, useRelays } from 'soapbox/api/hooks/admin';
+import { useRelays } from 'soapbox/api/hooks/admin';
 import ScrollableList from 'soapbox/components/scrollable-list';
 import { Button, Column, Form, HStack, Input, Stack, Text } from 'soapbox/components/ui';
 import { useTextField } from 'soapbox/hooks/forms';
@@ -22,14 +22,14 @@ interface IRelay {
 }
 
 const Relay: React.FC<IRelay> = ({ relay }) => {
-  const { mutate: deleteRelay } = useDeleteRelay();
-  const { refetch } = useRelays();
+  const { unfollowRelay } = useRelays();
 
   const handleDeleteRelay = () => () => {
-    deleteRelay(relay.actor).then(() => {
-      refetch();
-      toast.success(messages.relayDeleteSuccess);
-    }).catch(() => {});
+    unfollowRelay(relay.actor, {
+      onSuccess: () => {
+        toast.success(messages.relayDeleteSuccess);
+      },
+    });
   };
 
   return (
@@ -64,18 +64,16 @@ const NewRelayForm: React.FC = () => {
 
   const name = useTextField();
 
-  const { createRelay, isSubmitting } = useCreateRelay();
-  const { refetch } = useRelays();
+  const { followRelay, isPendingFollow } = useRelays();
 
   const handleSubmit = (e: React.FormEvent<Element>) => {
     e.preventDefault();
-    createRelay(name.value, {
+    followRelay(name.value, {
       onSuccess() {
         toast.success(messages.createSuccess);
-        refetch();
       },
       onError() {
-        toast.success(messages.createFail);
+        toast.error(messages.createFail);
       },
     });
   };
@@ -91,13 +89,13 @@ const NewRelayForm: React.FC = () => {
           <Input
             type='text'
             placeholder={label}
-            disabled={isSubmitting}
+            disabled={isPendingFollow}
             {...name}
           />
         </label>
 
         <Button
-          disabled={isSubmitting}
+          disabled={isPendingFollow}
           onClick={handleSubmit}
           theme='primary'
         >