diff --git a/contracts/tasks/index.ts b/contracts/tasks/index.ts
index 19050a901..98c143c27 100644
--- a/contracts/tasks/index.ts
+++ b/contracts/tasks/index.ts
@@ -15,6 +15,7 @@ import './runners/finalize'
 import './runners/claim'
 import './runners/cancel'
 import './runners/exportRound'
+import './runners/exportImages'
 import './runners/mergeAllocation'
 import './runners/loadSimpleUsers'
 import './runners/loadMerkleUsers'
diff --git a/contracts/tasks/runners/exportImages.ts b/contracts/tasks/runners/exportImages.ts
new file mode 100644
index 000000000..7800a85a2
--- /dev/null
+++ b/contracts/tasks/runners/exportImages.ts
@@ -0,0 +1,83 @@
+/**
+ * Export the project logo images in a ClrFund round.
+ *
+ * Sample usage:
+ * yarn hardhat export-images \
+ *   --output-dir ../vue-apps/public/ipfs
+ *   --gateway https://ipfs.io
+ *   --round-file ../vue-app/src/rounds/arbitrum/0x4A2d90844EB9C815eF10dB0371726F0ceb2848B0.json
+ *
+ * Notes:
+ * 1) This script assumes the round has been exported using the `export-round` hardhat task
+ */
+
+import { task } from 'hardhat/config'
+import { isPathExist, makeDirectory } from '../../utils/misc'
+import { getIpfsContent } from '@clrfund/common'
+import fs from 'fs'
+import { dirname } from 'path'
+
+/**
+ * Download the IPFS file with the ipfsHash to the output directory
+ * @param gateway IPFS gateway url
+ * @param ipfsHash IPFS hash of the file to download
+ * @param outputDir The directory to store the downloaded file
+ */
+async function download({
+  gateway,
+  ipfsHash,
+  outputDir,
+}: {
+  gateway: string
+  ipfsHash: string
+  outputDir: string
+}) {
+  if (!ipfsHash) return
+
+  const res = await getIpfsContent(ipfsHash, gateway)
+  if (res.hasBody()) {
+    console.log('Downloaded', ipfsHash)
+    const path = `${outputDir}/${ipfsHash}`
+    const folder = dirname(path)
+    if (!isPathExist(folder)) {
+      makeDirectory(folder)
+    }
+
+    fs.writeFileSync(path, res.body)
+  }
+}
+
+task('export-images', 'Export project logo images')
+  .addParam('outputDir', 'The output directory')
+  .addParam('roundFile', 'The exported funding round file path')
+  .addParam('gateway', 'The IPFS gateway url')
+  .setAction(async ({ outputDir, roundFile, gateway }) => {
+    console.log('Starting to download from ipfs')
+
+    const data = fs.readFileSync(roundFile, { encoding: 'utf-8' })
+    const round = JSON.parse(data)
+    const projects = round.projects
+    const images = projects.map((project: any) => {
+      const { bannerImageHash, thumbnailImageHash, imageHash } =
+        project.metadata
+      return { bannerImageHash, thumbnailImageHash, imageHash }
+    })
+
+    for (let i = 0; i < images.length; i++) {
+      await download({
+        gateway,
+        ipfsHash: images[i].bannerImageHash,
+        outputDir,
+      })
+      await download({
+        gateway,
+        ipfsHash: images[i].thumbnailImageHash,
+        outputDir,
+      })
+      await download({
+        gateway,
+        ipfsHash: images[i].imageHash,
+        outputDir,
+      })
+    }
+  })
diff --git a/subgraph/config/clrfund-arbitrum.json b/subgraph/config/clrfund-arbitrum.json
new file mode 100644
index 000000000..2c58c9603
--- /dev/null
+++ b/subgraph/config/clrfund-arbitrum.json
@@ -0,0 +1,6 @@
+{
+  "network": "arbitrum-one",
+  "address": "0xc06349D95C30551Ea510bD5F35CfA2151499D60a",
+  "factoryStartBlock": 96912420,
+  "recipientRegistryStartBlock": 96912420
+}
diff --git a/vue-app/src/App.vue b/vue-app/src/App.vue
index 3c7ad9b98..01f555ac1 100644
--- a/vue-app/src/App.vue
+++ b/vue-app/src/App.vue
@@ -8,8 +8,20 @@
       <div v-if="isSidebarShown" id="sidebar" :class="`${showCartPanel ? 'desktop-l' : 'desktop'}`">
         <round-information />
       </div>
-      <active-app v-if="isActiveApp" :is-sidebar-shown="isSidebarShown" :show-bread-crumb="showBreadCrumb" />
-      <static-app v-else :is-sidebar-shown="isSidebarShown" :show-bread-crumb="showBreadCrumb" />
+      <div
+        id="content"
+        :class="{
+          padded: isVerifyStep || (isSidebarShown && !isCartPadding),
+          'mr-cart-open': showCartPanel && isSideCartShown,
+          'mr-cart-closed': !showCartPanel && isSideCartShown,
+        }"
+      >
+        <breadcrumbs v-if="showBreadCrumb" />
+        <router-view :key="route.path" />
+      </div>
+      <div v-if="isSideCartShown" id="cart" :class="`desktop ${showCartPanel ? 'open-cart' : 'closed-cart'}`">
+        <cart-widget />
+      </div>
     </div>
     <mobile-tabs v-if="isMobileTabsShown" />
   </div>
@@ -20,22 +32,29 @@
 <script setup lang="ts">
 import NavBar from '@/components/NavBar.vue'
 import MobileTabs from '@/components/MobileTabs.vue'
-import ActiveApp from './components/ActiveApp.vue'
-import StaticApp from './components/StaticApp.vue'
 
 // @ts-ignore
 import { ModalsContainer } from 'vue-final-modal'
 
 import { getDefaultColorScheme } from '@/utils/theme'
-import { operator, isActiveApp } from '@/api/core'
-import { useAppStore } from '@/stores'
+import { operator } from '@/api/core'
+import { useAppStore, useRecipientStore, useUserStore, useWalletStore } from '@/stores'
 import { storeToRefs } from 'pinia'
 import { useRoute } from 'vue-router'
 import { useMeta } from 'vue-meta'
+import { getCurrentRound } from './api/round'
+import type { WalletUser } from '@/stores'
+import type { BrowserProvider } from 'ethers'
 
 const route = useRoute()
 const appStore = useAppStore()
-const { theme, showCartPanel } = storeToRefs(appStore)
+const { theme, showCartPanel, currentRound } = storeToRefs(appStore)
+const userStore = useUserStore()
+const { currentUser } = storeToRefs(userStore)
+const recipientStore = useRecipientStore()
+const wallet = useWalletStore()
+const { user: walletUser } = storeToRefs(wallet)
+const appReady = ref(false)
 
 // https://stackoverflow.com/questions/71785473/how-to-use-vue-meta-with-vue3
 // https://www.npmjs.com/package/vue-meta/v/3.0.0-alpha.7
@@ -100,6 +119,100 @@ watch(theme, () => {
   const savedTheme = theme.value
   document.documentElement.setAttribute('data-theme', savedTheme || getDefaultColorScheme())
 })
+
+const intervals: { [key: string]: any } = {}
+const isUserAndRoundLoaded = computed(() => !!currentUser.value && !!currentRound.value)
+const isSideCartShown = computed(() => isUserAndRoundLoaded.value && isSidebarShown.value && routeName.value !== 'cart')
+const isVerifyStep = computed(() => routeName.value === 'verify-step')
+const isCartPadding = computed(() => {
+  const routes = ['cart']
+  return routes.includes(routeName.value)
+})
+
+function setupLoadIntervals() {
+  intervals.round = setInterval(() => {
+    appStore.loadRoundInfo()
+  }, 60 * 1000)
+  intervals.recipient = setInterval(async () => {
+    recipientStore.loadRecipientRegistryInfo()
+  }, 60 * 1000)
+  intervals.user = setInterval(() => {
+    userStore.loadUserInfo()
+  }, 60 * 1000)
+}
+
+onMounted(async () => {
+  try {
+    await wallet.reconnect()
+  } catch (err) {
+    /* eslint-disable-next-line no-console */
+    console.warn('Unable to reconnect wallet', err)
+  }
+
+  try {
+    const roundAddress = appStore.currentRoundAddress || (await getCurrentRound())
+
+    if (roundAddress) {
+      appStore.selectRound(roundAddress)
+      /* eslint-disable-next-line no-console */
+      console.log('roundAddress', roundAddress)
+    }
+  } catch (err) {
+    /* eslint-disable-next-line no-console */
+    console.warn('Failed to get current round:', err)
+  }
+
+  appReady.value = true
+  try {
+    await appStore.loadClrFundInfo()
+    await appStore.loadMACIFactoryInfo()
+    await appStore.loadRoundInfo()
+    await recipientStore.loadRecipientRegistryInfo()
+    appStore.isAppReady = true
+
+    setupLoadIntervals()
+  } catch (err) {
+    /* eslint-disable-next-line no-console */
+    console.warn('Failed to load application data:', err)
+  }
+})
+
+onBeforeUnmount(() => {
+  for (const interval of Object.keys(intervals)) {
+    clearInterval(intervals[interval])
+  }
+})
+
+watch(walletUser, async () => {
+  try {
+    if (walletUser.value) {
+      const user: WalletUser = {
+        chainId: walletUser.value.chainId,
+        walletAddress: walletUser.value.walletAddress,
+        web3Provider: walletUser.value.web3Provider as BrowserProvider,
+      }
+      // make sure factory is loaded
+      await appStore.loadClrFundInfo()
+      userStore.loginUser(user)
+      await userStore.loadUserInfo()
+      await userStore.loadBrightID()
+    } else {
+      await userStore.logoutUser()
+    }
+  } catch (err) {
+    /* eslint-disable-next-line no-console */
+    console.log('error', err)
+  }
+})
+
+watch(isUserAndRoundLoaded, async () => {
+  if (!isUserAndRoundLoaded.value) {
+    return
+  }
+
+  // load contribution when we get round information
+  await userStore.loadUserInfo()
+})
 </script>
 
 <style lang="scss">
diff --git a/vue-app/src/api/clrFund.ts b/vue-app/src/api/clrFund.ts
index a3a1018f4..ad147ecb0 100644
--- a/vue-app/src/api/clrFund.ts
+++ b/vue-app/src/api/clrFund.ts
@@ -1,4 +1,4 @@
-import { clrfundContractAddress, clrFundContract, isActiveApp, provider } from './core'
+import { clrfundContractAddress, clrFundContract, provider } from './core'
 import sdk from '@/graphql/sdk'
 import { ERC20 } from './abi'
 import { Contract } from 'ethers'
