update loading cycle + potential staking rewards

src/App.vue

@@ -14,7 +14,7 @@ import { useCycleStore } from "@/stores/cycles";
 import SlideoutPanel from "./components/SlideoutPanel.vue";
 import ConnectWallet from "./components/ConnectWallet.vue";
 
-import { getNetwork } from "@wagmi/core";
+import { getNetwork, fetchTransaction } from "@wagmi/core";
 
 const isMobile = ref(false);
 const showPanel = ref(false);

src/components/SacrificeToken.vue

@@ -14,7 +14,7 @@
 					]"
 					v-for="token in props.data"
 					:key="token.contractAddress"
-					@click="tokenStore.changeActiveToken(token)"
+					@click="changeActiveToken(token)"
 				>
 					<div class="sacrifice-token-logo">
 						<img v-if="isMobile" :src="token.logoMobile" alt="token logo" />
@@ -90,7 +90,7 @@
 						>
 							No Staking Bonus
 						</div>
-						<div class="mid-mid-text" v-else>+ TODO Staking Bonus</div>
+						<div class="mid-mid-text" v-else>+ {{ stakingOutput }} Staking Bonus</div>
 						<div class="icon">
 							<font-awesome-icon icon="chevron-down" />
 						</div>
@@ -189,6 +189,7 @@ const props = defineProps({
 });
 
 const output = ref(0);
