Merge pull request #23 from Apillon/dev

Import NFT (switch chain fix)

frontend/composables/useContract.ts

@@ -8,19 +8,26 @@ import {
 import { getContract } from 'viem';
 import { moonbaseAlpha, moonbeam } from 'use-wagmi/chains';
 import { abi } from '~/lib/config/abi';
-import { Chains, Environments } from '~/lib/values/general.values';
+import { Chains } from '~/lib/values/general.values';
 
 export default function useContract() {
   const message = useMessage();
   const config = useRuntimeConfig();
   const { chain } = useNetwork();
   const { address } = useAccount();
-  const { switchNetwork } = useSwitchNetwork();
   const publicClient = usePublicClient();
   const { data: walletClient, refetch } = useWalletClient();
+  const { switchNetwork } = useSwitchNetwork({
+    onSuccess() {
+      if (importNft.value) {
+        _watchAsset(importNft.value);
+      }
+    },
+  });
 
   const usedChain = config.public.CHAIN_ID === Chains.MOONBASE ? moonbaseAlpha : moonbeam;
   const contract = ref();
+  const importNft = ref<string | null>(null);
 
   async function getTokenOfOwner(index: number) {
     return (await contract.value.read.tokenOfOwnerByIndex([address.value, index])) as number;
@@ -35,6 +42,15 @@ export default function useContract() {
       await refetch();
       await sleep(200);
     }
+    if (!chain || !chain.value || chain?.value.id !== usedChain.id) {
+      importNft.value = `${nftId}`;
+      await switchNetwork(usedChain.id);
+    } else {
+      _watchAsset(nftId);
+    }
+  }
+
+  async function _watchAsset(nftId: string | number) {
     try {
       const contractAddress = contract.value?.address
         ? contract.value.address
@@ -47,10 +63,11 @@ export default function useContract() {
           tokenId: `${nftId}`,
         },
       });
-      return true;
+      importNft.value = null;
+
+      message.success("You've successfully imported your MENT token to your wallet.");
     } catch (e) {
       contractError(e);
-      return false;
     }
   }
 
@@ -63,7 +80,7 @@ export default function useContract() {
       await sleep(200);
     }
     if (!chain || !chain.value || chain?.value.id !== usedChain.id) {
-      switchNetwork(usedChain.id);
+      await switchNetwork(usedChain.id);
     }
 
     if (!contractAddress) {

frontend/nuxt.config.ts

@@ -16,9 +16,9 @@ if (env === Environments.prod) {
 }
 
 const meta = {
-  title: 'Apillon email prebuild solution',
-  description: 'airdrop email',
-  url: 'https://apillon.io/',
+  title: 'powered by Apillon',
+  description: 'Ment NFT airdrop - powered by Apillon',
+  url: 'https://nft.ment.si/',
 };
 
 // https://nuxt.com/docs/api/configuration/nuxt-config

frontend/pages/admin.vue

@@ -8,7 +8,7 @@ definePageMeta({
   layout: 'admin',
 });
 useHead({
-  title: 'MENT token airdrop',
+  title: 'Ment NFT airdrop',
 });
 
 const message = useMessage();

frontend/pages/claim.vue

@@ -9,7 +9,7 @@ definePageMeta({
   layout: 'claim',
 });
 useHead({
-  title: 'MENT token airdrop',
+  title: 'Ment NFT airdrop',
 });
 
 const config = useRuntimeConfig();

frontend/pages/index.vue

@@ -4,7 +4,7 @@ import SuperRareJpg from '~/assets/images/superrare.jpg';
 const { isMd } = useScreen();
 
 useHead({
-  title: 'MENT token airdrop',
+  title: 'Ment NFT airdrop',
 });
 </script>
 

frontend/pages/share.vue

@@ -3,7 +3,7 @@ import { prepareOG } from '~/lib/utils/helpers';
 import { Chains } from '~/lib/values/general.values';
 
 useHead({
-  title: 'MENT token airdrop',
+  title: 'Ment NFT airdrop',
 });
 
 const router = useRouter();
@@ -49,14 +49,6 @@ function transactionLink(transactionHash?: string | null): string {
       return '';
   }
 }
-
-async function importNft(nftId: string) {
-  const imported = await watchAsset(nftId);
-
-  if (imported) {
-    message.success("You've successfully imported your MENT token to your wallet.");
-  }
-}
 </script>
 
 <template>
@@ -78,7 +70,7 @@ async function importNft(nftId: string) {
           v-if="query?.nftId && nftId"
           size="large"
           class="!text-black mb-6"
-          @click="importNft(nftId)"
+          @click="watchAsset(nftId)"
         >
           Import NFT to wallet
         </Btn>

frontend/pages/success.vue

@@ -5,14 +5,14 @@
     <p>Check your email and see where you stand.</p>
     <br />
     <p>
-      If you got in, you’ll have 72 hours to claim your MENT token in peace,
-      in the comfort of your own home. Now, go enjoy some music.
+      If you got in, you’ll have 72 hours to claim your MENT token in peace, in the comfort of your
+      own home. Now, go enjoy some music.
     </p>
   </div>
 </template>
 
 <script setup lang="ts">
 useHead({
-  title: 'MENT token airdrop',
+  title: 'Ment NFT airdrop',
 });
 </script>