Merge pull request #664 from clrfund/fix/missing-round-error

Fix missing round error

vue-app/src/App.vue

@@ -85,7 +85,7 @@ const routeName = computed(() => route.name?.toString() || '')
 const isUserAndRoundLoaded = computed(() => !!currentUser.value && !!currentRound.value)
 const isInApp = computed(() => routeName.value !== 'landing')
 const isVerifyStep = computed(() => routeName.value === 'verify-step')
-const isSideCartShown = computed(() => !!currentUser.value && isSidebarShown.value && routeName.value !== 'cart')
+const isSideCartShown = computed(() => isUserAndRoundLoaded.value && isSidebarShown.value && routeName.value !== 'cart')
 const isCartPadding = computed(() => {
   const routes = ['cart']
   return routes.includes(routeName.value)
@@ -169,6 +169,7 @@ onMounted(async () => {
   await appStore.loadMACIFactoryInfo()
   await appStore.loadRoundInfo()
   await recipientStore.loadRecipientRegistryInfo()
+  appStore.isAppReady = true
 
   setupLoadIntervals()
 })

vue-app/src/components/CallToActionCard.vue

@@ -48,7 +48,7 @@ import { useAppStore, useUserStore } from '@/stores'
 import { storeToRefs } from 'pinia'
 
 const appStore = useAppStore()
-const { canUserReallocate, hasContributionPhaseEnded } = storeToRefs(appStore)
+const { canUserReallocate, hasContributionPhaseEnded, currentRound } = storeToRefs(appStore)
 const userStore = useUserStore()
 const { currentUser } = storeToRefs(userStore)
 
@@ -58,6 +58,7 @@ const hasStartedVerification = computed(
 const showUserVerification = computed(() => {
   return (
     userRegistryType === UserRegistryType.BRIGHT_ID &&
+    currentRound.value &&
     currentUser.value?.isRegistered !== undefined &&
     !currentUser.value.isRegistered
   )

vue-app/src/components/Cart.vue

@@ -1,6 +1,11 @@
 <template>
   <div class="h100">
-    <div v-if="!currentUser" class="empty-cart">
+    <loader v-if="!isAppReady"></loader>
+    <div v-else-if="!currentRound" class="empty-cart">
+      <div class="moon-emoji">🌚</div>
+      <h3>{{ $t('roundInfo.div21') }}</h3>
+    </div>
+    <div v-else-if="!currentUser" class="empty-cart">
       <div class="moon-emoji">🌚</div>
       <h3>{{ $t('cart.h3_1') }}</h3>
       <button @click="promptConnection" class="btn-action">{{ $t('cart.connect') }}</button>
@@ -217,7 +222,7 @@
   </div>
 </template>
 <script setup lang="ts">
-import { computed, ref, onMounted } from 'vue'
+import { computed, ref } from 'vue'
 import { BigNumber } from 'ethers'
 import { parseFixed } from '@ethersproject/bignumber'
 import { DateTime } from 'luxon'
@@ -262,6 +267,7 @@ const {
   hasUserVoted,
   hasContributionPhaseEnded,
   contributor,
+  isAppReady,
 } = storeToRefs(appStore)
 const userStore = useUserStore()
 const { currentUser } = storeToRefs(userStore)
@@ -293,12 +299,6 @@ function removeAll(): void {
   appStore.toggleEditSelection(true)
 }
 
-onMounted(() => {
-  if (currentUser.value && !currentUser.value.encryptionKey) {
-    promptSignagure()
-  }
-})
-
 function showError(errorMessage: string) {
   const { open, close } = useModal({
     component: ErrorModal,
@@ -348,7 +348,7 @@ function promptSignagure(): void {
 }
 
 async function loadCart() {
-  if (appStore.cartLoaded) {
+  if (appStore.cartLoaded || !appStore.currentRound) {
     return
   }
 

vue-app/src/components/CartWidget.vue

@@ -27,6 +27,9 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 import Cart from '@/components/Cart.vue'
+import { useModal } from 'vue-final-modal'
+import SignatureModal from '@/components/SignatureModal.vue'
+
 import { useAppStore, useUserStore } from '@/stores'
 import { storeToRefs } from 'pinia'
 
@@ -43,8 +46,24 @@ const isCartBadgeShown = computed(() => {
   return (canUserReallocate.value || isRoundContributionPhase.value) && !!cart.value.length
 })
 
+async function promptSignagure() {
+  const { open, close } = useModal({
+    component: SignatureModal,
+    attrs: {
+      onClose() {
+        close().then(() => {
+          appStore.toggleShowCartPanel()
+        })
+      },
+    },
+  })
+  open()
+}
+
 function toggleCart(): void {
-  appStore.toggleShowCartPanel()
+  if (currentUser.value && !currentUser.value.encryptionKey) {
+    promptSignagure()
+  }
 }
 </script>
 

vue-app/src/stores/app.ts

@@ -27,6 +27,7 @@ import { assert, ASSERT_MISSING_ROUND, ASSERT_MISSING_SIGNATURE, ASSERT_NOT_CONN
 import { Keypair } from '@clrfund/maci-utils'
 
 export type AppState = {
+  isAppReady: boolean
   cart: CartItem[]
   cartEditModeSelected: boolean
   committedCart: CartItem[]
@@ -46,6 +47,7 @@ export type AppState = {
 
 export const useAppStore = defineStore('app', {
   state: (): AppState => ({
+    isAppReady: false,
     cart: new Array<CartItem>(),
     cartEditModeSelected: false,
     committedCart: new Array<CartItem>(),

vue-app/src/views/Profile.vue

@@ -131,7 +131,7 @@ onMounted(async () => {
 
 const walletProvider = computed(() => currentUser.value?.walletProvider)
 const showBrightIdWidget = computed(
-  () => userRegistryType === UserRegistryType.BRIGHT_ID && !hasContributionPhaseEnded.value,
+  () => userRegistryType === UserRegistryType.BRIGHT_ID && currentRound.value && !hasContributionPhaseEnded.value,
 )
 const tokenLogo = computed(() => getTokenLogo(nativeTokenSymbol.value))
 const displayAddress = computed(() => {

vue-app/src/views/VerifyLanding.vue

@@ -94,7 +94,7 @@ onMounted(async () => {
 })
 
 const isRoundFull = computed(() => isRoundContributorLimitReached.value)
-const isRoundOver = computed(() => hasContributionPhaseEnded.value)
+const isRoundOver = computed(() => !currentRound.value || hasContributionPhaseEnded.value)
 const showBrightIdButton = computed(() => currentUser.value?.isRegistered === false)
 
 async function promptSignagure() {