sync main

apps/web/package.json

@@ -20,19 +20,20 @@
     "@fontsource/londrina-solid": "^4.5.9",
     "@rainbow-me/rainbowkit": "^1.3.1",
     "@sentry/nextjs": "^7.105.0",
+    "@smartinvoicexyz/constants": "^0.1.17",
     "@types/lodash": "^4.14.186",
     "@types/react-portal": "^4.0.4",
     "@types/tinycolor2": "^1.4.3",
     "@vanilla-extract/next-plugin": "^2.0.2",
     "@vanilla-extract/recipes": "^0.2.5",
-    "bs58": "^5.0.0",
     "@vercel/og": "^0.4.0",
     "@zoralabs/nouns-protocol": "1.2.0",
     "@zoralabs/zord": "workspace:*",
     "analytics": "workspace:*",
     "axios": "^0.27.2",
     "bignumber.js": "^9.1.0",
     "blocklist": "workspace:*",
+    "bs58": "^5.0.0",
     "dayjs": "^1.11.3",
     "flatpickr": "^4.6.13",
     "formik": "^2.2.9",

apps/web/src/constants/subgraph.ts

@@ -17,7 +17,7 @@ export const PUBLIC_SUBGRAPH_URL = {
     'https://api.goldsky.com/api/public/project_cm39qflfrtz7e01xibgnuczby/subgraphs/nouns-builder-optimism-sepolia/0.0.5/gn',
   [CHAIN_ID.BASE]:
     // 'https://api.goldsky.com/api/public/project_clkk1ucdyf6ak38svcatie9tf/subgraphs/nouns-builder-base-mainnet/stable/gn',
-    'https://api.goldsky.com/api/public/project_cm39qflfrtz7e01xibgnuczby/subgraphs/nouns-builder-base-mainnet/0.0.5/gn',
+    'https://api.goldsky.com/api/public/project_cm33ek8kjx6pz010i2c3w8z25/subgraphs/nouns-builder-base-mainnet/0.0.6/gn',
   [CHAIN_ID.BASE_SEPOLIA]:
     // 'https://api.goldsky.com/api/public/project_clkk1ucdyf6ak38svcatie9tf/subgraphs/nouns-builder-base-sepolia/stable/gn',
     'https://api.goldsky.com/api/public/project_cm39qflfrtz7e01xibgnuczby/subgraphs/nouns-builder-base-sepolia/0.0.5/gn',

apps/web/src/modules/create-proposal/components/ReviewProposalForm/ReviewProposalForm.tsx

@@ -23,6 +23,7 @@ import { AddressType, CHAIN_ID } from 'src/typings'
 
 import { BuilderTransaction, useProposalStore } from '../../stores'
 import { prepareProposalTransactions } from '../../utils/prepareTransactions'
+import { useEscrowFormStore } from '../TransactionForm/Escrow/EscrowUtils'
 import { Transactions } from './Transactions'
 import { ERROR_CODE, FormValues, validationSchema } from './fields'
 
@@ -69,6 +70,7 @@ export const ReviewProposalForm = ({
   const [simulating, setSimulating] = useState<boolean>(false)
   const [simulations, setSimulations] = useState<Array<Simulation>>([])
   const [proposing, setProposing] = useState<boolean>(false)
+  const { clear: clearEscrowForm } = useEscrowFormStore()
 
   const { data: votes, isLoading } = useContractRead({
     address: addresses?.token as AddressType,
@@ -178,6 +180,7 @@ export const ReviewProposalForm = ({
           .then(() => {
             setProposing(false)
             clearProposal()
+            clearEscrowForm()
           })
       } catch (err: any) {
         setProposing(false)

apps/web/src/modules/create-proposal/components/TransactionForm/Escrow/EscrowForm.schema.ts

@@ -25,6 +25,7 @@ export interface EscrowFormState {
   formValues: EscrowFormValues
   setFormValues: (values: EscrowFormValues) => void
   resetForm: () => void
+  clear: () => void
 }
 
 export interface EscrowFormProps {

apps/web/src/modules/create-proposal/components/TransactionForm/Escrow/EscrowForm.tsx

@@ -120,7 +120,7 @@ const EscrowForm: React.FC<EscrowFormProps> = ({
 
   const { formValues, setFormValues } = useEscrowFormStore()
   const {
-    addresses: { multiSig, governor, treasury },
+    addresses: { multiSig, treasury },
   } = useDaoStore()
 
   const handleSubmit = useCallback(

apps/web/src/modules/create-proposal/components/TransactionForm/Escrow/EscrowUtils.ts

@@ -172,6 +172,10 @@ const useEscrowFormStore = create(
       formValues: initialState,
       setFormValues: (values) => set({ formValues: values }),
       resetForm: () => set({ formValues: initialState }),
+      clear: () => {
+        set({ formValues: initialState })
+        localStorage.removeItem('escrow-form-storage')
+      },
     }),
     {
       name: 'escrow-form-storage',

apps/web/src/modules/proposal/components/ProposalDescription/MilestoneDetails.tsx

@@ -1,8 +1,9 @@
 import { Button, Stack, Text } from '@zoralabs/zord'
 import axios from 'axios'
 import { IPFS_GATEWAY } from 'ipfs-service/src/gateway'
+import _ from 'lodash'
 import { useRouter } from 'next/router'
-import { useCallback, useEffect, useMemo } from 'react'
+import { useCallback, useEffect, useMemo, useState } from 'react'
 import useSWR from 'swr'
 import {
   Hex,
@@ -28,7 +29,6 @@ import { AddressType } from 'src/typings'
 
 import { DecodedTransaction } from './ProposalDescription'
 
-// Constants remain unchanged
 const RELEASE_FUNCTION_ABI = [
   {
     inputs: [{ internalType: 'uint256', name: '_milestone', type: 'uint256' }],
@@ -39,10 +39,23 @@ const RELEASE_FUNCTION_ABI = [
   },
 ]
 
-const INVOICE_ADDRESS = '0x5C2ac7D59B6CCe44da4a4a6285cC5260e14cf6A5' // todo: get from exec txn hash
 const SAFE_APP_URL =
   'https://app.safe.global/share/safe-app?appUrl=https://app.smartinvoice.xyz/invoices'
 
+const INVOICE_QUERY = `
+  query GetInvoice($txHash: String!) {
+    invoices(where: {
+      creationTxHash: $txHash
+    }) {
+      address
+      id
+      createdAt
+      network
+      creationTxHash
+    }
+  }
+`
+
 interface MilestoneDetailsProps {
   decodedTxnData: DecodedTransaction
   executionTransactionHash?: string
@@ -53,16 +66,56 @@ interface Document {
   src: string
 }
 
+const useNetworkConfig = () => {
+  const [networkConfig, setNetworkConfig] = useState<any>(null)
+  const [isLoading, setIsLoading] = useState(true)
+  const [error, setError] = useState<Error | null>(null)
+
+  useEffect(() => {
+    const loadNetworkConfig = async () => {
+      try {
+        const { NETWORK_CONFIG } = await import('@smartinvoicexyz/constants')
+        setNetworkConfig(NETWORK_CONFIG)
+      } catch (err) {
+        setError(err as Error)
+      } finally {
+        setIsLoading(false)
+      }
+    }
+    loadNetworkConfig()
+  }, [])
+
+  return { networkConfig, isLoading, error }
+}
+
 export const MilestoneDetails = ({
   decodedTxnData,
   executionTransactionHash,
 }: MilestoneDetailsProps) => {
   const router = useRouter()
   const { chain: invoiceChain } = useChainStore()
   const { addresses } = useDaoStore()
-  const { removeAllTransactions, addTransaction } = useProposalStore()
+  const { addTransaction } = useProposalStore()
+  const { networkConfig, isLoading, error: networkConfigError } = useNetworkConfig()
+
+  const subgraphURL = useMemo(() => {
+    return networkConfig?.[invoiceChain.id]?.SUBGRAPH
+  }, [networkConfig, invoiceChain.id])
+
+  const { data: INVOICE_ADDRESS } = useSWR(
+    [subgraphURL, executionTransactionHash],
+    async () => {
+      const response = await axios.post(subgraphURL, {
+        query: INVOICE_QUERY,
+        variables: {
+          txHash: executionTransactionHash,
+        },
+      })
+
+      return _.get(response, 'data.data.invoices[0].address')
+    }
+  )
 
-  // Decode transaction data
   const { invoiceCid, clientAddress, milestoneAmount } = useMemo(() => {
     const decodedAbiData = decodeAbiParameters(
       parseAbiParameters([
@@ -89,7 +142,6 @@ export const MilestoneDetails = ({
     }
   }, [decodedTxnData])
 
-  // Fetch invoice data
   const { data: invoiceData } = useSWR(
     invoiceCid ? [SWR_KEYS.IPFS, invoiceCid] : null,
     async () => {
@@ -100,11 +152,9 @@ export const MilestoneDetails = ({
         console.error('Failed to fetch invoice data:', error)
         return null
       }
-    },
-    { revalidateOnFocus: false }
+    }
   )
 
-  // Get released milestones count
   const { data: numOfMilestonesReleased } = useContractRead({
     address: INVOICE_ADDRESS,
     abi: [
@@ -243,5 +293,13 @@ export const MilestoneDetails = ({
     renderDocumentLink,
   ])
 
+  if (isLoading) {
+    return <div>Loading network configuration...</div>
+  }
+
+  if (networkConfigError) {
+    return <div>Error loading network configuration</div>
+  }
+
   return <Accordion items={milestonesDetails || []} />
 }

apps/web/src/modules/proposal/components/ProposalDescription/ProposalDescription.tsx

@@ -1,7 +1,8 @@
 import { Box, Flex, Paragraph, Text, atoms } from '@zoralabs/zord'
-import { useEffect } from 'hono/jsx'
 import { toLower } from 'lodash'
 import Image from 'next/image'
+import { useEffect } from 'react'
+import { Suspense } from 'react'
 import React, { ReactNode } from 'react'
 import { useState } from 'react'
 import ReactMarkdown from 'react-markdown'
@@ -86,16 +87,18 @@ export const ProposalDescription: React.FC<ProposalDescriptionProps> = ({
       <Flex direction={'column'} mt={{ '@initial': 'x6', '@768': 'x13' }}>
         {isEscrow && decodedTxnData && (
           <Section title="Escrow Milestones">
-            {decodedTxnData?._escrowData?.value ? (
-              <MilestoneDetails
-                decodedTxnData={decodedTxnData}
-                executionTransactionHash={executionTransactionHash}
-              />
-            ) : (
-              <Text variant="code" color="negative">
-                Error Decoding Escrow Milestones
-              </Text>
-            )}
+            <Suspense fallback={<Text variant="code">Loading escrow milestones...</Text>}>
+              {decodedTxnData?._escrowData?.value ? (
+                <MilestoneDetails
+                  decodedTxnData={decodedTxnData}
+                  executionTransactionHash={executionTransactionHash}
+                />
+              ) : (
+                <Text variant="code" color="negative">
+                  Error Decoding Escrow Milestones
+                </Text>
+              )}
+            </Suspense>
           </Section>
         )}