full page traversal

frontend/src/App.vue

@@ -2,6 +2,7 @@
 import { onBeforeMount, ref } from 'vue';
 import Login from './components/Login.vue';
 import HomePage from './components/HomePage.vue';
+import AddTimeSlot from './components/AddTimeSlot.vue';
 
 const page = ref<number>(0);
 
@@ -16,4 +17,5 @@ onBeforeMount(async () => {
 <template>
     <Login v-if="page == 0" @next-page="page++"/>
     <HomePage v-if="page == 1" @add-slot="page++"/>
+    <AddTimeSlot v-if="page == 2" @go-home="page--"/>
 </template>

frontend/src/components/AddTimeSlot.vue

@@ -0,0 +1,7 @@
+<script setup lang="ts">
+defineEmits(['goHome']);
+</script>
+<template>
+    <p>AddTimeSlot</p>
+    <button @click="$emit('goHome')">Done</button>
+</template>

frontend/src/components/HomePage.vue

@@ -17,7 +17,7 @@ onBeforeMount(async () => {
         <h1>What's free in my free?</h1>
         <button @click="$emit('addSlot')">Add new slot</button>
     </header>
-    <article>
+    <article v-if="rooms">
         <h2>Free Rooms:</h2>
         <p v-if="rooms.records.length == 0">No free rooms right now</p>
         <ul v-for="(slot, index) in rooms.records">