115 lines
3.3 KiB
Vue
115 lines
3.3 KiB
Vue
<script setup lang="ts">
|
|
import {
|
|
ContextMenu,
|
|
ContextMenuTrigger,
|
|
ContextMenuContent,
|
|
ContextMenuItem,
|
|
ContextMenuSeparator,
|
|
} from '@/components/ui/context-menu';
|
|
import { deleteWarrenDirectory, deleteWarrenFile } from '~/lib/api/warrens';
|
|
import type { DirectoryEntry } from '#shared/types';
|
|
|
|
const warrenStore = useWarrenStore();
|
|
const renameDialog = useRenameDirectoryDialog();
|
|
|
|
const { entry, disabled } = defineProps<{
|
|
entry: DirectoryEntry;
|
|
disabled: boolean;
|
|
}>();
|
|
|
|
const deleting = ref(false);
|
|
|
|
async function submitDelete(force: boolean = false) {
|
|
if (warrenStore.current == null) {
|
|
return;
|
|
}
|
|
|
|
deleting.value = true;
|
|
|
|
if (entry.fileType === 'directory') {
|
|
await deleteWarrenDirectory(
|
|
warrenStore.current.warrenId,
|
|
warrenStore.current.path,
|
|
entry.name,
|
|
force
|
|
);
|
|
} else {
|
|
await deleteWarrenFile(
|
|
warrenStore.current.warrenId,
|
|
warrenStore.current.path,
|
|
entry.name
|
|
);
|
|
}
|
|
|
|
deleting.value = false;
|
|
}
|
|
|
|
async function openRenameDialog() {
|
|
renameDialog.openDialog(entry);
|
|
}
|
|
|
|
async function onClick() {
|
|
if (warrenStore.loading) {
|
|
return;
|
|
}
|
|
|
|
warrenStore.addToCurrentWarrenPath(entry.name);
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<ContextMenu>
|
|
<ContextMenuTrigger>
|
|
<button
|
|
:disabled="warrenStore.loading || disabled"
|
|
:class="[
|
|
'bg-accent/30 border-border flex w-52 flex-row gap-4 overflow-hidden rounded-md border-1 px-4 py-2 select-none',
|
|
{
|
|
'pointer-events-none': entry.fileType === 'file',
|
|
},
|
|
]"
|
|
@click="onClick"
|
|
>
|
|
<div class="flex flex-row items-center">
|
|
<Icon class="size-6" :name="getFileIcon(entry.mimeType)" />
|
|
</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">{{ entry.name }}</span>
|
|
<NuxtTime
|
|
v-if="entry.createdAt != null"
|
|
:datetime="entry.createdAt * 1000"
|
|
class="text-muted-foreground w-full truncate text-sm"
|
|
relative
|
|
></NuxtTime>
|
|
</div>
|
|
</button>
|
|
</ContextMenuTrigger>
|
|
<ContextMenuContent>
|
|
<ContextMenuItem @select="openRenameDialog">
|
|
<Icon name="lucide:pencil" />
|
|
Rename
|
|
</ContextMenuItem>
|
|
|
|
<ContextMenuSeparator />
|
|
|
|
<ContextMenuItem @select="() => submitDelete(false)">
|
|
<Icon name="lucide:trash-2" />
|
|
Delete
|
|
</ContextMenuItem>
|
|
<ContextMenuItem
|
|
v-if="entry.fileType === 'directory'"
|
|
@select="() => submitDelete(true)"
|
|
>
|
|
<Icon
|
|
class="text-destructive-foreground"
|
|
name="lucide:trash-2"
|
|
/>
|
|
Force delete
|
|
</ContextMenuItem>
|
|
</ContextMenuContent>
|
|
</ContextMenu>
|
|
</template>
|