quoter update + desktop update

src/components/ClaimComponent.vue

@@ -1,5 +1,5 @@
 <template>
-	<stake-component>
+	<card-component>
 		<template v-slot:headline> Unclaimed </template>
 		<template v-slot:body>
 			<token-name-price
@@ -48,12 +48,12 @@
 				<div class="small-text text-center">Sacrifice to earn $BLOOD</div>
 			</template>
 		</template>
-	</stake-component>
+	</card-component>
 </template>
 
 <script setup>
 import { ref } from "vue";
-import StakeComponent from "@/components/StakeComponent.vue";
+import CardComponent from "@/components/CardComponent.vue";
 import StakeMenu from "@/components/StakeMenu.vue";
 import TokenNamePrice from "@/components/TokenNamePrice.vue";
 import TokenLogo from "@/components/TokenLogo.vue";

src/components/ConnectWallet.vue

@@ -63,7 +63,6 @@ import { useTokenStore } from "@/stores/tokens";
 import Meme1Json from "@/assets/contracts/Meme1.json";
 import TokenNamePrice from "./TokenNamePrice.vue";
 import TokenLogo from "./TokenLogo.vue";
-import StakeComponent from "./StakeComponent.vue";
 import TokenInput from "./TokenInput.vue";
 import StakeComponentV1 from "@/components/StakeComponentV1.vue";
 