+const stakingOutput = ref(null);
 const blockEvent = ref(null);
 const approveToast = ref(null);
 /**
@@ -231,8 +232,9 @@ const stateComputed = computed(() => {
 	return returnState;
 });
 const processChange = debounce(async (value) => {
-	const returnValue = await sacrificeStore.getRewardsFor(value, activeToken.value);
+	const rewardValue = await sacrificeStore.getRewardsFor(value, activeToken.value);
-	output.value = returnValue.output;
+	output.value = rewardValue.output;
+	stakingOutput.value = rewardValue.staking;
 });
 
 onMounted(() => {
@@ -244,6 +246,7 @@ onMounted(() => {
 			console.log("blockNumber", blockNumber);
 			var rewardValue = await sacrificeStore.getRewardsFor(sacrificeStore.sacrificeNumber, activeToken.value);
 			output.value = rewardValue.output;
+			stakingOutput.value = rewardValue.staking;
 		}
 	);
 });
@@ -275,12 +278,16 @@ async function approveToken(amount) {
 
 async function addTokens(value) {
 	sacrificeStore.sacrificeNumber = Number(sacrificeStore.sacrificeNumber) + Number(value);
-	output.value = await sacrificeStore.getRewardsFor(sacrificeStore.sacrificeNumber, activeToken.value).output;
+	const rewardValue = await sacrificeStore.getRewardsFor(sacrificeStore.sacrificeNumber, activeToken.value);
+	output.value = rewardValue.output;
+	stakingOutput.value = rewardValue.staking;
 }
 
 async function addMaxTokens() {
 	sacrificeStore.sacrificeNumber = activeWalletToken.value.balanceOf;
-	output.value = await sacrificeStore.getRewardsFor(sacrificeStore.sacrificeNumber, activeToken.value).output;
+	const rewardValue = await sacrificeStore.getRewardsFor(sacrificeStore.sacrificeNumber, activeToken.value);
+	output.value = rewardValue.output;
+	stakingOutput.value = rewardValue.staking;
 }
 
 function showApprovedToast(value, header, subheader, info) {
@@ -310,11 +317,26 @@ function showApprovedToast(value, header, subheader, info) {
 		toastClassName: "approve-toast toast-card",
 	});
 }
+
 //call function in the store and remove icon,
 async function sacrificeToken() {
 	await sacrificeStore.sacrificeToken(sacrificeStore.sacrificeNumber, activeToken.value);
 	toast.dismiss(approveToast.value);
 }
+
+async function changeActiveToken(token) {
+	console.log("changeActiveToken");
+	tokenStore.activeToken = token;
+	if (walletStore.connected) {
+		//TODO, wenn connected, dann all diese Daten laden?
+		tokenStore.activeToken.balance = await walletStore.getTokenBalance(token);
+		tokenStore.activeToken.allowance = Number(await tokenStore.allowance());
+	}
+	var rewards = await sacrificeStore.getRewardsFor(sacrificeStore.sacrificeNumber, token);
+	console.log("rewards", rewards);
+	output.value = rewards.output;
+	stakingOutput.value = rewards.staking;
+}
 </script>
 
 <style lang="sass">

src/components/TokenClaim.vue

@@ -77,8 +77,6 @@
 						v-if="stakeMenu"
 					>
 						<template v-slot:body>
-							{{ stateStakeClaimComp }}
-							{{ stateStakeClaim }}
 							<div class="btn btn-immortal stake-button" disabled v-if="stateStakeClaimComp === 0">
 								Enter Amount
 							</div>
@@ -150,11 +148,7 @@ async function stakeAndClaim() {
 		console.log(tokenNumber.value);
 		console.log(getCurrentCycleData.value.rewards_total);
 		const coefficient = (10000 * tokenNumber.value) / getCurrentCycleData.value.rewards_total;
-		console.log("hier");
 		stateStakeClaim.value = 2;
-		console.log("hier2");
-		console.log("coefficient", coefficient);
-		console.log("cycleStore.activeCycle", cycleStore.activeCycle);
 		var hash = await rewardLockerStore.stakeAndClaimCycle(coefficient, cycleStore.activeCycle);
 		console.log("hash");
 		stateStakeClaim.value = 3;
@@ -169,15 +163,26 @@ async function stakeAndClaim() {
 				(topic) => topic === "0xd0813ff03c470dcc7baa9ce36914dc2febdfd276d639deffaac383fd3db42ba3"
 			);
 		});
+
+		var stakeData = data.logs.find((logObject) => {
+			return logObject.topics.find(
+				(topic) => topic === "0xf496bf2b14b1d178412b6f7a745900105b49b38b315cfdfbfabad31a6f995c6f"
+			);
+		});
 		//
 		console.log("rewardData", rewardData);
 		const outputClaim = Number(rewardData?.topics[2]) / Math.pow(10, tokenStore.memeToken.decimals);
+		const outputStaked = Number(stakeData?.topics[3]) / Math.pow(10, tokenStore.memeToken.decimals);
 		showSuccessToast(
-			formatNumber(outputClaim),
+			formatNumber(outputClaim + outputStaked),
 			"Success!",
 			"You just claimed and staked",
 			"Join the next cycle to increase your rewards and win with your clan."
 		);
+		tokenNumber.value = 0;
+		stakeMenu.value = false;
+		await cycleStore.fillCycle(activeCycle.value, true);
+		await walletStore.loadWalletData();
 	} catch (error) {
 		console.error("stakeAndClaim", error);
 	} finally {
@@ -242,8 +247,8 @@ const stateClaimedComp = computed(() => {
 });
 
 const stateStakeClaimComp = computed(() => {
+	console.log("stateStakeClaimComp");
 	let returnState = 0;
-	console.log("tokenNumber.value", tokenNumber.value);
 	if (
 		tokenNumber.value === null ||
 		tokenNumber.value === "" ||

src/stores/cycles.js

@@ -65,9 +65,12 @@ export const useCycleStore = defineStore("cycles", {
 			const tokenStore = useTokenStore();
 			const memeBurnerStore = useMemeburnerStore();
             var data = await memeBurnerStore.getSacrificedCycle(this.currentCycle);
+            console.log("this.currentCycle", this.currentCycle);
+            console.log("this.cycles", this.cycles);
 			var tokenIndex = this.cycles[this.currentCycle]?.token.findIndex(
 				(tokenData) => tokenData.contractAddress === sacrificedToken
             );
+            console.log("tokenIndex", tokenIndex);
             const token = tokenStore.getToken(sacrificedToken);
             this.cycles[this.currentCycle].token[tokenIndex].amount =
                 Number(data[tokenIndex].result[1]) / Math.pow(10, token.decimals)

src/stores/rewardlocker.js

@@ -35,7 +35,6 @@ export const useRewardLockerStore = defineStore("rewardlocker", {
 				return await this.contract.read.rewards([walletAddress, cycleNumber, tokenAddress]);
 			} catch (error) {
 				console.error("getRewards", error);
-                
 			}
 		},
 		async getRewardsForAllToken(cycleNumber) {
@@ -63,7 +62,6 @@ export const useRewardLockerStore = defineStore("rewardlocker", {
 				const contracts = [];
 				for (let index = 0; index < tokenStore.sacrificeToken.length; index++) {
 					const token = tokenStore.sacrificeToken[index];
-				// calls.push(this.contract.methods.rewards(walletStore.address, cycleNumber, token.contractAddress));
 					contracts.push({
 						...this.contract,
 						functionName: "getTotalSacrificeRewardsForToken",
@@ -75,13 +73,22 @@ export const useRewardLockerStore = defineStore("rewardlocker", {
 				});
 				// const multicallStore = useMultiCallStore();
 				return data;
-                
 			} catch (error) {
-                throw new Error(error)
+				throw new Error(error);
 			}
 		},
 		async getSacrificedTokenCoefficient(cycleNumber, sacrificedToken) {
 			return await this.contract.read.getSacrificedTokenCoefficient([cycleNumber, sacrificedToken]);
+		},
+        async getStakeRewardForSacrificeReward(sacrificedToken, reward) {
+            const walletStore = useWalletStoreV2();
+            const cycleStore = useCycleStore();
+            return await this.contract.read.getStakeRewardForSacrificeReward([
+				walletStore.address,
+				sacrificedToken,
+				reward,
+			]);
+            
         },
 		async lastCompletedCycle() {
 			return await this.contract.read.lastCompletedCycle();
@@ -125,7 +132,7 @@ export const useRewardLockerStore = defineStore("rewardlocker", {
 			const spender = this.config.contractAddress;
 			const deadline = Date.now() + 20 * 60;
 			const decimals = tokenStore.getToken(walletStore.memeToken.contractAddress).decimals;
-			const value = BigInt(tokenNumber * Math.pow(10, decimals))
+			const value = BigInt(tokenNumber * Math.pow(10, decimals));
 			const nonce = await tokenStore.memeToken.contract.read.nonces([fromAddress]);
 			console.log("nonce", nonce);
 			const { types, message, domain, primaryType } = createPermitObject(
@@ -147,7 +154,6 @@ export const useRewardLockerStore = defineStore("rewardlocker", {
 			console.log("value, deadline, v, r, s", value, deadline, v, r, s);
 			const hash = await this.contract.write.stakeToBeSecured([value, deadline, v, r, s]);
 			return hash;
-			
 		},
 		async stakeAndClaimCycle(stakeCoefficient, cycle) {
 			// stakeCoefficient 25% = 2500, 50% = 5000

src/stores/sacrifice.js

@@ -3,6 +3,8 @@ import { useMemeburnerStore } from "@/stores/memeburner";
 import { useUniswapStore } from "@/stores/uniswap";
 import { useWalletStoreV2 } from "@/stores/walletV2";
 import { useCycleStore } from "@/stores/cycles";
+import { useRewardLockerStore } from "@/stores/rewardlocker";
+
 
 import { useTokenStore } from "@/stores/tokens";
 import { waitForTransaction, readContract, watchBlockNumber, multicall } from "@wagmi/core";
@@ -46,12 +48,23 @@ export const useSacrificeStore = defineStore("sacrifice", {
 				});
 				console.log("data", data);
 
-				var rewardData = data.logs.find((logObject) => {
+				// var rewardData = data.logs.find((logObject) => {
-					return logObject.topics.find(
+				// 	return logObject.topics.find(
+				// 		(topic) => topic === "0x5e60ccd3c81486143d815dce24867a494d7fee585a0a44282cf479b19a5186ee"
+				// 	);
+                // });
+                
+                var rewardData = data.logs.filter((logObject) => {
+					return logObject.topics.filter(
 						(topic) => topic === "0x5e60ccd3c81486143d815dce24867a494d7fee585a0a44282cf479b19a5186ee"
 					);
 				});
-				const outputSacrifice = Number(rewardData.data) / Math.pow(10, token.decimals);
+                console.log("rewardData", rewardData);
+				const outputSacrifice = rewardData.reduce((x, y) => {
+					return x + Number(y.data) / Math.pow(10, token.decimals);
+				}, 0);
+                console.log("outputSacrifice", outputSacrifice);
+				// const outputSacrifice = Number(rewardData.data) / Math.pow(10, token.decimals);
 				token.allowance = await tokenStore.allowance();
 				this.sacrificeState = 4;
 				showSuccessToast(
@@ -75,6 +88,8 @@ export const useSacrificeStore = defineStore("sacrifice", {
 			const memeburnerStore = useMemeburnerStore();
 			const uniswapStore = useUniswapStore();
             const walletStore = useWalletStoreV2();
+            const rewardLockerStore = useRewardLockerStore();
+            
 
 			let output = 0;
 			try {
@@ -88,7 +103,6 @@ export const useSacrificeStore = defineStore("sacrifice", {
 				const rewardsForResultNumber = rewardsForResult.reduce((x, y) => {
 					return x + Number(y) / Math.pow(10, token.decimals);
 				}, 0);
-
 				var quoteRewards = await uniswapStore.quoteExactInputSingle(value * Math.pow(10, token.decimals));
 				let variant = "sacrifice";
 				if (quoteRewards.result) {
@@ -163,7 +177,16 @@ export const useSacrificeStore = defineStore("sacrifice", {
 						console.log("use sacrifice after comparison sacrificeMemeAndBuyBLOOD and sacrificeMeme");
 					}
                 }
-				return { output: output, variant: variant };
+                //potential staking rewards
+                let stakingRewardsNumber = 0;
+                if (output > 0) {
+                    const stakingReward = await rewardLockerStore.getStakeRewardForSacrificeReward(
+                        token.contractAddress,
+                        output * Math.pow(10, token.decimals)
+                    );
+                    stakingRewardsNumber = (Number(stakingReward) / Math.pow(10, token.decimals)).toFixed(2);
+                }
+				return { output: output, variant: variant, staking: stakingRewardsNumber };
 			} catch (error) {
                 console.error("getRewardsFor", error);
 			}

src/stores/tokens.js

@@ -133,16 +133,6 @@ export const useTokenStore = defineStore("token", {
 			} catch (error) {
 				console.error("initV2", error);
 			}
-        },
-		async changeActiveToken(token) {
-			console.log("changeActiveToken");
-			this.activeToken = token;
-			const walletStore = useWalletStoreV2();
-			if (walletStore.connected) {
-				//TODO, wenn connected, dann all diese Daten laden?
-				this.activeToken.balance = await walletStore.getTokenBalance(token);
-				this.activeToken.allowance = Number(await this.allowance());
-			}
         },
 		async allowance() {
 			console.log("allowance");

src/stores/walletV2.js

@@ -119,10 +119,10 @@ export const useWalletStoreV2 = defineStore("walletV2", {
             //MemeToken Staked
             const tokenStore = useTokenStore();
             const staked = await rewardlockerStore.getStaked(this.address);
-            this.memeToken.staked = Number(staked / BigInt(Math.pow(10, tokenStore.memeToken.decimals)));
+            this.memeToken.staked = Number(staked) / Math.pow(10, tokenStore.memeToken.decimals);
             const unclaimedRewardsArray = await rewardlockerStore.getTotalRewards(this.address);
             const unclaimedRewards = unclaimedRewardsArray[0] + unclaimedRewardsArray[1];
-            this.memeToken.unclaimedRewards = Number(unclaimedRewards/  BigInt(Math.pow(10, tokenStore.memeToken.decimals)))
+            this.memeToken.unclaimedRewards = Number(unclaimedRewards) / Math.pow(10, tokenStore.memeToken.decimals)
 
         }
 	},

src/views/CycleView.vue

@@ -22,16 +22,18 @@
 		<div class="cycle card card--glow container container--variant1 bloodline-wrapper">
 			<div
 				class="bloodline-border round-finish-info low-mid-text"
-				v-if="difference > 0 && cycleStore.currentCycle === cycleStore.activeCycle"
+				:class="{ loading: difference <= 0 }"
+				v-if="cycleStore.currentCycle === cycleStore.activeCycle"
 			>
-				<!-- <div class="round-finish-info-element low-mid-text"> -->
+				<template v-if="difference > 0">
 					<div class="round-finish-info-key">Sacrifice Goal:</div>
 					<div class="round-finish-info-value">{{ cycleStore.getCurrentCycleData?.goalInBLD }} $BDL</div>
-				<!-- </div> -->
-				<!-- <div class="round-finish-info-element low-mid-text"> -->
 					<div class="round-finish-info-key">Time left:</div>
 					<div class="round-finish-info-value">{{ days }} {{ hours }} {{ minutes }}</div>
-				<!-- </div> -->
+				</template>
+				<template v-else>
+					<loading-component></loading-component>
+				</template>
 			</div>
 			<template v-if="cycleStore.currentCycle !== cycleStore.activeCycle">
 				<div class="bloodline-border bloodline-border purple cycle-winner" v-if="cycleStore.getCycleWinner">
@@ -47,7 +49,7 @@
 					</div>
 				</div>
 				<div class="bloodline-border bloodline-border__thin grey cycle-winner" v-else>
-					<!-- <loading-component></loading-component> -->
+					<template v-if="cycleStore.getCycleWinner">
 						<div class="cycle-winner-left">
 							<div class="cycle-winner-headline">No Clan Winner</div>
 							<div class="cycle-winner-subheadline">time limit has been reached</div>
@@ -57,6 +59,10 @@
 								<img src="/assets/img/token/bloodline.png" alt="" />
 							</div>
 						</div>
+					</template>
+					<div class="cycle-winner-loading" v-else>
+						<loading-component></loading-component>
+					</div>
 				</div>
 			</template>
 
@@ -83,6 +89,7 @@ import { inject, ref, onMounted, onBeforeUnmount } from "vue";
 import BloodChart from "@/components/BloodChart.vue";
 import TokenClaim from "@/components/TokenClaim.vue";
 import { useMemeburnerStore } from "@/stores/memeburner";
+import LoadingComponent from "@/components/LoadingComponent.vue";
 
 import { useCycleStore } from "@/stores/cycles";
 import { useRewardLockerStore } from "@/stores/rewardlocker";
@@ -278,6 +285,8 @@ function timeBetweenDates(expirationTimestamp) {
                     opacity: 0.3
         .cycle-winner-name
             font-size: 16px
+    .cycle-winner-loading
+        width: 100%
 
 
 .bloodline-clan
@@ -291,6 +300,9 @@ function timeBetweenDates(expirationTimestamp) {
     display: grid
     grid-template-columns: 1fr 1fr
     text-align: right
+    &.loading
+        grid-template-columns: 1fr
+
     .round-finish-info-key
         text-align: right
     .round-finish-info-value

src/views/TestView.vue

@@ -2,6 +2,7 @@
 	<div>
 		<button @click="mintToken">mint</button>
 		<button @click="mintToken2">mint2</button>
+		<button @click="mintToken3">mint3</button>
 		<button @click="sacrificeMeme">sacrifice Meme</button>
 		<button @click="approveMeme1">approve Meme1</button>
 		<button @click="tokenStore.approveToken(MemeBurnerJson, 10)">wallet approve</button>
@@ -163,6 +164,19 @@ async function mintToken2() {
 	// var totalSupply = await contract.methods.totalSupply().call();
 	// console.log("totalSupply", totalSupply);
 }
+async function mintToken3() {
+	try {
+		var mint = await tokenStore.token[2].contract.write.mint(["100000000000000000000000"]);
+		// .send({ from: web3.value.eth.Contract.defaultAccount });
+		console.log("mint", mint);
+	} catch (error) {
+		console.log(error);
+	}
+	// var balanceOf = await contract.methods.balanceOf("0x66422602B2f4885c57EE794174f98d9E4DDBBBC6").call();
+	// console.log("balanceOf", balanceOf);
+	// var totalSupply = await contract.methods.totalSupply().call();
+	// console.log("totalSupply", totalSupply);
+}
 
 async function fetchBalance() {
 	var result = await walletV2Store.fetchBalance();