From bcdc77576f40bc0963b4136471d9b1d269c6cb32 Mon Sep 17 00:00:00 2001
From: Sungho Park <43461389+psh320@users.noreply.github.com>
Date: Tue, 12 Jul 2022 00:04:43 +0900
Subject: [PATCH] Feat: add review count

---
 src/api/store.ts                             | 74 ++++++++++----------
 src/components/Map/MapReviewToggleButton.tsx |  6 +-
 src/components/Map/MapStoreReviewList.tsx    | 10 ++-
 src/components/Map/MapStoreReviewPhoto.tsx   | 12 +++-
 src/modal/StoreModal.tsx                     |  2 +
 5 files changed, 63 insertions(+), 41 deletions(-)

diff --git a/src/api/store.ts b/src/api/store.ts
index 698b3a3..7f4c5c3 100644
--- a/src/api/store.ts
+++ b/src/api/store.ts
@@ -35,14 +35,14 @@ export const getStoreData = async (storeId?: number) => {
 
 export const getStoreReviewImages = async ({pageParam = 0}, storeId?: number) => {
   const response = await customAxios().get(`/api/v1/reviews/images/${storeId}`, {
-    params: {page: pageParam, size: 3},
+    params: {page: pageParam, size: 9},
   });
   return response;
 };
 
 export const getStoreReviewList = async ({pageParam = 0}, storeId?: number) => {
   const response = await customAxios().get(`/api/v1/reviews/${storeId}`, {
-    params: {page: pageParam, size: 3},
+    params: {page: pageParam, size: 5},
   });
   return response;
 };
@@ -52,37 +52,8 @@ export const postReview = async (data: {storeId: number; rate: number; content:
   return response.data;
 };
 
-export const postReviewImages = async (imageList: imageData[], reviewId: number) => {
-  const token = await AsyncStorage.getItem('accessToken');
-  var formdata = new FormData();
-  imageList.map((image) => {
-    let photo;
-    Platform.OS === 'ios'
-      ? (photo = {
-          uri: image.uri.replace('file://', ''),
-          type: 'image/jpg',
-          name: 'image',
-        })
-      : (photo = {
-          uri: image.uri,
-          type: 'image/jpeg',
-          name: 'image',
-        });
-    formdata.append('reviewImage', photo);
-  });
-  try {
-    const response = await fetch(`https://bobpossible.shop/api/v1/reviews/me/images/${reviewId}`, {
-      method: 'POST',
-      headers: {Authorization: `Bearer ${token}`, 'Content-Type': 'multipart/form-data'},
-      body: formdata,
-    });
-    console.log('image register 성공:', response);
-  } catch (error) {
-    console.log('image register:', error);
-  }
-};
-
 // export const postReviewImages = async (imageList: imageData[], reviewId: number) => {
+//   const token = await AsyncStorage.getItem('accessToken');
 //   var formdata = new FormData();
 //   imageList.map((image) => {
 //     let photo;
@@ -99,9 +70,38 @@ export const postReviewImages = async (imageList: imageData[], reviewId: number)
 //         });
 //     formdata.append('reviewImage', photo);
 //   });
-
-//   const response = await customAxios().post(`/api/v1/reviews/me/images/${reviewId}`, formdata, {
-//     headers: {'Content-Type': 'multipart/form-data'},
-//   });
-//   return response;
+//   try {
+//     const response = await fetch(`https://bobpossible.shop/api/v1/reviews/me/images/${reviewId}`, {
+//       method: 'POST',
+//       headers: {Authorization: `Bearer ${token}`, 'Content-Type': 'multipart/form-data'},
+//       body: formdata,
+//     });
+//     console.log('image register 성공:', response);
+//   } catch (error) {
+//     console.log('image register:', error);
+//   }
 // };
+
+export const postReviewImages = async (imageList: imageData[], reviewId: number) => {
+  var formdata = new FormData();
+  imageList.map((image) => {
+    let photo;
+    Platform.OS === 'ios'
+      ? (photo = {
+          uri: image.uri.replace('file://', ''),
+          type: 'image/jpg',
+          name: 'image',
+        })
+      : (photo = {
+          uri: image.uri,
+          type: 'image/jpeg',
+          name: 'image',
+        });
+    formdata.append('reviewImage', photo);
+  });
+
+  const response = await customAxios().post(`/api/v1/reviews/me/images/${reviewId}`, formdata, {
+    headers: {'Content-Type': 'multipart/form-data'},
+  });
+  return response;
+};
diff --git a/src/components/Map/MapReviewToggleButton.tsx b/src/components/Map/MapReviewToggleButton.tsx
index db27811..7938317 100644
--- a/src/components/Map/MapReviewToggleButton.tsx
+++ b/src/components/Map/MapReviewToggleButton.tsx
@@ -6,12 +6,14 @@ type MapReviewToggleButtonProps = {
   toggleReview: () => void;
   togglePhoto: () => void;
   isReview: boolean;
+  reviewCount: number;
 };
 
 export const MapReviewToggleButton: FC<MapReviewToggleButtonProps> = ({
   toggleReview,
   togglePhoto,
   isReview,
+  reviewCount,
 }) => {
   return (
     <View style={[styles.ToggleWrap]}>
@@ -27,7 +29,9 @@ export const MapReviewToggleButton: FC<MapReviewToggleButtonProps> = ({
             {marginLeft: 34},
           ]}
         >
-          <Text style={[isReview ? styles.toggleTextOn : styles.toggleTextOff]}>리뷰 100</Text>
+          <Text style={[isReview ? styles.toggleTextOn : styles.toggleTextOff]}>
+            리뷰 {reviewCount}
+          </Text>
         </View>
       </TouchableOpacity>
     </View>
diff --git a/src/components/Map/MapStoreReviewList.tsx b/src/components/Map/MapStoreReviewList.tsx
index cd7cc59..e327f1f 100644
--- a/src/components/Map/MapStoreReviewList.tsx
+++ b/src/components/Map/MapStoreReviewList.tsx
@@ -15,9 +15,16 @@ type props = {
   isReview: boolean;
   setIsReview: React.Dispatch<React.SetStateAction<boolean>>;
   offset: Animated.Value;
+  reviewCount?: number;
 };
 
-export const MapStoreReviewList = ({storeData, isReview, setIsReview, offset}: props) => {
+export const MapStoreReviewList = ({
+  storeData,
+  isReview,
+  setIsReview,
+  offset,
+  reviewCount,
+}: props) => {
   const [photoModal, setPhotoModal] = useState(false);
   const [reviewPhoto, setReviewPhoto] = useState<{uri: string}>({uri: 'string'});
   const openPhotoModal = (imageSource: string) => {
@@ -70,6 +77,7 @@ export const MapStoreReviewList = ({storeData, isReview, setIsReview, offset}: p
               toggleReview={() => setIsReview(true)}
               togglePhoto={() => setIsReview(false)}
               isReview={isReview}
+              reviewCount={reviewCount}
             />
           </View>
         </>
diff --git a/src/components/Map/MapStoreReviewPhoto.tsx b/src/components/Map/MapStoreReviewPhoto.tsx
index 68199e5..6f9d07b 100644
--- a/src/components/Map/MapStoreReviewPhoto.tsx
+++ b/src/components/Map/MapStoreReviewPhoto.tsx
@@ -26,9 +26,16 @@ type props = {
   isReview: boolean;
   setIsReview: React.Dispatch<React.SetStateAction<boolean>>;
   offset: Animated.Value;
+  reviewCount?: number;
 };
 
-export const MapStoreReviewPhoto = ({storeData, isReview, setIsReview, offset}: props) => {
+export const MapStoreReviewPhoto = ({
+  storeData,
+  isReview,
+  setIsReview,
+  offset,
+  reviewCount,
+}: props) => {
   const [photoModal, setPhotoModal] = useState(false);
   const [reviewPhoto, setReviewPhoto] = useState<{uri: string}>({uri: 'string'});
 
@@ -82,6 +89,7 @@ export const MapStoreReviewPhoto = ({storeData, isReview, setIsReview, offset}:
               toggleReview={() => setIsReview(true)}
               togglePhoto={() => setIsReview(false)}
               isReview={isReview}
+              reviewCount={reviewCount}
             />
           </View>
         </>
@@ -89,7 +97,7 @@ export const MapStoreReviewPhoto = ({storeData, isReview, setIsReview, offset}:
       data={reviewImages.data?.pages}
       renderItem={({item}) => {
         return (
-          <View style={{flexDirection: 'row'}}>
+          <View style={{flexDirection: 'row', flexWrap: 'wrap'}}>
             {item.data.result.content.map((image: any) => (
               <TouchableOpacity onPress={() => openPhotoModal(image.imageUrl)}>
                 <View style={{borderColor: '#FFFFFF', borderWidth: 1}}>
diff --git a/src/modal/StoreModal.tsx b/src/modal/StoreModal.tsx
index d67a41f..0078488 100644
--- a/src/modal/StoreModal.tsx
+++ b/src/modal/StoreModal.tsx
@@ -75,6 +75,7 @@ const StoreModal: FC<StoreModalProps> = ({storeId, visible, closeStoreModal}) =>
             isReview={isReview}
             setIsReview={setIsReview}
             offset={offset1}
+            reviewCount={storeData.data?.reviewCount}
           />
         ) : (
           <MapStoreReviewPhoto
@@ -82,6 +83,7 @@ const StoreModal: FC<StoreModalProps> = ({storeId, visible, closeStoreModal}) =>
             isReview={isReview}
             setIsReview={setIsReview}
             offset={offset1}
+            reviewCount={storeData.data?.reviewCount}
           />
         )}
         {isReview && (