rename directory entries

frontend/components/DirectoryEntry.vue

@@ -4,13 +4,14 @@ import {
     ContextMenuTrigger,
     ContextMenuContent,
     ContextMenuItem,
+    ContextMenuSeparator,
 } from '@/components/ui/context-menu';
 import { deleteWarrenDirectory, deleteWarrenFile } from '~/lib/api/warrens';
 import type { DirectoryEntry } from '~/types';
-import { buttonVariants } from '@/components/ui/button';
 
 const route = useRoute();
 const warrenRoute = useWarrenRoute();
+const renameDialog = useRenameDirectoryDialog();
 
 const { entry, disabled } = defineProps<{
     entry: DirectoryEntry;
@@ -30,6 +31,10 @@ async function submitDelete(force: boolean = false) {
 
     deleting.value = false;
 }
+
+async function openRenameDialog() {
+    renameDialog.openDialog(entry);
+}
 </script>
 
 <template>
@@ -62,6 +67,13 @@ async function submitDelete(force: boolean = false) {
             </NuxtLink>
         </ContextMenuTrigger>
         <ContextMenuContent>
+            <ContextMenuItem @select="openRenameDialog">
+                <Icon name="lucide:pencil" />
+                Rename
+            </ContextMenuItem>
+
+            <ContextMenuSeparator />
+
             <ContextMenuItem @select="() => submitDelete(false)">
                 <Icon name="lucide:trash-2" />
                 Delete