@@ -21,34 +21,31 @@ export async function getClrFundInfo() {
   let recipientRegistryAddress = ''
 
   try {
-    if (isActiveApp) {
-      const data = await sdk.GetClrFundInfo({
-        clrFundAddress: clrfundContractAddress.toLowerCase(),
-      })
-      const nativeTokenInfo = data.clrFund?.nativeTokenInfo
-      if (nativeTokenInfo) {
-        nativeTokenAddress = nativeTokenInfo.tokenAddress || ''
-        nativeTokenSymbol = nativeTokenInfo.symbol || ''
-        nativeTokenDecimals = Number(nativeTokenInfo.decimals) || 0
-      }
-
-      userRegistryAddress = data.clrFund?.contributorRegistryAddress || ''
-      recipientRegistryAddress = data.clrFund?.recipientRegistryAddress || ''
-    } else {
-      nativeTokenAddress = await clrFundContract.nativeToken()
-      const nativeTokenContract = new Contract(nativeTokenAddress, ERC20, provider)
-      nativeTokenSymbol = await nativeTokenContract.symbol()
-      nativeTokenDecimals = await nativeTokenContract.decimals()
-      userRegistryAddress = await clrFundContract.userRegistry()
-      recipientRegistryAddress = await clrFundContract.recipientRegistry()
+    const data = await sdk.GetClrFundInfo({
+      clrFundAddress: clrfundContractAddress.toLowerCase(),
+    })
+    const nativeTokenInfo = data.clrFund?.nativeTokenInfo
+    if (nativeTokenInfo) {
+      nativeTokenAddress = nativeTokenInfo.tokenAddress || ''
+      nativeTokenSymbol = nativeTokenInfo.symbol || ''
+      nativeTokenDecimals = Number(nativeTokenInfo.decimals) || 0
     }
+
+    userRegistryAddress = data.clrFund?.contributorRegistryAddress || ''
+    recipientRegistryAddress = data.clrFund?.recipientRegistryAddress || ''
   } catch (err) {
-    /* eslint-disable-next-line no-console */
-    console.error('Failed GetClrFundInfo', err)
+    nativeTokenAddress = await clrFundContract.nativeToken().catch(() => '')
+    const nativeTokenContract = new Contract(nativeTokenAddress, ERC20, provider)
+    nativeTokenSymbol = await nativeTokenContract.symbol().catch(() => '')
+    nativeTokenDecimals = await nativeTokenContract.decimals().catch(() => nativeTokenDecimals)
+    userRegistryAddress = await clrFundContract.userRegistry().catch(() => '')
+    recipientRegistryAddress = await clrFundContract.recipientRegistry().catch(() => '')
   }
 
   try {
-    matchingPool = await getMatchingFunds(nativeTokenAddress)
+    if (nativeTokenAddress) {
+      matchingPool = await getMatchingFunds(nativeTokenAddress)
+    }
   } catch (err) {
     /* eslint-disable-next-line no-console */
     console.error('Failed to get matching pool', err)
diff --git a/vue-app/src/api/contributions.ts b/vue-app/src/api/contributions.ts
index a6aed99ef..08598dc31 100644
--- a/vue-app/src/api/contributions.ts
+++ b/vue-app/src/api/contributions.ts
@@ -8,6 +8,7 @@ import { clrFundContract, provider } from './core'
 import type { Project } from './projects'
 import sdk from '@/graphql/sdk'
 import { Transaction } from '@/utils/transaction'
+import type { GetContributorIndexQuery, GetContributorMessagesQuery, GetTotalContributedQuery } from '@/graphql/API'
 
 export const DEFAULT_CONTRIBUTION_AMOUNT = 5
 export const MAX_CONTRIBUTION_AMOUNT = 10000 // See FundingRound.sol
@@ -99,9 +100,14 @@ export async function getTotalContributed(fundingRoundAddress: string): Promise<
   const nativeToken = new Contract(nativeTokenAddress, ERC20, provider)
   const balance = await nativeToken.balanceOf(fundingRoundAddress)
 
-  const data = await sdk.GetTotalContributed({
-    fundingRoundAddress: fundingRoundAddress.toLowerCase(),
-  })
+  let data: GetTotalContributedQuery
+  try {
+    data = await sdk.GetTotalContributed({
+      fundingRoundAddress: fundingRoundAddress.toLowerCase(),
+    })
+  } catch {
+    return { count: 0, amount: 0n }
+  }
 
   if (!data.fundingRound?.contributorCount) {
     return { count: 0, amount: 0n }
@@ -149,10 +155,16 @@ export async function getContributorIndex(maciAddress: string, pubKey: PubKey):
   if (!maciAddress) {
     return null
   }
-  const id = getPubKeyId(maciAddress, pubKey)
-  const data = await sdk.GetContributorIndex({
-    publicKeyId: id,
-  })
+
+  let data: GetContributorIndexQuery
+  try {
+    const id = getPubKeyId(maciAddress, pubKey)
+    data = await sdk.GetContributorIndex({
+      publicKeyId: id,
+    })
+  } catch {
+    return null
+  }
 
   if (data.publicKeys.length === 0) {
     return null
@@ -197,11 +209,16 @@ export async function getContributorMessages({
     return []
   }
 
-  const key = getPubKeyId(maciAddress, contributorKey.pubKey)
-  const result = await sdk.GetContributorMessages({
-    pubKey: key,
-    contributorAddress: contributorAddress.toLowerCase(),
-  })
+  let result: GetContributorMessagesQuery
+  try {
+    const key = getPubKeyId(maciAddress, contributorKey.pubKey)
+    result = await sdk.GetContributorMessages({
+      pubKey: key,
+      contributorAddress: contributorAddress.toLowerCase(),
+    })
+  } catch {
+    return []
+  }
 
   if (!(result.messages && result.messages.length)) {
     return []
diff --git a/vue-app/src/api/core.ts b/vue-app/src/api/core.ts
index 0de7568ae..c306df278 100644
--- a/vue-app/src/api/core.ts
+++ b/vue-app/src/api/core.ts
@@ -58,10 +58,7 @@ if (!['simple', 'optimistic', 'kleros'].includes(recipientRegistryType as string
 export const recipientRegistryPolicy = import.meta.env.VITE_RECIPIENT_REGISTRY_POLICY
 export const operator: string = import.meta.env.VITE_OPERATOR || 'Clr.fund'
 
-export const SUBGRAPH_ENDPOINT =
-  import.meta.env.VITE_SUBGRAPH_URL || 'https://api.thegraph.com/subgraphs/name/clrfund/clrfund'
-
-export const isActiveApp = Boolean(import.meta.env.VITE_SUBGRAPH_URL)
+export const SUBGRAPH_ENDPOINT = import.meta.env.VITE_SUBGRAPH_URL || ''
 
 // application theme
 export enum ThemeMode {
diff --git a/vue-app/src/api/leaderboard.ts b/vue-app/src/api/leaderboard.ts
deleted file mode 100644
index a09b0d0d6..000000000
--- a/vue-app/src/api/leaderboard.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import leaderboardRounds from '@/rounds/rounds.json'
-
-type LeaderboardRecord = {
-  address: string
-  network: string
-}
-
-export async function getLeaderboardData(roundAddress: string, network: string) {
-  const rounds = leaderboardRounds as LeaderboardRecord[]
-
-  const lowercaseRoundAddress = (roundAddress || '').toLowerCase()
-  const lowercaseNetwork = (network || '').toLowerCase()
-  const found = rounds.find((r: LeaderboardRecord) => {
-    return r.address.toLowerCase() === lowercaseRoundAddress && r.network.toLowerCase() === lowercaseNetwork
-  })
-
-  return found ? import(`../rounds/${found.network}/${found.address}.json`) : null
-}
diff --git a/vue-app/src/api/maci-factory.ts b/vue-app/src/api/maci-factory.ts
index 7e8a9f84c..e1b6bf8cf 100644
--- a/vue-app/src/api/maci-factory.ts
+++ b/vue-app/src/api/maci-factory.ts
@@ -12,8 +12,13 @@ export async function getMACIFactoryInfo(maxRecipients?: number): Promise<MACIFa
 
   if (maxRecipients === undefined) {
     const maciFactory = new Contract(maciFactoryAddress, MACIFactoryABI, provider)
-    const treeDepths = await maciFactory.treeDepths()
-    maxRecipients = 5 ** getNumber(treeDepths.voteOptionTreeDepth) - 1
+    try {
+      const treeDepths = await maciFactory.treeDepths()
+      maxRecipients = 5 ** getNumber(treeDepths.voteOptionTreeDepth) - 1
+    } catch {
+      // treeDepths doesn't exist on older version of maciFactory
+      maxRecipients = 124
+    }
   }
 
   return {
diff --git a/vue-app/src/api/projects.ts b/vue-app/src/api/projects.ts
index 2795ad82e..323ed0f6c 100644
--- a/vue-app/src/api/projects.ts
+++ b/vue-app/src/api/projects.ts
@@ -7,16 +7,16 @@ import SimpleRegistry from './recipient-registry-simple'
 import OptimisticRegistry from './recipient-registry-optimistic'
 import KlerosRegistry from './recipient-registry-kleros'
 import sdk from '@/graphql/sdk'
-import { getLeaderboardData } from '@/api/leaderboard'
+import { findStaticRound } from '@/api/round'
 import type { RecipientApplicationData } from '@/api/types'
+import type { GetRecipientByIndexQuery } from '@/graphql/API'
 
 export interface LeaderboardProject {
   id: string // Address or another ID depending on registry implementation
   name: string
   index: number
-  bannerImageUrl?: string
-  thumbnailImageUrl?: string
-  imageUrl?: string
+  bannerImageHash?: string
+  thumbnailImageHash?: string
   allocatedAmount: bigint
   votes: bigint
   donation: bigint
@@ -39,9 +39,8 @@ export interface Project {
   websiteUrl?: string
   twitterUrl?: string
   discordUrl?: string
-  bannerImageUrl?: string
-  thumbnailImageUrl?: string
-  imageUrl?: string // TODO remove
+  bannerImageHash?: string
+  thumbnailImageHash?: string
   index: number
   isHidden: boolean // Hidden from the list (does not participate in round)
   isLocked: boolean // Visible, but contributions are not allowed
@@ -53,17 +52,33 @@ export interface Project {
 export async function getRecipientRegistryAddress(roundAddress: string | null): Promise<string> {
   if (roundAddress !== null) {
     const fundingRound = new Contract(roundAddress, FundingRound, provider)
-    return await fundingRound.recipientRegistry()
+    return await fundingRound.recipientRegistry().catch(() => null)
   } else {
-    return await clrFundContract.recipientRegistry()
+    return await clrFundContract.recipientRegistry().catch(() => null)
   }
 }
 
-export async function getProjects(registryAddress: string, startTime?: number, endTime?: number): Promise<Project[]> {
+/**
+ * Get all the projects added between the start and end time
+ * @returns List of projects
+ */
+export async function getProjects({
+  registryAddress,
+  fundingRoundAddress,
+  network,
+  startTime,
+  endTime,
+}: {
+  registryAddress: string
+  fundingRoundAddress?: string
+  network?: string
+  startTime?: number
+  endTime?: number
+}): Promise<Project[]> {
   if (recipientRegistryType === 'simple') {
     return await SimpleRegistry.getProjects(registryAddress, startTime, endTime)
   } else if (recipientRegistryType === 'optimistic') {
-    return await OptimisticRegistry.getProjects(registryAddress, startTime, endTime)
+    return await OptimisticRegistry.getProjects({ registryAddress, fundingRoundAddress, network, startTime, endTime })
   } else if (recipientRegistryType === 'kleros') {
     return await KlerosRegistry.getProjects(registryAddress, startTime, endTime)
   } else {
@@ -81,11 +96,21 @@ export async function getProjects(registryAddress: string, startTime?: number, e
  * @param filter filter result by locked or verified status
  * @returns project information
  */
-export async function getProject(registryAddress: string, recipientId: string, filter = true): Promise<Project | null> {
+export async function getProject({
+  registryAddress,
+  fundingRoundAddress,
+  recipientId,
+  filter = true,
+}: {
+  registryAddress: string
+  fundingRoundAddress?: string
+  recipientId: string
+  filter: boolean
+}): Promise<Project | null> {
   if (recipientRegistryType === 'simple') {
     return await SimpleRegistry.getProject(registryAddress, recipientId)
   } else if (recipientRegistryType === 'optimistic') {
-    return await OptimisticRegistry.getProject(recipientId, filter)
+    return await OptimisticRegistry.getProject({ fundingRoundAddress, recipientId, filter })
   } else if (recipientRegistryType === 'kleros') {
     return await KlerosRegistry.getProject(registryAddress, recipientId)
   } else {
@@ -117,10 +142,15 @@ export async function getProjectByIndex(
   registryAddress: string,
   recipientIndex: number,
 ): Promise<Partial<Project> | null> {
-  const result = await sdk.GetRecipientByIndex({
-    registryAddress: registryAddress.toLowerCase(),
-    recipientIndex,
-  })
+  let result: GetRecipientByIndexQuery
+  try {
+    result = await sdk.GetRecipientByIndex({
+      registryAddress: registryAddress.toLowerCase(),
+      recipientIndex,
+    })
+  } catch {
+    return null
+  }
 
   if (!result.recipients.length) {
     return null
@@ -134,17 +164,13 @@ export async function getProjectByIndex(
     metadata = {}
   }
 
-  const thumbnailImageUrl = metadata.thumbnailImageHash
-    ? `${ipfsGatewayUrl}/ipfs/${metadata.thumbnailImageHash}`
-    : `${ipfsGatewayUrl}/ipfs/${metadata.imageUrl}`
-
   return {
     id: recipient.id,
     address: recipient.recipientAddress || '',
     name: metadata.name,
     description: metadata.description,
     tagline: metadata.tagline,
-    thumbnailImageUrl,
+    thumbnailImageHash: metadata.thumbnailImageHash || metadata.imageHash,
     index: recipient.recipientIndex,
   }
 }
@@ -182,12 +208,12 @@ export async function getRecipientIdByHash(transactionHash: string): Promise<str
 }
 
 export function toLeaderboardProject(project: any): LeaderboardProject {
-  const imageUrl = `${ipfsGatewayUrl}/ipfs/${project.metadata.imageHash || project.metadata.thumbnailImageHash}`
   return {
     id: project.id,
     name: project.name,
-    index: getNumber(project.recipientIndex),
-    imageUrl,
+    index: getNumber(project.recipientIndex || 0),
+    thumbnailImageHash: project.metadata.thumbnailImageHash || project.metadata.imageHash,
+    bannerImageHash: project.metadata.bannerImageHash,
     allocatedAmount: BigInt(project.allocatedAmount || '0'),
     votes: BigInt(project.tallyResult || '0'),
     donation: BigInt(project.spentVoiceCredits || '0'),
@@ -199,7 +225,7 @@ export async function getLeaderboardProject(
   projectId: string,
   network: string,
 ): Promise<Project | null> {
-  const data = await getLeaderboardData(roundAddress, network)
+  const data = await findStaticRound(roundAddress, network)
   if (!data) {
     return null
   }
@@ -207,10 +233,8 @@ export async function getLeaderboardProject(
   const project = data.projects.find(project => project.id === projectId)
 
   const metadata = project.metadata
-  const thumbnailHash = metadata.thumbnailImageHash || metadata.imageHash
-  const thumbnailImageUrl = thumbnailHash ? `${ipfsGatewayUrl}/ipfs/${thumbnailHash}` : undefined
-  const bannerHash = metadata.bannerImageHash || metadata.imageHash
-  const bannerImageUrl = bannerHash ? `${ipfsGatewayUrl}/ipfs/${bannerHash}` : undefined
+  const thumbnailImageHash = metadata.thumbnailImageHash || metadata.imageHash
+  const bannerImageHash = metadata.bannerImageHash || metadata.imageHash
 
   return {
     id: project.id,
@@ -228,8 +252,8 @@ export async function getLeaderboardProject(
     websiteUrl: metadata.websiteUrl,
     twitterUrl: metadata.twitterUrl,
     discordUrl: metadata.discordUrl,
-    thumbnailImageUrl,
-    bannerImageUrl,
+    thumbnailImageHash,
+    bannerImageHash,
     index: project.recipientIndex,
     isHidden: false, // always show leaderboard project
     isLocked: true, // Visible, but contributions are not allowed
@@ -254,8 +278,8 @@ export function formToProjectInterface(data: RecipientApplicationData): Project
     websiteUrl: links.website,
     twitterUrl: links.twitter,
     discordUrl: links.discord,
-    bannerImageUrl: `${ipfsGatewayUrl}/ipfs/${image.bannerHash}`,
-    thumbnailImageUrl: `${ipfsGatewayUrl}/ipfs/${image.thumbnailHash}`,
+    bannerImageHash: image.bannerHash,
+    thumbnailImageHash: image.thumbnailHash,
     index: 0,
     isHidden: false,
     isLocked: true,
@@ -271,7 +295,7 @@ export function staticDataToProjectInterface(project: any): Project {
   return {
     id: project.id,
     address: project.recipientAddress,
-    name: project.metadata.name,
+    name: project.metadata.name || project.name,
     tagline: project.metadata.tagline,
     description: project.metadata.description,
     category: project.metadata.category,
@@ -284,26 +308,10 @@ export function staticDataToProjectInterface(project: any): Project {
     websiteUrl: project.metadata.websiteUrl,
     twitterUrl: project.metadata.twitterUrl,
     discordUrl: project.discordUrl,
-    bannerImageUrl: `${ipfsGatewayUrl}/ipfs/${project.metadata.bannerImageHash}`,
-    thumbnailImageUrl: `${ipfsGatewayUrl}/ipfs/${project.metadata.thumbnailImageHash}`,
+    bannerImageHash: project.metadata.bannerImageHash || project.metadata.imageHash,
+    thumbnailImageHash: project.metadata.thumbnailImageHash || project.metadata.imageHash,
     index: project.recipientIndex,
     isHidden: project.state !== 'Accepted',
     isLocked: false,
   }
 }
-
-/**
- * Get the list of projects for a static round
- * @param roundAddress The funding round contract address
- * @param network The network
- * @returns Array of projects
- */
-export async function getProjectsForStaticRound(roundAddress: string, network: string): Promise<Project[]> {
-  const data = await getLeaderboardData(roundAddress, network)
-  if (!data) {
-    return []
-  }
-
-  const projects = data.projects.map(staticDataToProjectInterface)
-  return projects
-}
diff --git a/vue-app/src/api/recipient-registry-kleros.ts b/vue-app/src/api/recipient-registry-kleros.ts
index 7ab229938..943a6e149 100644
--- a/vue-app/src/api/recipient-registry-kleros.ts
+++ b/vue-app/src/api/recipient-registry-kleros.ts
@@ -39,7 +39,7 @@ function decodeTcrItemData(
   address: string
   name: string
   description: string
-  imageUrl: string
+  imageHash: string
 } {
   // Disable console.error to ignore parser errors
   /* eslint-disable no-console */
@@ -52,7 +52,7 @@ function decodeTcrItemData(
     address: decodedMetadata[1] as string,
     name: decodedMetadata[0] as string,
     description: decodedMetadata[3] as string,
-    imageUrl: `${ipfsGatewayUrl}${decodedMetadata[2]}`,
+    imageHash: decodedMetadata[2] as string,
   }
 }
 
diff --git a/vue-app/src/api/recipient-registry-optimistic.ts b/vue-app/src/api/recipient-registry-optimistic.ts
index 1baf6610f..8a2f5b054 100644
--- a/vue-app/src/api/recipient-registry-optimistic.ts
+++ b/vue-app/src/api/recipient-registry-optimistic.ts
@@ -1,16 +1,18 @@
 import { Contract, toNumber, isHexString, ContractTransactionResponse } from 'ethers'
-import type { TransactionResponse, TransactionReceipt, Signer } from 'ethers'
+import type { TransactionResponse, Signer } from 'ethers'
 import { DateTime } from 'luxon'
-import { chain } from '@/api/core'
+import { chain, clrFundContract } from '@/api/core'
 
 import { OptimisticRecipientRegistry } from './abi'
 import { provider, ipfsGatewayUrl } from './core'
-import type { Project } from './projects'
+import { staticDataToProjectInterface, type Project } from './projects'
 import sdk from '@/graphql/sdk'
-import type { Recipient } from '@/graphql/API'
+import type { GetProjectQuery, GetRecipientsQuery, Recipient } from '@/graphql/API'
 import { hasDateElapsed } from '@/utils/dates'
 import type { RegistryInfo, RecipientApplicationData } from './types'
 import { formToRecipientData } from './recipient'
+import { isSameAddress } from '@/utils/accounts'
+import { findStaticRound, getStaticRoundInfo } from './round'
 
 async function getRegistryInfo(registryAddress: string): Promise<RegistryInfo> {
   const registry = new Contract(registryAddress, OptimisticRecipientRegistry, provider)
@@ -70,8 +72,8 @@ export enum RequestStatus {
 interface RecipientMetadata {
   name: string
   description: string
-  imageUrl: string
-  thumbnailImageUrl: string
+  imageHash: string
+  thumbnailImageHash: string
 }
 
 export interface Request {
@@ -129,10 +131,73 @@ function mapRequestStatus(request: RecipientRequestData): RequestStatus {
   return status
 }
 
+/**
+ * Map the recipient state from static round data to request status
+ * @param state Recipient state: Active, Rejected, Removed
+ * @returns Request status
+ */
+function staticStateToRequestStatus(state: string): RequestStatus {
+  switch (state) {
+    case 'Accepted':
+      return RequestStatus.Executed
+    case 'Rejected':
+      return RequestStatus.Rejected
+    default:
+      return RequestStatus.Removed
+  }
+}
+
+/**
+ * Try to get the recipients from the static round data
+ * @param registryAddress The recipient registry address
+ * @returns The recipient application requests
+ */
+async function tryGetRecipientsStatically(registryAddress: string): Promise<Request[]> {
+  let requests: Request[] = []
+
+  try {
+    const fundingRoundAddress = await clrFundContract.getCurrentRound()
+    const fundingRoundInfo = await findStaticRound(fundingRoundAddress)
+    if (isSameAddress(fundingRoundInfo?.round?.recipientRegistryAddress, registryAddress)) {
+      if (fundingRoundInfo?.projects) {
+        requests = fundingRoundInfo.projects.map(project => {
+          let metadata = project.metadata
+          try {
+            if (typeof metadata === 'string') {
+              metadata = JSON.parse(project.metadata || '{}')
+            }
+          } catch (e) {
+            metadata = { name: project.name }
+          }
+          return {
+            transactionHash: '', // transaction hash not available in the static data
+            type: RequestType.Registration,
+            status: staticStateToRequestStatus(project.state),
+            acceptanceDate: DateTime.fromISO(project.createdAt),
+            recipientId: project.id,
+            recipient: project.recipientAddress,
+            metadata,
+            requester: project.requester,
+          }
+        })
+      }
+    }
+  } catch {
+    requests = []
+  }
+
+  return requests
+}
+
 export async function getRequests(registryInfo: RegistryInfo, registryAddress: string): Promise<Request[]> {
-  const data = await sdk.GetRecipients({
-    registryAddress: registryAddress.toLowerCase(),
-  })
+  let data: GetRecipientsQuery
+  try {
+    data = await sdk.GetRecipients({
+      registryAddress: registryAddress.toLowerCase(),
+    })
+  } catch {
+    return tryGetRecipientsStatically(registryAddress)
+  }
 
   if (!data.recipients.length) {
     return []
@@ -155,10 +220,8 @@ export async function getRequests(registryInfo: RegistryInfo, registryAddress: s
       metadata = {
         name,
         description,
-        imageUrl: `${ipfsGatewayUrl}/ipfs/${imageHash}`,
-        thumbnailImageUrl: thumbnailImageHash
-          ? `${ipfsGatewayUrl}/ipfs/${thumbnailImageHash}`
-          : `${ipfsGatewayUrl}/ipfs/${imageHash}`,
+        imageHash: imageHash,
+        thumbnailImageHash: thumbnailImageHash,
       }
     }
 
@@ -213,9 +276,6 @@ function decodeProject(recipient: Partial<Recipient>): Project {
 
   const metadata = JSON.parse(recipient.recipientMetadata || '')
 
-  // imageUrl is the legacy form property - fall back to this if bannerImageHash or thumbnailImageHash don't exist
-  const imageUrl = `${ipfsGatewayUrl}/ipfs/${metadata.imageHash}`
-
   let requester
   if (recipient.requester) {
     requester = recipient.requester
@@ -227,7 +287,6 @@ function decodeProject(recipient: Partial<Recipient>): Project {
     requester,
     name: metadata.name,
     description: metadata.description,
-    imageUrl,
     // Only unregistered project can have invalid index 0
     index: 0,
     isHidden: false,
@@ -246,15 +305,42 @@ function decodeProject(recipient: Partial<Recipient>): Project {
     websiteUrl: metadata.websiteUrl,
     twitterUrl: metadata.twitterUrl,
     discordUrl: metadata.discordUrl,
-    bannerImageUrl: metadata.bannerImageHash ? `${ipfsGatewayUrl}/ipfs/${metadata.bannerImageHash}` : imageUrl,
-    thumbnailImageUrl: metadata.thumbnailImageHash ? `${ipfsGatewayUrl}/ipfs/${metadata.thumbnailImageHash}` : imageUrl,
+    bannerImageHash: metadata.bannerImageHash || metadata.imageHash,
+    thumbnailImageHash: metadata.thumbnailImageHash || metadata.imageHash,
   }
 }
 
-export async function getProjects(registryAddress: string, startTime?: number, endTime?: number): Promise<Project[]> {
-  const data = await sdk.GetRecipients({
-    registryAddress: registryAddress.toLowerCase(),
-  })
+/**
+ * Get a list of projects created between the start time and end time
+ * @param registryAddress The recipient registry address
+ * @param fundingRoundAddress The funding round address to search in the static rounds
+ * @returns List of projects
+ */
+export async function getProjects({
+  registryAddress,
+  fundingRoundAddress,
+  network,
+  startTime,
+  endTime,
+}: {
+  registryAddress: string
+  fundingRoundAddress?: string
+  network?: string
+  startTime?: number
+  endTime?: number
+}): Promise<Project[]> {
+  let data: GetRecipientsQuery
+  try {
+    data = await sdk.GetRecipients({
+      registryAddress: registryAddress.toLowerCase(),
+    })
+  } catch {
+    if (!fundingRoundAddress) {
+      return []
+    }
+    const _round = await getStaticRoundInfo(fundingRoundAddress, network)
+    return _round?.projects || []
+  }
 
   if (!data.recipients.length) {
     return []
@@ -316,21 +402,71 @@ export async function getProjects(registryAddress: string, startTime?: number, e
   return projects
 }
 
+/**
+ * Find the project from the static round file
+ * @param projectId The project id
+ * @param fundingRoundAddress The funding round address
+ * @param filter Filter the project if it's deleted
+ */
+async function findStaticProject({
+  projectId,
+  fundingRoundAddress,
+  filter,
+}: {
+  fundingRoundAddress?: string
+  projectId: string
+  filter: boolean
+}): Promise<Project | null> {
+  let project: Project | null = null
+  try {
+    const roundAddress = fundingRoundAddress ?? (await clrFundContract.getCurrentRound())
+    const round = await findStaticRound(roundAddress)
+    if (round?.projects) {
+      const staticProject = round.projects.find(project => project.id === projectId)
+      if (staticProject) {
+        project = staticDataToProjectInterface(staticProject)
+        if (filter && project.isHidden) {
+          project = null
+        }
+      }
+    }
+  } catch {
+    // return not found on error
+    return null
+  }
+
+  return project
+}
+
 /**
  * Get project information
  *
  * @param recipientId recipient id
+ * @param fundingRoundAddress The funding round address
  * @param filter default to always filter result by locked or verified status
  * @returns project
  */
-export async function getProject(recipientId: string, filter = true): Promise<Project | null> {
+export async function getProject({
+  recipientId,
+  fundingRoundAddress,
+  filter = true,
+}: {
+  recipientId: string
+  fundingRoundAddress?: string
+  filter: boolean
+}): Promise<Project | null> {
   if (!isHexString(recipientId, 32)) {
     return null
   }
 
-  const data = await sdk.GetProject({
-    recipientId,
-  })
+  let data: GetProjectQuery
+  try {
+    data = await sdk.GetProject({
+      recipientId,
+    })
+  } catch {
+    return findStaticProject({ projectId: recipientId, fundingRoundAddress, filter })
+  }
 
   if (!data.recipients.length) {
     // Project does not exist
diff --git a/vue-app/src/api/recipient-registry-simple.ts b/vue-app/src/api/recipient-registry-simple.ts
index 8b8f581db..fd988e92a 100644
--- a/vue-app/src/api/recipient-registry-simple.ts
+++ b/vue-app/src/api/recipient-registry-simple.ts
@@ -27,8 +27,8 @@ function decodeRecipientAdded(event: EventLog): Project {
     websiteUrl: metadata.websiteUrl,
     twitterUrl: metadata.twitterUrl,
     discordUrl: metadata.discordUrl,
-    bannerImageUrl: `${ipfsGatewayUrl}/ipfs/${metadata.bannerImageHash}`,
-    thumbnailImageUrl: `${ipfsGatewayUrl}/ipfs/${metadata.thumbnailImageHash}`,
+    bannerImageHash: metadata.bannerImageHash,
+    thumbnailImageHash: metadata.thumbnailImageHash,
     index: getNumber(args._index),
     isHidden: false,
     isLocked: false,
diff --git a/vue-app/src/api/round.ts b/vue-app/src/api/round.ts
index 219dbecad..50088db1b 100644
--- a/vue-app/src/api/round.ts
+++ b/vue-app/src/api/round.ts
@@ -3,14 +3,20 @@ import { DateTime } from 'luxon'
 import { PubKey, type Tally, getMaxContributors } from '@clrfund/common'
 
 import { FundingRound, Poll } from './abi'
-import { provider, clrFundContract, isActiveApp } from './core'
+import { provider, clrFundContract } from './core'
 import { getTotalContributed } from './contributions'
 import { isVoidedRound } from './rounds'
 import sdk from '@/graphql/sdk'
 
 import { isSameAddress } from '@/utils/accounts'
 import { Keypair } from '@clrfund/common'
-import { getLeaderboardData } from '@/api/leaderboard'
+import { staticDataToProjectInterface } from './projects'
+import staticRounds from '@/rounds/rounds.json'
+
+type StaticRoundRecord = {
+  address: string
+  network: string
+}
 
 export interface RoundInfo {
   fundingRoundAddress: string
@@ -39,6 +45,7 @@ export interface RoundInfo {
   blogUrl?: string
   network?: string
   tally?: Tally
+  projects?: any
 }
 
 export interface TimeLeft {
@@ -55,6 +62,37 @@ export enum RoundStatus {
   Finalized = 'Finalized',
   Cancelled = 'Cancelled',
 }
+
+function isSameNetwork(network1 = '', network2 = ''): boolean {
+  return network1.toLowerCase() === network2.toLowerCase()
+}
+
+/**
+ * Find the funding round address from the static round index file
+ * @param roundAddress The funding round address
+ * @param network The network name
+ * @returns The static round data
+ */
+export async function findStaticRound(roundAddress: string, network?: string) {
+  const rounds = staticRounds as StaticRoundRecord[]
+  const checkNetwork = Boolean(network)
+
+  const found = rounds.find((r: StaticRoundRecord) => {
+    return isSameAddress(r.address, roundAddress) && (!checkNetwork || isSameNetwork(network, r.network))
+  })
+
+  if (!found) {
+    return null
+  }
+
+  const data = await import(`../rounds/${found.network}/${found.address}.json`)
+  if (!data.round) {
+    data.round = {}
+  }
+  data.round.network = found.network
+  return data
+}
+
 //TODO: update to take ClrFund address as a parameter, default to env. variable
 export async function getCurrentRound(): Promise<string | null> {
   const fundingRoundAddress = await clrFundContract.getCurrentRound()
@@ -65,7 +103,7 @@ export async function getCurrentRound(): Promise<string | null> {
   return isVoidedRound(fundingRoundAddress) ? null : fundingRoundAddress
 }
 
-export function toRoundInfo(data: any, network: string): RoundInfo {
+export function toRoundInfo(data: any): RoundInfo {
   const nativeTokenDecimals = Number(data.nativeTokenDecimals)
   // leaderboard does not need coordinator key, generate a dummy number
   const keypair = Keypair.createFromSeed(hexlify(randomBytes(32)))
@@ -109,28 +147,34 @@ export function toRoundInfo(data: any, network: string): RoundInfo {
     contributors: data.contributorCount,
     messages: Number(data.messages),
     blogUrl: data.blogUrl,
-    network,
+    network: data.network,
   }
 }
 
-export async function getLeaderboardRoundInfo(fundingRoundAddress: string, network: string): Promise<RoundInfo | null> {
-  const data = await getLeaderboardData(fundingRoundAddress, network)
+export async function getStaticRoundInfo(fundingRoundAddress: string, network?: string): Promise<RoundInfo | null> {
+  const data = await findStaticRound(fundingRoundAddress, network)
   if (!data) {
     return null
   }
 
   let round: RoundInfo | null = null
   try {
-    round = toRoundInfo(data.round, network)
-
-    round.tally = {
-      provider: data.tally.provider,
-      maci: data.tally.maci,
-      pollId: data.pollId,
-      newTallyCommitment: data.tally.newTallyCommitment,
-      results: data.tally.results,
-      totalSpentVoiceCredits: data.tally.totalSpentVoiceCredits ?? data.tally.totalVoiceCredits,
-      perVOSpentVoiceCredits: data.tally.perVOSpentVoiceCredits ?? data.tally.totalVoiceCreditsPerVoteOption,
+    round = toRoundInfo(data.round)
+
+    if (data.tally) {
+      round.tally = {
+        provider: data.tally.provider,
+        maci: data.tally.maci,
+        pollId: data.pollId,
+        newTallyCommitment: data.tally.newTallyCommitment,
+        results: data.tally.results,
+        totalSpentVoiceCredits: data.tally.totalSpentVoiceCredits ?? data.tally.totalVoiceCredits,
+        perVOSpentVoiceCredits: data.tally.perVOSpentVoiceCredits ?? data.tally.totalVoiceCreditsPerVoteOption,
+      }
+    }
+
+    if (data.projects) {
+      round.projects = data.projects.map(staticDataToProjectInterface)
     }
   } catch (err) {
     /* eslint-disable-next-line no-console */
@@ -151,9 +195,9 @@ export async function getRoundInfo(
     return cachedRound
   }
 
-  if (!isActiveApp) {
-    // static app should use the exported round information from rounds.json
-    return null
+  const staticRoundInfo = await getStaticRoundInfo(fundingRoundAddress)
+  if (staticRoundInfo) {
+    return staticRoundInfo
   }
 
   const fundingRound = new Contract(fundingRoundAddress, FundingRound, provider)
diff --git a/vue-app/src/api/rounds.ts b/vue-app/src/api/rounds.ts
index a4e7d9ecd..b809ca248 100644
--- a/vue-app/src/api/rounds.ts
+++ b/vue-app/src/api/rounds.ts
@@ -1,7 +1,7 @@
 import sdk from '@/graphql/sdk'
 import extraRounds from '@/rounds/rounds.json'
 import { getNumber } from 'ethers'
-import { chain, voidedRounds, isActiveApp, clrfundContractAddress } from './core'
+import { chain, voidedRounds, clrfundContractAddress, SUBGRAPH_ENDPOINT } from './core'
 
 export interface Round {
   index: number
@@ -26,13 +26,9 @@ function toRoundId({ network, address }: { network: string; address: string }):
  */
 export async function getRounds(): Promise<Round[]> {
   let data
-  if (isActiveApp) {
-    try {
-      data = await sdk.GetRounds({ clrFundAddress: clrfundContractAddress.toLowerCase() })
-    } catch {
-      data = { fundingRounds: [] }
-    }
-  } else {
+  try {
+    data = await sdk.GetRounds({ clrFundAddress: clrfundContractAddress.toLowerCase() })
+  } catch {
     data = { fundingRounds: [] }
   }
 
diff --git a/vue-app/src/api/subgraph.ts b/vue-app/src/api/subgraph.ts
deleted file mode 100644
index 9f1a58819..000000000
--- a/vue-app/src/api/subgraph.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import type { TransactionReceipt } from 'ethers'
-import sdk from '@/graphql/sdk'
-
-/**
- * Check if the transaction in the receipt exists in the subgraph
- * @param receipt transaction receipt
- * @returns true if the latest block number in subgraph is greater than the transaction block number
- */
-export async function isTransactionInSubgraph(receipt: TransactionReceipt): Promise<boolean> {
-  const data = await sdk.GetLatestBlockNumber()
-
-  if (!data._meta?.block.number) {
-    return false
-  }
-
-  return data._meta.block.number > receipt.blockNumber
-}
diff --git a/vue-app/src/api/tally.ts b/vue-app/src/api/tally.ts
index 1280796dd..d49e4453a 100644
--- a/vue-app/src/api/tally.ts
+++ b/vue-app/src/api/tally.ts
@@ -1,16 +1,46 @@
 import { Contract } from 'ethers'
 
 import { FundingRound } from './abi'
-import { provider, ipfsGatewayUrl } from './core'
+import { provider, chain } from './core'
 
 // https://github.com/webpack/webpack/issues/7378#issuecomment-683891615
 import type { Tally } from '@clrfund/common'
+import { getIpfsUrl } from '@/utils/url'
+import { findStaticRound } from './round'
 
 export { Tally }
 
-export async function getTally(fundingRoundAddress: string): Promise<Tally> {
-  const fundingRound = new Contract(fundingRoundAddress, FundingRound, provider)
-  const tallyHash = await fundingRound.tallyHash()
-  const response = await fetch(`${ipfsGatewayUrl}/ipfs/${tallyHash}`)
-  return await response.json()
+export async function getTally(fundingRoundAddress: string): Promise<Tally | null> {
+  let tally: Tally | null = null
+
+  try {
+    // try to get the tally file statically first, if not found, try the IPFS gateway
+    const round = await findStaticRound(fundingRoundAddress, chain.name)
+    if (round?.tally) {
+      tally = round.tally
+
+      // field name changes from MACI v0 to v1
+      if (tally.totalVoiceCredits) {
+        tally.totalSpentVoiceCredits = tally.totalVoiceCredits
+      }
+      if (tally.totalVoiceCreditsPerVoteOption) {
+        tally.perVOSpentVoiceCredits = tally.totalVoiceCreditsPerVoteOption
+      }
+    }
+  } catch {
+    // ignore error and try to get the tally file from Ipfs gateway
+  }
+
+  if (!tally) {
+    try {
+      const fundingRound = new Contract(fundingRoundAddress, FundingRound, provider)
+      const tallyHash = await fundingRound.tallyHash()
+      const response = await fetch(getIpfsUrl(tallyHash) || '')
+      return await response.json()
+    } catch {
+      // ignore error and return null
+    }
+  }
+
+  return tally
 }
diff --git a/vue-app/src/components.d.ts b/vue-app/src/components.d.ts
index 5f037b3de..0dedd963b 100644
--- a/vue-app/src/components.d.ts
+++ b/vue-app/src/components.d.ts
@@ -8,7 +8,6 @@ export {}
 declare module '@vue/runtime-core' {
   export interface GlobalComponents {
     Accordion: typeof import('./components/Accordion.vue')['default']
-    ActiveApp: typeof import('./components/ActiveApp.vue')['default']
     AddToCartButton: typeof import('./components/AddToCartButton.vue')['default']
     BackLink: typeof import('./components/BackLink.vue')['default']
     BalanceItem: typeof import('./components/BalanceItem.vue')['default']
@@ -36,6 +35,7 @@ declare module '@vue/runtime-core' {
     Info: typeof import('./components/Info.vue')['default']
     InputButton: typeof import('./components/InputButton.vue')['default']
     IpfsCopyWidget: typeof import('./components/IpfsCopyWidget.vue')['default']
+    IpfsImage: typeof import('./components/IpfsImage.vue')['default']
     IpfsImageUpload: typeof import('./components/IpfsImageUpload.vue')['default']
     LayoutSteps: typeof import('./components/LayoutSteps.vue')['default']
     LeaderboardDetailView: typeof import('./components/LeaderboardDetailView.vue')['default']
@@ -57,7 +57,6 @@ declare module '@vue/runtime-core' {
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     SignatureModal: typeof import('./components/SignatureModal.vue')['default']
-    StaticApp: typeof import('./components/StaticApp.vue')['default']
     TimeLeft: typeof import('./components/TimeLeft.vue')['default']
     Transaction: typeof import('./components/Transaction.vue')['default']
     TransactionModal: typeof import('./components/TransactionModal.vue')['default']
diff --git a/vue-app/src/components/ActiveApp.vue b/vue-app/src/components/ActiveApp.vue
deleted file mode 100644
index 7bc404fb1..000000000
--- a/vue-app/src/components/ActiveApp.vue
+++ /dev/null
@@ -1,139 +0,0 @@
-<template>
-  <div
-    id="content"
-    :class="{
-      padded: isVerifyStep || (isSidebarShown && !isCartPadding),
-      'mr-cart-open': showCartPanel && isSideCartShown,
-      'mr-cart-closed': !showCartPanel && isSideCartShown,
-    }"
-  >
-    <breadcrumbs v-if="showBreadCrumb" />
-    <router-view :key="route.path" />
-  </div>
-  <div v-if="isSideCartShown" id="cart" :class="`desktop ${showCartPanel ? 'open-cart' : 'closed-cart'}`">
-    <cart-widget />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useRoute } from 'vue-router'
-import { getCurrentRound } from '@/api/round'
-import type { WalletUser } from '@/stores'
-import { useAppStore, useRecipientStore, useUserStore } from '@/stores'
-import type { BrowserProvider } from 'ethers'
-import { useWalletStore } from '@/stores'
-import CartWidget from '@/components/CartWidget.vue'
-import Breadcrumbs from '@/components/Breadcrumbs.vue'
-
-interface Props {
-  showBreadCrumb: boolean
-  isSidebarShown: boolean
-}
-const props = defineProps<Props>()
-
-const route = useRoute()
-const wallet = useWalletStore()
-const { user: walletUser } = storeToRefs(wallet)
-
-const appReady = ref(false)
-const appStore = useAppStore()
-const recipientStore = useRecipientStore()
-const userStore = useUserStore()
-const { currentUser } = storeToRefs(userStore)
-const { currentRound, showCartPanel } = storeToRefs(appStore)
-const routeName = computed(() => route.name?.toString() || '')
-
-const intervals: { [key: string]: any } = {}
-const isUserAndRoundLoaded = computed(() => !!currentUser.value && !!currentRound.value)
-const isSideCartShown = computed(() => isUserAndRoundLoaded.value && props.isSidebarShown && routeName.value !== 'cart')
-const isVerifyStep = computed(() => routeName.value === 'verify-step')
-const isCartPadding = computed(() => {
-  const routes = ['cart']
-  return routes.includes(routeName.value)
-})
-
-function setupLoadIntervals() {
-  intervals.round = setInterval(() => {
-    appStore.loadRoundInfo()
-  }, 60 * 1000)
-  intervals.recipient = setInterval(async () => {
-    recipientStore.loadRecipientRegistryInfo()
-  }, 60 * 1000)
-  intervals.user = setInterval(() => {
-    userStore.loadUserInfo()
-  }, 60 * 1000)
-}
-
-onMounted(async () => {
-  try {
-    await wallet.reconnect()
-  } catch (err) {
-    /* eslint-disable-next-line no-console */
-    console.warn('Unable to reconnect wallet', err)
-  }
-
-  try {
-    const roundAddress = appStore.currentRoundAddress || (await getCurrentRound())
-
-    if (roundAddress) {
-      appStore.selectRound(roundAddress)
-      /* eslint-disable-next-line no-console */
-      console.log('roundAddress', roundAddress)
-    }
-  } catch (err) {
-    /* eslint-disable-next-line no-console */
-    console.warn('Failed to get current round:', err)
-  }
-
-  appReady.value = true
-  try {
-    await appStore.loadClrFundInfo()
-    await appStore.loadMACIFactoryInfo()
-    await appStore.loadRoundInfo()
-    await recipientStore.loadRecipientRegistryInfo()
-    appStore.isAppReady = true
-
-    setupLoadIntervals()
-  } catch (err) {
-    /* eslint-disable-next-line no-console */
-    console.warn('Failed to load application data:', err)
-  }
-})
-
-onBeforeUnmount(() => {
-  for (const interval of Object.keys(intervals)) {
-    clearInterval(intervals[interval])
-  }
-})
-
-watch(walletUser, async () => {
-  try {
-    if (walletUser.value) {
-      const user: WalletUser = {
-        chainId: walletUser.value.chainId,
-        walletAddress: walletUser.value.walletAddress,
-        web3Provider: walletUser.value.web3Provider as BrowserProvider,
-      }
-      // make sure factory is loaded
-      await appStore.loadClrFundInfo()
-      userStore.loginUser(user)
-      await userStore.loadUserInfo()
-      await userStore.loadBrightID()
-    } else {
-      await userStore.logoutUser()
-    }
-  } catch (err) {
-    /* eslint-disable-next-line no-console */
-    console.log('error', err)
-  }
-})
-
-watch(isUserAndRoundLoaded, async () => {
-  if (!isUserAndRoundLoaded.value) {
-    return
-  }
-
-  // load contribution when we get round information
-  await userStore.loadUserInfo()
-})
-</script>
diff --git a/vue-app/src/components/CartItems.vue b/vue-app/src/components/CartItems.vue
index 915a09f58..e2081542e 100644
--- a/vue-app/src/components/CartItems.vue
+++ b/vue-app/src/components/CartItems.vue
@@ -10,7 +10,7 @@
     >
       <div class="project">
         <links :to="{ name: 'project', params: { id: item.id } }">
-          <img class="project-image" :src="item.thumbnailImageUrl" :alt="item.name" />
+          <ipfs-image class="project-image" :src="item.thumbnailImageHash" :alt="item.name" />
         </links>
         <links class="project-name" :to="{ name: 'project', params: { id: item.id } }">
           {{ item.name }}
diff --git a/vue-app/src/components/IpfsImage.vue b/vue-app/src/components/IpfsImage.vue
new file mode 100644
index 000000000..4cd531311
--- /dev/null
+++ b/vue-app/src/components/IpfsImage.vue
@@ -0,0 +1,37 @@
+<template>
+  <template v-if="imageType === ImageType.NoImage" />
+  <img v-else @error="handleBrokenImage" :src="imageSrc" :alt="alt" :class="class" />
+</template>
+
+<script setup lang="ts">
+import { getIpfsUrl, getStaticUrlByIpfsHash } from '@/utils/url'
+
+interface Props {
+  class?: string
+  src?: string
+  alt: string
+}
+
+enum ImageType {
+  Ipfs,
+  Static,
+  NoImage,
+}
+
+const props = defineProps<Props>()
+
+const imageType = ref(ImageType.Ipfs)
+const imageSrc = ref(getIpfsUrl(props.src) || '')
+
+function handleBrokenImage() {
+  switch (imageType.value) {
+    case ImageType.Ipfs:
+      imageType.value = ImageType.Static
+      imageSrc.value = getStaticUrlByIpfsHash(props.src) || ''
+      break
+    default:
+      imageType.value = ImageType.NoImage
+      imageSrc.value = ''
+  }
+}
+</script>
diff --git a/vue-app/src/components/LeaderboardSimpleView.vue b/vue-app/src/components/LeaderboardSimpleView.vue
index 5ffe65266..db86550e3 100644
--- a/vue-app/src/components/LeaderboardSimpleView.vue
+++ b/vue-app/src/components/LeaderboardSimpleView.vue
@@ -24,9 +24,6 @@
             {{ rank }}
           </div>
         </div>
-        <div class="desktop project-image">
-          <img v-if="projectImageUrl" :src="projectImageUrl" :alt="project.name" />
-        </div>
         <div class="project-name">
           {{ project.name }}
         </div>
@@ -79,14 +76,6 @@ function formatAllocationAmount(amount?: bigint): string {
   return amount ? formatAmount(amount, tokenDecimals, null, 0) : '0'
 }
 
-const projectImageUrl = computed(() => {
-  if (typeof props.project.imageUrl !== 'undefined') {
-    return props.project.imageUrl
-  }
-
-  return null
-})
-
 const tokenSymbol = computed(() => {
   return props.round.nativeTokenSymbol
 })
diff --git a/vue-app/src/components/NavBar.vue b/vue-app/src/components/NavBar.vue
index c4cf5cdfc..82b50b3f6 100644
--- a/vue-app/src/components/NavBar.vue
+++ b/vue-app/src/components/NavBar.vue
@@ -53,7 +53,7 @@
               <p class="item-text">{{ $t('navBar.dropdown.rounds') }}</p>
             </links>
           </div>
-          <div v-if="isOptimisticRecipientRegistry && isActiveApp" class="dropdown-item" @click="closeHelpDropdown">
+          <div v-if="isOptimisticRecipientRegistry" class="dropdown-item" @click="closeHelpDropdown">
             <links to="/recipients">
               <div class="emoji-wrapper">💎</div>
               <p class="item-text">{{ $t('navBar.dropdown.recipients') }}</p>
@@ -87,7 +87,7 @@
 </template>
 
 <script setup lang="ts">
-import { chain, ThemeMode, isOptimisticRecipientRegistry, isActiveApp } from '@/api/core'
+import { chain, ThemeMode, isOptimisticRecipientRegistry } from '@/api/core'
 import { lsGet, lsSet } from '@/utils/localStorage'
 import { isValidTheme, getDefaultColorScheme } from '@/utils/theme'
 import { useAppStore } from '@/stores'
diff --git a/vue-app/src/components/ProjectListItem.vue b/vue-app/src/components/ProjectListItem.vue
index 009502493..b0b7c3aa4 100644
--- a/vue-app/src/components/ProjectListItem.vue
+++ b/vue-app/src/components/ProjectListItem.vue
@@ -3,7 +3,7 @@
     <div>
       <links :to="projectRoute">
         <div class="project-image">
-          <img :src="projectImageUrl || ''" :alt="project.name" />
+          <ipfs-image :src="props.project.bannerImageHash || ''" :alt="project.name" />
           <div v-if="project.category" class="tag">
             {{ $t(categoryLocaleKey(project.category)) }}
           </div>
@@ -36,7 +36,7 @@ import { markdown } from '@/utils/markdown'
 import { useRoute, type RouteLocationRaw } from 'vue-router'
 import { useAppStore } from '@/stores'
 import { storeToRefs } from 'pinia'
-import { isActiveApp } from '@/api/core'
+import IpfsImage from './IpfsImage.vue'
 
 const route = useRoute()
 const appStore = useAppStore()
@@ -55,16 +55,6 @@ const descriptionHtml = computed<string>(() => {
   return markdown.renderInline(props.project.description)
 })
 
-const projectImageUrl = computed<string | null>(() => {
-  if (typeof props.project.bannerImageUrl !== 'undefined') {
-    return props.project.bannerImageUrl
-  }
-  if (typeof props.project.imageUrl !== 'undefined') {
-    return props.project.imageUrl
-  }
-  return null
-})
-
 const inCart = computed<boolean>(() => {
   const index = appStore.cart.findIndex((item: CartItem) => {
     // Ignore cleared items
@@ -74,8 +64,8 @@ const inCart = computed<boolean>(() => {
 })
 
 const isCurrentRound = computed<boolean>(() => {
-  const roundAddress = props.roundAddress || currentRoundAddress.value
-  return appStore.isCurrentRound(props.roundAddress)
+  const roundAddress = props.roundAddress || currentRoundAddress.value || ''
+  return appStore.isCurrentRound(roundAddress)
 })
 
 const shouldShowCartInput = computed<boolean>(() => {
@@ -83,20 +73,12 @@ const shouldShowCartInput = computed<boolean>(() => {
 })
 
 const projectRoute = computed<RouteLocationRaw>(() => {
-  if (isActiveApp) {
-    return route.name === 'round'
-      ? {
-          name: 'round-project',
-          params: { address: props.roundAddress, id: props.project.id },
-        }
-      : { name: 'project', params: { id: props.project.id } }
-  } else {
-    const network = currentRound.value?.network || ''
-    return {
-      name: 'leaderboard-project',
-      params: { address: props.roundAddress, network, id: props.project.id },
-    }
-  }
+  return route.name === 'round'
+    ? {
+        name: 'round-project',
+        params: { address: props.roundAddress, id: props.project.id },
+      }
+    : { name: 'project', params: { id: props.project.id } }
 })
 </script>
 
diff --git a/vue-app/src/components/ProjectProfile.vue b/vue-app/src/components/ProjectProfile.vue
index 1bdc167ed..eaa233143 100644
--- a/vue-app/src/components/ProjectProfile.vue
+++ b/vue-app/src/components/ProjectProfile.vue
@@ -1,7 +1,7 @@
 <template>
   <div v-if="project" class="project-page">
     <info v-if="previewMode" class="info" :message="$t('projectProfile.info1')" />
-    <img v-if="previewMode" class="project-image" :src="project.bannerImageUrl" :alt="project.name" />
+    <ipfs-image v-if="previewMode" class="project-image" :src="project.bannerImageHash" :alt="project.name" />
     <div class="about">
       <h1 class="project-name" :title="addressName" :project-index="project.index">
         <links v-if="klerosCurateUrl" :to="klerosCurateUrl">{{ project.name }}</links>
diff --git a/vue-app/src/components/RoundInformation.vue b/vue-app/src/components/RoundInformation.vue
index df625126f..b368ffe4b 100644
--- a/vue-app/src/components/RoundInformation.vue
+++ b/vue-app/src/components/RoundInformation.vue
@@ -265,7 +265,7 @@
               >
                 <img width="16" src="@/assets/info.svg" />
               </div>
-              <div v-if="isActiveApp" v-tooltip="$t('roundInfo.tooltip9')" class="add-link" @click="addMatchingFunds">
+              <div v-tooltip="$t('roundInfo.tooltip9')" class="add-link" @click="addMatchingFunds">
                 <img src="@/assets/add.svg" width="16px" />
                 <span class="add-funds-link">{{ $t('roundInfo.span1') }}</span>
               </div>
@@ -288,8 +288,8 @@
 import { ref, onMounted, computed, watch } from 'vue'
 import { DateTime } from 'luxon'
 import { hasDateElapsed } from '@/utils/dates'
-import { type RoundInfo, getRoundInfo, getLeaderboardRoundInfo } from '@/api/round'
-import { chain, isActiveApp } from '@/api/core'
+import { type RoundInfo, getRoundInfo, getStaticRoundInfo } from '@/api/round'
+import { chain } from '@/api/core'
 import { lsGet, lsSet } from '@/utils/localStorage'
 import { formatAmount as _formatAmount } from '@/utils/amounts'
 import MatchingFundsModal from '@/components/MatchingFundsModal.vue'
@@ -370,7 +370,7 @@ async function loadRoundInfo() {
     try {
       if (routeName.startsWith('leaderboard')) {
         const network = getRouteParamValue(route.params.network)
-        roundInfo.value = await getLeaderboardRoundInfo(roundAddress.value, network)
+        roundInfo.value = await getStaticRoundInfo(roundAddress.value, network)
       } else {
         roundInfo.value = await getRoundInfo(roundAddress.value, currentRound.value)
       }
diff --git a/vue-app/src/components/StaticApp.vue b/vue-app/src/components/StaticApp.vue
deleted file mode 100644
index 68accedfb..000000000
--- a/vue-app/src/components/StaticApp.vue
+++ /dev/null
@@ -1,66 +0,0 @@
-<template>
-  <div id="content" class="app-margin">
-    <breadcrumbs v-if="showBreadCrumb" />
-    <router-view :key="route.path" />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useRoute, useRouter } from 'vue-router'
-import { useAppStore, useWalletStore, useUserStore, type WalletUser } from '@/stores'
-import type { BrowserProvider } from 'ethers'
-
-interface Props {
-  showBreadCrumb: boolean
-  isSidebarShown: boolean
-}
-defineProps<Props>()
-
-const route = useRoute()
-const router = useRouter()
-const appStore = useAppStore()
-const { currentRound } = storeToRefs(appStore)
-
-const userStore = useUserStore()
-const wallet = useWalletStore()
-const { user: walletUser } = storeToRefs(wallet)
-
-onMounted(async () => {
-  await appStore.loadStaticClrFundInfo()
-  appStore.isAppReady = true
-})
-
-watch(walletUser, async () => {
-  try {
-    if (walletUser.value) {
-      const user: WalletUser = {
-        chainId: walletUser.value.chainId,
-        walletAddress: walletUser.value.walletAddress,
-        web3Provider: walletUser.value.web3Provider as BrowserProvider,
-      }
-      // make sure factory is loaded
-      await appStore.loadStaticClrFundInfo()
-      userStore.loginUser(user)
-      await userStore.loadUserInfo()
-    } else {
-      await userStore.logoutUser()
-    }
-  } catch (err) {
-    /* eslint-disable-next-line no-console */
-    console.log('error', err)
-  }
-})
-</script>
-
-<style lang="scss">
-@import '../styles/vars';
-@import '../styles/fonts';
-@import '../styles/theme';
-
-.app-margin {
-  margin-right: 1.5rem;
-  @media (max-width: $breakpoint-m) {
-    margin-right: 0;
-  }
-}
-</style>
diff --git a/vue-app/src/graphql/sdk.ts b/vue-app/src/graphql/sdk.ts
index fc22db618..dcd511bdb 100644
--- a/vue-app/src/graphql/sdk.ts
+++ b/vue-app/src/graphql/sdk.ts
@@ -1,7 +1,15 @@
 import { GraphQLClient } from 'graphql-request'
 
 import { SUBGRAPH_ENDPOINT } from '@/api/core'
-import { getSdk } from './API'
+import { getSdk, type SdkFunctionWrapper } from './API'
 
 const client = new GraphQLClient(SUBGRAPH_ENDPOINT)
-export default getSdk(client)
+
+const wrapper: SdkFunctionWrapper = (action, _operationName, _operationType) => {
+  if (!SUBGRAPH_ENDPOINT) {
+    throw new Error('Subgraph not available')
+  }
+  return action()
+}
+
+export default getSdk(client, wrapper)
diff --git a/vue-app/src/router/index.ts b/vue-app/src/router/index.ts
index 86a75d5b9..e6e415a07 100644
--- a/vue-app/src/router/index.ts
+++ b/vue-app/src/router/index.ts
@@ -1,6 +1,6 @@
 import { createRouter, createWebHashHistory } from 'vue-router'
 import type { RouteRecordRaw } from 'vue-router'
-import { isUserRegistrationRequired, isOptimisticRecipientRegistry, isActiveApp } from '@/api/core'
+import { isUserRegistrationRequired, isOptimisticRecipientRegistry } from '@/api/core'
 
 const Landing = () => import('@/views/Landing.vue')
 const JoinLanding = () => import('@/views/JoinLanding.vue')
@@ -262,7 +262,7 @@ if (isUserRegistrationRequired) {
   )
 }
 
-if (isOptimisticRecipientRegistry && isActiveApp) {
+if (isOptimisticRecipientRegistry) {
   routes.push({
     path: '/recipients',
     name: 'recipients',
diff --git a/vue-app/src/stores/app.ts b/vue-app/src/stores/app.ts
index 65b7fc494..ad873972d 100644
--- a/vue-app/src/stores/app.ts
+++ b/vue-app/src/stores/app.ts
@@ -9,8 +9,8 @@ import {
   serializeCart,
 } from '@/api/contributions'
 import { getCommittedCart } from '@/api/cart'
-import { operator, chain, ThemeMode, recipientRegistryType, recipientJoinDeadlineConfig, isActiveApp } from '@/api/core'
-import { type RoundInfo, RoundStatus, getRoundInfo, getLeaderboardRoundInfo } from '@/api/round'
+import { operator, chain, ThemeMode, recipientRegistryType, recipientJoinDeadlineConfig } from '@/api/core'
+import { type RoundInfo, RoundStatus, getRoundInfo, getStaticRoundInfo } from '@/api/round'
 import { getTally, type Tally } from '@/api/tally'
 import { type ClrFund, getClrFundInfo, getMatchingFunds } from '@/api/clrFund'
 import { getMACIFactoryInfo, type MACIFactory } from '@/api/maci-factory'
@@ -70,11 +70,6 @@ export const useAppStore = defineStore('app', {
         return recipientJoinDeadlineConfig
       }
 
-      if (!isActiveApp) {
-        // when running in static mode, do not allow adding recipients
-        return DateTime.now()
-      }
-
       const recipientStore = useRecipientStore()
       if (!state.currentRound || !recipientStore.recipientRegistryInfo) {
         return null
@@ -470,38 +465,6 @@ export const useAppStore = defineStore('app', {
         stateIndex,
       }
     },
-    async loadStaticClrFundInfo() {
-      const rounds = await getRounds()
-      // rounds are sorted in reverse order, first one is the newest round
-      const currentRound = rounds[0]
-
-      let maxRecipients = 0
-      if (currentRound) {
-        const network = currentRound.network || ''
-        const currentRoundInfo = await getLeaderboardRoundInfo(currentRound.address, network)
-        if (currentRoundInfo) {
-          const matchingPool = await getMatchingFunds(currentRoundInfo.nativeTokenAddress)
-          this.clrFund = {
-            nativeTokenAddress: currentRoundInfo.nativeTokenAddress,
-            nativeTokenSymbol: currentRoundInfo.nativeTokenSymbol,
-            nativeTokenDecimals: currentRoundInfo.nativeTokenDecimals,
-            userRegistryAddress: currentRoundInfo.userRegistryAddress,
-            recipientRegistryAddress: currentRoundInfo.recipientRegistryAddress,
-            matchingPool,
-          }
-          this.selectRound(currentRound.address)
-          this.currentRound = currentRoundInfo
-          if (currentRoundInfo.tally) {
-            this.tally = currentRoundInfo.tally
-          }
-          maxRecipients = currentRoundInfo.maxRecipients
-        }
-      }
-      if (!this.clrFund) {
-        this.clrFund = await getClrFundInfo()
-      }
-      await this.loadMACIFactoryInfo(maxRecipients)
-    },
     async loadClrFundInfo() {
       const clrFund = await getClrFundInfo()
       this.clrFund = clrFund
diff --git a/vue-app/src/utils/chains.ts b/vue-app/src/utils/chains.ts
index acab4ecfe..94e752f8a 100644
--- a/vue-app/src/utils/chains.ts
+++ b/vue-app/src/utils/chains.ts
@@ -15,6 +15,7 @@ export enum ChainId {
 export type ChainInfo = {
   [chainId in ChainId]: {
     label: string
+    name: string
     currency: string
     logo: string
     isLayer2: boolean
@@ -29,6 +30,7 @@ export type ChainInfo = {
 export const CHAIN_INFO: ChainInfo = {
   [ChainId.MAINNET]: {
     label: 'Mainnet',
+    name: 'mainnet',
     currency: 'ETH',
     logo: 'eth.svg',
     isLayer2: false,
@@ -38,6 +40,7 @@ export const CHAIN_INFO: ChainInfo = {
   },
   [ChainId.SEPOLIA]: {
     label: 'Sepolia',
+    name: 'sepolia',
     currency: 'ETH',
     logo: 'eth.svg',
     isLayer2: false,
@@ -47,6 +50,7 @@ export const CHAIN_INFO: ChainInfo = {
   },
   [ChainId.HARDHAT]: {
     label: 'Arbitrum Hardhat',
+    name: 'hardhat',
     currency: 'AETH',
     logo: 'arbitrum.svg',
     isLayer2: true,
@@ -58,6 +62,7 @@ export const CHAIN_INFO: ChainInfo = {
   },
   [ChainId.ARBITRUM_ONE]: {
     label: 'Arbitrum',
+    name: 'arbitrum',
     currency: 'AETH',
     logo: 'arbitrum.svg',
     isLayer2: true,
@@ -69,6 +74,7 @@ export const CHAIN_INFO: ChainInfo = {
   },
   [ChainId.ARBITRUM_RINKEBY]: {
     label: 'Arbitrum Rinkeby',
+    name: 'arbitrum-rinkeby',
     currency: 'AETH',
     logo: 'arbitrum.svg',
     isLayer2: true,
@@ -80,6 +86,7 @@ export const CHAIN_INFO: ChainInfo = {
   },
   [ChainId.ARBITRUM_GOERLI]: {
     label: 'Arbitrum Goerli',
+    name: 'arbitrum-goerli',
     currency: 'AETH',
     logo: 'arbitrum.svg',
     isLayer2: true,
@@ -91,6 +98,7 @@ export const CHAIN_INFO: ChainInfo = {
   },
   [ChainId.ARBITRUM_SEPOLIA]: {
     label: 'Arbitrum Sepolia',
+    name: 'arbitrum-sepolia',
     currency: 'AETH',
     logo: 'arbitrum.svg',
     isLayer2: true,
@@ -102,6 +110,7 @@ export const CHAIN_INFO: ChainInfo = {
   },
   [ChainId.OPTIMISM]: {
     label: 'Optimism',
+    name: 'optimism',
     currency: 'OETH',
     logo: 'optimism.svg',
     isLayer2: true,
@@ -113,6 +122,7 @@ export const CHAIN_INFO: ChainInfo = {
   },
   [ChainId.OPTIMISM_SEPOLIA]: {
     label: 'Optimism Sepolia',
+    name: 'optimism-sepolia',
     currency: 'OETH',
     logo: 'optimism.svg',
     isLayer2: true,
@@ -124,6 +134,7 @@ export const CHAIN_INFO: ChainInfo = {
   },
   [ChainId.XDAI]: {
     label: 'xDai',
+    name: 'xdai',
     currency: 'xDai',
     logo: 'xdai.svg',
     isLayer2: false,
@@ -135,6 +146,7 @@ export const CHAIN_INFO: ChainInfo = {
   },
   [ChainId.POLYGON]: {
     label: 'Polygon',
+    name: 'polygon',
     currency: 'MATIC',
     logo: 'polygon.svg',
     isLayer2: false,
diff --git a/vue-app/src/utils/url.ts b/vue-app/src/utils/url.ts
index 8596ed105..0f797e971 100644
--- a/vue-app/src/utils/url.ts
+++ b/vue-app/src/utils/url.ts
@@ -1,3 +1,16 @@
+import { ipfsGatewayUrl } from '@/api/core'
+
 export function getAssetsUrl(path) {
   return new URL(`/src/assets/${path}`, import.meta.url).href
 }
+
+export function getStaticUrlByIpfsHash(hash): string | null {
+  return hash ? `/ipfs/${hash}` : null
+}
+
+export function getIpfsUrl(hash): string | null {
+  if (!hash || !ipfsGatewayUrl) {
+    return null
+  }
+  return `${ipfsGatewayUrl}/ipfs/${hash}`
+}
diff --git a/vue-app/src/views/Leaderboard.vue b/vue-app/src/views/Leaderboard.vue
index b5c08a706..c7d338ffb 100644
--- a/vue-app/src/views/Leaderboard.vue
+++ b/vue-app/src/views/Leaderboard.vue
@@ -46,10 +46,9 @@
 import { useAppStore } from '@/stores'
 import { useRouter, useRoute } from 'vue-router'
 import type { RoundInfo } from '@/api/round'
-import { toRoundInfo } from '@/api/round'
+import { toRoundInfo, findStaticRound } from '@/api/round'
 import type { LeaderboardProject } from '@/api/projects'
 import { toLeaderboardProject } from '@/api/projects'
-import { getLeaderboardData } from '@/api/leaderboard'
 import { getRouteParamValue } from '@/utils/route'
 
 const router = useRouter()
@@ -63,7 +62,7 @@ const appStore = useAppStore()
 const { showSimpleLeaderboard } = storeToRefs(appStore)
 
 async function loadLeaderboard(address: string, network: string) {
-  const data = await getLeaderboardData(address, network)
+  const data = await findStaticRound(address, network)
   return data
 }
 
@@ -77,9 +76,9 @@ onMounted(async () => {
   const network = getRouteParamValue(route.params.network)
   const data = await loadLeaderboard(address, network)
 
-  // redirect to projects view if not finalized or no static round data for leaderboard
-  if (!data?.projects) {
-    router.push({ name: 'round' })
+  // redirect to projects view if no tally data or no static round data for leaderboard
+  if (!data?.projects || !data?.tally) {
+    router.push({ name: 'round', params: { address } })
     return
   }
 
@@ -88,7 +87,7 @@ onMounted(async () => {
       .filter(project => project.state != 'Removed')
       .map(project => toLeaderboardProject(project))
       .sort((p1: LeaderboardProject, p2: LeaderboardProject) => {
-        const diff = p2.allocatedAmount - p1.allocatedAmount
+        const diff = BigInt(p2.allocatedAmount || 0) - BigInt(p1.allocatedAmount || 0)
         if (diff === BigInt(0)) return 0
         if (diff > BigInt(0)) return 1
         return -1
@@ -98,7 +97,7 @@ onMounted(async () => {
   }
 
   try {
-    round.value = toRoundInfo(data.round, network)
+    round.value = toRoundInfo(data.round)
   } catch (e) {
     console.log('Error converting to round info', e)
   }
diff --git a/vue-app/src/views/LeaderboardProject.vue b/vue-app/src/views/LeaderboardProject.vue
index 3c4c52ad5..c3dfa65ce 100644
--- a/vue-app/src/views/LeaderboardProject.vue
+++ b/vue-app/src/views/LeaderboardProject.vue
@@ -2,7 +2,7 @@
   <div>
     <loader v-if="isLoading"></loader>
     <div :class="`grid ${showCartPanel ? 'cart-open' : 'cart-closed'}`" v-if="project">
-      <img class="project-image banner" :src="project.bannerImageUrl" :alt="project.name" />
+      <ipfs-image class="project-image banner" :src="project.bannerImageHash" :alt="project.name" />
       <project-profile class="details" :project="project" :previewMode="false" />
       <div class="sticky-column">
         <div class="desktop">
diff --git a/vue-app/src/views/Profile.vue b/vue-app/src/views/Profile.vue
index b4c6612e9..da632f2d6 100644
--- a/vue-app/src/views/Profile.vue
+++ b/vue-app/src/views/Profile.vue
@@ -69,8 +69,8 @@
       <div class="projects-section">
         <h2>{{ $t('profile.h2_3') }}</h2>
         <div v-if="projects.length > 0" class="project-list">
-          <div class="project-item" v-for="{ id, name, thumbnailImageUrl, isHidden, isLocked } of projects" :key="id">
-            <img :src="thumbnailImageUrl" alt="thumbnail" class="project-thumbnail" />
+          <div class="project-item" v-for="{ id, name, thumbnailImageHash, isHidden, isLocked } of projects" :key="id">
+            <ipfs-image :src="thumbnailImageHash" alt="thumbnail" class="project-thumbnail" />
             <div class="project-details">
               <div class="project-name">
                 {{ name }}
@@ -103,19 +103,18 @@ import CopyButton from '@/components/CopyButton.vue'
 import Loader from '@/components/Loader.vue'
 import FundsNeededWarning from '@/components/FundsNeededWarning.vue'
 
-import { userRegistryType, UserRegistryType, chain, isActiveApp } from '@/api/core'
-import { type Project, getProjects, getProjectsForStaticRound } from '@/api/projects'
+import { userRegistryType, UserRegistryType, chain } from '@/api/core'
+import { type Project, getProjects } from '@/api/projects'
 import { isSameAddress } from '@/utils/accounts'
 import { getTokenLogo } from '@/utils/tokens'
 import { useAppStore, useUserStore, useRecipientStore, useWalletStore } from '@/stores'
 import { storeToRefs } from 'pinia'
 import { useRouter } from 'vue-router'
-import { getLeaderboardData } from '@/api/leaderboard'
 import { formatAmount } from '@/utils/amounts'
 
 import WithdrawalModal from '@/components/WithdrawalModal.vue'
 import { useModal } from 'vue-final-modal'
-import { RoundStatus } from '@/api/round'
+import { RoundStatus, getRoundInfo } from '@/api/round'
 
 interface Props {
   balance: string
@@ -179,20 +178,17 @@ watch(recipientRegistryAddress, () => loadProjects())
 
 async function loadProjects(): Promise<void> {
   isLoading.value = true
-  let _projects: Project[] = []
-
-  if (isActiveApp) {
-    if (!recipientRegistryAddress.value) return
-    _projects = await getProjects(
-      recipientRegistryAddress.value,
-      currentRound.value?.startTime.toSeconds(),
-      currentRound.value?.votingDeadline.toSeconds(),
-    )
-  } else {
-    const currentRoundAddress = currentRound.value?.fundingRoundAddress || ''
-    const network = currentRound.value?.network || ''
-    _projects = await getProjectsForStaticRound(currentRoundAddress, network)
-  }
+  let _projects: Project[] | undefined = undefined
+
+  if (!recipientRegistryAddress.value) return
+
+  _projects = await getProjects({
+    registryAddress: recipientRegistryAddress.value,
+    fundingRoundAddress: currentRound.value?.fundingRoundAddress,
+    network: currentRound.value?.network,
+    startTime: currentRound.value?.startTime.toSeconds(),
+    endTime: currentRound.value?.votingDeadline.toSeconds(),
+  })
 
   const userProjects: Project[] = _projects.filter(
     ({ address, requester }) =>
diff --git a/vue-app/src/views/Project.vue b/vue-app/src/views/Project.vue
index 08ce13444..4eda5cf04 100644
--- a/vue-app/src/views/Project.vue
+++ b/vue-app/src/views/Project.vue
@@ -2,7 +2,7 @@
   <div>
     <loader v-if="isLoading"></loader>
     <div :class="`grid ${showCartPanel ? 'cart-open' : 'cart-closed'}`" v-if="project">
-      <img class="project-image banner" :src="project.bannerImageUrl" :alt="project.name" />
+      <ipfs-image class="project-image banner" :src="project.bannerImageHash" :alt="project.name" />
       <project-profile class="details" :project="project" :previewMode="false" />
       <div class="sticky-column">
         <div class="desktop">
@@ -60,8 +60,14 @@ onMounted(async () => {
 
   roundAddress.value = (route.params.address as string) || currentRoundAddress || ''
 
+  const recipientId = route.params.id as string
   const registryAddress = await getRecipientRegistryAddress(roundAddress.value || null)
-  const _project = await getProject(registryAddress, route.params.id as string)
+  const _project = await getProject({
+    registryAddress,
+    fundingRoundAddress: roundAddress.value || undefined,
+    recipientId,
+    filter: false,
+  })
   if (_project === null || _project.isHidden) {
     // Project not found
     router.push({ name: 'projects' })
diff --git a/vue-app/src/views/ProjectList.vue b/vue-app/src/views/ProjectList.vue
index 8bc21b7c5..9b2ef9c96 100644
--- a/vue-app/src/views/ProjectList.vue
+++ b/vue-app/src/views/ProjectList.vue
@@ -60,7 +60,7 @@
 import { ref, computed, onMounted } from 'vue'
 
 import { getCurrentRound, getRoundInfo } from '@/api/round'
-import { type Project, getProjects, getRecipientRegistryAddress, getProjectsForStaticRound } from '@/api/projects'
+import { type Project, getProjects, getRecipientRegistryAddress } from '@/api/projects'
 
 import CallToActionCard from '@/components/CallToActionCard.vue'
 import ProjectListItem from '@/components/ProjectListItem.vue'
@@ -70,7 +70,6 @@ import { useRoute } from 'vue-router'
 import { useAppStore, useUserStore } from '@/stores'
 import { storeToRefs } from 'pinia'
 import { DateTime } from 'luxon'
-import { isActiveApp } from '@/api/core'
 import { getSecondsFromNow } from '@/utils/dates'
 
 type ProjectRoundInfo = {
@@ -124,10 +123,7 @@ onMounted(async () => {
     roundAddress.value =
       (route.params.address as string) || currentRoundAddress.value || (await getCurrentRound()) || ''
 
-    const round = isActiveApp
-      ? await loadProjectRoundInfo(roundAddress.value)
-      : await loadStaticRoundInfo(roundAddress.value)
-    await loadProjects(round)
+    await loadProjectRoundInfo(roundAddress.value)
   } catch (err) {
     /* eslint-disable-next-line no-console */
     console.error('Error loading projects', err)
@@ -135,11 +131,13 @@ onMounted(async () => {
   isLoading.value = false
 })
 
-async function loadProjectRoundInfo(roundAddress: string): Promise<ProjectRoundInfo> {
+async function loadProjectRoundInfo(roundAddress: string) {
   // defaults when a round has not been created yet
   let recipientRegistryAddress = ''
   let startTime = 0
   let votingDeadline = DateTime.local().toSeconds()
+  let network = ''
+  let fundingRoundAddress = ''
 
   if (roundAddress) {
     const round = await getRoundInfo(roundAddress, currentRound.value)
@@ -147,6 +145,8 @@ async function loadProjectRoundInfo(roundAddress: string): Promise<ProjectRoundI
       recipientRegistryAddress = round.recipientRegistryAddress
       startTime = round.startTime.toSeconds()
       votingDeadline = round.votingDeadline.toSeconds()
+      network = round.network || ''
+      fundingRoundAddress = round.fundingRoundAddress
     }
   }
 
@@ -155,27 +155,13 @@ async function loadProjectRoundInfo(roundAddress: string): Promise<ProjectRoundI
     recipientRegistryAddress = await getRecipientRegistryAddress(null)
   }
 
-  return { recipientRegistryAddress, startTime, votingDeadline, fundingRoundAddress: roundAddress, network: '' }
-}
-
-/**
- * Get the round information from static file rounds.json
- * @param roundAddress The funding round address
- * @returns The project round information
- */
-async function loadStaticRoundInfo(roundAddress: string): Promise<ProjectRoundInfo> {
-  await appStore.loadClrFundInfo()
-  const network = currentRound.value?.network || ''
-  const recipientRegistryAddress = currentRound.value?.recipientRegistryAddress || ''
-  const startTime = getSecondsFromNow(currentRound.value?.startTime || DateTime.now())
-  const votingDeadline = getSecondsFromNow(currentRound.value?.votingDeadline || DateTime.now())
-  return { recipientRegistryAddress, startTime, votingDeadline, fundingRoundAddress: roundAddress, network }
-}
-
-async function loadProjects(round: ProjectRoundInfo) {
-  const _projects = isActiveApp
-    ? await getProjects(round.recipientRegistryAddress, round.startTime, round.votingDeadline)
-    : await getProjectsForStaticRound(roundAddress.value, round.network)
+  const _projects = await getProjects({
+    registryAddress: recipientRegistryAddress,
+    fundingRoundAddress,
+    network,
+    startTime,
+    endTime: votingDeadline,
+  })
   const visibleProjects = _projects.filter(project => {
     return !project.isHidden && !project.isLocked
   })
diff --git a/vue-app/src/views/RecipientProfile.vue b/vue-app/src/views/RecipientProfile.vue
index cb2c548eb..9e3bfecf9 100644
--- a/vue-app/src/views/RecipientProfile.vue
+++ b/vue-app/src/views/RecipientProfile.vue
@@ -4,7 +4,7 @@
     {{ $t('recipientProfile.not_found') }}
   </div>
   <div v-else class="project-page">
-    <img class="project-image" :src="recipient.bannerImageUrl" :alt="recipient.name" />
+    <ipfs-image class="project-image" :src="recipient.bannerImageHash" :alt="recipient.name" />
     <div class="about">
       <h1 class="project-name" :title="addressName" :project-index="recipient.index">
         <span> {{ recipient.name }} </span>
@@ -22,15 +22,15 @@
       </div>
       <div class="project-section">
         <h2>{{ $t('projectProfile.h2_1') }}</h2>
-        <markdown :raw="recipient.description" />
+        <markdown v-if="recipient.description" :raw="recipient.description" />
       </div>
       <div v-if="recipient.problemSpace" class="project-section">
         <h2>{{ $t('projectProfile.h2_2') }}</h2>
-        <markdown :raw="recipient.problemSpace" />
+        <markdown v-if="recipient.problemSpace" :raw="recipient.problemSpace" />
       </div>
       <div v-if="recipient.plans" class="project-section">
         <h2>{{ $t('projectProfile.h2_3') }}</h2>
-        <markdown :raw="recipient.plans" />
+        <markdown v-if="recipient.plans" :raw="recipient.plans" />
       </div>
       <div
         :class="{
@@ -91,8 +91,12 @@ onMounted(async () => {
   const recipientRegistryAddress = await getRecipientRegistryAddress(currentRoundAddress)
 
   // retrieve the project information without filtering by the locked or verified status
-  const filter = false
-  recipient.value = await getProject(recipientRegistryAddress, recipientId, filter)
+  recipient.value = await getProject({
+    registryAddress: recipientRegistryAddress,
+    fundingRoundAddress: currentRoundAddress || undefined,
+    recipientId,
+    filter: false,
+  })
   if (recipient.value?.address) {
     ens.value = await ensLookup(recipient.value.address)
   }
diff --git a/vue-app/src/views/RecipientRegistry.vue b/vue-app/src/views/RecipientRegistry.vue
index 15c1ed302..81ee0aec7 100644
--- a/vue-app/src/views/RecipientRegistry.vue
+++ b/vue-app/src/views/RecipientRegistry.vue
@@ -24,9 +24,11 @@
           <tr v-for="request in requests.slice().reverse()" :key="request.recipientId">
             <td>
               <div class="project-name">
-                <links v-if="request.metadata.thumbnailImageUrl" :to="request.metadata.thumbnailImageUrl">
-                  <img class="project-image" :src="request.metadata.thumbnailImageUrl" />
-                </links>
+                <ipfs-image
+                  class="project-image"
+                  :src="request.metadata.thumbnailImageHash"
+                  :alt="request.metadata.name"
+                />
                 {{ request.metadata.name }}
                 <links
                   v-if="hasProjectLink(request)"
@@ -183,10 +185,6 @@ function isAccepted(request: Request): boolean {
   return request.status === RequestStatus.Accepted
 }
 
-function isRejected(request: Request): boolean {
-  return request.status === RequestStatus.Rejected
-}
-
 function isExecuted(request: Request): boolean {
   return request.status === RequestStatus.Executed
 }