fix: delete SameTokensWarning type

rango-exchange · Nov 17, 2024 · c9982ce · c9982ce
1 parent de5524d
commit c9982ce
Show file tree

Hide file tree

Showing 10 changed files with 55 additions and 56 deletions.
diff --git a/widget/embedded/src/components/NoResult/NoResult.helpers.ts b/widget/embedded/src/components/NoResult/NoResult.helpers.ts
@@ -1,20 +1,16 @@
 import type { Info } from './NoResult.types';
-import type {
-  NoResultError,
-  QuoteRequestFailed,
-  SameTokensWarning,
-} from '../../types';
+import type { NoResultError, QuoteRequestFailed } from '../../types';
 
 import { i18n } from '@lingui/core';
 
 import { errorMessages } from '../../constants/errors';
-import { QuoteErrorType, QuoteWarningType } from '../../types';
+import { QuoteErrorType } from '../../types';
 
 const SMALL_NO_ROUTE__ICON_SIZE = 24;
 const LARGE_NO_ROUTE_ICON_SIZE = 60;
 
 export function makeInfo(
-  error: NoResultError | QuoteRequestFailed | SameTokensWarning | null,
+  error: NoResultError | QuoteRequestFailed | null,
   disabledLiquiditySources: string[],
   toggleAllLiquiditySources: (shouldReset: boolean) => void,
   refetchQuote: () => void
@@ -31,11 +27,6 @@ export function makeInfo(
       },
       description: '',
     };