@@ -155,6 +154,8 @@ async function connectWallet(connector) {
                 border-radius: 8px
         .connected-header-logout
             margin-left: auto
+            &:hover, &:active, &:focus
+                cursor: pointer
             svg
                 font-size: 25px
 

src/components/SacrificeToken.vue

@@ -39,7 +39,7 @@
 					@input="
 						($event) => {
 							tokenNumber = $event.target.value;
-							return getRewardsFor($event.target.value);
+							return processChange($event.target.value);
 						}
 					"
 					:logo="activeToken.logo"
@@ -65,9 +65,7 @@
 				<div class="sarcrifice-to-input">
 					<div class="sacrifice-to-output">
 						<div class="sacrifice-to-output-coin">$BLOOD</div>
-						<div class="sacrifice-to-output-rewards header">
-							{{ output }}
-						</div>
+						<div class="sacrifice-to-output-rewards header">{{ output.toFixed(5) }}</div>
 					</div>
 					<div class="sacrifice-logo">
 						<img :src="activeToken.vamp?.logo" :alt="activeToken.vamp.name" />
@@ -90,8 +88,6 @@
 					<stake-component-v1 :variant="1" v-if="showStakingMenu">
 						<template v-slot:headline> {{ null }}</template>
 					</stake-component-v1>
-
-					<!-- <stake-component v-if="showStakingMenu" stakeonly class="variant1"></stake-component> -->
 				</div>
 			</div>
 			<div class="sacrificed-info" v-if="state === 4">
@@ -150,16 +146,17 @@
 </template>
 
 <script setup>
-import { ref, defineProps, watch, inject, nextTick } from "vue";
+import { ref, defineProps, watch, inject, nextTick, onMounted, onBeforeUnmount, computed } from "vue";
 import { useWalletStoreV2 } from "@/stores/walletV2";
 import { useTokenStore } from "@/stores/tokens";
 import { useMemeburnerStore } from "@/stores/memeburner";
+import { useUniswapStore } from "@/stores/uniswap";
 import StakeComponentV1 from "@/components/StakeComponentV1.vue";
 import LoadingComponent from "@/components/LoadingComponent.vue";
 import TokenInput from "@/components/TokenInput.vue";
 
 import { storeToRefs } from "pinia";
-import { waitForTransaction } from "@wagmi/core";
+import { waitForTransaction, readContract, watchBlockNumber } from "@wagmi/core";
 
 import Helper from "@/utils/helper.js";
 const isMobile = inject("isMobile");
@@ -173,6 +170,7 @@ const tokenStore = useTokenStore();
 const { activeToken } = storeToRefs(tokenStore);
 
 const memeburnerStore = useMemeburnerStore();
+const uniswapStore = useUniswapStore();
 
 const props = defineProps({
 	data: Array,
@@ -189,6 +187,7 @@ const props = defineProps({
 const tokenNumber = ref(null);
 const output = ref(0);
 const loading = ref(false);
+const blockEvent = ref(null);
 /**
  * state 0 enter amount
  * state 1 rdy to go
@@ -200,12 +199,66 @@ const state = ref(0);
 const showStakingMenu = ref(false);
 const approvalData = ref(null);
 
-// const processChange = Helper.debounce((e) => getRewardsFor(e.target.value));
+const processChange = Helper.debounce((value) => getRewardsFor(value));
+
+onMounted(() => {
+	blockEvent.value = watchBlockNumber(
+		{
+			listen: true,
+		},
+		async (blockNumber) => {
+			console.log("blockNumber", blockNumber);
+			await getRewardsFor(tokenNumber.value);
+			// if (tokenNumber.value && tokenNumber.value > 0) {
+			// 	console.log("tokenNumber.value", tokenNumber.value);
+			// 	var quoteRewards = await uniswapStore.quoteExactInputSingle(
+			// 		tokenNumber.value * Math.pow(10, tokenStore.activeToken.decimals)
+			// 	);
+			// 	const quoteRewards1 = Number(quoteRewards) / Math.pow(10, tokenStore.activeToken.decimals);
+			// 	console.log("quoteRewards", quoteRewards);
+			// 	const rewardsForResult = await memeburnerStore.getRewardFor(
+			// 		tokenNumber.value * Math.pow(10, tokenStore.activeToken.decimals)
+			// 	);
+			// 	const rewardsForResult1 = Number(rewardsForResult) / Math.pow(10, tokenStore.activeToken.decimals);
+			// 	console.log("rewardsForResult1", rewardsForResult1);
+			// 	console.log("quoteRewards1", quoteRewards1);
+			// 	console.log("compare", quoteRewards1 * 0.995);
+			// 	console.log("ifcompare1", quoteRewards1 * 0.995 > rewardsForResult1);
+			// 	//return bigger number
+			// 	if (quoteRewards1 * 0.995 > rewardsForResult1) {
+			// 		//sacrificememe
+			// 		output.value = quoteRewards1;
+			// 		// const hash = await memeburnerStore.sacrificeMeme(tokenNumber.value);
+			// 	} else {
+			// 		output.value = rewardsForResult1;
+			// 		//sacrificeMemeAndBuyBLOOD
+			// 		// const hash = await memeburnerStore.sacrificeMeme(tokenNumber.value);
+			// 	}
+			// }
+			//
+		}
+	);
+	console.log("blockEvent.value", blockEvent.value);
+});
+
+onBeforeUnmount(() => {
+	console.log("blockEventunwatch", blockEvent.value);
+	blockEvent.value();
+});
 
 async function sacrificeToken(amount) {
 	try {
 		state.value = 2;
-		const hash = await memeburnerStore.sacrificeMeme(amount);
+		const getRewards = await getRewardsFor(amount);
+		console.log("getRewards123", getRewards);
+		let hash = null;
+		if (getRewards.variant === "sacrifice") {
+			console.log("sacrifice");
+			hash = await memeburnerStore.sacrificeMeme(amount);
+		} else {
+			console.log("buy");
+			hash = await memeburnerStore.sacrificeMemeAndBuyBLOOD(amount);
+		}
 		console.log("hash", hash);
 		state.value = 3;
 		const data = await waitForTransaction({
@@ -241,20 +294,86 @@ async function approveToken(amount) {
 }
 
 async function getRewardsFor(value) {
+	console.log("getRewardsFor", value);
 	loading.value = true;
+	let variant = null;
+	let newOutput = 0;
+	// if (activeToken.value.allowance >= value) {
+	// 	const amountDecimal = BigInt(value * Math.pow(10, tokenStore.activeToken.decimals));
+
+	// 	const hash = await readContract({
+	// 		address: memeburnerStore.contract.address,
+	// 		abi: memeburnerStore.contract.abi,
+	// 		functionName: "sacrificeMeme",
+	// 		args: [tokenStore.activeToken.contractAddress, amountDecimal.toString(), 0],
+	// 		account: walletStore.address,
+	// 	});
+	// 	console.log("hash", hash);
+	// 	// var hash = await memeburnerStore.contract.simulate.sacrificeMeme([
+	// 	// 	tokenStore.activeToken.contractAddress,
+	// 	// 	amountDecimal.toString(),
+	// 	// 	0,
+	// 	// ]);
+	// 	// console.log("hash", hash);
+	// 	// state.value = 3;
+	// 	// const data = await waitForTransaction({
+	// 	// 	hash: hash,
+	// 	// });
+	// 	// console.log("datahash", data);
+	// }
 	try {
 		if (!value || isNaN(value)) {
 			output.value = 0;
 			state.value = 0;
 			return;
 		}
-		const rewardsForResult = await memeburnerStore.getRewardFor(
-			BigInt(value * Math.pow(10, activeToken.value.decimals))
-		);
+		console.log("blablub", {
+			allowance: activeToken.value.allowance,
+			tokenNumber: tokenNumber.value,
+			connected: walletStore.connected,
+			check: walletStore.connected && activeToken.value.allowance >= tokenNumber.value,
+			ges: !walletStore.connected || (walletStore.connected && activeToken.value.allowance < tokenNumber.value),
+		});
+		if (!walletStore.connected || (walletStore.connected && activeToken.value.allowance < tokenNumber.value)) {
+			console.log("hier");
+			const rewardsForResult = await memeburnerStore.getRewardFor(
+				BigInt(value * Math.pow(10, activeToken.value.decimals))
+			);
+			console.log("rewardsForResult", rewardsForResult);
+			const rewardsForResultNumber = Number(rewardsForResult) / Math.pow(10, tokenStore.activeToken.decimals);
+			newOutput = rewardsForResultNumber;
+			variant = "sacrifice";
+		} else {
+			console.log("hier1");
+			console.log("activeToken.allowance", activeToken.value.allowance);
+			const rewardsForResult = await memeburnerStore.getRewardFor(
+				BigInt(value * Math.pow(10, activeToken.value.decimals))
+			);
+			console.log("rewardsForResult", rewardsForResult);
+			var quoteRewards = await uniswapStore.quoteExactInputSingle(
+				tokenNumber.value * Math.pow(10, tokenStore.activeToken.decimals)
+			);
+			const rewardsForResultNumber = Number(rewardsForResult) / Math.pow(10, tokenStore.activeToken.decimals);
+			console.log("rewardsForResultNumber", rewardsForResultNumber);
+			const quoteRewardsNumber = Number(quoteRewards) / Math.pow(10, tokenStore.activeToken.decimals);
+			console.log("quoteRewardsNumber", quoteRewardsNumber);
+			if (quoteRewardsNumber * 0.995 > rewardsForResultNumber) {
+				//sacrificememe
+				newOutput = quoteRewardsNumber;
+				variant = "buy";
+				// const hash = await memeburnerStore.sacrificeMeme(tokenNumber.value);
+			} else {
+				newOutput = rewardsForResultNumber;
+				variant = "sacrifice";
+				//sacrificeMemeAndBuyBLOOD
+				// const hash = await memeburnerStore.sacrificeMeme(tokenNumber.value);
+			}
+		}
+		console.log("variant", variant);
 		state.value = 1;
-		output.value = rewardsForResult / BigInt(Math.pow(10, tokenStore.memeToken.decimals));
-		tokenStore.activeToken.rewards = output.value;
-		return output.value;
+		output.value = newOutput;
+		tokenStore.activeToken.rewards = newOutput;
+		return { ouput: newOutput, variant: variant };
 	} catch (error) {
 		console.log("error", error);
 	} finally {
@@ -264,7 +383,7 @@ async function getRewardsFor(value) {
 
 async function addTokens(value) {
 	tokenNumber.value = Number(tokenNumber.value) + Number(value);
-	output.value = await getRewardsFor(parseInt(tokenNumber.value));
+	output.value = await getRewardsFor(tokenNumber.value).output;
 }
 </script>
 

src/components/StakeComponentV1.vue

@@ -108,7 +108,7 @@
 
 <script setup>
 import { ref, useSlots } from "vue";
-import StakeComponent from "@/components/StakeComponent.vue";
+import CardComponent from "@/components/CardComponent.vue";
 import StakeMenu from "@/components/StakeMenu.vue";
 import TokenNamePrice from "@/components/TokenNamePrice.vue";
 import TokenLogo from "@/components/TokenLogo.vue";
@@ -201,6 +201,8 @@ async function orderUnstake() {
                 .token-price
                     font-size: 24px
         .connected-stake-buttons
+            display: flex
+            gap: 8px
             .btn
                 font-size: 18px
         .connected-stake-first-round

src/components/TokenClaim.vue

@@ -70,7 +70,7 @@
 			</template>
 			<template v-else-if="getCurrentRoundData?.rewards_total > 0">
 				<Transition name="smooth">
-					<div class="connected-stake-buttons" v-show="!stakeMenu">
+					<div class="stake-buttons" v-show="!stakeMenu">
 						<div class="btn btn-immortal" @click="claimRewards">Claim</div>
 						<div class="btn btn-immortal" @click="openStake">Stake</div>
 					</div>
@@ -165,7 +165,9 @@ async function claimRewards() {
     .stake-buttons
         display: flex
         text-align: center
-        gap: 32px
+        gap: 8px
+        @media (min-width: 992px)
+            gap: 32px
         div
             flex: 1 1 50%
 .rewards-wrapper

src/components/TokenInput.vue

@@ -1,11 +1,7 @@
 <template>
 	<div class="token-input">
 		<div class="sarcrifice-from-input">
-			<input
-				@input="emit('update:modelValue', $event.target.value)"
-				v-model="props.modelValue"
-				:placeholder="0"
-			/>
+			<input @input="emit('update:modelValue', $event.target.value)" :value="props.modelValue" :placeholder="0" />
 			<div class="sacrifice-logo" v-if="props.logo">
 				<img :src="props.logo" alt="vampir" />
 			</div>
@@ -19,7 +15,7 @@
 
 <script setup>
 const props = defineProps({
-	modelValue: Number,
+	modelValue: [String, Number],
 	logo: String,
 });
 

src/components/TokenNamePrice.vue

@@ -8,7 +8,7 @@
 <script setup>
 const props = defineProps({
 	name: String,
-	price: Number,
+	price: [Number, String],
 });
 </script>