Merge pull request #5822 from EdgeApp/jon/fix/ramp-error-cards

Fix error display in `RampSelectOptionScene`

Author: Jon-edge

src/components/scenes/RampSelectOptionScene.tsx

@@ -154,6 +154,11 @@ export const RampSelectOptionScene: React.FC<Props> = (props: Props) => {
       ? lstrings.trade_option_buy_title
       : lstrings.trade_option_sell_title
 
+  // Only show a single non-fiat provider error when there are no quotes
+  const nonFiatErrors = React.useMemo(() => {
+    return failedQuotes.filter(q => !(q.error instanceof FiatProviderError))
+  }, [failedQuotes])
+
   return (
     <SceneWrapper scroll hasTabs>
       <SceneContainer headerTitle={headerTitle}>
@@ -199,22 +204,12 @@ export const RampSelectOptionScene: React.FC<Props> = (props: Props) => {
                 />
               )
             )}
-            {failedQuotes.map(quoteError => {
-              const error = quoteError.error
-              if (error instanceof FiatProviderError) {
-                // Ignore known FiatProviderErrors
-                return null
-              }
-
-              // We should communicate all unknown errors to the user for
-              // reporting purposes.
-              return (
-                <ErrorCard
-                  key={`error-${quoteError.pluginId}`}
-                  error={quoteError.error}
-                />
-              )
-            })}
+            {allQuotes.length === 0 && nonFiatErrors.length > 0 ? (
+              <ErrorCard
+                key="ramp-quotes-error"
+                error={nonFiatErrors[0].error}
+              />
+            ) : null}
           </>
         )}
       </SceneContainer>

src/hooks/useRampQuotes.ts

@@ -58,7 +58,7 @@ export const useRampQuotes = ({
           try {
             const quotes = await runWithTimeout(
               plugin.fetchQuotes(rampQuoteRequest),
-              10000
+              15000
             )
             return { ok: true, value: quotes }
           } catch (error) {

src/locales/en_US.ts

@@ -1364,7 +1364,7 @@ const strings = {
   error_unexpected_title: 'Unexpected Error',
   error_kyc_required_s: 'KYC required: %s',
   error_generic_message:
-    'An unexpected error occurred. Please try again later.',
+    'An unexpected error occurred. Please check your network connection and try again later.',
 
   export_transaction_date_range: 'Date Range',
   export_transaction_export_type: 'Export Type',

src/locales/strings/enUS.json

@@ -1070,7 +1070,7 @@
   "error_boundary_help_button": "Help Closing App",
   "error_unexpected_title": "Unexpected Error",
   "error_kyc_required_s": "KYC required: %s",
-  "error_generic_message": "An unexpected error occurred. Please try again later.",
+  "error_generic_message": "An unexpected error occurred. Please check your network connection and try again later.",
   "export_transaction_date_range": "Date Range",
   "export_transaction_export_type": "Export Type",
   "export_transaction_this_month": "This Month",