<template>
  <q-header elevated>
    <q-toolbar>
      <q-btn
        flat
        dense
        round
        icon="menu"
        aria-label="Menu"
        @click="toggleLeftDrawer"
      />

      <q-toolbar-title> {{ pageTitle }} </q-toolbar-title>
      <q-tabs shrink>
        <q-tab> </q-tab>
      </q-tabs>
    </q-toolbar>
  </q-header>
  <LeftDrawer :drawer="leftDrawerOpen" @drawer-toggle="toggleLeftDrawer" />
</template>

<script setup lang="ts">
import { ref } from 'vue';
import LeftDrawer from 'components/LeftDrawer.vue';

const leftDrawerOpen = ref(false);
function toggleLeftDrawer() {
  leftDrawerOpen.value = !leftDrawerOpen.value;
}
defineProps({
  pageTitle: String,
});
</script>
