[PREVIEW] Async metadata

src/components/NftRewards/AddNftCollectionForm/AddNftCollectionForm.tsx

@@ -4,7 +4,8 @@ import { Form, FormInstance } from 'antd'
 import ExternalLink from 'components/ExternalLink'
 import TooltipLabel from 'components/TooltipLabel'
 import { JuiceInput } from 'components/inputs/JuiceTextInput'
-import { NftPostPayModalConfig, NftRewardTier } from 'models/nftRewards'
+import { NftPostPayModalConfig } from 'models/nftPostPayModal'
+import { NftRewardTier } from 'models/nftRewards'
 import { CreateCollapse } from 'packages/v2v3/components/Create/components/CreateCollapse/CreateCollapse'
 import { OptionalHeader } from 'packages/v2v3/components/Create/components/OptionalHeader'
 import { useLockPageRulesWrapper } from 'packages/v2v3/components/Create/hooks/useLockPageRulesWrapper'

src/components/NftRewards/AddNftCollectionForm/NftPaymentSuccessFormItems.tsx

@@ -7,7 +7,7 @@ import { CreateButton } from 'components/buttons/CreateButton/CreateButton'
 import { JuiceTextArea } from 'components/inputs/JuiceTextArea'
 import { JuiceInput } from 'components/inputs/JuiceTextInput'
 import { useModal } from 'hooks/useModal'
