feat: add hook useShowToast.ts

src/components/Orders/Orders.tsx

@@ -10,7 +10,6 @@ import {
   Spinner,
   Text,
   Td,
-  useToast,
 } from '@chakra-ui/react';
 import { useTranslation } from 'react-i18next';
 import dayjs from 'dayjs';
@@ -22,6 +21,7 @@ import {
   useGetMastersQuery,
   useGetOrdersQuery,
 } from '../../__data__/service/api';
+import useShowToast from '../../hooks/useShowToast';
 
 const TABLE_HEADERS = [
   'carNumber' as const,
@@ -36,7 +36,7 @@ const Orders = () => {
   const { t } = useTranslation('~', {
     keyPrefix: 'dry-wash.arm.order',
   });
-  const toast = useToast();
+  const showToast = useShowToast();
 
   const [currentDate, setCurrentDate] = useState(new Date());
   const {
@@ -61,16 +61,9 @@ const Orders = () => {
 
   useEffect(() => {
     if (isError) {
-      toast({
-        title: t('error.title'),
-        // description: errorMessage,
-        status: 'error',
-        duration: 5000,
-        isClosable: true,
-        position: 'bottom-right',
-      });
+      showToast(t('error.title'), 'error');
     }
-  }, [isError, ordersError, mastersError, toast, t]);
+  }, [isError, ordersError, mastersError, t]);
 
   return (
     <Box p='8'>