feat: add hook useShowToast.ts

src/components/Masters/Masters.tsx

@@ -10,7 +10,6 @@ import {
   Button,
   useDisclosure,
   Flex,
-  useToast,
   Td,
   Text,
   Spinner,
@@ -20,6 +19,7 @@ import { useTranslation } from 'react-i18next';
 import MasterItem from '../MasterItem';
 import MasterDrawer from '../MasterDrawer';
 import { useGetMastersQuery } from '../../__data__/service/api';
+import useShowToast from '../../hooks/useShowToast';
 
 const TABLE_HEADERS = [
   'name' as const,
@@ -30,7 +30,8 @@ const TABLE_HEADERS = [
 
 const Masters = () => {
   const { isOpen, onOpen, onClose } = useDisclosure();
-  const toast = useToast();
+  const showToast = useShowToast();
+
   const { t } = useTranslation('~', {
     keyPrefix: 'dry-wash.arm.master',
   });
@@ -39,12 +40,7 @@ const Masters = () => {
 
   useEffect(() => {
     if (error) {
-      toast({
-        title: t('error.title'),
-        status: 'error',
-        isClosable: true,
-        position: 'bottom-right',
-      });
+      showToast(t('error.title'), 'error');
     }
   }, [error]);