-import { NftPostPayModalConfig } from 'models/nftRewards'
+import { NftPostPayModalConfig } from 'models/nftPostPayModal'
 
 export function NftPaymentSuccessFormItems({
   hidePreview,

src/components/NftRewards/NftPostPayModal.tsx

@@ -1,6 +1,6 @@
 import { t } from '@lingui/macro'
 import Modal from 'antd/lib/modal/Modal'
-import { NftPostPayModalConfig } from 'models/nftRewards'
+import { NftPostPayModalConfig } from 'models/nftPostPayModal'
 import { withHttps } from 'utils/externalLink'
 
 export function NftPostPayModal({

src/models/nftPostPayModal.ts

@@ -0,0 +1,5 @@
+export type NftPostPayModalConfig = {
+  ctaText: string | undefined
+  ctaLink: string | undefined
+  content: string | undefined
+}

src/models/nftRewards.ts

@@ -132,19 +132,18 @@ export type NftCollectionMetadata = {
   description: string | undefined
 }
 
-export type NftPostPayModalConfig = {
-  ctaText: string | undefined
-  ctaLink: string | undefined
-  content: string | undefined
-}
-
 export enum JB721GovernanceType {
   NONE,
   ONCHAIN,
 }
 
 export interface JB721PricingParams {
-  tiers: (JB721TierParams | JB_721_TIER_PARAMS_V3_1 | JB_721_TIER_PARAMS_V3_2 | JB_721_TIER_PARAMS_V4)[]
+  tiers: (
+    | JB721TierParams
+    | JB_721_TIER_PARAMS_V3_1
+    | JB_721_TIER_PARAMS_V3_2
+    | JB_721_TIER_PARAMS_V4
+  )[]
   currency: CurrencyOption
   decimals: number
   prices: string // address

src/models/projectMetadata.ts

@@ -1,4 +1,4 @@
-import { NftPostPayModalConfig } from './nftRewards'
+import { NftPostPayModalConfig } from './nftPostPayModal'
 import { ProjectTagName, filterValidTags } from './project-tags'
 import { TokenRef } from './tokenRef'
 

src/pages/v2/p/[projectId]/index.tsx

@@ -5,6 +5,7 @@ import { AnnouncementsProvider } from 'contexts/Announcements/AnnouncementsProvi
 import { paginateDepleteProjectsQueryCall } from 'lib/apollo/paginateDepleteProjectsQuery'
 import { loadCatalog } from 'locales/utils'
 import { GetStaticPaths, GetStaticProps, InferGetStaticPropsType } from 'next'
+import { ProjectDashboard } from 'packages/v2v3/components/V2V3Project/ProjectDashboard/ProjectDashboard'
 import { V2V3ProjectPageProvider } from 'packages/v2v3/contexts/V2V3ProjectPageProvider'
 import React, { PropsWithChildren } from 'react'
 import {
@@ -65,8 +66,7 @@ export default function V2V3ProjectPage({
         <AppWrapper>
           <V2V3ProjectPageProvider projectId={projectId} metadata={metadata}>
             <AnnouncementsProvider>
-              hello
-              {/* <ProjectDashboard /> */}
+              <ProjectDashboard />
             </AnnouncementsProvider>
           </V2V3ProjectPageProvider>
         </AppWrapper>

src/redux/slices/creatingV2Project/creatingV2Project.ts

@@ -1,9 +1,9 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 import { CreatePage } from 'models/createPage'
+import { NftPostPayModalConfig } from 'models/nftPostPayModal'
 import {
   JB721GovernanceType,
   NftCollectionMetadata,
-  NftPostPayModalConfig,
   NftRewardTier,
 } from 'models/nftRewards'
 import { PayoutsSelection } from 'models/payoutsSelection'

src/redux/slices/editingV2Project/editingV2Project.ts

@@ -1,9 +1,9 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 import { CreatePage } from 'models/createPage'
+import { NftPostPayModalConfig } from 'models/nftPostPayModal'
 import {
   JB721GovernanceType,
   NftCollectionMetadata,
-  NftPostPayModalConfig,
   NftRewardTier,
 } from 'models/nftRewards'
 import { PayoutsSelection } from 'models/payoutsSelection'

src/redux/slices/shared/v2ProjectTypes.ts

@@ -1,10 +1,10 @@
 import { CreatePage } from 'models/createPage'
 import { FundingTargetType } from 'models/fundingTargetType'
+import { NftPostPayModalConfig } from 'models/nftPostPayModal'
 import {
   JB721GovernanceType,
   JBTiered721Flags,
   NftCollectionMetadata,
-  NftPostPayModalConfig,
   NftRewardTier,
 } from 'models/nftRewards'
 import { PayoutsSelection } from 'models/payoutsSelection'

src/utils/server/metadata.ts

@@ -1,22 +1,11 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { getPublicClient } from '@wagmi/core'
-import { CV_V3 } from 'constants/cv'
-import { JUICEBOX_MONEY_PROJECT_METADATA_DOMAIN } from 'constants/metadataDomain'
-import { readNetwork } from 'constants/networks'
 import { PV_V1, PV_V2, PV_V4 } from 'constants/pv'
-import { readProvider } from 'constants/readProvider'
-import {
-  readJbDirectoryControllerOf,
-  getProjectMetadata as sdkGetProjectMetadata,
-} from 'juice-sdk-core'
 import { PV } from 'models/pv'
-import { V2V3ContractName } from 'packages/v2v3/models/contracts'
-import { loadV2V3Contract } from 'packages/v2v3/utils/loadV2V3Contract'
-import { chainNameMap } from 'packages/v4/utils/networks'
-import { wagmiConfig } from 'packages/v4/wagmiConfig'
-import { PublicClient } from 'viem'
 import { findProjectMetadata } from './ipfs'
 
+/**
+ * Server-side function. Returns the metadata for a v2v3 or v4 project.
+ */
 export const getProjectMetadata = async (
   projectId: string | number,
   pv: PV = PV_V2,
@@ -31,48 +20,11 @@ export const getProjectMetadata = async (
     case PV_V1:
       throw new Error('V1 projects are not supported')
     case PV_V2:
+      const { V2V3GetMetadataCidFromContract } = await import('./v2v3Metadata')
       const metadataCid = await V2V3GetMetadataCidFromContract(projectId)
       return findProjectMetadata({ metadataCid })
     case PV_V4:
-      if (!chain) throw new Error('Chain is required for V4 projects')
-      return await V4GetMetadataCidFromContract(projectId, chain)
+      const { getV4ProjectMetadata } = await import('./v4Metadata')
+      return getV4ProjectMetadata(projectId, chain)
   }
 }
-
-const V2V3GetMetadataCidFromContract = async (projectId: number) => {
-  const JBProjects = await loadV2V3Contract(
-    V2V3ContractName.JBProjects,
-    readNetwork.name,
-    readProvider,
-    CV_V3, // Note: v2 and v3 use the same JBProjects, so the CV doesn't matter.
-  )
-  if (!JBProjects) {
-    throw new Error(`contract not found ${V2V3ContractName.JBProjects}`)
-  }
-  const metadataCid = (await JBProjects.metadataContentOf(
-    projectId,
-    JUICEBOX_MONEY_PROJECT_METADATA_DOMAIN,
-  )) as string
-
-  return metadataCid
-}
-
-const V4GetMetadataCidFromContract = async (
-  projectId: number,
-  chainName: string,
-) => {
-  const chainId = chainNameMap[chainName]
-  const jbControllerAddress = await readJbDirectoryControllerOf(wagmiConfig, {
-    chainId,
-    args: [BigInt(projectId)],
-  })
-  const client = getPublicClient(wagmiConfig, {
-    chainId,
-  }) as PublicClient
-  const metadata = await sdkGetProjectMetadata(client, {
-    jbControllerAddress,
-    projectId: BigInt(projectId),
-  })
-
-  return metadata
-}

src/utils/server/v2v3Metadata.ts

@@ -0,0 +1,25 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { CV_V3 } from 'constants/cv'
+import { JUICEBOX_MONEY_PROJECT_METADATA_DOMAIN } from 'constants/metadataDomain'
+import { readNetwork } from 'constants/networks'
+import { readProvider } from 'constants/readProvider'
+import { V2V3ContractName } from 'packages/v2v3/models/contracts'
+import { loadV2V3Contract } from 'packages/v2v3/utils/loadV2V3Contract'
+
+export const V2V3GetMetadataCidFromContract = async (projectId: number) => {
+  const JBProjects = await loadV2V3Contract(
+    V2V3ContractName.JBProjects,
+    readNetwork.name,
+    readProvider,
+    CV_V3, // Note: v2 and v3 use the same JBProjects, so the CV doesn't matter.
+  )
+  if (!JBProjects) {
+    throw new Error(`contract not found ${V2V3ContractName.JBProjects}`)
+  }
+  const metadataCid = (await JBProjects.metadataContentOf(
+    projectId,
+    JUICEBOX_MONEY_PROJECT_METADATA_DOMAIN,
+  )) as string
+
+  return metadataCid
+}

src/utils/server/v4Metadata.ts

@@ -0,0 +1,42 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { getPublicClient } from '@wagmi/core'
+import {
+  readJbDirectoryControllerOf,
+  getProjectMetadata as sdkGetProjectMetadata,
+} from 'juice-sdk-core'
+import { chainNameMap } from 'packages/v4/utils/networks'
+import { wagmiConfig } from 'packages/v4/wagmiConfig'
+import { PublicClient } from 'viem'
+
+export const getV4ProjectMetadata = async (
+  projectId: string | number,
+  chain?: string | undefined,
+) => {
+  if (typeof projectId === 'string') {
+    projectId = Number(projectId)
+  }
+  if (isNaN(projectId)) return undefined
+
+  if (!chain) throw new Error('Chain is required for V4 projects')
+  return await V4GetMetadataCidFromContract(projectId, chain)
+}
+
+const V4GetMetadataCidFromContract = async (
+  projectId: number,
+  chainName: string,
+) => {
+  const chainId = chainNameMap[chainName]
+  const jbControllerAddress = await readJbDirectoryControllerOf(wagmiConfig, {
+    chainId,
+    args: [BigInt(projectId)],
+  })
+  const client = getPublicClient(wagmiConfig, {
+    chainId,
+  }) as PublicClient
+  const metadata = await sdkGetProjectMetadata(client, {
+    jbControllerAddress,
+    projectId: BigInt(projectId),
+  })
+
+  return metadata
+}