merge: bring reward page in sync with master (#355)

* remove banner (#275) Signed-off-by: Tulun <[email protected]> Signed-off-by: Tulun <[email protected]> * improve(storybook): add global styles to all preview tabs (#268) * improve: add global styles to all preview tabs * fix: pool removal crashing with small amounts (#274) * improve: Remove debug level logs from API (#271) These logs print every time API is requested, please comment if there are any logs worth keeping * feat: Disable Bridge when REACT_APP_DISABLE_BRIDGE is set to 1 (truthy). (#272) * error shows. Signed-off-by: Tulun <[email protected]> * disable send tx and show disabled button. Signed-off-by: Tulun <[email protected]> * documentation Signed-off-by: Tulun <[email protected]> * slightly better message. Signed-off-by: Tulun <[email protected]> * change only in useSendAction Signed-off-by: Tulun <[email protected]> * early casting of disableBridge; EOL Signed-off-by: Tulun <[email protected]> * force check for 'true' on env Signed-off-by: Tulun <[email protected]> * === true Signed-off-by: Tulun <[email protected]> Signed-off-by: Tulun <[email protected]> * feat: additional delay calc logic configurable by REACT_APP_DEPOSIT_DELAY (#278) * Give time estimate for eth2 Signed-off-by: Tulun <[email protected]> * 6-7 mins Signed-off-by: Tulun <[email protected]> * fromChain added Signed-off-by: Tulun <[email protected]> * env example Signed-off-by: Tulun <[email protected]> * start to build func Signed-off-by: Tulun <[email protected]> * time range calc. Signed-off-by: Tulun <[email protected]> * Add comment. Signed-off-by: Tulun <[email protected]> * define calc once. Signed-off-by: Tulun <[email protected]> * refactor; adjusted incorrect times Signed-off-by: Tulun <[email protected]> * fix wrong key Signed-off-by: Tulun <[email protected]> * remove log Signed-off-by: Tulun <[email protected]> * Refactor * Update bridge.ts * test log Signed-off-by: Tulun <[email protected]> * temp log Signed-off-by: Tulun <[email protected]> * seperate logs Signed-off-by: Tulun <[email protected]> * refactor * Remove console.logs Signed-off-by: Tulun <[email protected]> Co-authored-by: nicholaspai <[email protected]> * fix: Disable all routes in API (#270) * fix: Disable all routes in API To prepare for merge, disable all API routes * Revert "fix: Disable all routes in API" This reverts commit 00c08fe. * Refactor * Revert "Refactor" This reverts commit 096fd52. * Refactor * Revert "fix: Disable all routes in API (#270)" (#279) This reverts commit 95f0034. * chore(package): Use Across SDK-v2 v0.1.25 (#276) This changes the behaviour of the Coingecko class, which should be primarily visible in the backend/API coingecko endpoint. * fix: port relayer fee logic to API (#256) * feat: add start of api utility to call endpoints * refactor: add fromChain to API calls * feat: add start of api utility to call endpoints * refactor: add fromChain to API calls * feat: replace sdk call with api reference * debug: add temp logging * fix: update fixed point division * feat(api): expose three new fields from response The total fees from the relayFeeCalculator are also dependent on the current price of the token. In most cases, this is a non-issue because ETH is the base price. However, in the singular case of MATIC, the total amount must also be multiplied by the price of MATIC/ETH. To prevent needing this value to be calculated on the FE, this value can be exposed in the JSON payload of /suggested-fees * feat: resolve new data fields from the API * improve: add too low data from api * fix(api): remove errant price cache Before this commit, the cached CG price was being used as a overrided value to the getRelayerfeeDetails. This works for all the chains whose basis currency is ETH. However, this will fail for MATIC, because the price in the PolygonQueries is determined by a basis currency of MATIC. * docs: add relevant comments * fix(test): Add env to mock serverless API * feat: add mock and prod api function designation * chore(across-v2): Bump SDK -> 0.1.26 (#280) - Less logging, and longer timeout on CoinGecko price lookups. * ci: 🧑‍💻 chromatic publish on specific label (#281) * feat: speed up modal (#260) * feat: speed up modal * chore: bump sdk to version with speed up support * ui tweaks * improve: hover on data row * fix: zap style tweaks * feat: add basic success content * fix: mobile friendly speed up * refactor: adjust min and max inputs * refactor: tweak input validation * fix: notify speed up on different chain * fix: stats box * fixup * fix: notify singleton usage * fix: replace notify with wait * improve: code quality - usage of closures for formatter - usage of `Boolean` instead of `!!` - usage of `else if` instead of `if` - usage of `weiSafe` * feat: add useNotify hook * fixup * refactor: improve intention fo formatWeiPct * improve: file structure * build: fix from merge commit * feat: Add Header + Footer to storybook; Include solution for react-context. (#288) * Footer story works; Header WIP. Signed-off-by: Tulun <[email protected]> * footer only. Signed-off-by: Tulun <[email protected]> * Header story works. Signed-off-by: Tulun <[email protected]> * wired up controls. Signed-off-by: Tulun <[email protected]> * improve: Abstracted useConnection into own hook as it has no ref to redux anymore. Signed-off-by: Tulun <[email protected]> * remove ref Signed-off-by: Tulun <[email protected]> Signed-off-by: Tulun <[email protected]> * fix: remove max relayer fee button (#289) Remove button for now, until better suited function is found. * feat(api): Exit early from debug level logs if boolean is switched on (#291) * feat(api): Exit early from debug level logs if boolean is switched on Vercel logging can be expensive and we're not in control of when clients trigger the API that log. We should be able to turn off non-critical logs with a boolean flip easily * Update _utils.ts * Update _utils.ts * Add lazy loading routes (#259) * fix: change typing of bouncetype (#295) * Close sidebar on click outside (#262) * improve: deleted unused logos (#346) * removed a couple unused logos Signed-off-by: Tulun <[email protected]> * more unused icons Signed-off-by: Tulun <[email protected]> * more unnec logos Signed-off-by: Tulun <[email protected]> Signed-off-by: Tulun <[email protected]> * fix: Start separating functions for unit testing (#350) * toWeiSafe works Signed-off-by: Tulun <[email protected]> * Addresses can be checked independently; odd import is screwing up other test. Signed-off-by: Tulun <[email protected]> * save wip Signed-off-by: Tulun <[email protected]> * address.test.ts Signed-off-by: Tulun <[email protected]> * update imports Signed-off-by: Tulun <[email protected]> * Fixed import issue Signed-off-by: Tulun <[email protected]> * test env Signed-off-by: Tulun <[email protected]> * removed unnec jest config stuff Signed-off-by: Tulun <[email protected]> * add to GH actions Signed-off-by: Tulun <[email protected]> * syntax Signed-off-by: Tulun <[email protected]> Signed-off-by: Tulun <[email protected]> * test: Adding tests for generic hooks (#351) * window size hook Signed-off-by: Tulun <[email protected]> * usePrevious test Signed-off-by: Tulun <[email protected]> * useScrollPosition Signed-off-by: Tulun <[email protected]> * split test Signed-off-by: Tulun <[email protected]> Signed-off-by: Tulun <[email protected]> * feat: add a way to specify an override provider for the API (#352) * improve: allow canonical linking in deep-link (#336) * feat: ✨ crate a mapping of string to numeric chain id * feat: ✨ add fns to resolve canonical name * improve: enable canonical name linking in from/to * fix: remove typecast * improve: hoist undefined logic into calling fn * improve: add conditional * improve: add doc comment * fix: resolve build conflict * fix: change useConnection location Signed-off-by: Tulun <[email protected]> Co-authored-by: Jason Kiraly <[email protected]> Co-authored-by: David A <[email protected]> Co-authored-by: nicholaspai <[email protected]> Co-authored-by: nicholaspai <[email protected]> Co-authored-by: Paul <[email protected]> Co-authored-by: Dong-Ha Kim <[email protected]> Co-authored-by: Anastasios <[email protected]> Co-authored-by: Matt Rice <[email protected]>
across-protocol · Oct 11, 2022 · 455e952 · 455e952
1 parent 0749867
commit 455e952
Show file tree

Hide file tree

Showing 120 changed files with 2,372 additions and 987 deletions.
diff --git a/.env.example b/.env.example
@@ -70,4 +70,13 @@ HARDHAT_INFURA_ID=
 REACT_APP_GENERAL_MAINTENANCE_MESSAGE="Message to display in top banner."
 
 # Publish to Storybook manually by adding the frontend-v2 chromatic project id
-CHROMATIC_PROJECT_TOKEN = 
+CHROMATIC_PROJECT_TOKEN= 
+
+# Disable bridge send transactions in UI and show an error when this is set to `true`.
+REACT_APP_BRIDGE_DISABLED= 
+
+# Disable and mock the serverless API. Note: for testing purposes
+REACT_APP_MOCK_SERVERLESS=
+
+# JSON string with format: {[chainId]: numberInMinutes}, eg: { "1": 2, "10": 2, "137": 2, "288": 2, "42161": 2 }
+REACT_APP_DEPOSIT_DELAY=
diff --git a/.env.test b/.env.test
@@ -0,0 +1,2 @@
+REACT_APP_V_ETH=0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045
+REACT_APP_UMA_ADDRESS=0x04Fa0d235C4abf4BcF4787aF4CF447DE572eF828
diff --git a/.github/workflows/chromatic.yaml b/.github/workflows/chromatic.yaml
@@ -4,27 +4,44 @@ name: Chromatic
 on:
   # manual trigger
   workflow_dispatch:
-  push:
-    branches:
-      - master
   pull_request:
-    branches:
-      - master
 
 # List of jobs
 jobs:
   chromatic-deployment:
+    if: ${{ contains( github.event.pull_request.labels.*.name, 'storybook') }} 
     # Operating System
     runs-on: ubuntu-latest
     # Job steps
     steps:
-      - uses: actions/checkout@v1
-      - name: Install dependencies
-        run: yarn
-        # 👇 Adds Chromatic as a step in the workflow
+      - uses: actions/checkout@v3
+        with: 
+          fetch-depth: 0
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 16
+          registry-url: https://registry.npmjs.org
+          cache: yarn
+
+      - uses: actions/cache@v3
+        id: yarn-cache
+        with:
+          path: node_modules/
+          key: ${{ runner.os }}-install-${{ hashFiles('**/yarn.lock') }}
+
+      - if: steps.yarn-cache.outputs.cache-hit != 'true'
+        run: yarn install --frozen-lockfile --ignore-scripts
+        shell: bash
       - name: Publish to Chromatic
         uses: chromaui/action@v1
+        env:
+          REACT_APP_PUBLIC_INFURA_ID: ${{ secrets.CYPRESS_PUBLIC_INFURA_ID }}
+          REACT_APP_PUBLIC_ONBOARD_API_KEY: ${{ secrets.CYPRESS_PUBLIC_ONBOARD_API_KEY }}
+          REACT_APP_REWARDS_API_URL: ${{ secrets.CYPRESS_REWARDS_API_URL }}
+          REACT_APP_CHAIN_137_PROVIDER_URL: ${{ secrets.CYPRESS_CHAIN_137_PROVIDER_URL }}
+          REACT_APP_CHAIN_42161_PROVIDER_URL: ${{ secrets.CYPRESS_CHAIN_42161_PROVIDER_URL }}
         # Chromatic GitHub Action options
         with:
           # 👇 Chromatic projectToken, refer to the manage page to obtain it.
           projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
+          exitZeroOnChanges: true
diff --git a/.github/workflows/lint-test.yaml b/.github/workflows/lint-test.yaml
@@ -23,7 +23,15 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - uses: ./.github/actions/setup
-      - run: yarn test
+      - name: Unit tests
+        env:
+          REACT_APP_PUBLIC_INFURA_ID: ${{ secrets.CYPRESS_PUBLIC_INFURA_ID }}
+          REACT_APP_PUBLIC_ONBOARD_API_KEY: ${{ secrets.CYPRESS_PUBLIC_ONBOARD_API_KEY }}
+          REACT_APP_REWARDS_API_URL: ${{ secrets.CYPRESS_REWARDS_API_URL }}
+          REACT_APP_CHAIN_137_PROVIDER_URL: ${{ secrets.CYPRESS_CHAIN_137_PROVIDER_URL }}
+          REACT_APP_CHAIN_42161_PROVIDER_URL: ${{ secrets.CYPRESS_CHAIN_42161_PROVIDER_URL }}
+          REACT_APP_MOCK_SERVERLESS: true
+        run: yarn test
 
   cypress-tests:
     runs-on: ubuntu-latest
@@ -56,6 +64,7 @@ jobs:
           REACT_APP_REWARDS_API_URL: ${{ secrets.CYPRESS_REWARDS_API_URL }}
           REACT_APP_CHAIN_137_PROVIDER_URL: ${{ secrets.CYPRESS_CHAIN_137_PROVIDER_URL }}
           REACT_APP_CHAIN_42161_PROVIDER_URL: ${{ secrets.CYPRESS_CHAIN_42161_PROVIDER_URL }}
+          REACT_APP_MOCK_SERVERLESS: true
         run: yarn build
       - name: Cypress run Chrome
         uses: cypress-io/github-action@v4

diff --git a/.storybook/main.js b/.storybook/main.js
@@ -5,9 +5,25 @@ module.exports = {
     "@storybook/addon-essentials",
     "@storybook/addon-interactions",
     "@storybook/preset-create-react-app",
+    "storybook-addon-react-router-v6",
   ],
   framework: "@storybook/react",
   core: {
     builder: "webpack4",
   },
+  // Note: by default, storybook only forwards environment variables that
+  //       take the form /^STORYBOOK_/ . The code below creates a 1:1 mapping
+  //       of the /^REACT_APP_/ environment variables so that this Storybook
+  //       instance can run.
+  //
+  //       This clears an error in which storybook cannot publish to Chromatic
+  //
+  //       Relevant Storybook Docs: https://storybook.js.org/docs/react/configure/environment-variables
+  env: (config) => ({
+    ...config,
+    ...Object.keys(process.env).reduce((accumulator, envKey) => {
+      if (/^REACT_APP_/.test(envKey)) accumulator[envKey] = process.env[envKey];
+      return accumulator;
+    }, {}),
+  }),
 };
diff --git a/.storybook/preview.js b/.storybook/preview.js
@@ -1,6 +1,29 @@
 import { Buffer } from "buffer";
+import { addDecorator } from "@storybook/react";
+import { default as GlobalStyles } from "components/GlobalStyles/GlobalStyles";
+import { OnboardContext, useOnboardManager } from "hooks/useOnboard";
+
+import { MemoryRouter } from "react-router";
+addDecorator((story) => (
+  <MemoryRouter initialEntries={["/"]}>{story()}</MemoryRouter>
+));
+
 window.Buffer = Buffer;
+addDecorator((s) => (
+  <>
+    <GlobalStyles />
+    {s()}
+  </>
+));
+
+const OnboardDecorator = (storyFn) => {
+  const value = useOnboardManager();
+  return (
+    <OnboardContext.Provider value={value}>{storyFn()}</OnboardContext.Provider>
+  );
+};
 
+addDecorator(OnboardDecorator);
 export const parameters = {
   actions: { argTypesRegex: "^on[A-Z].*" },
   controls: {

diff --git a/api/_utils.ts b/api/_utils.ts
@@ -23,6 +23,7 @@ const {
   REACT_APP_GOOGLE_SERVICE_ACCOUNT,
   VERCEL_ENV,
   GAS_MARKUP,
+  DISABLE_DEBUG_LOGS,
 } = process.env;
 
 const GOOGLE_SERVICE_ACCOUNT = REACT_APP_GOOGLE_SERVICE_ACCOUNT
@@ -44,6 +45,10 @@ export const log = (
   severity: "DEBUG" | "INFO" | "WARN" | "ERROR",
   data: LogType
 ) => {
+  if (DISABLE_DEBUG_LOGS === "true" && severity === "DEBUG") {
+    console.log(data);
+    return;
+  }
   let message = JSON.stringify(data, null, 4);
   // Fire and forget. we don't wait for this to finish.
   gcpLogger
@@ -127,13 +132,6 @@ export const getTokenDetails = async (
     "0xc186fA914353c44b2E33eBE05f21846F1048bEda",
     provider
   );
-  getLogger().debug({
-    at: "getTokenDetails",
-    message: "Fetching token details",
-    l1Token,
-    l2Token,
-    chainId,
-  });
 
   // 2 queries: treating the token as the l1Token or treating the token as the L2 token.
   const l2TokenFilter = hubPool.filters.SetPoolRebalanceRoute(
@@ -158,11 +156,6 @@ export const getTokenDetails = async (
   });
 
   const event = events[0];
-  getLogger().debug({
-    at: "getTokenDetails",
-    message: "Fetched pool rebalance route event",
-    event,
-  });
 
   return {
     hubPool,
@@ -181,11 +174,6 @@ export class InputError extends Error {}
  */
 export const infuraProvider = (name: string) => {
   const url = `https://${name}.infura.io/v3/${REACT_APP_PUBLIC_INFURA_ID}`;
-  getLogger().info({
-    at: "infuraProvider",
-    message: "Using an Infura provider",
-    url,
-  });
   return new ethers.providers.StaticJsonRpcProvider(url);
 };
 
@@ -196,6 +184,21 @@ export const infuraProvider = (name: string) => {
 export const bobaProvider = (): providers.StaticJsonRpcProvider =>
   new ethers.providers.StaticJsonRpcProvider("https://mainnet.boba.network");
 
+/**
+ * Resolves a fixed Static RPC provider if an override url has been specified.
+ * @returns A provider or undefined if an override was not specified.
+ */
+export const overrideProvider = (
+  chainId: string
+): providers.StaticJsonRpcProvider | undefined => {
+  const url = process.env[`OVERRIDE_PROVIDER_${chainId}`];
+  if (url) {
+    return new ethers.providers.StaticJsonRpcProvider(url);
+  } else {
+    return undefined;
+  }
+};
+
 /**
  * Generates a fixed HubPoolClientConfig object
  * @returns A fixed constant
@@ -313,11 +316,6 @@ export const getRelayerFeeCalculator = (destinationChainId: number) => {
     queries: queryFn(),
     capitalCostsConfig: relayerFeeCapitalCostConfig,
   };
-  getLogger().info({
-    at: "getRelayerFeeDetails",
-    message: "Relayer fee calculator config",
-    relayerFeeCalculatorConfig,
-  });
   return new sdk.relayFeeCalculator.RelayFeeCalculator(
     relayerFeeCalculatorConfig,
     logger
@@ -364,15 +362,14 @@ export const getRelayerFeeDetails = (
  * @param l1Token The ERC20 token address of the coin to find the cached price of
  * @returns The price of the `l1Token` token.
  */
-export const getCachedTokenPrice = async (l1Token: string): Promise<number> => {
-  getLogger().debug({
-    at: "getCachedTokenPrice",
-    message: `Resolving price from ${resolveVercelEndpoint()}/api/coingecko`,
-  });
+export const getCachedTokenPrice = async (
+  l1Token: string,
+  baseCurrency: string = "eth"
+): Promise<number> => {
   return Number(
     (
       await axios(`${resolveVercelEndpoint()}/api/coingecko`, {
-        params: { l1Token },
+        params: { l1Token, baseCurrency },
       })
     ).data.price
   );
@@ -388,24 +385,29 @@ export const providerCache: Record<string, StaticJsonRpcProvider> = {};
 export const getProvider = (_chainId: number): providers.Provider => {
   const chainId = _chainId.toString();
   if (!providerCache[chainId]) {
-    switch (chainId.toString()) {
-      case "1":
-        providerCache[chainId] = infuraProvider("mainnet");
-        break;
-      case "10":
-        providerCache[chainId] = infuraProvider("optimism-mainnet");
-        break;
-      case "137":
-        providerCache[chainId] = infuraProvider("polygon-mainnet");
-        break;
-      case "288":
-        providerCache[chainId] = bobaProvider();
-        break;
-      case "42161":
-        providerCache[chainId] = infuraProvider("arbitrum-mainnet");
-        break;
-      default:
-        throw new Error(`Invalid chainId provided: ${chainId}`);
+    const override = overrideProvider(chainId);
+    if (override) {
+      providerCache[chainId] = override;
+    } else {
+      switch (chainId.toString()) {
+        case "1":
+          providerCache[chainId] = infuraProvider("mainnet");
+          break;
+        case "10":
+          providerCache[chainId] = infuraProvider("optimism-mainnet");
+          break;
+        case "137":
+          providerCache[chainId] = infuraProvider("polygon-mainnet");
+          break;
+        case "288":
+          providerCache[chainId] = bobaProvider();
+          break;
+        case "42161":
+          providerCache[chainId] = infuraProvider("arbitrum-mainnet");
+          break;
+        default:
+          throw new Error(`Invalid chainId provided: ${chainId}`);
+      }
     }
   }
   return providerCache[chainId];
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		REACT_APP_V_ETH=0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045
		REACT_APP_UMA_ADDRESS=0x04Fa0d235C4abf4BcF4787aF4CF447DE572eF828