feat: use user selected gas speed for price calculations

Author: kimpers

ts/hooks/use_allowance.ts

@@ -40,8 +40,8 @@ export const useAllowance = (): UseAllowanceHookResult => {
         setIsStarted(true);
         const ownerAddress = (providerState.account as AccountReady).address;
 
-        // const localStorageSpeed = localStorage.getItem('gas-speed');
-        const gasInfo = await backendClient.getGasInfoAsync();
+        const localStorageSpeed = localStorage.getItem('gas-speed');
+        const gasInfo = await backendClient.getGasInfoAsync(localStorageSpeed);
 
         const contractAddresses = getContractAddressesForChainOrThrow(networkId);
         const erc20ProxyAddress = contractAddresses.erc20Proxy;

ts/hooks/use_stake.ts

@@ -118,8 +118,8 @@ export const useStake = (networkId: ChainId, providerState: ProviderState): UseS
         async (data: string[]) => {
             setLoadingState(TransactionLoadingState.WaitingForSignature);
 
-            // const localStorageSpeed = localStorage.getItem('gas-speed');
-            const gasInfo = await backendClient.getGasInfoAsync();
+            const localStorageSpeed = localStorage.getItem('gas-speed');
+            const gasInfo = await backendClient.getGasInfoAsync(localStorageSpeed);
             const txPromise = stakingProxyContract.batchExecute(data).awaitTransactionSuccessAsync({
                 from: ownerAddress,
                 maxFeePerGas: gasInfo.maxFeePerGas,
@@ -251,7 +251,8 @@ export const useStake = (networkId: ChainId, providerState: ProviderState): UseS
 
             setLoadingState(TransactionLoadingState.WaitingForSignature);
 
-            const gasInfo = await backendClient.getGasInfoAsync();
+            const localStorageSpeed = localStorage.getItem('gas-speed');
+            const gasInfo = await backendClient.getGasInfoAsync(localStorageSpeed);
 
             const txPromise = stakingContract.unstake(zrxAmountBaseUnits).awaitTransactionSuccessAsync({
                 from: ownerAddress,

ts/pages/governance/vote_form.tsx

@@ -274,8 +274,8 @@ class VoteFormComponent extends React.Component<Props> {
 
             const { votePreference } = this.state;
 
-            // const localStorageSpeed = localStorage.getItem('gas-speed');
-            const gasInfo = await backendClient.getGasInfoAsync();
+            const localStorageSpeed = localStorage.getItem('gas-speed');
+            const gasInfo = await backendClient.getGasInfoAsync(localStorageSpeed);
 
             const txPromise = contract
                 .castVote(

ts/utils/backend_client.ts

@@ -205,10 +205,10 @@ export const backendClient = {
         return data;
     },
 
-    async getGasInfoAsync(speed?: GasSpeedSelectors): Promise<GasInfo> {
+    async getGasInfoAsync(speed?: string): Promise<GasInfo> {
         const gasApiPath = 'v2/source/block_native';
         const gasInfoReq: Promise<GasApiSingleSourceResponse> = fetchUtils.requestAsync(ZEROEX_GAS_API, gasApiPath);
-        const speedInput: GasSpeedSelectors = speed || 'standard';
+        const speedInput = speed || 'standard';
 
         const gasWaitTimesReq = fetchUtils.requestAsync(utils.getBackendBaseUrl(), ETH_GAS_STATION_ENDPOINT);
 
@@ -220,7 +220,12 @@ export const backendClient = {
         const waitTime = speedToWaitTimeMap[speedInput];
         const estimatedTimeMs = (gasWaitTimes as any)[waitTime] * 60 * 1000; // Minutes to MS
 
-        return { ...gasInfo.result[speedInput], estimatedTimeMs };
+        // Try to use user selected value, fall back to standard if no match
+        const gasPriceInfo = gasInfo.result[speedInput as GasSpeedSelectors]
+            ? gasInfo.result[speedInput as GasSpeedSelectors]
+            : gasInfo.result.standard;
+
+        return { ...gasPriceInfo, estimatedTimeMs };
     },
 
     async getGasInfoSelectionAsync(): Promise<GasInfoSelection> {