Merge branch 'develop' of github.com:decentdao/fractal-interface into…

… refactor-root-reskin
decentdao · Apr 12, 2024 · 46ac977 · 46ac977
2 parents e94e640 + c18bfdf
commit 46ac977
Show file tree

Hide file tree

Showing 122 changed files with 868 additions and 827 deletions.
diff --git a/.env b/.env
@@ -16,6 +16,8 @@ VITE_APP_ALCHEMY_SEPOLIA_API_KEY=""
 VITE_APP_ALCHEMY_BASE_SEPOLIA_API_KEY=""
 # Alchemy provider API key, used on Base
 VITE_APP_ALCHEMY_BASE_API_KEY=""
+# Alchemy provider API key, used on Optimism
+VITE_APP_ALCHEMY_OPTIMISM_API_KEY=""
 # Alchemy automated testing workflows
 VITE_APP_ALCHEMY_TESTING_API_KEY=""
 
@@ -29,6 +31,8 @@ VITE_APP_ETHERSCAN_SEPOLIA_API_KEY=""
 VITE_APP_ETHERSCAN_BASE_SEPOLIA_API_KEY=""
 # ABI selector, used on Base
 VITE_APP_ETHERSCAN_BASE_API_KEY=""
+# ABI selector, used on Optimism
+VITE_APP_ETHERSCAN_OPTIMISM_API_KEY=""
 
 # IPFS pinning
 VITE_APP_INFURA_IPFS_API_KEY=""

diff --git a/netlify/functions/tokenPrices.mts b/netlify/functions/tokenPrices.mts
@@ -1,6 +1,6 @@
-// eslint-disable-next-line import/named
-import { Store, getStore } from '@netlify/blobs';
-import { ethers } from 'ethers';
+import { getStore } from '@netlify/blobs';
+import type { Store } from '@netlify/blobs';
+import { isAddress } from 'viem';
 
 const PUBLIC_DEMO_API_BASE_URL = 'https://api.coingecko.com/api/v3/';
 const AUTH_QUERY_PARAM = `?x_cg_demo_api_key=${process.env.COINGECKO_API_KEY}`;
@@ -27,7 +27,7 @@ type SupportedNetworks = (typeof SUPPORTED_NETWORKS)[number];
 function sanitizeUserInput(tokensString: string, network: SupportedNetworks) {
   const rawTokenAddresses = tokensString.split(',');
   const needNativeAsset = rawTokenAddresses.map(address => address.toLowerCase()).includes(network);
-  const validTokenAddresses = rawTokenAddresses.filter(address => ethers.utils.isAddress(address));
+  const validTokenAddresses = rawTokenAddresses.filter(address => isAddress(address));
   const lowerCaseTokenAddresses = validTokenAddresses.map(address => address.toLowerCase());
   const tokens = [...new Set(lowerCaseTokenAddresses)];
   if (needNativeAsset) tokens.push(network);

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -9,7 +9,7 @@
     "@emotion/styled": "^11.10.6",
     "@ethersproject/abstract-signer": "^5.7.0",
     "@ethersproject/providers": "^5.7.2",
-    "@fractal-framework/fractal-contracts": "^0.6.0",
+    "@fractal-framework/fractal-contracts": "^0.7.0",
     "@graphprotocol/client-apollo": "^1.0.16",
     "@lido-sdk/contracts": "^3.0.2",
     "@netlify/blobs": "^6.5.0",
@@ -60,7 +60,7 @@
     "dev": "VITE_APP_GIT_HASH=`git rev-parse HEAD` vite --force",
     "start": "vite start",
     "preview": "vite preview",
-    "build": "npm run graphql:build && VITE_APP_GIT_HASH=`git rev-parse HEAD` vite build",
+    "build": "VITE_APP_GIT_HASH=`git rev-parse HEAD` vite build",
     "graphql:build": "graphclient build",
     "graphql:dev-server": "graphclient serve-dev",
     "test": "vitest --dir=test",
@@ -107,4 +107,4 @@
     "url": "^0.11.0",
     "vitest": "^1.2.2"
   }
