Fix flashing banner for errored messages

pull/14/head
J M Rossy 2 years ago
parent 0e23b26418
commit a6bd1d8198
  1. 16
      src/features/deliveryStatus/useMessageDeliveryStatus.ts
  2. 15
      src/features/messages/MessageDetails.tsx

@ -1,13 +1,15 @@
import { useQuery } from '@tanstack/react-query';
import { logger } from 'ethers';
import { useEffect } from 'react';
import { toast } from 'react-toastify';
import { Message, MessageStatus } from '../../types';
import { logger } from '../../utils/logger';
import type { MessageDeliveryStatusResponse } from './types';
export function useMessageDeliveryStatus(message: Message, isReady: boolean) {
const serializedMessage = JSON.stringify(message);
return useQuery(
const queryResult = useQuery(
['messageProcessTx', serializedMessage, isReady],
async () => {
if (!isReady || !message || message.status === MessageStatus.Delivered) return null;
@ -29,4 +31,14 @@ export function useMessageDeliveryStatus(message: Message, isReady: boolean) {
},
{ retry: false },
);
// Show toast on error
const error = queryResult.error;
useEffect(() => {
if (error) {
logger.error('Error fetching delivery status', error);
toast.error(`${error}`);
}
}, [error]);
return queryResult;
}

@ -54,10 +54,7 @@ export function MessageDetails({ messageId }: { messageId: string }) {
} = message;
const isIcaMsg = isIcaMessage(message);
const { data: deliveryStatusResponse, error: deliveryStatusError } = useMessageDeliveryStatus(
message,
isMessageFound,
);
const { data: deliveryStatusResponse } = useMessageDeliveryStatus(message, isMessageFound);
let resolvedDestTx = destTransaction;
let resolvedMsgStatus = status;
@ -86,14 +83,10 @@ export function MessageDetails({ messageId }: { messageId: string }) {
} else {
setBanner('');
}
if (deliveryStatusError) {
logger.error('Error fetching delivery status', deliveryStatusError);
toast.error(`${deliveryStatusError}`);
}
}, [error, isFetching, resolvedMsgStatus, isMessageFound, setBanner]);
useEffect(() => {
return () => setBanner('');
}, [error, deliveryStatusError, isFetching, resolvedMsgStatus, isMessageFound, setBanner]);
}, [setBanner]);
const reExecutor = useCallback(() => {
if (!isMessageFound || resolvedMsgStatus !== MessageStatus.Delivered) {

Loading…
Cancel
Save