Feature implementation from commits 643773c..7e049ee

packages/constants/src/config.ts

@@ -84,8 +84,7 @@ const LEXDAO_DATA: ResolverWithoutAddress = {
   id: 'lexdao',
   name: 'LexDAO',
   logoUrl: '/assets/lex-dao.png',
-  termsUrl:
-    'https://github.com/lexDAO/Arbitration/blob/master/rules/ToU.md#lexdao-resolver',
+  termsUrl: 'https://docs.smartinvoice.xyz/arbitration/lexdao-arbitration',
 };
 
 const KLEROS_DATA: ResolverWithoutAddress = {
@@ -94,8 +93,7 @@ const KLEROS_DATA: ResolverWithoutAddress = {
   disclaimer:
     'Only choose Kleros if total invoice value is greater than 1000 USD',
   logoUrl: '/assets/kleros.svg',
-  termsUrl:
-    'https://docs.google.com/document/d/1z_l2Wc8YHSspB0Lm5cmMDhu9h0W5G4thvDLqWRtuxbA/',
+  termsUrl: 'https://docs.smartinvoice.xyz/arbitration/kleros-arbitration',
 };
 
 const SMART_INVOICE_ARBITRATION_DATA: ResolverWithoutAddress = {

packages/contracts/deployments/mainnet.json

@@ -5,7 +5,8 @@
   "blockNumber": "16991083",
   "implementations": {
     "escrow": ["0xEfA83c32691e312d8c0c2973b05048fecCfab752"],
-    "instant": ["0xb54586d9032728b0d82F64845D3fC51577bB00cd"]
+    "instant": ["0xb54586d9032728b0d82F64845D3fC51577bB00cd"],
+    "updatable": ["0xd8e1f218021550fadda4b1e353578b80a1ce1a94"]
   },
   "bundler": {
     "address": "0xb4cdef4aa610c046864467592fae456a58d3443a",

packages/forms/src/InvoicePaymentDetails.tsx

@@ -229,7 +229,7 @@ export function InvoicePaymentDetails({
                             isExternal
                             color="grey"
                             fontStyle="italic"
-                            href={getTxLink(chainId, release.txHash)}
+                            href={getTxLink(invoice?.chainId, release.txHash)}
                           >
                             Released{' '}
                             {new Date(
@@ -243,7 +243,7 @@ export function InvoicePaymentDetails({
                             isExternal
                             color="grey"
                             fontStyle="italic"
-                            href={getTxLink(chainId, deposit?.txHash)}
+                            href={getTxLink(invoice?.chainId, deposit?.txHash)}
                           >
                             {`${_.capitalize(depositedText)} `}
                             {new Date(
@@ -347,7 +347,7 @@ export function InvoicePaymentDetails({
                         {`A dispute is in progress with `}
                         <AccountLink
                           address={resolver as Hex}
-                          chainId={chainId}
+                          chainId={invoice?.chainId}
                         />
                         <br />
                         {!isEmptyIpfsHash(dispute.ipfsHash) && (
@@ -363,7 +363,7 @@ export function InvoicePaymentDetails({
                           </>
                         )}
                         <Link
-                          href={getTxLink(chainId, dispute.txHash)}
+                          href={getTxLink(invoice?.chainId, dispute.txHash)}
                           color="blue.1"
                           isExternal
                         >
@@ -405,7 +405,7 @@ export function InvoicePaymentDetails({
                           <Text maxW="300px" color="purple">
                             <AccountLink
                               address={resolver as Hex}
-                              chainId={chainId}
+                              chainId={invoice?.chainId}
                             />
                             {
                               ' has resolved the dispute and dispersed remaining funds'
@@ -436,7 +436,10 @@ export function InvoicePaymentDetails({
                               </>
                             )}
                             <Link
-                              href={getTxLink(chainId, resolution.txHash)}
+                              href={getTxLink(
+                                invoice?.chainId,
+                                resolution.txHash,
+                              )}
                               isExternal
                             >
                               <u>View transaction</u>
@@ -460,7 +463,7 @@ export function InvoicePaymentDetails({
                                 )} ${tokenMetadata?.symbol} to `}
                                 <AccountLink
                                   address={detail.distributee as Hex}
-                                  chainId={chainId}
+                                  chainId={invoice?.chainId}
                                 />
                               </Text>
                             ),

packages/forms/src/PaymentsForm.tsx

@@ -133,12 +133,9 @@ export function PaymentsForm({
             defaultValue={nativeWrappedToken.toLowerCase()}
             tooltip={
               <Text>
-                {`This is the cryptocurrency you'll receive payment in. The
-                network your wallet is connected to determines which allTokens
-                display here.`}
+                {`This is the cryptocurrency you'll receive payment in. The network your wallet is connected to determines which tokens are displayed here.`}
                 <br />
-                {`If you change your wallet network now,
-                you'll be forced to start the invoice over.`}
+                {`If you change your wallet network now, you'll be sent back to Step 1.`}
               </Text>
             }
             localForm={localForm}
@@ -154,7 +151,7 @@ export function PaymentsForm({
           <HStack spacing={4}>
             <FormLabel m={0}>Milestones</FormLabel>
             <Tooltip
-              label="Amounts of each milestone for the escrow. Additional milestones can be added later."
+              label="Payment amounts for each milestone. Additional milestones can be added later."
               placement="right"
               hasArrow
               shouldWrapChildren

packages/forms/src/ProjectDetailsForm.tsx

@@ -12,6 +12,7 @@ import {
 import {
   oneMonthFromNow,
   projectDetailsSchema,
+  sevenDaysFromDate,
   sevenDaysFromNow,
 } from '@smartinvoicexyz/utils';
 import _ from 'lodash';
@@ -64,7 +65,9 @@ export function ProjectDetailsForm({
 
   const {
     handleSubmit,
-    formState: { isValid },
+    setValue: setFormValue,
+    formState: { isValid, errors },
+    trigger,
   } = localForm;
 
   const { primaryButtonSize } = useMediaStyles();
@@ -116,12 +119,21 @@ export function ProjectDetailsForm({
             name="startDate"
             tooltip="The date the project is expected to start"
             localForm={localForm}
+            onChange={(v: Date) => {
+              setFormValue('startDate', v);
+              trigger();
+            }}
           />
           <DatePicker
             label="Estimated End Date"
             name="endDate"
             tooltip="The date the project is expected to end. This value is not formally used in the escrow."
             localForm={localForm}
+            onChange={(v: Date) => {
+              setFormValue('endDate', v);
+              setFormValue('deadline', sevenDaysFromDate(v));
+              trigger();
+            }}
           />
           {type === INVOICE_TYPES.Instant ? (
             <DatePicker
@@ -137,6 +149,10 @@ export function ProjectDetailsForm({
               name="safetyValveDate"
               tooltip="The date the client can withdraw funds. Should be well in the future generally!"
               localForm={localForm}
+              onChange={(v: Date) => {
+                setFormValue('safetyValveDate', v);
+                trigger();
+              }}
             />
           )}
         </SimpleGrid>

packages/hooks/src/index.ts

@@ -1,4 +1,5 @@
 export * from './useAddMilestones';
+export * from './useDebounce';
 export * from './useDeposit';
 export * from './useEscrowZap';
 export * from './useFetchTokens';

packages/hooks/src/useDebounce.ts

@@ -0,0 +1,17 @@
+import { useEffect, useState } from 'react';
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const useDebounce = (value: any, delay: number) => {
+  const [debouncedValue, setDebouncedValue] = useState(value);
+  useEffect(() => {
+    const handler = setTimeout(() => {
+      setDebouncedValue(value);
+    }, delay);
+    return () => {
+      clearTimeout(handler);
+    };
+  }, [value, delay]);
+  return debouncedValue;
+};
+
+export default useDebounce;

packages/hooks/src/useDetailsPin.ts

@@ -23,6 +23,9 @@ export const useDetailsPin = (
   isBasic = false,
 ) => {
   const validatedDetails = useMemo((): InvoiceMetadata | null => {
+    if (details === null) {
+      return null;
+    }
     if (isBasic) {
       if (!validateBasicMetadata(details)) {
         logDebug('Invalid basic metadata: ', details);

packages/hooks/src/useEscrowZap.ts

@@ -1,12 +1,14 @@
-import {
-  ESCROW_ZAP_ABI,
-  NETWORK_CONFIG,
-  NetworkConfig,
-} from '@smartinvoicexyz/constants';
+import { ESCROW_ZAP_ABI, NETWORK_CONFIG } from '@smartinvoicexyz/constants';
 import { logDebug } from '@smartinvoicexyz/utils';
 import _ from 'lodash';
 import { useCallback, useMemo } from 'react';
-import { encodeAbiParameters, Hex, isAddress, parseUnits } from 'viem';
+import {
+  encodeAbiParameters,
+  Hex,
+  isAddress,
+  parseEther,
+  parseUnits,
+} from 'viem';
 import { useChainId, useSimulateContract, useWriteContract } from 'wagmi';
 
 import { SimulateContractErrorType, WriteContractErrorType } from './types';
@@ -39,8 +41,7 @@ export const useEscrowZap = ({
   safetyValveDate,
   details,
   enabled = true,
-  networkConfig = NETWORK_CONFIG,
-  token,
+  networkConfig,
   onSuccess,
 }: UseEscrowZapProps): {
   writeAsync: () => Promise<Hex | undefined>;
@@ -53,21 +54,24 @@ export const useEscrowZap = ({
   const { owners, percentAllocations } =
     separateOwnersAndAllocations(ownersAndAllocations);
   const saltNonce = Math.floor(new Date().getTime() / 1000);
+  const milestoneAmounts = networkConfig?.tokenDecimals
+    ? _.map(
+        milestones,
+        (a: { value: string }) =>
+          a.value && parseUnits(a.value, networkConfig.tokenDecimals),
+      )
+    : _.map(
+        milestones,
+        (a: { value: string }) => a.value && parseEther(a.value),
+      );
 
-  const tokenDecimals =
-    _.get(networkConfig[chainId], `TOKENS.${token}.decimals`) ?? 18;
-
-  const milestoneAmounts = _.map(
-    NETWORK_CONFIG[chainId] ? milestones : [],
-    (a: { value: string }) => a.value && parseUnits(a.value, tokenDecimals),
-  );
-
-  const tokenAddress =
-    _.get(networkConfig[chainId], `TOKENS.${token}.address`) ?? '0x0';
+  const tokenAddress = networkConfig?.tokenAddress
+    ? networkConfig?.tokenAddress
+    : '0x0';
 
   const resolver = daoSplit
-    ? (_.first(_.keys(_.get(networkConfig[chainId], 'RESOLVERS'))) as Hex)
-    : (networkConfig[chainId].DAO_ADDRESS ?? '');
+    ? (_.first(_.keys(_.get(NETWORK_CONFIG[chainId], 'RESOLVERS'))) as Hex)
+    : (NETWORK_CONFIG[chainId].DAO_ADDRESS ?? '');
 
   const encodedSafeData = useMemo(() => {
     if (!threshold || !saltNonce)
@@ -152,7 +156,7 @@ export const useEscrowZap = ({
     status,
   } = useSimulateContract({
     chainId,
-    address: networkConfig[chainId].ZAP_ADDRESS ?? '0x0',
+    address: networkConfig?.ZAP_ADDRESS ?? '0x0',
     abi: ESCROW_ZAP_ABI,
     functionName: 'createSafeSplitEscrow',
     args: [
@@ -218,6 +222,10 @@ interface UseEscrowZapProps {
   safetyValveDate: Date;
   details?: `0x${string}` | null;
   enabled?: boolean;
-  networkConfig?: { [key: number]: NetworkConfig }; // to override the default network config
+  networkConfig?: {
+    tokenAddress: Hex;
+    tokenDecimals: number;
+    ZAP_ADDRESS: Hex;
+  };
   onSuccess?: (hash: Hex) => void;
 }

packages/hooks/src/useFetchTokens.ts

@@ -52,12 +52,15 @@ const fetchTokens = async () => {
   return [] as IToken[];
 };
 
-export const useFetchTokens = () => {
+export const useFetchTokens = (
+  { enabled }: { enabled: boolean } = { enabled: true },
+) => {
   const { data, isLoading, error } = useQuery({
     queryKey: ['tokens'],
     queryFn: fetchTokens,
     staleTime: Infinity,
     refetchInterval: false,
+    enabled,
   });
 
   const allTokens = useMemo(