Merge branch 'dev' of https://github.com/yieldprotocol/app-v2 into dev

devin.

.env

@@ -4,7 +4,7 @@ REACT_APP_INFURA_KEY_V1=646dc0f33d2449878b28e0afa25267f6
 REACT_APP_RPC_URL_42='https://kovan.infura.io/v3/2af222f674024a0f84b5f0aad0da72a2'
 REACT_APP_RPC_URL_1='https://mainnet.infura.io/v3/2af222f674024a0f84b5f0aad0da72a2'
 REACT_APP_RPC_URL_4='https://rinkeby.infura.io/v3/2af222f674024a0f84b5f0aad0da72a2'
-REACT_APP_RPC_URL_10='https://optimism-mainnet.infura.io/v3/82c9d66897df4cf7a9e74ab44826affe'
-REACT_APP_RPC_URL_69='https://optimism-kovan.infura.io/v3/277b589655694280bcb3cd7ebf79032c'
-REACT_APP_RPC_URL_42161='https://arbitrum-mainnet.infura.io/v3/cbbe5034491045709e466f05dcd5ad5a'
-REACT_APP_RPC_URL_421611='https://arbitrum-rinkeby.infura.io/v3/9adffa99cbf64552a492081225822885'
+REACT_APP_RPC_URL_10='https://optimism-mainnet.infura.io/v3/2af222f674024a0f84b5f0aad0da72a2'
+REACT_APP_RPC_URL_69='https://optimism-kovan.infura.io/v3/2af222f674024a0f84b5f0aad0da72a2'
+REACT_APP_RPC_URL_42161='https://arbitrum-mainnet.infura.io/v3/2af222f674024a0f84b5f0aad0da72a2'
+REACT_APP_RPC_URL_421611='https://arbitrum-rinkeby.infura.io/v3/2af222f674024a0f84b5f0aad0da72a2'

README.md

@@ -1,30 +1,15 @@
-# Yield app v2
+# Basic Sample Hardhat Project
 
-## A. Setup Blockchain Environment
+This project demonstrates a basic Hardhat use case. It comes with a sample contract, a test for that contract, a sample script that deploys that contract, and an example of a task implementation, which simply lists the available accounts.
 
-### Option 1: Run development environment locally **(Recommended for now)**
+Try running some of the following tasks:
 
-In a new console:
-
-1. **clone** the environments-v2 repo: `git clone https://github.com/yieldprotocol/environments-v2.git`
-2. **checkout tagged release** `git checkout RC4`
-3. **install** the environment `yarn`
-4. **Start a local hardhat chain instance**: `npx hardhat node`
-5. optional: **Add your testing account** to the list of accounts to be auto-funded with test tokens:
-
-   (edit `externalTestAccounts` array line 32 in file `./environments/development.ts` )
-
-In a new console
-
-1. **Run the dev environment deploy/setup** `npx hardhat run ./environments/development.ts --network localhost`
-
-### Option 2: Use Rinkeby Testnet
-
-No setup required, simply point metamask to the correct network
-
-## B. Run User Interface (this Repo):
-
-Fire up the UI locally:
-
-1. **install and run** `yarn && yarn start`
-2. In the browser, connect metamask to the localhost network, and reset the metamask account (for just in case).
+```shell
+npx hardhat accounts
+npx hardhat compile
+npx hardhat clean
+npx hardhat test
+npx hardhat node
+node scripts/sample-script.js
+npx hardhat help
+```

hardhat.config.js

