<script setup lang="ts">
import DirectoryListContextMenu from '~/components/DirectoryListContextMenu.vue';
import RenameEntryDialog from '~/components/actions/RenameEntryDialog.vue';
import { getWarrenDirectory } from '~/lib/api/warrens';

definePageMeta({
    middleware: ['authenticated'],
});

const warrenStore = useWarrenStore();
const loadingIndicator = useLoadingIndicator();
const warrenPath = computed(() => useWarrenPath());

if (warrenStore.current == null) {
    await navigateTo({
        path: '/warrens',
    });
}

const entries = useAsyncData(
    'current-directory',
    async () => {
        if (warrenStore.current == null) {
            return [];
        }

        loadingIndicator.start();
        warrenStore.loading = true;

        const entries = await getWarrenDirectory(
            warrenStore.current.warrenId,
            warrenStore.current.path
        );

        warrenStore.loading = false;
        loadingIndicator.finish();

        return entries;
    },
    { watch: [warrenPath] }
).data;
</script>

<template>
    <div class="grow">
        <DirectoryListContextMenu class="w-full grow">
            <DirectoryList v-if="entries != null" :entries="entries" />
        </DirectoryListContextMenu>
        <RenameEntryDialog />
    </div>
</template>
