add error type for 429 too many requests (#62)

Author: mindofmar

src/components/simulation/Error.tsx

@@ -10,6 +10,7 @@ import GeneralErrorComponent from './SimulationSubComponents/errors/GeneralError
 import InsufficientFundsComponent from './SimulationSubComponents/errors/InsufficientFundsError';
 import RevertComponent from './SimulationSubComponents/errors/RevertError';
 import UnauthorizedComponent from './SimulationSubComponents/errors/UnauthorizedError';
+import RateLimitedError from './SimulationSubComponents/errors/RateLimitedError';
 
 interface ErrorComponentProps {
   currentSimulation: StoredSimulation;
@@ -32,6 +33,8 @@ export const ErrorComponent = (props: ErrorComponentProps) => {
         return <InsufficientFundsComponent currentSimulation={currentSimulation} />;
       case ErrorType.Revert:
         return <RevertComponent currentSimulation={currentSimulation} />;
+      case ErrorType.TooManyRequests:
+        return <RateLimitedError currentSimulation={currentSimulation} />;
       default:
         return <GeneralErrorComponent currentSimulation={currentSimulation} />;
     }

src/components/simulation/SimulationSubComponents/errors/RateLimitedError.tsx

@@ -0,0 +1,28 @@
+import React from 'react';
+import styles from '../../simulation.module.css';
+import ErrorTextComponent from './ErrorText';
+import { ErrorComponentProps } from './GeneralError';
+
+export default function RateLimitedError(props: ErrorComponentProps) {
+  return (
+    <div className="row pt-5 text-center pl-4 pr-4">
+      <div className="col-12">
+        <h4 className={`${styles['font-archivo-medium']} pb-3`} style={{ color: 'white', marginBottom: '20px' }}>
+          Too many requests
+        </h4>
+      </div>
+      <div className="col-12 text-center">
+        <p
+          className={`${styles['font-archivo-medium']}`}
+          style={{
+            color: 'white',
+            fontSize: '16px',
+          }}
+        >
+          We've received a lot of requests recently. Please try again in an hour.
+        </p>
+      </div>
+      <ErrorTextComponent currentSimulation={props.currentSimulation} />
+    </div>
+  );
+}

src/lib/simulation/server.ts

@@ -41,6 +41,15 @@ export const fetchSimulate = async (args: TransactionArgs): Promise<Response> =>
           extraData: null
         }
       };
+    } else if (result.status === 429) {
+      return {
+        type: ResponseType.Error,
+        error: {
+          type: ErrorType.TooManyRequests,
+          message: "TooManyRequests",
+          extraData: null
+        }
+      }
     }
 
     const data: SimulationErrorResponse = await result.json();
@@ -99,6 +108,15 @@ export const fetchSignature = async (
           extraData: null
         }
       };
+    } else if (result.status === 429) {
+      return {
+        type: ResponseType.Error,
+        error: {
+          type: ErrorType.TooManyRequests,
+          message: "TooManyRequests",
+          extraData: null
+        }
+      }
     }
 
     const data: SimulationErrorResponse = await result.json();

src/models/simulation/Transaction.ts

@@ -101,6 +101,7 @@ export enum ErrorType {
   InsufficientFunds = 'INSUFFICIENT_FUNDS',
   MaxFeePerGasLessThanBlockBaseFee = 'MAX_FEE_PER_GAS_LESS_THAN_BLOCK_BASE_FEE',
   Revert = 'REVERT',
+  TooManyRequests = 'TOO_MANY_REQUESTS',
   GeneralError = 'ERROR',
   UnknownError = "UNKNOWN_ERROR"
 }