1 files changed, 87 insertions, 0 deletions
diff --git a/lib/menu-v2/components/move-to-dialog.tsx b/lib/menu-v2/components/move-to-dialog.tsx
new file mode 100644
index 00000000..7253708b
--- /dev/null
+++ b/lib/menu-v2/components/move-to-dialog.tsx
@@ -0,0 +1,87 @@
+"use client";
+
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import { Button } from "@/components/ui/button";
+import { ScrollArea } from "@/components/ui/scroll-area";
+import { cn } from "@/lib/utils";
+import { Folder, FolderOpen, Home } from "lucide-react";
+import type { MenuTreeNode } from "../types";
+
+interface MoveToDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  node: MenuTreeNode | null;
+  availableParents: { id: number | null; title: string; depth: number }[];
+  onMove: (newParentId: number | null) => void;
+}
+
+export function MoveToDialog({
+  open,
+  onOpenChange,
+  node,
+  availableParents,
+  onMove,
+}: MoveToDialogProps) {
+  if (!node) return null;
+
+  const isCurrent = (parentId: number | null) => node.parentId === parentId;
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="max-w-md">
+        <DialogHeader>
+          <DialogTitle>Move To</DialogTitle>
+          <DialogDescription>
+            Select a new location for &quot;{node.titleKo}&quot;
+          </DialogDescription>
+        </DialogHeader>
+        
+        <ScrollArea className="max-h-[400px]">
+          <div className="space-y-0.5 p-1">
+            {availableParents.map((parent) => (
+              <Button
+                key={parent.id ?? 'root'}
+                variant={isCurrent(parent.id) ? "secondary" : "ghost"}
+                className={cn(
+                  "w-full justify-start h-auto py-2 text-sm",
+                  parent.depth === 0 && "font-medium",
+                  parent.depth === 1 && "font-medium",
+                  parent.depth === 2 && "text-muted-foreground"
+                )}
+                style={{ paddingLeft: parent.depth * 20 + 8 }}
+                onClick={() => onMove(parent.id)}
+                disabled={isCurrent(parent.id)}
+              >
+                {parent.id === null ? (
+                  <Home className="mr-2 h-4 w-4 text-blue-500 shrink-0" />
+                ) : parent.depth === 1 ? (
+                  <FolderOpen className="mr-2 h-4 w-4 text-amber-500 shrink-0" />
+                ) : (
+                  <Folder className="mr-2 h-4 w-4 text-amber-400 shrink-0" />
+                )}
+                <span className="truncate">{parent.title}</span>
+                {isCurrent(parent.id) && (
+                  <span className="ml-auto text-xs text-muted-foreground shrink-0">(current)</span>
+                )}
+              </Button>
+            ))}
+          </div>
+        </ScrollArea>
+
+        <div className="flex justify-end">
+          <Button variant="outline" onClick={() => onOpenChange(false)}>
+            Cancel
+          </Button>
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}
+
+