From 18b64b0d3b05bb47e9933d2815566eba81803c73 Mon Sep 17 00:00:00 2001
From: Hj1218 <wjdguswl2341@naver.com>
Date: Wed, 19 Jun 2024 18:33:49 +0900
Subject: [PATCH] =?UTF-8?q?[fix]=20textarea=20=EB=A7=A8=20=EC=9C=84?=
 =?UTF-8?q?=EB=A1=9C=20=EC=8A=A4=ED=81=AC=EB=A1=A4=20=EC=98=AC=EB=9D=BC?=
 =?UTF-8?q?=EA=B0=80=EB=8A=94=20=ED=98=84=EC=83=81=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/Calendar/Diary.js | 23 +++++++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/pages/Calendar/Diary.js b/src/pages/Calendar/Diary.js
index 4264331..eb78078 100644
--- a/src/pages/Calendar/Diary.js
+++ b/src/pages/Calendar/Diary.js
@@ -28,20 +28,19 @@ const Diary = () => {
     textarea.style.height = "auto"; // Reset height to auto
     textarea.style.height = textarea.scrollHeight + "px";
   }, []);
+
   useEffect(() => {
     handleResizeHeight();
   }, [handleResizeHeight]);
 
   const handleContentChange = (e) => {
-    // 내용이 변경될 때마다 높이 조정
-    handleResizeHeight();
     setNewContent(e.target.value);
   };
 
   // 다이어리 수정
   const updateDiary = async () => {
     try {
-      if (newContent == "") {
+      if (newContent === "") {
         return alert("내용을 작성해주세요.");
       }
       setIsSaving(true);
@@ -74,7 +73,6 @@ const Diary = () => {
     try {
       const res = await DiaryController.deleteDiary(diaryId);
       console.log("일기가 삭제되었습니다.");
-      // window.location.reload();
       navigate("/");
     } catch (error) {
       setIsSaving(false);
@@ -100,6 +98,21 @@ const Diary = () => {
     );
   }, []);
 
+  const handleScroll = (e) => {
+    e.preventDefault();
+    textRef.current.scrollTop = textRef.current.scrollHeight;
+  };
+
+  const handleInput = (e) => {
+    const textarea = e.target;
+    const scrollTop = textarea.scrollTop;
+    const scrollHeight = textarea.scrollHeight;
+
+    textarea.scrollTop = scrollTop;
+    textarea.style.height = "auto";
+    textarea.style.height = scrollHeight + "px";
+  };
+
   return (
     <div id="diary">
       {isSaving ? <Loading text="일기 수정 중..." /> : null}
@@ -147,6 +160,8 @@ const Diary = () => {
           ref={textRef}
           onChange={handleContentChange}
           value={newContent}
+          onInput={handleInput}
+          onScroll={handleScroll}
         />
       </div>
       <div