<script setup lang="ts">
import type { AdminWarrenData } from '~/shared/types/warrens';

const { warren } = defineProps<{
    warren: AdminWarrenData;
}>();
</script>

<template>
    <div
        class="group/warren bg-accent/30 flex shrink grow flex-row items-center gap-4 rounded-lg p-2 pl-4"
    >
        <Icon class="size-5" name="lucide:folder-root" />
        <div class="flex min-w-0 shrink grow flex-col leading-4">
            <p class="truncate text-sm font-medium">{{ warren.name }}</p>
            <span class="text-muted-foreground truncate text-xs">{{
                warren.path
            }}</span>
        </div>
        <div
            class="flex justify-end transition-all not-pointer-coarse:opacity-0 not-pointer-coarse:group-hover/warren:opacity-100"
        >
            <slot name="actions" />
        </div>
    </div>
</template>
