<template>
<!--  <div>-->
<!--
    <v-card-title><v-icon icon="mdi-faucet"/>&nbsp;Testnet Faucet</v-card-title>
    <v-card-text>The Dexorder testnet faucet will send 1 TETH (Testnet ETH) to your account, plus 10 MEH (Mock Ethernet Hardfork) and 10,000 USXD (Joke Currency XD) to your vault.</v-card-text>
    <v-card-text>Click below to get free test tokens: </v-card-text>
    <v-card-item>
-->
<!--
      <v-table plain>
        <tbody>
        <tr v-for="token of tokens">
          <td><v-btn prepend-icon='mdi-plus' :text="'Gib '+token.symbol" @click="gib(token)" class="my-3" variant="outlined"/></td>
          <td>{{token.name}}</td>
        </tr>
        </tbody>
      </v-table>
-->
  <div class="w-100">
    <btn icon='mdi-plus' color="green" :disabled="!s.vault||disabled" @click="gib" :text="text" variant="outlined"/>
    <v-card-text v-if="s.chainId===421614">Get Sepolia ETH from any of the following Arbitrum Sepolia faucets:</v-card-text>
    <v-card-item v-if="s.chainId===421614">
      <ul>
        <li><a href="https://www.alchemy.com/faucets/arbitrum-sepolia" target="arbsep_faucet_alchemy">Alchemy Faucet <v-icon size="x-small" icon="mdi-open-in-new"/></a></li>
        <li><a href="https://getblock.io/faucet/arb-sepolia/" target="arbsep_faucet_getblock">GetBlock.io Faucet <v-icon size="x-small" icon="mdi-open-in-new"/></a></li>
        <li><a href="https://faucet.quicknode.com/arbitrum/sepolia" target="arbsep_faucet_quicknode">QuickNode Faucet <v-icon size="x-small" icon="mdi-open-in-new"/></a></li>
        <li><a href="https://bwarelabs.com/faucets/arbitrum-sepolia" target="arbsep_faucet_bware">Bware Labs Faucet <v-icon size="x-small" icon="mdi-open-in-new"/></a></li>
      </ul>
    </v-card-item>
  </div>
<!--    </v-card-item>-->
<!--  </div>-->
</template>

<script setup>
import {useStore} from "@/store/store";
import {computed, ref} from "vue";
import Btn from "@/components/Btn.vue";
import {metadata} from "@/version.js";
import {socket} from "@/socket.js";

const DISABLED_DURATION = 60_000;

const props = defineProps({
  text: {default:'GIB!'},
})
const s = useStore()

/*
function gib(token) {
  const tokenAddr = token.address
  const vault = s.vault
  const amount = 1_000_000n * 10n ** BigInt(token.decimals);
  async function send(signer) {
    return await new ethers.Contract(tokenAddr, mockErc20Abi, signer).mint(vault, amount);
  }
  pendTransaction(send)
}
*/

const disabled = ref(false)

const FAUCET_CONFIG = {
  native: 1,
  // MEH: 1,
  // USXD: 10000,
  MEH: 0,
  USXD: 0,
  WETH: 0,
  ARB: 0,
  USDC: 1000000,
}

function gib() {
  const s = useStore()
  if( s.account ) {
    const chainId = s.chainId
    const tokenAmounts = {native: BigInt(FAUCET_CONFIG.native*1e18)}
    const tmd = metadata[chainId].t // token metadata
    for (const [symbol, amount] of Object.entries(FAUCET_CONFIG)) {
      if (amount>0) {
        for (const t of tmd) {
          if (t.s === symbol) {
            if (t.x?.mock === true) {
              tokenAmounts[t.a] = BigInt(Math.trunc(10 ** t.d * amount))
            }
            break
          }
        }
      }
    }
    console.log('gib', s.chainId, s.account, s.vault, tokenAmounts )
    if (Object.keys(tokenAmounts).length>0) {
      disabled.value = true
      socket.emit('gib', s.chainId, s.account, s.vault, tokenAmounts )
      setTimeout(()=>disabled.value=false, DISABLED_DURATION)
    }
  }
}

const tokens = computed(()=>!s.mockCoins? [] : s.mockCoins.map((addr)=>s.tokens[addr]))

</script>

<style scoped lang="scss">
@use "src/styles/vars" as *;

</style>
