<template>
  <slot v-if="s.regionApproved"/>
  <v-card v-if="s.regionApproved===null" title="Loading..." prepend-icon="mdi-clock-outline"
          text="If loading takes more than a second, please refresh your browser or contact support@dexorder.trade"/>
  <v-card v-if="s.regionApproved===false" title="Restricted" prepend-icon="mdi-alert" color="yellow-darken-1"
          text="Dexorder is not available in your region." rounded="0"/>
</template>

<script setup>
import {useStore} from "@/store/store";
import {socket} from "@/socket.js";
import {useRoute} from "vue-router";

const s = useStore()

let timer = null

const bypass = useRoute().query.approval

function tryApproval() {
  console.log('trying region approval')
  if (timer!==null) {
    clearTimeout(timer)
    timer = null
  }
  if (s.regionApproved===true) {
    console.log('region approved')
  }
  else if (s.regionApproved===null) {
    console.log('asking for region approval', bypass)
    socket.emit('approveRegion', bypass)
    timer = setTimeout(tryApproval, 5000)
  }
}

tryApproval()

</script>

<style scoped lang="scss">

</style>
