fix: feedback issues

src/components/contextual/pages/dashboard/Cards/RefiProfileCard.vue

@@ -3,21 +3,16 @@ import NFTImage from '@/assets/images/mocks/NFT.png';
 import { useRFNFT } from '@/composables/campaigns/useRFNFT';
 import useBreakpoints from '@/composables/useBreakpoints';
 import useWeb3 from '@/services/web3/useWeb3';
+
 const { startConnectWithInjectedProvider } = useWeb3();
 const { isMobile, bp } = useBreakpoints();
 
 const { NFTData, isLoading, MintNFT } = useRFNFT();
 const { isWalletReady } = useWeb3();
 
-function handleMintNFT() {
-  MintNFT();
-}
-function handleLevelUp() {
-  console.debug('Level up');
-}
-
 const nftImageSrc = computed(() => NFTData.value?.imageData || NFTImage);
 
+//TODO: Remove this ugly method and use a better one like all the info in the NFTData :)
 const levels = ref([
   { nextLevel: '100', votes: 1 },
   { nextLevel: '250', votes: 10 },
@@ -42,7 +37,7 @@ const levels = ref([
             </h3>
             <div class="flex justify-between items-center text-base">
               <p>Voting Power</p>
-              <p v-if="NFTData">{{ levels[NFTData?.id - 1].votes }} Votes</p>
+              <p v-if="NFTData">{{ NFTData.attributes[1].value }} Votes</p>
               <p v-else>- Votes</p>
             </div>
           </div>
@@ -73,20 +68,13 @@ const levels = ref([
           >
           <BalBtn
             v-else-if="!NFTData"
+            :disabled="MintingNFT"
             color="gradient-blue-light"
             class="self-end w-fit"
             size="sm"
-            @click="handleMintNFT"
+            @click="() => MintNFT()"
             >Mint NFT</BalBtn
           >
-          <BalBtn
-            v-else
-            color="gray"
-            class="self-end w-fit"
-            size="sm"
-            @click="handleLevelUp"
-            >Level Up</BalBtn
-          >
         </div>
       </div>
     </BalCard>
@@ -103,7 +91,7 @@ const levels = ref([
             </h3>
             <div class="flex justify-between items-center text-base">
               <p>Voting Power</p>
-              <p v-if="NFTData">{{ levels[NFTData?.id - 1].votes }} Votes</p>
+              <p v-if="NFTData">{{ NFTData.attributes[1].value }} Votes</p>
               <p v-else>- Votes</p>
             </div>
           </div>
@@ -135,19 +123,12 @@ const levels = ref([
           <BalBtn
             v-else-if="!NFTData"
             color="gradient-blue-light"
+            :disabled="MintingNFT"
             class="self-end w-fit"
             size="sm"
-            @click="handleMintNFT"
+            @click="() => MintNFT()"
             >Mint NFT</BalBtn
           >
-          <BalBtn
-            v-else
-            color="gray"
-            class="self-end w-fit"
-            size="sm"
-            @click="handleLevelUp"
-            >Level Up</BalBtn
-          >
         </div>
       </div>
     </BalCard>
@@ -172,7 +153,7 @@ const levels = ref([
             <h3 v-else class="self-start text-lg">Mint NFT</h3>
             <div class="flex justify-between items-center text-base">
               <p>Voting Power</p>
-              <p v-if="NFTData">{{ levels[NFTData?.id - 1].votes }} Votes</p>
+              <p v-if="NFTData">{{ NFTData.attributes[1].value }} Votes</p>
               <p v-else>- Votes</p>
             </div>
           </div>
@@ -202,21 +183,14 @@ const levels = ref([
             >Connect wallet</BalBtn
           >
           <BalBtn
-            v-else-if="!NFTData"
+            v-else
             color="gradient-blue-light"
+            :disabled="MintingNFT"
             class="self-end w-fit"
             size="sm"
-            @click="handleMintNFT"
+            @click="() => MintNFT()"
             >Mint NFT</BalBtn
           >
-          <BalBtn
-            v-else
-            color="gray"
-            class="self-end w-fit"
-            size="sm"
-            @click="handleLevelUp"
-            >Level Up</BalBtn
-          >
         </div>
       </div>
     </div>

src/composables/campaigns/useAllocations.ts

@@ -1,10 +1,12 @@
 import { QueryKey, useMutation, useQuery } from '@tanstack/vue-query';
 import { campaignsService } from '@/services/campaigns/campaigns.service';
+import useWeb3 from '@/services/web3/useWeb3';
 
 export function useAllocations() {
+  const { account } = useWeb3();
   const queryKey = reactive(['currentAllocation']);
   const queryFn = async () => {
-    return await campaignsService.getCurrentAllocation();
+    return await campaignsService.getCurrentAllocation(account.value);
   };
 
   const { data: currentAllocation, isLoading } = useQuery(

src/composables/campaigns/useRFNFT.ts

@@ -1,10 +1,16 @@
-import { useQuery, QueryKey, useMutation } from '@tanstack/vue-query';
+import { useQuery, QueryKey } from '@tanstack/vue-query';
 import {
   RFNFTData,
   campaignsService,
 } from '@/services/campaigns/campaigns.service';
+import useWeb3 from '@/services/web3/useWeb3';
+import useNotifications from '../useNotifications';
+import useTransactions from '../useTransactions';
 
 export function useRFNFT() {
+  const { addNotification } = useNotifications();
+  const { addTransaction } = useTransactions();
+  const { account } = useWeb3();
   const fetchNFTImage = async (ipfsHash: string) => {
     try {
       const imageUrl = `https://${
@@ -20,7 +26,7 @@ export function useRFNFT() {
 
   const queryFn = async () => {
     try {
-      const data = await campaignsService.getCurrentNFT();
+      const data = await campaignsService.getCurrentNFT(account.value);
       if (data?.image) {
         const ipfsHash = data.image.split('ipfs://')[1];
         const imageData = await fetchNFTImage(ipfsHash);
@@ -48,15 +54,28 @@ export function useRFNFT() {
     enabled: true,
   });
 
-  const mintNFTMutationKey: QueryKey = reactive(['mintNFT']);
-  const mintNFTMutationFn = async () => {
-    return await campaignsService.mintNFT();
+  const MintNFT = async () => {
+    try {
+      const txResponse = await campaignsService.mintNFT();
+      addTransaction({
+        id: txResponse.hash,
+        type: 'tx',
+        action: 'mintNFT',
+        summary: 'Regenerative Finance NFT',
+      });
+    } catch (error) {
+      console.error('Error minting NFT:', error);
+      addNotification({
+        title: 'Error',
+        message: 'The NFT could not be minted',
+        type: 'error',
+      });
+    }
   };
 
-  const { mutate: MintNFT } = useMutation(
-    mintNFTMutationKey,
-    mintNFTMutationFn
-  );
-
-  return { NFTData: data, isLoading, MintNFT };
+  return {
+    NFTData: data,
+    isLoading,
+    MintNFT,
+  };
 }

src/composables/useTransactions.ts

@@ -56,7 +56,8 @@ export type TransactionAction =
   | 'restake'
   | 'sync'
   | 'userGaugeCheckpoint'
-  | 'claimSubmission';
+  | 'claimSubmission'
+  | 'mintNFT';
 
 export type TransactionType = 'order' | 'tx';
 
@@ -165,7 +166,7 @@ function getId(id: string, type: TransactionType) {
 
 function getTransactions(): TransactionsMap {
   const transactionsMap = transactionsState.value[networkId] ?? {};
-
+  console.debug({ transactionsMap });
   return transactionsMap;
 }
 

src/lib/config/alfajores/contracts.ts

@@ -1,7 +1,7 @@
 import { Contracts } from '../types';
 import * as alfajores from '@/assets/data/contracts/alfajores.json';
 
-const contracts: Contracts & { simpleMinter: string } = {
+const contracts: Contracts = {
   merkleRedeem: '',
   merkleOrchard: '',
   merkleOrchardV2: '',

src/locales/default.json

@@ -1500,7 +1500,8 @@
     "unlock": "Unlock",
     "sync": "Sync",
     "userGaugeCheckpoint": "Pool gauge veBAL update",
-    "claimSubmission": "Claim submission"
+    "claimSubmission": "Claim submission",
+    "mintNFT": "Mint"
   },
   "transactionDeadline": "Transaction deadline",
   "transactionDeadlineTooltip": "Your swap will expire and not execute if it is pending for more than the selected duration. Only executed transactions incur fees for swaps between ERC-20 tokens.",

src/services/campaigns/campaigns.service.ts

@@ -6,9 +6,9 @@ import { getRpcProviderService } from '@/dependencies/rpc-provider.service';
 import { Network } from '@/lib/config/types';
 import { BigNumber } from '@ethersproject/bignumber';
 import { formatUnits } from '@ethersproject/units';
-import { networkId } from '@/composables/useNetwork';
 import { ipfsService } from '../ipfs/ipfs.service';
 import { configService } from '../config/config.service';
+import { Address } from '@kolektivo-labs/sdk';
 
 type Attributes = {
   trait_type: string;
@@ -28,27 +28,31 @@ export default class CampaignsService {
     this.addresses = configService.network.addresses;
   }
 
-  public async getCurrentAllocation() {
+  public async getCurrentAllocation(userAddress?: Address) {
     const provider = getRpcProviderService().getJsonProvider(Network.ALFAJORES);
+    if (!userAddress) return 0;
     const currentUserAddress = await this.walletService.getUserAddress();
-    if (networkId.value === Network.ALFAJORES) {
+    if (!currentUserAddress) return 0;
+    if (this.addresses.simpleMinter) {
       const currentAllocation = await call(provider, SimpleMinterAbi, [
         this.addresses.simpleMinter,
         'allocations',
-        [currentUserAddress],
+        [userAddress],
       ]);
-      return formatUnits(BigNumber.from(currentAllocation), 18);
+      if (currentAllocation) {
+        return formatUnits(BigNumber.from(currentAllocation), 18);
+      }
+      return 0;
     }
   }
 
-  public async getCurrentNFT() {
+  public async getCurrentNFT(userAddress?: Address) {
     const provider = getRpcProviderService().getJsonProvider(Network.ALFAJORES);
-    const currentUserAddress = await this.walletService.getUserAddress();
-    if (networkId.value === Network.ALFAJORES) {
+    if (this.addresses.RFNFT) {
       const currentNFTId = await call(provider, RFNFTAbi, [
         this.addresses.RFNFT,
         'ownerTokenId',
-        [currentUserAddress],
+        [userAddress],
       ]);
       const currentNFTTier = await call(provider, RFNFTAbi, [
         this.addresses.RFNFT,
@@ -75,7 +79,7 @@ export default class CampaignsService {
 
   public async mintNFT() {
     const currentUserAddress = await this.walletService.getUserAddress();
-    return this.walletService.txBuilder.contract.sendTransaction({
+    return await this.walletService.txBuilder.contract.sendTransaction({
       contractAddress: this.addresses.RFNFT,
       abi: RFNFTAbi,
       action: 'mint',