<template>
  <Notifications />
  <component :is="currentScreen" />
</template>

<script setup lang="ts">
import { useGameStore } from '@/stores/gameStore'
import { useZoneEditorStore } from '@/stores/zoneEditorStore'
import Notifications from '@/components/utilities/Notifications.vue'
import Login from '@/screens/Login.vue'
import Characters from '@/screens/Characters.vue'
import Game from '@/screens/Game.vue'
import ZoneEditor from '@/screens/ZoneEditor.vue'
import { computed } from 'vue'

const gameStore = useGameStore()
const zoneEditorStore = useZoneEditorStore()

const currentScreen = computed(() => {
  if (!gameStore.connection) return Login
  if (!gameStore.token) return Login
  if (!gameStore.character) return Characters
  if (zoneEditorStore.active) return ZoneEditor
  return Game
})

// Disable right click
addEventListener('contextmenu', (event) => event.preventDefault())
</script>
