Fix/updates and stuff

app/components/CloseButton/index.tsx

@@ -2,12 +2,11 @@ import { useBlockTx } from "../../hooks/useBlockTx";
 import { useCustomToasts } from "../../hooks/useCustomToasts";
 import { contractAddresses, contractABI } from "../../utils/constants";
 import { Button } from "@chakra-ui/react";
-import { BigNumberish } from "ethers";
 import React from "react";
 import { useContractWrite, usePrepareContractWrite } from "wagmi";
 
 type CloseButtonType = {
-  workstreamId: BigNumberish;
+  workstreamId?: string;
   contributors?: string[];
   disabled?: boolean;
   text?: string;
@@ -27,6 +26,7 @@ const CloseButton: React.FC<CloseButtonType> = ({
     abi: contractABI.fux,
     functionName: "closeWorkstream",
     args: [workstreamId, contributors],
+    enabled: !!workstreamId,
   });
 
   const { write } = useContractWrite({

app/components/CommitFuxModal/index.tsx

@@ -21,7 +21,6 @@ import {
   Stat,
   StatNumber,
 } from "@chakra-ui/react";
-import { BigNumber, BigNumberish } from "ethers";
 import { useForm, FormProvider } from "react-hook-form";
 import { usePrepareContractWrite, useContractWrite } from "wagmi";
 
@@ -30,19 +29,19 @@ type FormData = {
 };
 
 const CommitFuxModal: React.FC<{
-  workstreamID?: BigNumber;
-  fuxGiven?: BigNumberish;
-  fuxAvailable?: BigNumberish;
+  workstreamID: bigint | string;
+  fuxGiven: bigint;
+  fuxAvailable: bigint;
   tiny?: boolean;
-}> = ({ workstreamID, fuxGiven, fuxAvailable, tiny }) => {
+}> = ({ workstreamID, fuxGiven = 0n, fuxAvailable = 0n, tiny = false }) => {
   const { isOpen, onOpen, onClose } = useDisclosure();
   const { error, success } = useCustomToasts();
-  const _fuxGiven = BigNumber.from(fuxGiven);
+  const _fuxGiven = fuxGiven;
   const { checkChain } = useBlockTx();
 
   const formMethods = useForm<FormData>({
     defaultValues: {
-      fux: _fuxGiven ? _fuxGiven.toNumber() : 0,
+      fux: Number(fuxGiven),
     },
   });
 
@@ -78,10 +77,11 @@ const CommitFuxModal: React.FC<{
     },
   });
 
-  const maxValue = _fuxGiven.add(fuxAvailable || 0).toNumber();
+  const maxValue = Number(_fuxGiven) + Number(fuxAvailable);
+  console.log({ maxValue, _fuxGiven, fuxAvailable });
 
   const onSubmit = (e: FormData) => {
-    if (!_fuxGiven.eq(BigNumber.from(e.fux)) && checkChain()) {
+    if (_fuxGiven !== BigInt(e.fux) && checkChain()) {
       write?.();
     }
   };
@@ -104,7 +104,7 @@ const CommitFuxModal: React.FC<{
         <StatGroup>
           <Stat>
             <StatNumber fontFamily="mono" fontSize="md" fontWeight="100">{`${
-              maxValue - newFux || 0
+              Number(maxValue) - newFux || 0
             } / ${maxValue} FUX available`}</StatNumber>
           </Stat>
         </StatGroup>
@@ -115,7 +115,7 @@ const CommitFuxModal: React.FC<{
           </Button>
           <Spacer />
           <Button
-            isDisabled={_fuxGiven.eq(BigNumber.from(newFux))}
+            isDisabled={_fuxGiven === BigInt(newFux)}
             isLoading={isSubmitting}
             type="submit"
           >

app/components/Contributor/index.tsx

@@ -8,22 +8,21 @@ import {
   StatLabel,
   StatNumber,
 } from "@chakra-ui/react";
-import { BigNumberish } from "ethers";
 
 export const Contributor: React.FC<{
   address: `0x${string}`;
-  commitment: BigNumberish;
+  commitment: bigint;
   coordinator?: boolean;
   direction?: "column" | "row";
-}> = ({ address, commitment, coordinator = false, direction }) => {
+}> = ({ address, commitment = 0n, coordinator = false, direction }) => {
   return (
     <Flex direction={direction}>
       <User address={address} direction="horizontal" displayAvatar={true} />
       <Spacer />
       <StatGroup>
         <Stat>
           <StatLabel>Committed</StatLabel>
-          <StatNumber>{`${commitment || 0}%`}</StatNumber>
+          <StatNumber>{`${commitment.toString()} %`}</StatNumber>
         </Stat>
         <Stat>
           <StatLabel>vFux</StatLabel>

app/components/ContributorModal/index.tsx

@@ -8,7 +8,6 @@ import {
   Box,
   Button,
   ButtonGroup,
-  Input,
   Modal,
   ModalOverlay,
   ModalContent,
@@ -30,11 +29,10 @@ import {
   FormControl,
   FormLabel,
 } from "@chakra-ui/react";
-import { BigNumber, ethers } from "ethers";
-import { isAddress } from "ethers/lib/utils";
-import { Fragment } from "react";
+import { Fragment, useEffect, useState } from "react";
 import { FormProvider, useFieldArray, useForm } from "react-hook-form";
 import { BsFillPersonPlusFill, BsFillPersonXFill } from "react-icons/bs";
+import { isAddress } from "viem";
 import { usePrepareContractWrite, useContractWrite } from "wagmi";
 import { fetchEnsAddress } from "wagmi/actions";
 
@@ -44,13 +42,16 @@ type FormData = {
 };
 
 const ContributorModal: React.FC<{
-  workstreamID: BigNumber;
+  workstreamID: bigint | string;
   workstreamName: string;
   contributors?: WorkstreamContributor[];
 }> = ({ workstreamID, workstreamName, contributors }) => {
   const { isOpen, onOpen, onClose } = useDisclosure();
   const { error, success } = useCustomToasts();
   const { checkChain } = useBlockTx();
+  const [contributorAddresses, setContributorAddresses] = useState<string[]>(
+    []
+  );
 
   const formMethods = useForm<FormData>({
     defaultValues: {
@@ -74,24 +75,39 @@ const ContributorModal: React.FC<{
 
   const newContributors = watch("newContributors");
 
+  useEffect(() => {
+    const parsedAddresses = async () => {
+      const addresses = await Promise.all(
+        newContributors.map(async (contributor) => {
+          if (isAddress(contributor.address)) {
+            return contributor.address;
+          }
+
+          if (contributor.address.includes(".eth")) {
+            const address = await fetchEnsAddress({
+              chainId: 1,
+              name: contributor.address,
+            });
+            if (address) return address;
+          }
+        })
+      );
+
+      setContributorAddresses(
+        addresses
+          .filter((address) => !!address)
+          .map((address) => address as string)
+      );
+    };
+
+    parsedAddresses();
+  }, [newContributors]);
+
   const { config } = usePrepareContractWrite({
     address: contractAddresses.fuxContractAddress,
     abi: contractABI.fux,
     functionName: "updateContributors",
-    args: [
-      workstreamID,
-      newContributors
-        .map((entry) => entry.address)
-        .filter((address) => address != ethers.constants.AddressZero)
-        .map((account) => {
-          if (!isAddress(account)) {
-            return fetchEnsAddress({ chainId: 1, name: account });
-          } else if (isAddress(account)) {
-            return account;
-          }
-        }),
-      true,
-    ],
+    args: [workstreamID, contributorAddresses, true],
   });
 
   const { write } = useContractWrite({
@@ -109,7 +125,7 @@ const ContributorModal: React.FC<{
   });
 
   const onSubmit = () => {
-    if (newContributors.length > 0 && checkChain()) {
+    if (contributorAddresses.length > 0 && checkChain()) {
       write?.();
       onClose();
     }

app/components/ContributorOverview/index.tsx

@@ -12,7 +12,6 @@ import {
   Text,
   Tooltip,
 } from "@chakra-ui/react";
-import { BigNumber } from "ethers";
 import { useAccount } from "wagmi";
 
 export const ContributorOverview: React.FC<{
@@ -21,7 +20,7 @@ export const ContributorOverview: React.FC<{
   const { address } = useAccount();
   const contributors = workstream?.contributors;
 
-  if (!contributors) {
+  if (!contributors || !workstream.id) {
     return null;
   }
 
@@ -48,7 +47,7 @@ export const ContributorOverview: React.FC<{
         <Text pr={6}>Contributor</Text>
         {workstream.status === "Closed" || !userIsCoordinator ? undefined : (
           <ContributorModal
-            workstreamID={BigNumber.from(workstream.id)}
+            workstreamID={BigInt(workstream.id)}
             workstreamName={workstream.name || ""}
             contributors={workstream.contributors ?? []}
           />

app/components/FinalizeForm/index.tsx

@@ -1,4 +1,3 @@
-import { useRouter } from "next/router";
 import { Workstream, WorkstreamContributor } from "../../.graphclient";
 import { useBlockTx } from "../../hooks/useBlockTx";
 import { useCustomToasts } from "../../hooks/useCustomToasts";
@@ -21,9 +20,10 @@ import {
   Flex,
   ButtonGroup,
 } from "@chakra-ui/react";
-import { BigNumber, ethers } from "ethers";
 import _ from "lodash";
+import { useRouter } from "next/router";
 import React, { Fragment } from "react";
+import { formatUnits } from "viem";
 import { useAccount, useContractWrite, usePrepareContractWrite } from "wagmi";
 
 const FinalizeForm: React.FC<{
@@ -51,7 +51,7 @@ const FinalizeForm: React.FC<{
     ],
   });
 
-  const { data, isLoading, isSuccess, write } = useContractWrite({
+  const { isLoading, write } = useContractWrite({
     ...config,
     onError(e) {
       toast.error(e);
@@ -105,7 +105,7 @@ const FinalizeForm: React.FC<{
   const coordinator = _workstream.coordinator?.id;
 
   const finalizeForm =
-    contributors && contributors?.length > 0 ? (
+    contributors && contributors?.length > 0 && workstream.id ? (
       <>
         <Grid gap={2} templateColumns="repeat(16, 1fr)">
           <GridItem colSpan={8}>
@@ -115,7 +115,7 @@ const FinalizeForm: React.FC<{
             <Text>Committed</Text>
           </GridItem>
           <GridItem colSpan={2}>
-            <Text>vFUX</Text>
+            <Text>Rating</Text>
           </GridItem>
           <GridItem colSpan={3}>
             <Text>Funds</Text>
@@ -152,17 +152,17 @@ const FinalizeForm: React.FC<{
                   bg="#301A3A"
                   display={"inline-grid"}
                   colSpan={3}
-                  justifyContent="end"
+                  justifyContent="start"
                   alignContent="center"
                 >
                   {_workstream?.funding && _workstream.funding.length > 0 ? (
                     <Text fontFamily="mono" pr={"1em"}>
                       {`${
                         relative[address]
-                          ? ethers.utils.formatUnits(
-                              BigNumber.from(_workstream.funding[0].amount).mul(
-                                BigNumber.from(relative[address]).div(100)
-                              ),
+                          ? formatUnits(
+                              (BigInt(_workstream.funding[0].amount) *
+                                BigInt(relative[address])) /
+                                100n,
                               _workstream.funding[0].token.decimals
                             )
                           : "0"
@@ -173,7 +173,7 @@ const FinalizeForm: React.FC<{
                           : _workstream.funding[0].token.symbol
                       }`}
                     </Text>
-                  ) : undefined}
+                  ) : "N/A"}
                 </GridItem>
               </Fragment>
             );
@@ -191,7 +191,7 @@ const FinalizeForm: React.FC<{
             Finalize workstream
           </Button>
           <CloseButton
-            workstreamId={workstream.id || ""}
+            workstreamId={workstream.id}
             contributors={contributors.map((c) => c.contributor.id)}
             disabled={coordinator?.toLowerCase() !== address?.toLowerCase()}
           />

app/components/FormComponents/ContractAddressInput.tsx

@@ -1,8 +1,7 @@
 import { Input } from "@chakra-ui/react";
-import { ethers } from "ethers";
-import { isAddress } from "ethers/lib/utils";
 import { useState } from "react";
 import { useFormContext } from "react-hook-form";
+import { isAddress } from "viem";
 
 const ContractAddressInput: React.FC<{
   onChange: (e: { target: any; type?: any }) => void;

app/components/FormComponents/TokenAmountInput.tsx

@@ -10,32 +10,32 @@ import {
   Text,
   InputGroup,
 } from "@chakra-ui/react";
-import { BigNumberish, ethers } from "ethers";
 import { Controller, useFormContext } from "react-hook-form";
+import { formatEther, formatUnits, parseEther, parseUnits } from "viem";
 
 const TokenAmountInput: React.FC<{
   fieldName: string;
   native: boolean;
   name?: string;
-  decimals?: BigNumberish;
+  decimals?: number;
   symbol?: string;
 }> = ({ fieldName, name = "Unknown", native, decimals, symbol = "N/A" }) => {
   const form = useFormContext();
   const { nativeToken } = useConstants();
   const { control } = form;
 
   const parseFundingAmount = (value: string) => {
-    if (!native) {
-      return ethers.utils.parseUnits(value, decimals);
+    if (!native && decimals) {
+      return parseUnits(value, decimals);
     }
-    return ethers.utils.parseEther(value);
+    return parseEther(value);
   };
 
-  const formatFundingAmount = (value: BigNumberish) => {
-    if (!native) {
-      return ethers.utils.formatUnits(value, decimals);
+  const formatFundingAmount = (value: bigint) => {
+    if (!native && decimals) {
+      return formatUnits(value, decimals);
     }
-    return ethers.utils.formatEther(value);
+    return formatEther(value);
   };
 
   return (