-  } else if (error?.type === QuoteWarningType.SAME_TOKENS) {
-    return {
-      alert: null,
-      description: '',
-    };
   } else if (disabledLiquiditySources.length) {
     return {
       alert: {

diff --git a/widget/embedded/src/components/NoResult/NoResult.types.ts b/widget/embedded/src/components/NoResult/NoResult.types.ts
@@ -1,12 +1,8 @@
-import type {
-  NoResultError,
-  QuoteRequestFailed,
-  SameTokensWarning,
-} from '../../types';
+import type { NoResultError, QuoteRequestFailed } from '../../types';
 
 export interface PropTypes {
   fetch: () => void;
-  error: NoResultError | QuoteRequestFailed | SameTokensWarning | null;
+  error: NoResultError | QuoteRequestFailed | null;
   size?: 'small' | 'large';
 }
 

diff --git a/widget/embedded/src/components/QuoteWarningsAndErrors/QuoteWarningsAndErrors.helpers.ts b/widget/embedded/src/components/QuoteWarningsAndErrors/QuoteWarningsAndErrors.helpers.ts
@@ -68,12 +68,6 @@ export function makeAlerts(
       alertInfo.title = i18n.t('Caution, your slippage is high.');
       alertInfo.action = 'change-settings';
     }
-    if (warning.type === QuoteWarningType.SAME_TOKENS) {
-      alertInfo.title = i18n.t(
-        'You cannot use the same token for From and To.'
-      );
-    }
-
     return alertInfo;
   }
   return null;

diff --git a/widget/embedded/src/components/QuoteWarningsAndErrors/QuoteWarningsAndErrors.tsx b/widget/embedded/src/components/QuoteWarningsAndErrors/QuoteWarningsAndErrors.tsx
@@ -33,18 +33,10 @@ export function QuoteWarningsAndErrors(props: PropTypes) {
     onClose: onCloseWarningModal,
     onConfirm: onConfirmWarningModal,
   };
-  const isNoResultError = error?.type === QuoteErrorType.NO_RESULT;
-  const isRequestFailedError = error?.type === QuoteErrorType.REQUEST_FAILED;
-  const isSameTokensWarning = warning?.type === QuoteWarningType.SAME_TOKENS;
 
   const showNoResultMessage =
-    isNoResultError || isRequestFailedError || isSameTokensWarning;
-
-  const displayedError = isSameTokensWarning
-    ? warning
-    : isNoResultError || isRequestFailedError
-    ? error
-    : null;
+    error?.type === QuoteErrorType.NO_RESULT ||
+    error?.type === QuoteErrorType.REQUEST_FAILED;
 
   const alertInfo = makeAlerts(
     warning,
@@ -61,9 +53,8 @@ export function QuoteWarningsAndErrors(props: PropTypes) {
 
   return (
     <>
-      {showNoResultMessage && (
-        <NoResult error={displayedError} fetch={refetchQuote} />
-      )}
+      {showNoResultMessage && <NoResult error={error} fetch={refetchQuote} />}
+
       {showAlerts && (
         <Alerts>
           <Alert

diff --git a/widget/embedded/src/components/SameTokensWarning/SameTokensWarning.styles.ts b/widget/embedded/src/components/SameTokensWarning/SameTokensWarning.styles.ts
@@ -0,0 +1,7 @@
+import { styled } from '@rango-dev/ui';
+
+export const Container = styled('div', {
+  display: 'flex',
+  flexDirection: 'column',
+  alignItems: 'center',
+});
diff --git a/widget/embedded/src/components/SameTokensWarning/SameTokensWarning.tsx b/widget/embedded/src/components/SameTokensWarning/SameTokensWarning.tsx
@@ -0,0 +1,30 @@
+import { i18n } from '@lingui/core';
+import { Alert, Divider, NoRouteIcon, Typography } from '@rango-dev/ui';
+import React from 'react';
+
+import { useQuoteStore } from '../../store/quote';
+import { areTokensEqual } from '../../utils/wallets';
+
+import { Container } from './SameTokensWarning.styles';
+
+export function SameTokensWarning() {
+  const { fromToken, toToken } = useQuoteStore();
+  const showWarningMessage =
+    fromToken && toToken && areTokensEqual(fromToken, toToken);
+
+  return showWarningMessage ? (
+    <Container>
+      <NoRouteIcon size={24} color="gray" />
+      <Divider size={4} />
+      <Typography variant="title" size={'small'}>
+        {i18n.t('No Routes Found')}
+      </Typography>
+      <Divider size={4} />
+      <Alert
+        title={i18n.t('You cannot use the same token for From and To.')}
+        type={'warning'}
+        variant="alarm"
+      />
+    </Container>
+  ) : null;
+}
diff --git a/widget/embedded/src/components/SameTokensWarning/index.ts b/widget/embedded/src/components/SameTokensWarning/index.ts
@@ -0,0 +1 @@
+export { SameTokensWarning } from './SameTokensWarning';
diff --git a/widget/embedded/src/hooks/useSwapInput.ts b/widget/embedded/src/hooks/useSwapInput.ts
@@ -107,6 +107,7 @@ export function useSwapInput({
       affiliatePercent,
       affiliateWallets,
     } = params;
+
     if (!loading) {
       resetState(true);
     }

diff --git a/widget/embedded/src/pages/Home.tsx b/widget/embedded/src/pages/Home.tsx
@@ -1,4 +1,4 @@
-import type { SameTokensWarning, SelectedQuote } from '../types';
+import type { SelectedQuote } from '../types';
 
 import { i18n } from '@lingui/core';
 import { Button, Divider, styled, WarningIcon } from '@rango-dev/ui';
@@ -9,6 +9,7 @@ import { useNavigate } from 'react-router-dom';
 import { HeaderButtons } from '../components/HeaderButtons';
 import { Layout, PageContainer } from '../components/Layout';
 import { QuoteWarningsAndErrors } from '../components/QuoteWarningsAndErrors';
+import { SameTokensWarning } from '../components/SameTokensWarning';
 import { navigationRoutes } from '../constants/navigationRoutes';
 import { ExpandedQuotes } from '../containers/ExpandedQuotes';
 import { Inputs } from '../containers/Inputs';
@@ -19,11 +20,10 @@ import { useAppStore } from '../store/AppStore';
 import { useQuoteStore } from '../store/quote';
 import { useUiStore } from '../store/ui';
 import { useWalletsStore } from '../store/wallets';
-import { QuoteWarningType, UiEventTypes } from '../types';
+import { UiEventTypes } from '../types';
 import { isVariantExpandable } from '../utils/configs';
 import { emitPreventableEvent } from '../utils/events';
 import { getSwapButtonState, isTokensIdentical } from '../utils/swap';
-import { areTokensEqual } from '../utils/wallets';
 
 const MainContainer = styled('div', {
   display: 'flex',
@@ -89,16 +89,9 @@ export function Home() {
 
   const fetchingQuote = hasInputs && fetchMetaStatus === 'success' && loading;
 
-  const sameTokensWarning: SameTokensWarning | null =
-    areTokensEqual(fromToken, toToken) && fetchMetaStatus === 'success'
-      ? {
-          type: QuoteWarningType.SAME_TOKENS,
-        }
-      : null;
-
   const hasValidQuotes =
     !isExpandable || (isExpandable && quotes?.results.length);
-  const hasWarningOrError = quoteWarning || quoteError || sameTokensWarning;
+  const hasWarningOrError = quoteWarning || quoteError;
   const showMessages = hasValidQuotes && hasWarningOrError;
 
   useEffect(() => {
@@ -216,7 +209,7 @@ export function Home() {
             <>
               <Divider size="10" />
               <QuoteWarningsAndErrors
-                warning={quoteWarning || sameTokensWarning}
+                warning={quoteWarning}
                 error={quoteError}
                 couldChangeSettings={true}
                 refetchQuote={fetchQuote}
@@ -235,6 +228,7 @@ export function Home() {
               />
             </>
           ) : null}
+          <SameTokensWarning />
         </PageContainer>
       </Layout>
       {isExpandable ? (

diff --git a/widget/embedded/src/types/quote.ts b/widget/embedded/src/types/quote.ts
@@ -51,7 +51,6 @@ export enum QuoteWarningType {
   UNKNOWN_PRICE,
   INSUFFICIENT_SLIPPAGE,
   HIGH_SLIPPAGE,
-  SAME_TOKENS,
 }
 
 export enum QuoteUpdateType {
@@ -101,16 +100,11 @@ export type UnknownPriceWarning = {
   type: QuoteWarningType.UNKNOWN_PRICE;
 };
 
-export type SameTokensWarning = {
-  type: QuoteWarningType.SAME_TOKENS;
-};
-
 export type QuoteWarning =
   | HighValueLossWarning
   | InsufficientSlippageWarning
   | HighSlippageWarning
-  | UnknownPriceWarning
-  | SameTokensWarning;
+  | UnknownPriceWarning;
 
 export type ConfirmSwapWarnings = {
   quote: QuoteWarning | null;