notely/frontend/src/components/app/AppModalHost.vue

<template>
    <CreateSpaceModal v-if="showCreateSpaceModal" @close="emit('close-create-space')" @create="emit('create-space', $event)" />
    <CreateCategoryModal
        v-if="showCreateCategoryModal"
        :category="editingCategory"
        :parent-options="categoryParentOptions"
        :parent-id="categoryModalParentId"
        @close="emit('close-create-category')"
        @submit="emit('submit-category', $event)"
    />
    <CreateNoteModal
        v-if="showCreateNoteModal"
        :category-options="categoryOptions"
        :default-category-id="selectedCategoryId"
        @close="emit('close-create-note')"
        @create="emit('create-note', $event)"
    />
    <CreateTaskListModal
        v-if="showCreateTaskListModal"
        :category-options="categoryOptions"
        :default-category-id="selectedCategoryId"
        @close="emit('close-create-task-list')"
        @create="emit('create-task-list', $event)"
    />
    <SpaceSettingsModal
        v-if="showSpaceSettingsModal && currentSpace && canManageSpaceSettings"
        :space="currentSpace"
        @close="emit('close-space-settings')"
        @saved="emit('saved-space', $event)"
        @deleted="emit('deleted-space', $event)"
    />
    <TaskDetailModal
        v-if="showTaskModal"
        :task="taskModalDraft || {}"
        :statuses="taskStatuses"
        :parent-task-options="taskParentOptions"
        :subtasks="taskDetailSubtasks"
        @close="emit('close-task-modal')"
        @save-task="emit('save-task', $event)"
        @delete-task="emit('delete-task', $event)"
        @transition="emit('transition-task', $event)"
        @create-subtask="emit('create-subtask', $event)"
        @open-task="emit('open-task', $event)"
    />
</template>

<script setup>
import CreateSpaceModal from "../CreateSpaceModal.vue";
import CreateCategoryModal from "../CreateCategoryModal.vue";
import CreateNoteModal from "../CreateNoteModal.vue";
import CreateTaskListModal from "../CreateTaskListModal.vue";
import SpaceSettingsModal from "../SpaceSettingsModal.vue";
import TaskDetailModal from "../TaskDetailModal.vue";

defineProps({
    showCreateSpaceModal: {
        type: Boolean,
        default: false,
    },
    showCreateCategoryModal: {
        type: Boolean,
        default: false,
    },
    editingCategory: {
        type: Object,
        default: null,
    },
    categoryParentOptions: {
        type: Array,
        default: () => [],
    },
    categoryModalParentId: {
        type: [String, Number, null],
        default: null,
    },
    showCreateNoteModal: {
        type: Boolean,
        default: false,
    },
    categoryOptions: {
        type: Array,
        default: () => [],
    },
    selectedCategoryId: {
        type: [String, Number, null],
        default: null,
    },
    showCreateTaskListModal: {
        type: Boolean,
        default: false,
    },
    showSpaceSettingsModal: {
        type: Boolean,
        default: false,
    },
    currentSpace: {
        type: Object,
        default: null,
    },
    canManageSpaceSettings: {
        type: Boolean,
        default: false,
    },
    showTaskModal: {
        type: Boolean,
        default: false,
    },
    taskModalDraft: {
        type: Object,
        default: null,
    },
    taskStatuses: {
        type: Array,
        default: () => [],
    },
    taskParentOptions: {
        type: Array,
        default: () => [],
    },
    taskDetailSubtasks: {
        type: Array,
        default: () => [],
    },
});

const emit = defineEmits([
    "close-create-space",
    "create-space",
    "close-create-category",
    "submit-category",
    "close-create-note",
    "create-note",
    "close-create-task-list",
    "create-task-list",
    "close-space-settings",
    "saved-space",
    "deleted-space",
    "close-task-modal",
    "save-task",
    "delete-task",
    "transition-task",
    "create-subtask",
    "open-task",
]);
</script>