@@ -0,0 +1,54 @@
+require("@nomiclabs/hardhat-waffle");
+
+// This is a sample Hardhat task. To learn how to create your own go to
+// https://hardhat.org/guides/create-task.html
+task("accounts", "Prints the list of accounts", async (taskArgs, hre) => {
+  const accounts = await hre.ethers.getSigners();
+  for (const account of accounts) {
+    console.log(account.address);
+  }
+});
+
+
+
+/* npx hardhat harvest --whale 0xa29332b560103d52f758b978e0661420a9d40cb5  --token 0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984 */ 
+task("harvest", "Fund accounts by impersonating whales", async (taskArgs, hre) => {
+
+  const topupList = [ '0x1Bd3Abb6ef058408734EA01cA81D325039cd7bcA' ];
+
+  const whaleAddr = taskArgs.whale;
+  const tokenAddr = taskArgs.token;
+
+  await hre.network.provider.request({
+    method: "hardhat_impersonateAccount",
+    params: [taskArgs.whale],
+  });
+
+  const signer = await ethers.getSigner(taskArgs.whale) // UNI whale 0xa29332b560103d52f758b978e0661420a9d40cb5
+  const uniAddr = taskArgs.token; // '0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984'; 
+  // The ERC-20 most simple Contract ABI
+  const erc20Abi = ["function transfer(address to, uint amount)","function balanceOf(address) view returns (uint)",];
+  const uni = new ethers.Contract(uniAddr, erc20Abi, signer);
+  const amount = ethers.utils.parseUnits("1000.0", 18);
+  await Promise.all( topupList.map(async (addr) => { 
+    await uni.transfer( addr, amount);
+    console.log( (await uni.balanceOf(addr)).toString() )
+  }))
+})
+.addParam("whale", "The account's address")
+.addParam("token", "The account's address");
+
+/**
+ * @type import('hardhat/config').HardhatUserConfig
+ */
+module.exports = {
+  solidity: "0.8.4",
+  networks: {
+    hardhat: {
+      chainId: 1,
+      forking: {
+        url: "https://mainnet.infura.io/v3/2af222f674024a0f84b5f0aad0da72a2",
+      }
+    }
+  }
+};

package.json

