<script setup>
import { request } from "../assets/helpers.js";
import { useStore } from "vuex";

const userStore = useStore("userStore");

async function dispense() {
	await request("POST", "/dispense");
}
</script>

<template>
	<main>
		<template v-if="userStore.state.userInfo">
			<h2>Welcome back, {{ userStore.state.userInfo.username }}</h2>
			<br>
			<button @click="dispense">Dispense the m&m</button>
		</template>

		<template v-else>
			<h1>M&M Dispenser</h1>

			<p>Please login to continue</p>
		</template>
	</main>
</template>

