Merge pull request #10890 from kodadot/refactor--drop-store-value

refactor: drop store value

components/collection/drop/MintButton.vue

@@ -90,9 +90,6 @@ const label = computed(() => {
   if (isCheckingMintRequirements.value) {
     return $i18n.t('checking')
   }
-  if (drop.value.userAccess === false) {
-    return $i18n.t('mint.unlockable.notEligibility')
-  }
 
   if (isMintNotLive.value) {
     return $i18n.t('mint.unlockable.mintingNotLive')
@@ -131,7 +128,6 @@ const enabled = computed(() => {
     || !previewItem.value // no image
     || isCheckingMintRequirements.value // still checking requirements
     || loading.value // still loading
-    || drop.value.userAccess === false // no access due to geofencing
   ) {
     return false
   }

components/drops/useDrops.ts

@@ -171,7 +171,7 @@ export const getDropDetails = async (alias: string) => {
 export function useDrop(alias?: string) {
   const { params } = useRoute()
   const dropStore = useDropStore()
-  const { isEvm, isSub } = useIsChain(usePrefix().urlPrefix)
+  const { isEvm } = useIsChain(usePrefix().urlPrefix)
 
   const drop = computed({
     get: () => dropStore.drop,
@@ -182,31 +182,42 @@ export function useDrop(alias?: string) {
   const token = computed(() => prefixToToken[drop.value?.chain ?? 'ahp'])
 
   const fetchDrop = async () => {
-    drop.value = await getDropById(alias ?? params.id.toString())
+    // get some offchain data
+    const campaign = await getDropById(alias ?? params.id.toString())
+    const offChainData = {
+      id: campaign.id,
+      chain: campaign.chain,
+      alias: campaign.alias,
+      collection: campaign.collection,
+      type: campaign.type,
+      disabled: campaign.disabled,
+      start_at: campaign.start_at,
+      holder_of: campaign.holder_of,
+
+      // would be nice if we could get this from the onchain
+      price: campaign.price,
+      creator: campaign.creator,
+    }
 
-    if (!drop.value.collection) {
+    const address = campaign.collection
+    if (!address) {
       return
     }
 
-    if (isSub.value) {
-      const { maxSupply: supply, minted, metadata } = await subCollection(drop.value.collection)
-
-      drop.value.max = supply
-      drop.value.minted = minted
-      drop.value.collectionName = metadata.name
-      drop.value.collectionDescription = metadata.description
+    // get some onchain data
+    const { maxSupply: supply, minted, metadata } = isEvm.value ? await evmCollection(address as `0x${string}`, usePrefix().urlPrefix.value) : await subCollection(address)
+    const onChainData = {
+      max: supply,
+      minted: minted || await fetchDropMintedCount(drop.value),
+      name: metadata.name,
+      collectionName: metadata.name,
+      collectionDescription: metadata.description,
+      image: metadata.image,
+      banner: metadata.banner || metadata.image,
+      content: metadata.generative_uri || campaign.content,
     }
 
-    if (isEvm.value) {
-      const { urlPrefix } = usePrefix()
-      const address = drop.value.collection as `0x${string}`
-      const { maxSupply: supply, metadata, minted } = await evmCollection(address, urlPrefix.value)
-
-      drop.value.max = supply
-      drop.value.minted = minted
-      drop.value.collectionName = metadata.name
-      drop.value.collectionDescription = metadata.description
-    }
+    drop.value = { ...offChainData, ...onChainData }
   }
 
   watch(() => params.id, fetchDrop)
@@ -249,10 +260,9 @@ export const useDropMinimumFunds = (amount = ref(1)) => {
   const { fetchMultipleBalance, transferableCurrentChainBalance }
     = useMultipleBalance()
 
-  const meta = computed<number>(() => Number(drop.value?.meta) || 0)
   const price = computed<number>(() => Number(drop.value?.price) || 0)
   const minimumFunds = computed<number>(() =>
-    price.value ? amount.value * price.value : meta.value,
+    price.value ? amount.value * price.value : 0,
   )
   const hasMinimumFunds = computed(
     () =>

params/types.ts

@@ -1,64 +1,11 @@
-// Copyright 2017-2019 @polkadot/react-components authors & contributors
-// This software may be modified and distributed under the terms
-// of the Apache-2.0 license. See the LICENSE file for details.
-
-import type { TypeDef } from '@polkadot/types/types'
-// import { BareProps } from '@polkadot/react-components/types';
 import type { Prefix } from '@kodadot1/static'
 
-// FIXME Ideally, we want these as Base from api-codec - as a stop-gap, any this until we have
-// params returning types extending Base (i.e. anything from api-codec)
-export type RawParamValue = any | undefined
-
-export type RawParamValueArray = (RawParamValue | RawParamValue[])[]
-
-export type RawParamValues = RawParamValue | RawParamValueArray
-
-export interface RawParam {
-  isValid: boolean
-  value: RawParamValues
-}
-
-export interface RawParamOnChangeValue {
-  isValid: boolean
-  value: RawParamValues
-}
-export type RawParamOnChange = (value: RawParamOnChangeValue) => void
-export type RawParamOnEnter = () => void
-
-export type RawParams = RawParam[]
-
-// export interface BaseProps extends BareProps {
-//   defaultValue: RawParam;
-//   name?: string;
-//   onChange?: RawParamOnChange;
-//   onEnter?: RawParamOnEnter;
-//   type: TypeDef;
-// }
-
-// export interface Props extends BaseProps {
-//   isDisabled?: boolean;
-//   isError?: boolean;
-//   isReadOnly?: boolean;
-//   label?: React.ReactNode;
-//   withLabel?: boolean;
-// }
-
-export type Size = 'full' | 'large' | 'medium' | 'small'
-
-export type ComponentMap = Record<string, Vue.Component>
-
 export interface Unit {
   name: string
   value: number
 }
 
-export interface ParamDef {
-  name?: string
-  type: TypeDef
-}
-
-export type DropType = 'paid' | 'free' | 'holder'
+type DropType = 'paid' | 'free' | 'holder'
 
 export type DropItem = {
   id: string
@@ -72,15 +19,11 @@ export type DropItem = {
   content: string
   alias: string
   type: DropType
-  meta: string
   disabled: number
   minted: number
   max?: number
   price?: string
   holder_of?: string
-  location?: string
-  userLocation?: string
-  userAccess?: boolean
   start_at?: string
   creator?: string
 }

stores/drop.ts

@@ -16,7 +16,6 @@ const DEFAULT_DROP: Omit<DropItem, 'chain'> = {
   content: '',
   alias: '',
   type: 'paid',
-  meta: '',
   disabled: 0,
 }
 interface State {

tests/e2e/drops.spec.ts

@@ -100,7 +100,7 @@ test('Drop page verification', async ({ page, Commands }) => {
 
 test('View Collection', async ({ page }) => {
   await page.goto(addresses[0])
-  await page.waitForTimeout(2000)
+  await page.waitForLoadState('networkidle')
   await expect(page.getByTestId('drops-view-collection-button')).toBeVisible()
   await page.getByTestId('drops-view-collection-button').click()
   await page.waitForTimeout(2000)

utils/onchain/evm.ts

@@ -1,5 +1,6 @@
 import { readContract } from '@wagmi/core'
 import type { Prefix } from '@kodadot1/static'
+import type { OnChainData } from './types'
 import { GENSOL_ABI } from '@/composables/transaction/evm/utils'
 import { getEvmCollection } from '@/services/ogi'
 
@@ -27,7 +28,7 @@ export const evmCollection = async (address: `0x${string}`, chain: Prefix) => {
     getEvmCollection(chain, address),
   ]) as [bigint, string, { claimed?: string }]
 
-  let metadata = { description: '', name: '', image: '' }
+  let metadata: OnChainData = { description: '', name: '', image: '', generative_uri: '', banner: '' }
   if (collectionMetadata) {
     metadata = await $fetch(sanitizeIpfsUrl(collectionMetadata))
   }

utils/onchain/sub.ts

@@ -1,3 +1,5 @@
+import type { OnChainData } from './types'
+
 export const subCollection = async (id: string) => {
   const api = await useApi().apiInstance.value
   const [queryCollectionConfig, queryCollection, queryCollectionMetadata] = await Promise.all([
@@ -9,7 +11,7 @@ export const subCollection = async (id: string) => {
   const collection = queryCollection.toJSON() as unknown as { items?: number }
 
   const collectionMetadata = queryCollectionMetadata.toHuman() as unknown as { data?: string }
-  let metadata = { description: '', name: '', image: '' }
+  let metadata: OnChainData = { description: '', name: '', image: '', generative_uri: '', banner: '' }
   if (collectionMetadata.data) {
     metadata = await $fetch(sanitizeIpfsUrl(collectionMetadata.data))
   }

utils/onchain/types.ts

@@ -0,0 +1,7 @@
+export type OnChainData = {
+  name: string
+  description: string
+  image: string
+  banner: string
+  generative_uri: string
+}