ReviewModal 추가/PhotoModal 개선

wafflestudio · Jan 11, 2025 · e5ce8e6 · e5ce8e6
1 parent 17d7052
commit e5ce8e6
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 9 deletions.
diff --git a/src/components/roomdetail/Info.tsx b/src/components/roomdetail/Info.tsx
@@ -1,17 +1,17 @@
 import PhotoSizeSelectActualIcon from '@mui/icons-material/PhotoSizeSelectActual';
 import StarIcon from '@mui/icons-material/Star';
-import ReviewModal from '@/components/roomdetail/ReviewModal';
+import { useState } from 'react';
 
 import { ACCOMMODATION_TYPES } from '@/components/common/constants/accommodationTypes';
 import checkin from '@/components/roomdetail/checkin.svg';
 import crownleft from '@/components/roomdetail/crownleft.svg';
 import crownright from '@/components/roomdetail/crownright.svg';
 import luggage from '@/components/roomdetail/luggage.svg';
+import ReviewModal from '@/components/roomdetail/ReviewModal';
 import superhost from '@/components/roomdetail/superhost.svg';
 import tv from '@/components/roomdetail/tv.svg';
 import wifi from '@/components/roomdetail/wifi.svg';
 import type { roomType } from '@/types/roomType';
-import { useState } from 'react';
 
 interface InfoProps {
   data: roomType;

diff --git a/src/components/roomdetail/PhotoModal.tsx b/src/components/roomdetail/PhotoModal.tsx
@@ -1,8 +1,9 @@
 import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
 import PhotoSizeSelectActualIcon from '@mui/icons-material/PhotoSizeSelectActual';
-import { Shareheart } from '@/components/roomdetail/Shareheart';
 import { useEffect } from 'react';
 
+import { Shareheart } from '@/components/roomdetail/Shareheart';
+
 const PhotoModal = ({ onClose }: { onClose: () => void }) => {
   const photos = [
     { title: '거실', icon: <PhotoSizeSelectActualIcon /> },

diff --git a/src/components/roomdetail/ReviewModal.tsx b/src/components/roomdetail/ReviewModal.tsx
@@ -1,10 +1,12 @@
-import CloseIcon from '@mui/icons-material/Close';
 import ChatBubbleOutlineIcon from '@mui/icons-material/ChatBubbleOutline';
-import clean from '@/components/roomdetail/clean.svg';
+import CloseIcon from '@mui/icons-material/Close';
+import { useEffect } from 'react';
+
 import accuracy from '@/components/roomdetail/accuracy.svg';
 import checkin from '@/components/roomdetail/checkin.svg';
-import { useEffect } from 'react';
+import clean from '@/components/roomdetail/clean.svg';
 import type { reviewType } from '@/types/reviewType';
+
 const ReviewModal = ({ onClose }: { onClose: () => void }) => {
   const reviews: reviewType[] = [
     {
@@ -81,7 +83,7 @@ const ReviewModal = ({ onClose }: { onClose: () => void }) => {
                   <span className="text-xs font-bold w-4">{rating}</span>
                   <div className="flex-1 h-1 bg-gray-200 mx-2">
                     <div
-                      className={`h-1 bg-black rounded-lg`}
+                      className="h-1 bg-black rounded-lg"
                       style={{ width: `${rating * 20}%` }}
                     ></div>
                   </div>
@@ -123,15 +125,15 @@ const ReviewModal = ({ onClose }: { onClose: () => void }) => {
               >
                 <div className="flex items-center">
                   <div className="w-8 h-8 rounded-full bg-gray-300 text-center leading-8 text-sm">
-                    {review.name?.charAt(0) ?? '?'}
+                    {review.name !== '' && review.name.charAt(0)}
                   </div>
                   <div className="ml-3">
                     <h5 className="font-medium">{review.name}</h5>
                     <p className="text-xs text-gray-500">{review.joined}</p>
                   </div>
                 </div>
                 <p className="mt-2 text-sm">{review.content}</p>
-                {review.hostReply && (
+                {review.hostReply !== '' && (
                   <div className="mt-2 ml-4 border-l-2 border-gray-300 pl-2 text-xs text-gray-600">
                     {review.hostReply}
                   </div>