[Feat] 스터디 후기 등록 content 로직 수정 및 후기 더보기 버튼 설정

app/(my)/my-study-review/page.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import Image from 'next/image';
-import { useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import KeywordReview from '@/entities/user/ui/keyword-review';
 import MoreKeywordReviewModal from '@/entities/user/ui/more-keyword-review-modal';
 import { MyReviewItem } from '@/features/study/api/types';
@@ -11,6 +11,7 @@ import {
   useUserPositiveKeywordsQuery,
 } from '@/features/study/model/use-review-query';
 import { formatKoreaRelativeTime } from '@/shared/lib/time';
+import UserAvatar from '@/shared/ui/avatar';
 
 export default function MyStudyReview() {
   const { data: positiveKeywordsData } = useUserPositiveKeywordsQuery({
@@ -172,16 +173,27 @@ function MoreNegativeKeywordsModal() {
 
 function Review({ data }: { data: MyReviewItem }) {
   const [expanded, setExpanded] = useState(false);
+  const [showButton, setShowButton] = useState(false);
+  const contentRef = useRef<HTMLParagraphElement>(null);
+
+  useEffect(() => {
+    if (contentRef.current) {
+      const lineHeight = parseInt(
+        window.getComputedStyle(contentRef.current).lineHeight,
+        10,
+      );
+      const maxHeight = lineHeight * 3; // 3줄 기준
+      setShowButton(contentRef.current.scrollHeight > maxHeight);
+    }
+  }, [data.content]);
 
   return (
     <li className="border-b-border-subtle flex flex-col gap-150 border-b py-250">
       <div className="flex items-center gap-150">
-        <Image
-          src={data.writer.profileImageUrl || '/profile-default.svg'}
-          width={32}
-          height={32}
+        <UserAvatar
+          size={32}
+          image={data.writer.profileImageUrl}
           alt={`${data.writer.memberName} 프로필 이미지`}
-          className="rounded-full"
         />
 
         <div>
@@ -197,18 +209,23 @@ function Review({ data }: { data: MyReviewItem }) {
 
       <div>
         <p
-          className={`text-text-default font-designer-15r ${expanded ? 'line-clamp-none' : 'line-clamp-3'}`}
+          ref={contentRef}
+          className={`text-text-default font-designer-15r ${
+            expanded ? 'line-clamp-none' : 'line-clamp-3'
+          }`}
         >
           {data.content}
         </p>
-        <button
-          className="font-designer-14r text-text-subtlest cursor-pointer"
-          onClick={() => setExpanded(!expanded)}
-        >
-          {expanded ? '접기' : '더보기'}
-        </button>
-      </div>
 
+        {showButton && (
+          <button
+            className="font-designer-14r text-text-subtlest cursor-pointer"
+            onClick={() => setExpanded(!expanded)}
+          >
+            {expanded ? '접기' : '더보기'}
+          </button>
+        )}
+      </div>
       <div>
         <div className="text-text-subtle">
           <span className="font-designer-14b mr-100">스터디 기간</span>

src/features/study/api/types.ts

@@ -124,7 +124,7 @@ export interface AddStudyReviewRequest {
   targetMemberId: number;
   satisfactionId: 10 | 20 | 30;
   keywordIds: number[];
-  content: string;
+  content?: string;
 }
 
 interface Keyword {

src/features/study/ui/study-review-modal.tsx

@@ -74,18 +74,19 @@ function StudyReviewForm({ onClose }: { onClose: () => void }) {
   if (!data) return null;
 
   const handleSubmit = () => {
-    if (
-      form.keywordIds.length === 0 ||
-      form.satisfactionId === null ||
-      form.content === ''
-    )
-      return;
-
-    addStudyReview(form, {
-      onSuccess: () => {
-        onClose();
+    if (form.keywordIds.length === 0 || form.satisfactionId === null) return;
+
+    addStudyReview(
+      {
+        ...form,
+        content: form.content || undefined,
+      },
+      {
+        onSuccess: () => {
+          onClose();
+        },
       },
-    });
+    );
   };
 
   return (