diff --git a/src/app/quote/Client.tsx b/src/app/quote/Client.tsx index 6723c50..29b7aa3 100644 --- a/src/app/quote/Client.tsx +++ b/src/app/quote/Client.tsx @@ -218,6 +218,13 @@ export default function QuoteClient() { executeQuoteRequest(); }; + // Retry wrapper for the quote request – re‑uses the existing submission logic. + const retryQuote = useCallback(() => { + // Create a synthetic submit event to trigger the same validation & request flow. + // The event type is cast to any to satisfy the FormEvent generic. + onSubmit(new Event('submit') as any); + }, [onSubmit]); + return (
{formError && (
diff --git a/src/app/quote/QuoteHistory.test.tsx b/src/app/quote/QuoteHistory.test.tsx index 49590b0..e60f096 100644 --- a/src/app/quote/QuoteHistory.test.tsx +++ b/src/app/quote/QuoteHistory.test.tsx @@ -45,12 +45,15 @@ describe('QuoteHistory Component', () => { let renderCount = 0; // Component wrapper that tracks render count of memoized QuoteHistory - const TrackedHistoryInner = (props: React.ComponentProps) => { - renderCount++; - return ; - }; - TrackedHistoryInner.displayName = 'TrackedHistory'; - const TrackedHistory = React.memo(TrackedHistoryInner); + const TrackedHistory = React.memo( + function TrackedHistoryComponent( + props: React.ComponentProps + ) { + renderCount++; + return ; + } + ); + TrackedHistory.displayName = 'TrackedHistory'; const ParentComponent = () => { const [dummyState, setDummyState] = useState(0); diff --git a/src/app/quote/Slippage.tsx b/src/app/quote/Slippage.tsx index e503944..7496734 100644 --- a/src/app/quote/Slippage.tsx +++ b/src/app/quote/Slippage.tsx @@ -28,8 +28,9 @@ type Props = { }; function SlippageBase({ status, slippage, errorMessage, onRetry }: Props) { - const content = ( - + // Accessible live region – always present, content changes with status. + const liveRegion = ( + {status === 'empty' && 'No slippage data'} {status === 'loading' && 'Calculating slippage…'} {status === 'error' && `Error: ${errorMessage ?? 'Unable to calculate'}`} @@ -37,11 +38,16 @@ function SlippageBase({ status, slippage, errorMessage, onRetry }: Props) { ); + // Render a tooltip‑styled badge for visual consistency. + const tooltip = ( + + {liveRegion} + + ); + return ( -
- - {content} - +
+ {tooltip} {status === 'error' && onRetry && (