fix: show error message when token is not found (#6057)

* fix: show error message when token is not found

* fix: make onContinue optional

src/components/TokenSafety/index.tsx

@@ -4,7 +4,7 @@ import { ButtonPrimary } from 'components/Button'
 import { AutoColumn } from 'components/Column'
 import CurrencyLogo from 'components/Logo/CurrencyLogo'
 import TokenSafetyLabel from 'components/TokenSafety/TokenSafetyLabel'
-import { checkWarning, getWarningCopy, TOKEN_SAFETY_ARTICLE, Warning } from 'constants/tokenSafety'
+import { checkWarning, getWarningCopy, TOKEN_SAFETY_ARTICLE, Warning, WARNING_LEVEL } from 'constants/tokenSafety'
 import { useToken } from 'hooks/Tokens'
 import { ExternalLink as LinkIconFeather } from 'react-feather'
 import { Text } from 'rebass'
@@ -77,7 +77,7 @@ const Buttons = ({
   showCancel,
 }: {
   warning: Warning
-  onContinue: () => void
+  onContinue?: () => void
   onCancel: () => void
   onBlocked?: () => void
   showCancel?: boolean
@@ -251,9 +251,13 @@ export default function TokenSafety({
       <Trans>Learn more</Trans>
     </StyledExternalLink>
   )
+  const tokenNotFoundWarning = {
+    level: WARNING_LEVEL.UNKNOWN,
+    message: <Trans>Token not found</Trans>,
+    canProceed: false,
+  }
 
-  return (
-    displayWarning && (
+  return displayWarning ? (
     <Wrapper>
       <Container>
         <AutoColumn>
@@ -277,6 +281,19 @@ export default function TokenSafety({
         />
       </Container>
     </Wrapper>
-    )
+  ) : (
+    <Wrapper>
+      <Container>
+        <ShortColumn>
+          <SafetyLabel warning={tokenNotFoundWarning} />
+        </ShortColumn>
+        <ShortColumn>
+          <InfoText>
+            {heading} {description} {learnMoreUrl}
+          </InfoText>
+        </ShortColumn>
+        <Buttons warning={tokenNotFoundWarning} onCancel={onCancel} showCancel={true} />
+      </Container>
+    </Wrapper>
   )
 }