40 lines
1.2 KiB
Vue
40 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import type { DirectoryEntry } from '~/shared/types';
|
|
|
|
const { entry } = defineProps<{ entry: DirectoryEntry }>();
|
|
const emit = defineEmits<{
|
|
back: [];
|
|
}>();
|
|
|
|
const onDrop = onDirectoryEntryDrop(entry, true);
|
|
</script>
|
|
|
|
<template>
|
|
<button
|
|
class="bg-accent/30 border-border flex w-52 translate-0 flex-row gap-4 overflow-hidden rounded-md border-1 px-4 py-2 select-none"
|
|
@contextmenu.prevent
|
|
@click="() => emit('back')"
|
|
@drop="onDrop"
|
|
>
|
|
<div class="flex flex-row items-center">
|
|
<Icon class="size-6" name="lucide:folder-up" />
|
|
</div>
|
|
<div
|
|
class="flex w-full flex-col items-start justify-stretch gap-0 overflow-hidden text-left leading-6"
|
|
>
|
|
<span class="w-full truncate"
|
|
>..
|
|
<span class="text-muted-foreground truncate text-sm"
|
|
>({{ entry.name }})</span
|
|
></span
|
|
>
|
|
<NuxtTime
|
|
v-if="entry.createdAt != null"
|
|
:datetime="entry.createdAt * 1000"
|
|
class="text-muted-foreground w-full truncate text-sm"
|
|
relative
|
|
></NuxtTime>
|
|
</div>
|
|
</button>
|
|
</template>
|