From a9e042ca6569c33ec65ceff6a9fa3bc6e08f3f14 Mon Sep 17 00:00:00 2001
From: syc0123 <yechul.shin@gmail.com>
Date: Tue, 31 Mar 2026 15:30:33 +0900
Subject: [PATCH] =?UTF-8?q?[RAPID-micro]=20=EC=BA=A1=EC=B2=98=20=EB=B2=84?=
 =?UTF-8?q?=ED=8A=BC=20=ED=97=A4=EB=8D=94=20=E2=86=92=20=EC=9E=85=EB=A0=A5?=
 =?UTF-8?q?=EC=B0=BD=20=EC=B2=A8=EB=B6=80=ED=8C=8C=EC=9D=BC=20=EC=A2=8C?=
 =?UTF-8?q?=EC=B8=A1=EC=9C=BC=EB=A1=9C=20=EC=9D=B4=EB=8F=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/components/messenger/ChatPanel.tsx      |  4 +++-
 frontend/components/messenger/MessageInput.tsx   | 10 ++++++++--
 frontend/components/messenger/MessengerModal.tsx | 11 ++---------
 3 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/frontend/components/messenger/ChatPanel.tsx b/frontend/components/messenger/ChatPanel.tsx
index 3a66feb4..767fc2f7 100644
--- a/frontend/components/messenger/ChatPanel.tsx
+++ b/frontend/components/messenger/ChatPanel.tsx
@@ -14,9 +14,10 @@ import type { Room } from "@/hooks/useMessenger";
 interface ChatPanelProps {
   room: Room | null;
   messageInputRef?: React.RefObject<MessageInputHandle | null>;
+  onCaptureClick?: () => void;
 }
 
-export function ChatPanel({ room, messageInputRef }: ChatPanelProps) {
+export function ChatPanel({ room, messageInputRef, onCaptureClick }: ChatPanelProps) {
   const { user } = useAuth();
   const { selectedRoomId } = useMessengerContext();
   const { data: messages } = useMessages(selectedRoomId);
@@ -180,6 +181,7 @@ export function ChatPanel({ room, messageInputRef }: ChatPanelProps) {
         roomId={room.id}
         onTypingStart={() => emitTypingStart(room.id)}
         onTypingStop={() => emitTypingStop(room.id)}
+        onCaptureClick={onCaptureClick}
       />
     </div>
   );
diff --git a/frontend/components/messenger/MessageInput.tsx b/frontend/components/messenger/MessageInput.tsx
index da0b5d3c..cc766fc8 100644
--- a/frontend/components/messenger/MessageInput.tsx
+++ b/frontend/components/messenger/MessageInput.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { useState, useRef, useCallback, useEffect, forwardRef, useImperativeHandle, KeyboardEvent, ChangeEvent } from "react";
-import { Paperclip, Send, SmilePlus, X, FileIcon } from "lucide-react";
+import { Paperclip, Send, SmilePlus, X, FileIcon, Scissors } from "lucide-react";
 import { useSendMessage, useUploadFile, useCompanyUsers } from "@/hooks/useMessenger";
 import { toast } from "sonner";
 
@@ -20,10 +20,11 @@ interface MessageInputProps {
   roomId: string;
   onTypingStart?: () => void;
   onTypingStop?: () => void;
+  onCaptureClick?: () => void;
 }
 
 export const MessageInput = forwardRef<MessageInputHandle, MessageInputProps>(
-function MessageInput({ roomId, onTypingStart, onTypingStop }: MessageInputProps, ref) {
+function MessageInput({ roomId, onTypingStart, onTypingStop, onCaptureClick }: MessageInputProps, ref) {
   const [text, setText] = useState("");
   const [pendingFiles, setPendingFiles] = useState<PendingFile[]>([]);
   const [showEmoji, setShowEmoji] = useState(false);
@@ -233,6 +234,11 @@ function MessageInput({ roomId, onTypingStart, onTypingStop }: MessageInputProps
 
       {/* Input toolbar */}
       <div className="flex items-center gap-1 p-2">
+        {onCaptureClick && (
+          <button onClick={onCaptureClick} className="p-1.5 hover:bg-muted rounded shrink-0" aria-label="화면 캡처">
+            <Scissors className="h-4 w-4 text-muted-foreground" />
+          </button>
+        )}
         <button onClick={() => fileRef.current?.click()} className="p-1.5 hover:bg-muted rounded shrink-0">
           <Paperclip className="h-4 w-4 text-muted-foreground" />
         </button>
diff --git a/frontend/components/messenger/MessengerModal.tsx b/frontend/components/messenger/MessengerModal.tsx
index b0bed09d..f0cfa1a9 100644
--- a/frontend/components/messenger/MessengerModal.tsx
+++ b/frontend/components/messenger/MessengerModal.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { useState, useEffect, useRef, useCallback } from "react";
-import { X, Settings, Scissors } from "lucide-react";
+import { X, Settings } from "lucide-react";
 import { useMessengerContext } from "@/contexts/MessengerContext";
 import { useRooms, useUnreadCount } from "@/hooks/useMessenger";
 import { RoomList } from "./RoomList";
@@ -194,13 +194,6 @@ export function MessengerModal() {
       >
         <h2 className="text-sm font-semibold">메신저</h2>
         <div className="flex items-center gap-1">
-          <button
-            onClick={() => setCapturing(true)}
-            className="p-1 hover:bg-muted rounded"
-            aria-label="화면 캡처"
-          >
-            <Scissors className="h-4 w-4 text-muted-foreground" />
-          </button>
           <button
             onClick={() => setShowSettings((p) => !p)}
             className="p-1 hover:bg-muted rounded"
@@ -221,7 +214,7 @@ export function MessengerModal() {
       {/* Body */}
       <div className="flex flex-1 min-h-0 relative">
         <RoomList />
-        <ChatPanel room={selectedRoom} messageInputRef={messageInputRef} />
+        <ChatPanel room={selectedRoom} messageInputRef={messageInputRef} onCaptureClick={() => setCapturing(true)} />
 
         {showSettings && (
           <div className="absolute inset-0 bg-background z-10 flex flex-col">