모달 열렸을 떄 위젯이 끌리는 현상 해결

frontend/components/admin/dashboard/widgets/yard-3d/YardLayoutCreateModal.tsx

@@ -12,18 +12,17 @@ import {
 } from "@/components/ui/dialog";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
-import { Textarea } from "@/components/ui/textarea";
-import { Loader2 } from "lucide-react";
+import { Alert, AlertDescription } from "@/components/ui/alert";
+import { Loader2, AlertCircle } from "lucide-react";
 
 interface YardLayoutCreateModalProps {
   isOpen: boolean;
   onClose: () => void;
-  onCreate: (name: string, description: string) => Promise<void>;
+  onCreate: (name: string) => Promise<void>;
 }
 
 export default function YardLayoutCreateModal({ isOpen, onClose, onCreate }: YardLayoutCreateModalProps) {
   const [name, setName] = useState("");
-  const [description, setDescription] = useState("");
   const [isCreating, setIsCreating] = useState(false);
   const [error, setError] = useState("");
 
@@ -38,9 +37,8 @@ export default function YardLayoutCreateModal({ isOpen, onClose, onCreate }: Yar
     setError("");
 
     try {
-      await onCreate(name.trim(), description.trim());
+      await onCreate(name.trim());
       setName("");
-      setDescription("");
     } catch (error: any) {
       console.error("야드 생성 실패:", error);
       setError(error.message || "야드 생성에 실패했습니다");
@@ -53,7 +51,6 @@ export default function YardLayoutCreateModal({ isOpen, onClose, onCreate }: Yar
   const handleClose = () => {
     if (isCreating) return;
     setName("");
-    setDescription("");
     setError("");
     onClose();
   };
@@ -68,14 +65,13 @@ export default function YardLayoutCreateModal({ isOpen, onClose, onCreate }: Yar
 
   return (
     <Dialog open={isOpen} onOpenChange={handleClose}>
-      <DialogContent className="sm:max-w-[500px]">
+      <DialogContent className="sm:max-w-[500px]" onPointerDown={(e) => e.stopPropagation()}>
         <DialogHeader>
           <DialogTitle>새 야드 생성</DialogTitle>
-          <DialogDescription>야드의 이름과 설명을 입력하세요</DialogDescription>
+          <DialogDescription>야드 이름을 입력하세요</DialogDescription>
         </DialogHeader>
 
         <div className="space-y-4 py-4">
-          {/* 야드 이름 */}
           <div className="space-y-2">
             <Label htmlFor="yard-name">
               야드 이름 <span className="text-red-500">*</span>
@@ -94,21 +90,12 @@ export default function YardLayoutCreateModal({ isOpen, onClose, onCreate }: Yar
             />
           </div>
 
-          {/* 설명 */}
-          <div className="space-y-2">
-            <Label htmlFor="yard-description">설명</Label>
-            <Textarea
-              id="yard-description"
-              value={description}
-              onChange={(e) => setDescription(e.target.value)}
-              placeholder="야드에 대한 설명을 입력하세요 (선택사항)"
-              rows={3}
-              disabled={isCreating}
-            />
-          </div>
-
-          {/* 에러 메시지 */}
-          {error && <div className="rounded-md bg-red-50 p-3 text-sm text-red-600">{error}</div>}
+          {error && (
+            <Alert variant="destructive">
+              <AlertCircle className="h-4 w-4" />
+              <AlertDescription>{error}</AlertDescription>
+            </Alert>
+          )}
         </div>
 
         <DialogFooter>