@@ -59,6 +59,8 @@
     ]
   },
   "devDependencies": {
+    "@nomiclabs/hardhat-ethers": "^2.0.0",
+    "@nomiclabs/hardhat-waffle": "^2.0.1",
     "@testing-library/jest-dom": "^5.14.1",
     "@testing-library/react": "^11.2.7",
     "@testing-library/user-event": "^13.2.1",
@@ -85,6 +87,8 @@
     "eslint-plugin-jsx-a11y": "^6.4.1",
     "eslint-plugin-react": "^7.26.1",
     "eslint-plugin-react-hooks": "^4.2.0",
+    "ethereum-waffle": "^3.2.0\n",
+    "hardhat": "^2.7.0",
     "prettier": "^2.4.1",
     "react-test-renderer": "^17.0.2",
     "source-map-explorer": "^2.5.2",

scripts/hardhat-script.js

@@ -0,0 +1,32 @@
+// We require the Hardhat Runtime Environment explicitly here. This is optional
+// but useful for running the script in a standalone fashion through `node <script>`.
+//
+// When running the script with `npx hardhat run <script>` you'll find the Hardhat
+// Runtime Environment's members available in the global scope.
+const hre = require("hardhat");
+
+async function main() {
+  // Hardhat always runs the compile task when running scripts with its command
+  // line interface.
+  //
+  // If this script is run directly using `node` you may want to call compile
+  // manually to make sure everything is compiled
+  // await hre.run('compile');
+
+  // We get the contract to deploy
+  const Greeter = await hre.ethers.getContractFactory("Greeter");
+  const greeter = await Greeter.deploy("Hello, Hardhat!");
+
+  await greeter.deployed();
+
+  console.log("Greeter deployed to:", greeter.address);
+}
+
+// We recommend this pattern to be able to use async/await everywhere
+// and properly handle errors.
+main()
+  .then(() => process.exit(0))
+  .catch((error) => {
+    console.error(error);
+    process.exit(1);
+  });

src/components/InfoBite.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { FC } from 'react';
 import { Box, Text } from 'grommet';
 import Skeleton from './wraps/SkeletonWrap';
 
@@ -9,14 +9,17 @@ interface IInfoBite {
   loading?: boolean;
 }
 
-const InfoBite = ({ label, value, icon, loading }: IInfoBite) => (
+const InfoBite: FC<IInfoBite> = ({ label, value, icon, loading, children }) => (
   <Box direction="row" align="center" pad={{ left: 'small', vertical: 'none' }} gap="medium">
     {icon && <Box>{icon}</Box>}
     <Box>
       <Text size="xsmall" color="text-weak">
         {label}
       </Text>
-      <Text size="medium"> {loading ? <Skeleton width={80} height={20} /> : value} </Text>
+      <Box direction="row" gap="xsmall">
+        <Text size="medium"> {loading ? <Skeleton width={80} height={20} /> : value} </Text>
+        {children}
+      </Box>
     </Box>
   </Box>
 );

src/components/buttons/TransactButton.tsx

@@ -4,7 +4,7 @@ import styled from 'styled-components';
 
 const StyledButton = styled(Button)`
   /* height: ${(props: any) => (props.mobile ? '3rem' : '3rem')}; */
-  border: ${(props) => (props.theme.dark ? '#141a1e' : '2px solid white')};
+  border: ${(props) => (props.theme.dark ? '2px solid #141a1e' : '2px solid white')};
 
   :hover {
     transform: scale(1.01);

src/components/selectors/SeriesSelector.tsx

@@ -3,7 +3,7 @@ import { Avatar, Box, Grid, ResponsiveContext, Select, Text } from 'grommet';
 
 import { ethers } from 'ethers';
 import styled from 'styled-components';
-import { ActionType, ISeries, IUserContextActions, IUserContextState } from '../../types';
+import { ActionType, ISeries, IUserContext, IUserContextActions, IUserContextState } from '../../types';
 import { UserContext } from '../../contexts/UserContext';
 import { maxBaseIn, maxBaseOut } from '../../utils/yieldMath';
 import { useApr } from '../../hooks/useApr';
@@ -121,9 +121,10 @@ function SeriesSelector({ selectSeriesLocally, inputValue, actionType, cardLayou
     settingsState: { diagnostics },
   } = useContext(SettingsContext);
 
-  const { userState, userActions }: { userState: IUserContextState; userActions: IUserContextActions } =
-    useContext(UserContext);
-  const { selectedSeries, selectedBase, seriesMap, seriesLoading } = userState;
+  const { userState, userActions }: { userState: IUserContextState; userActions: IUserContextActions } = useContext(
+    UserContext
+  ) as IUserContext;
+  const { selectedSeries, selectedBase, seriesMap, seriesLoading, selectedVault } = userState;
   const [localSeries, setLocalSeries] = useState<ISeries | null>();
   const [options, setOptions] = useState<ISeries[]>([]);
 
@@ -156,31 +157,32 @@ function SeriesSelector({ selectSeriesLocally, inputValue, actionType, cardLayou
 
   /* Keeping options/selection fresh and valid: */
   useEffect(() => {
-    const opts = Array.from(seriesMap.values()) as ISeries[];
+    const opts = Array.from(seriesMap.values());
 
     /* filter out options based on base Id and if mature */
-    let filteredOpts = opts
-      .filter(
-        (_series: ISeries) => _series.baseId === selectedBase?.idToUse && !_series.seriesIsMature
-        // !ignoredSeries?.includes(_series.baseId)
-      )
-      .sort((a: ISeries, b: ISeries) => b.maturity! - a.maturity!);
-
-    /* if required, filter out the globally selected asset and */
+    let filteredOpts = opts.filter(
+      (_series) => _series.baseId === selectedBase?.idToUse && !_series.seriesIsMature
+      // !ignoredSeries?.includes(_series.baseId)
+    );
+
+    /* if within a position, filter out appropriate series based on selected vault or selected series */
     if (selectSeriesLocally) {
-      filteredOpts = filteredOpts.filter((_series: ISeries) => _series.id !== _selectedSeries?.id);
+      filteredOpts = opts
+        .filter((_series) => _series.baseId === selectedSeries?.baseId && !_series.seriesIsMature) // only use selected series' base
+        .filter((_series) => _series.id !== selectedSeries?.id); // filter out current globally selected series
     }
 
-    /* if current selected series is NOT in the list of available series (for a particular base), or bases don't match:
-    set the selected series to null. */
-    if (
-      _selectedSeries &&
-      _selectedSeries.baseId !== selectedBase?.idToUse // )
-    )
-      userActions.setSelectedSeries(null);
-
-    setOptions(filteredOpts.sort((a: ISeries, b: ISeries) => a.maturity - b.maturity));
-  }, [seriesMap, selectedBase, selectSeriesLocally, _selectedSeries, userActions]);
+    setOptions(filteredOpts.sort((a, b) => a.maturity - b.maturity));
+  }, [
+    seriesMap,
+    selectedBase,
+    selectSeriesLocally,
+    _selectedSeries,
+    userActions,
+    selectedSeries,
+    actionType,
+    selectedVault,
+  ]);
 
   const handleSelect = (_series: ISeries) => {
     if (!selectSeriesLocally) {

src/config/assets.ts

@@ -56,4 +56,4 @@ ASSET_INFO.set('stETH', {
 });
 
 ASSET_INFO.set('LINK', { showToken: true, isWrappedToken: false, color: '#2A5ADA', digitFormat: 6 });
-ASSET_INFO.set('UNI', { showToken: false, isWrappedToken: false, color: '#FF007A', digitFormat: 6 });
+ASSET_INFO.set('UNI', { showToken: true, isWrappedToken: false, color: '#FF007A', digitFormat: 6 });

src/hooks/viewHelperHooks/useCollateralHelpers.ts

@@ -45,10 +45,10 @@ export const useCollateralHelpers = (
     if (assetPairInfo) {
       /* set the pertinent oracle price */
       setOraclePrice(decimalNToDecimal18(assetPairInfo.pairPrice, assetPairInfo.baseDecimals));
-      
+
       /* set min collaterateralisation ratio */
       setMinCollatRatio(assetPairInfo?.minRatio);
-      setMinCollatRatioPct( (assetPairInfo?.minRatio * 100).toString());
+      setMinCollatRatioPct((assetPairInfo?.minRatio * 100).toString());
 
       /* set min safe coll ratio */
       const _minSafeCollatRatio = assetPairInfo?.minRatio < 1.4 ? 1.5 : assetPairInfo?.minRatio + 1;
@@ -66,7 +66,6 @@ export const useCollateralHelpers = (
       })();
   }, [activeAccount, selectedIlk, setMaxCollateral]);
 
-
   /* handle changes to input values */
   useEffect(() => {
     /* NOTE: this whole function ONLY deals with decimal18, existing values are converted to decimal18 */
@@ -140,7 +139,6 @@ export const useCollateralHelpers = (
     minSafeCollatRatio,
   ]);
 
-
   /* Monitor for undercollaterization/ danger-collateralisation, and set flags if reqd. */
   useEffect(() => {
     parseFloat(collateralizationRatio!) >= minCollatRatio!

src/views/LendPosition.tsx

@@ -196,7 +196,10 @@ const LendPosition = () => {
                       value={
                         fyTokenMarketValue === 'Low liquidity'
                           ? 'Low Liquidity'
-                          : `${cleanValue(fyTokenMarketValue, selectedBase?.digitFormat!)}${selectedBase?.displaySymbol!}`
+                          : `${cleanValue(
+                              fyTokenMarketValue,
+                              selectedBase?.digitFormat!
+                            )} ${selectedBase?.displaySymbol!}`
                       }
                       icon={selectedBase?.image}
                       loading={seriesLoading}