-}
+}
diff --git a/src/components/CreateProposalTemplate/ProposalTemplateDetails.tsx b/src/components/CreateProposalTemplate/ProposalTemplateDetails.tsx
@@ -73,8 +73,8 @@ export default function ProposalTemplateDetails({
         </HStack>
         <Divider color="chocolate.700" />
         {transactions.map((transaction, i) => {
-          const valueBiggerThanZero = transaction.ethValue.bigNumberValue
-            ? transaction.ethValue.bigNumberValue.gt(0)
+          const valueBiggerThanZero = transaction.ethValue.bigintValue
+            ? transaction.ethValue.bigintValue > 0n
             : false;
           return (
             <Fragment key={i}>

diff --git a/src/components/CreateProposalTemplate/ProposalTemplateTransaction.tsx b/src/components/CreateProposalTemplate/ProposalTemplateTransaction.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next';
 import { CreateProposalTemplateTransaction } from '../../types/createProposalTemplate';
 import ABISelector, { ABIElement } from '../ui/forms/ABISelector';
 import ExampleLabel from '../ui/forms/ExampleLabel';
-import { BigNumberComponent, InputComponent } from '../ui/forms/InputComponent';
+import { BigIntComponent, InputComponent } from '../ui/forms/InputComponent';
 import { DEFAULT_PROPOSAL_TEMPLATE_TRANSACTION } from './constants';
 
 interface ProposalTemplateTransactionProps {
@@ -268,7 +268,7 @@ export default function ProposalTemplateTransaction({
           mt={6}
           pl={10}
         >
-          <BigNumberComponent
+          <BigIntComponent
             label={t('labelEthValue')}
             helper={t('helperEthValue')}
             isRequired={false}
@@ -286,7 +286,7 @@ export default function ProposalTemplateTransaction({
               </VStack>
             }
             errorMessage={undefined}
-            value={transaction.ethValue.bigNumberValue}
+            value={transaction.ethValue.bigintValue}
             onChange={e => {
               setFieldValue(`transactions.${transactionIndex}.ethValue`, e);
             }}

diff --git a/src/components/CreateProposalTemplate/ProposalTemplateTransactions.tsx b/src/components/CreateProposalTemplate/ProposalTemplateTransactions.tsx
@@ -11,7 +11,7 @@ import { ArrowDown, ArrowRight, Minus } from '@decent-org/fractal-ui';
 import { FormikErrors, FormikProps } from 'formik';
 import { Dispatch, SetStateAction } from 'react';
 import { useTranslation } from 'react-i18next';
-import { BigNumberValuePair } from '../../types';
+import { BigIntValuePair } from '../../types';
 import {
   CreateProposalTemplateForm,
   CreateProposalTemplateTransaction,
@@ -46,7 +46,7 @@ export default function ProposalTemplateTransactions({
     >
       {transactions.map((_, index) => {
         const txErrors = errors?.transactions?.[index] as
-          | FormikErrors<CreateProposalTemplateTransaction<BigNumberValuePair>>
+          | FormikErrors<CreateProposalTemplateTransaction<BigIntValuePair>>
           | undefined;
         const txAddressError = txErrors?.targetAddress;
         const txFunctionError = txErrors?.functionName;

diff --git a/src/components/CreateProposalTemplate/constants.ts b/src/components/CreateProposalTemplate/constants.ts
@@ -2,7 +2,7 @@ import { CreateProposalTemplateTransaction } from '../../types/createProposalTem
 
 export const DEFAULT_PROPOSAL_TEMPLATE_TRANSACTION: CreateProposalTemplateTransaction = {
   targetAddress: '',
-  ethValue: { value: '', bigNumberValue: undefined },
+  ethValue: { value: '', bigintValue: undefined },
   functionName: '',
   parameters: [
     {

diff --git a/src/components/DaoCreator/constants.ts b/src/components/DaoCreator/constants.ts
@@ -1,4 +1,3 @@
-import { BigNumber } from 'ethers';
 import {
   CreatorFormState,
   GovernanceType,
@@ -8,6 +7,8 @@ import {
 
 export const DEFAULT_TOKEN_DECIMALS = 18;
 
+// @todo make the time lengths dynamic for whatever real-life values we're targeting here
+
 export const initialState: CreatorFormState = {
   essentials: {
     daoName: '',
@@ -45,7 +46,7 @@ export const initialState: CreatorFormState = {
     ],
     quorumThreshold: {
       value: '10',
-      bigNumberValue: BigNumber.from(10),
+      bigintValue: 10n,
     },
   },
   /**
@@ -58,42 +59,42 @@ export const initialState: CreatorFormState = {
   azorius: {
     quorumPercentage: {
       value: '4',
-      bigNumberValue: BigNumber.from(4),
+      bigintValue: 4n,
     },
     timelock: {
       value: '1440',
-      bigNumberValue: BigNumber.from(1440),
+      bigintValue: 1440n,
     },
     votingPeriod: {
       value: '10080',
-      bigNumberValue: BigNumber.from(10080),
+      bigintValue: 10080n,
     },
     executionPeriod: {
       value: '2880',
-      bigNumberValue: BigNumber.from(2880),
+      bigintValue: 2880n,
     },
     votingStrategyType: VotingStrategyType.LINEAR_ERC20,
   },
   freeze: {
     executionPeriod: {
       value: '2880',
-      bigNumberValue: BigNumber.from(2880),
+      bigintValue: 2880n,
     },
     timelockPeriod: {
       value: '1440',
-      bigNumberValue: BigNumber.from(1440),
+      bigintValue: 1440n,
     },
     freezeVotesThreshold: {
       value: '1',
-      bigNumberValue: BigNumber.from(1),
+      bigintValue: 1n,
     },
     freezeProposalPeriod: {
       value: '10080',
-      bigNumberValue: BigNumber.from(10080),
+      bigintValue: 10080n,
     },
     freezePeriod: {
       value: '10080',
-      bigNumberValue: BigNumber.from(10080),
+      bigintValue: 10080n,
     },
   },
   multisig: {

diff --git a/src/components/DaoCreator/formComponents/AzoriusGovernance.tsx b/src/components/DaoCreator/formComponents/AzoriusGovernance.tsx
@@ -11,7 +11,7 @@ import { Info } from '@decent-org/fractal-ui';
 import { useTranslation } from 'react-i18next';
 import { ICreationStepProps, CreatorSteps, VotingStrategyType } from '../../../types';
 import ContentBoxTitle from '../../ui/containers/ContentBox/ContentBoxTitle';
-import { BigNumberInput } from '../../ui/forms/BigNumberInput';
+import { BigIntInput } from '../../ui/forms/BigIntInput';
 import { LabelComponent } from '../../ui/forms/InputComponent';
 import { StepButtons } from '../StepButtons';
 import { StepWrapper } from '../StepWrapper';
@@ -39,8 +39,8 @@ export function AzoriusGovernance(props: ICreationStepProps) {
           isRequired
         >
           <InputGroup>
-            <BigNumberInput
-              value={values.azorius.votingPeriod.bigNumberValue}
+            <BigIntInput
+              value={values.azorius.votingPeriod.bigintValue}
               onChange={valuePair => setFieldValue('azorius.votingPeriod', valuePair)}
               decimalPlaces={0}
               min="1"
@@ -63,8 +63,8 @@ export function AzoriusGovernance(props: ICreationStepProps) {
             isRequired
           >
             <InputGroup>
-              <BigNumberInput
-                value={values.azorius.quorumPercentage.bigNumberValue}
+              <BigIntInput
+                value={values.azorius.quorumPercentage.bigintValue}
                 onChange={valuePair => setFieldValue('azorius.quorumPercentage', valuePair)}
                 max="100"
                 decimalPlaces={0}
@@ -79,8 +79,8 @@ export function AzoriusGovernance(props: ICreationStepProps) {
             helper={t('helperQuorumThreshold')}
             isRequired
           >
-            <BigNumberInput
-              value={values.erc721Token.quorumThreshold.bigNumberValue}
+            <BigIntInput
+              value={values.erc721Token.quorumThreshold.bigintValue}
               onChange={valuePair => setFieldValue('erc721Token.quorumThreshold', valuePair)}
               decimalPlaces={0}
               min="1"
@@ -94,8 +94,8 @@ export function AzoriusGovernance(props: ICreationStepProps) {
           isRequired
         >
           <InputGroup>
-            <BigNumberInput
-              value={values.azorius.timelock.bigNumberValue}
+            <BigIntInput
+              value={values.azorius.timelock.bigintValue}
               onChange={valuePair => setFieldValue('azorius.timelock', valuePair)}
               decimalPlaces={0}
               data-testid="govConfig-timelock"
@@ -116,8 +116,8 @@ export function AzoriusGovernance(props: ICreationStepProps) {
           isRequired
         >
           <InputGroup>
-            <BigNumberInput
-              value={values.azorius.executionPeriod.bigNumberValue}
+            <BigIntInput
+              value={values.azorius.executionPeriod.bigintValue}
               onChange={valuePair => setFieldValue('azorius.executionPeriod', valuePair)}
               decimalPlaces={0}
               min="1"

diff --git a/src/components/DaoCreator/formComponents/AzoriusNFTDetail.tsx b/src/components/DaoCreator/formComponents/AzoriusNFTDetail.tsx
@@ -2,10 +2,10 @@ import { Flex, Box, Text } from '@chakra-ui/react';
 import { ethers } from 'ethers';
 import { useState, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
-import { erc721Abi } from 'viem';
+import { erc721Abi, isAddress } from 'viem';
 import useDisplayName from '../../../hooks/utils/useDisplayName';
 import { useEthersProvider } from '../../../providers/Ethers/hooks/useEthersProvider';
-import { BigNumberValuePair, ERC721TokenConfig } from '../../../types';
+import { BigIntValuePair, ERC721TokenConfig } from '../../../types';
 import { BarLoader } from '../../ui/loaders/BarLoader';
 
 type TokenDetails = {
@@ -18,7 +18,7 @@ export default function AzoriusNFTDetail({
   nft,
   hasAddressError,
 }: {
-  nft: ERC721TokenConfig<BigNumberValuePair>;
+  nft: ERC721TokenConfig<BigIntValuePair>;
   hasAddressError: boolean;
 }) {
   const [loading, setLoading] = useState<boolean>();
@@ -36,7 +36,7 @@ export default function AzoriusNFTDetail({
 
       setLoading(true);
       try {
-        if (nft.tokenAddress && ethers.utils.isAddress(nft.tokenAddress)) {
+        if (nft.tokenAddress && isAddress(nft.tokenAddress)) {
           const tokenContract = new ethers.Contract(nft.tokenAddress, erc721Abi, provider);
           const [name, symbol] = await Promise.all([tokenContract.name(), tokenContract.symbol()]);
           setTokenDetails({

diff --git a/src/components/DaoCreator/formComponents/AzoriusNFTDetails.tsx b/src/components/DaoCreator/formComponents/AzoriusNFTDetails.tsx
@@ -8,10 +8,10 @@ import {
   ICreationStepProps,
   CreatorSteps,
   ERC721TokenConfig,
-  BigNumberValuePair,
+  BigIntValuePair,
 } from '../../../types';
 import ContentBoxTitle from '../../ui/containers/ContentBox/ContentBoxTitle';
-import { BigNumberInput } from '../../ui/forms/BigNumberInput';
+import { BigIntInput } from '../../ui/forms/BigIntInput';
 import { LabelComponent } from '../../ui/forms/InputComponent';
 import { StepButtons } from '../StepButtons';
 import { StepWrapper } from '../StepWrapper';
@@ -70,7 +70,7 @@ export default function AzoriusNFTDetails(props: ICreationStepProps) {
             {values.erc721Token.nfts.map((nft, i) => {
               const nftError = (
                 errors?.erc721Token?.nfts as FormikErrors<
-                  ERC721TokenConfig<BigNumberValuePair>[] | undefined
+                  ERC721TokenConfig<BigIntValuePair>[] | undefined
                 >
               )?.[i];
               const addressErrorMessage =
@@ -135,8 +135,8 @@ export default function AzoriusNFTDetails(props: ICreationStepProps) {
                     }}
                   >
                     <Flex>
-                      <BigNumberInput
-                        value={nft.tokenWeight.bigNumberValue}
+                      <BigIntInput
+                        value={nft.tokenWeight.bigintValue}
                         onChange={valuePair =>
                           setFieldValue(`erc721Token.nfts.${i}.tokenWeight`, valuePair)
                         }
@@ -198,7 +198,7 @@ export default function AzoriusNFTDetails(props: ICreationStepProps) {
             {values.erc721Token.nfts.map((nft, i) => {
               const nftError = (
                 errors?.erc721Token?.nfts as FormikErrors<
-                  ERC721TokenConfig<BigNumberValuePair>[] | undefined
+                  ERC721TokenConfig<BigIntValuePair>[] | undefined
                 >
               )?.[i];
               const addressErrorMessage =

diff --git a/src/components/DaoCreator/formComponents/AzoriusTokenAllocation.tsx b/src/components/DaoCreator/formComponents/AzoriusTokenAllocation.tsx
@@ -1,17 +1,16 @@
 import { IconButton, Box } from '@chakra-ui/react';
 import { LabelWrapper, Minus } from '@decent-org/fractal-ui';
-import { BigNumber } from 'ethers';
 import { Field, FieldAttributes } from 'formik';
 import { useFormHelpers } from '../../../hooks/utils/useFormHelpers';
-import { BigNumberInput } from '../../ui/forms/BigNumberInput';
+import { BigIntInput } from '../../ui/forms/BigIntInput';
 import { AddressInput } from '../../ui/forms/EthAddressInput';
 interface ITokenAllocations {
   index: number;
   remove: <T>(index: number) => T | undefined;
   setFieldValue: (field: string, value: any) => void;
   addressErrorMessage: string | null;
   amountErrorMessage: string | null;
-  amountInputValue: BigNumber | undefined;
+  amountInputValue: bigint | undefined;
   allocationLength: number;
 }
 
@@ -39,7 +38,7 @@ export function AzoriusTokenAllocation({
         </Field>
       </LabelWrapper>
       <LabelWrapper errorMessage={amountErrorMessage}>
-        <BigNumberInput
+        <BigIntInput
           value={amountInputValue}
           onChange={valuePair =>
             setFieldValue(`erc20Token.tokenAllocations.${index}.amount`, valuePair)