<template>
  <main class="flex flex-col" style="--row-gap: var(--space-32)">
    <Projects />
    <ProjectRequestDialog v-if="isProjectRequestDialogOpen" @close="isProjectRequestDialogOpen = false" />
    <ProjectRequestButton @click="isProjectRequestDialogOpen = true" />
  </main>
</template>

<script setup>
import Projects from "../components/Projects.vue";
import ProjectRequestButton from "../components/ProjectRequestButton.vue";
import ProjectRequestDialog from "../components/ProjectRequestDialog.vue";
import { ref } from "vue";

const isProjectRequestDialogOpen = ref(false);
</script>
