Merge pull request #265 from map-of-pi/search-reviews

swoocn · web-flow · commit 3d1b6f6ac330 · 2024-10-19T22:56:19.000-04:00
Approved (1).
diff --git a/messages/en-GB.json b/messages/en-GB.json
@@ -86,7 +86,11 @@
       "REVIEWS_HEADER": "Reviews",
       "GIVE_REVIEW_SECTION_HEADER": "Give review to this pioneer",
       "REVIEWS_GIVEN_SECTION_HEADER": "Reviews given by this pioneer",
-      "REVIEWS_RECEIVED_SECTION_HEADER": "Reviews received by this pioneer"
+      "REVIEWS_RECEIVED_SECTION_HEADER": "Reviews received by this pioneer",
+      "VALIDATION": {
+        "NO_REVIEWS_FOUND": "No reviews found for Pioneer {search_value}",
+        "NO_PIONEER_FOUND": "Pioneer {search_value} not found"  
+      }
     },
     "CHECK_REVIEWS_FEEDBACK": {
       "CHECK_REVIEWS_NO_FEEDBACK_HEADER": "No reviews for {seller_id}",
diff --git a/messages/en.json b/messages/en.json
@@ -87,7 +87,11 @@
       "REVIEWS_HEADER": "Reviews",
       "GIVE_REVIEW_SECTION_HEADER": "Give review to this pioneer",
       "REVIEWS_GIVEN_SECTION_HEADER": "Reviews given by this pioneer",
-      "REVIEWS_RECEIVED_SECTION_HEADER": "Reviews received by this pioneer"
+      "REVIEWS_RECEIVED_SECTION_HEADER": "Reviews received by this pioneer",
+      "VALIDATION": {
+        "NO_REVIEWS_FOUND": "No reviews found for Pioneer {search_value}",
+        "NO_PIONEER_FOUND": "Pioneer {search_value} not found"  
+      }
     },
     "CHECK_REVIEWS_FEEDBACK": {
       "CHECK_REVIEWS_NO_FEEDBACK_HEADER": "No reviews for {seller_id}",
diff --git a/messages/es.json b/messages/es.json
@@ -86,7 +86,11 @@
       "REVIEWS_HEADER": "Reseñas",
       "GIVE_REVIEW_SECTION_HEADER": "Dar una reseña a este pionero",
       "REVIEWS_GIVEN_SECTION_HEADER": "Reseñas dadas por este pionero",
-      "REVIEWS_RECEIVED_SECTION_HEADER": "Reseñas recibidas por este pionero"
+      "REVIEWS_RECEIVED_SECTION_HEADER": "Reseñas recibidas por este pionero",
+      "VALIDATION": {
+        "NO_REVIEWS_FOUND": "No se encontraron reseñas para el Pionero {search_value}",
+        "NO_PIONEER_FOUND": "Pionero {search_value} no encontrado"
+      }
     },
     "CHECK_REVIEWS_FEEDBACK": {
       "CHECK_REVIEWS_NO_FEEDBACK_HEADER": "No hay reseñas para {seller_id}",
diff --git a/messages/ewe-BJ.json b/messages/ewe-BJ.json
@@ -86,7 +86,11 @@
       "REVIEWS_HEADER": "Nenyíawo",
       "GIVE_REVIEW_SECTION_HEADER": "No wo review kplii ame siaa",
       "REVIEWS_GIVEN_SECTION_HEADER": "Reviewwo kplii ame siaa",
-      "REVIEWS_RECEIVED_SECTION_HEADER": "Reviewwo yi le ame siaa"
+      "REVIEWS_RECEIVED_SECTION_HEADER": "Reviewwo yi le ame siaa",
+      "VALIDATION": {
+        "NO_REVIEWS_FOUND": "Mèɖu nú ŋutɔ wòàdzra Pioné {search_value}",
+        "NO_PIONEER_FOUND": "Pioné {search_value} wòɖu nɔ anyi"
+      }
     },
     "CHECK_REVIEWS_FEEDBACK": {
       "CHECK_REVIEWS_NO_FEEDBACK_HEADER": "Mèkpɔ dzudzɔkpɔkpɔ ƒe {seller_id} o",
diff --git a/messages/hau-NG.json b/messages/hau-NG.json
@@ -86,7 +86,11 @@
       "REVIEWS_HEADER": "Bita",
       "GIVE_REVIEW_SECTION_HEADER": "Ba wa wannan jagora sharhi",
       "REVIEWS_GIVEN_SECTION_HEADER": "Sharhi da aka ba wannan jagora",
-      "REVIEWS_RECEIVED_SECTION_HEADER": "Sharhi da wannan jagora ya samu"
+      "REVIEWS_RECEIVED_SECTION_HEADER": "Sharhi da wannan jagora ya samu",
+      "VALIDATION": {
+        "NO_REVIEWS_FOUND": "Ba a sami bita ga Mai-tushen {search_value} ba",
+        "NO_PIONEER_FOUND": "Ba a sami Mai-tushen {search_value} ba"
+      }
     },
     "CHECK_REVIEWS_FEEDBACK": {
       "CHECK_REVIEWS_NO_FEEDBACK_HEADER": "Babu bita don {seller_id}",
diff --git a/messages/ko.json b/messages/ko.json
@@ -86,7 +86,11 @@
       "REVIEWS_HEADER": "리뷰",
       "GIVE_REVIEW_SECTION_HEADER": "이 개척자에게 리뷰 남기기",
       "REVIEWS_GIVEN_SECTION_HEADER": "이 개척자가 남긴 리뷰",
-      "REVIEWS_RECEIVED_SECTION_HEADER": "이 개척자가 받은 리뷰"
+      "REVIEWS_RECEIVED_SECTION_HEADER": "이 개척자가 받은 리뷰",
+      "VALIDATION": {
+        "NO_REVIEWS_FOUND": "개척자 {search_value}에 대한 리뷰를 찾을 수 없습니다",
+        "NO_PIONEER_FOUND": "개척자 {search_value}를 찾을 수 없습니다"
+      }
     },
     "CHECK_REVIEWS_FEEDBACK": {
       "CHECK_REVIEWS_NO_FEEDBACK_HEADER": "{seller_id}에 대한 리뷰가 없습니다",
diff --git a/src/app/[locale]/seller/reviews/[id]/page.tsx b/src/app/[locale]/seller/reviews/[id]/page.tsx
@@ -4,7 +4,7 @@ import { useTranslations } from 'next-intl';
 import Image from 'next/image';
 import Link from 'next/link';
 import { useEffect, useState, useRef, useContext } from 'react';
-import { AppContext } from '../../../../../../context/AppContextProvider';
+import { toast } from 'react-toastify';
 import { resolveRating } from '../util/ratingUtils';
 import { OutlineBtn } from '@/components/shared/Forms/Buttons/Buttons';
 import EmojiPicker from '@/components/shared/Review/emojipicker';
@@ -15,6 +15,7 @@ import SearchIcon from '@mui/icons-material/Search';
 import { FormControl, TextField } from '@mui/material';
 import { fetchReviews } from '@/services/reviewsApi';
 import { resolveDate } from '@/utils/date';
+import { AppContext } from '../../../../../../context/AppContextProvider';
 import logger from '../../../../../../logger.config.mjs';
 
 function SellerReviews({
@@ -36,89 +37,109 @@ function SellerReviews({
   const { currentUser, setReload, reload } = useContext(AppContext);
   const inputRef = useRef<HTMLInputElement>(null);
   const [searchBarValue, setSearchBarValue] = useState('');
+  const [toUser, setToUser] = useState('');
 
   // Reusable function to process and filter reviews
-  const processReviews = (data: IReviewOutput[], userId: string): { giverReviews: ReviewInt[], receiverReviews: ReviewInt[] } => {
+  const processReviews = (data: IReviewOutput[]): ReviewInt[] => {
     const reviews = data
       .map((feedback: IReviewOutput) => {
-        if (feedback.review_giver_id === userId || feedback.review_receiver_id === userId) {
-          const { date, time } = resolveDate(feedback.review_date);
-          const { reaction, unicode } = resolveRating(feedback.rating) || {};
-
-          return {
-            heading: feedback.comment,
-            date,
-            time,
-            giver: feedback.giver,
-            receiver: feedback.receiver,
-            giverId: feedback.review_giver_id,
-            receiverId: feedback.review_receiver_id,
-            reviewId: feedback._id,
-            reaction,
-            unicode
-          };
-        }
-        return null; // Ignore irrelevant reviews
+        const { date, time } = resolveDate(feedback.review_date);
+        const { reaction, unicode } = resolveRating(feedback.rating) || {};
+        return {
+          heading: feedback.comment,
+          date,
+          time,
+          giver: feedback.giver,
+          receiver: feedback.receiver,
+          giverId: feedback.review_giver_id,
+          receiverId: feedback.review_receiver_id,
+          reviewId: feedback._id,
+          reaction,
+          unicode, 
+          image: feedback.image
+        };
       })
       .filter((review): review is ReviewInt => review !== null);
 
-    // Separate into giver and receiver reviews
-    return {
-      giverReviews: reviews.filter((review) => review.giverId === userId),
-      receiverReviews: reviews.filter((review) => review.receiverId === userId)
-    };
+    return reviews;
   };
 
-  useEffect(() => {
-    const fetchSellerReviews = async () => {
-      setError(null);
-      try {
-        logger.info(`Fetching reviews for seller ID: ${userId}`);
-        const data = await fetchReviews(userId);
+  const fetchUserReviews = async () => {
+    setError(null);
+    try {
+      logger.info(`Fetching reviews for userID: ${userId}`);
+      const data = await fetchReviews(userId);
 
-        if (data && data.length > 0) {
-          logger.info(`Fetched ${data.length} reviews for seller ID: ${userId}`);
-          const { giverReviews, receiverReviews } = processReviews(data, userId);
-          setGiverReviews(giverReviews);
-          setReceiverReviews(receiverReviews);
+      if (data) {
+        if (data.givenReviews.length > 0) {
+          logger.info(`Fetched ${data.givenReviews.length} reviews given by userID: ${userId}`);
+          setGiverReviews(processReviews(data.givenReviews));
+          setToUser(userId);
         } else {
-          logger.warn(`No reviews found for seller ID: ${userId}`);
+          logger.warn(`No given reviews found for userID: ${userId}`);
           setGiverReviews([]);
-          setReceiverReviews([]);
         }
-      } catch (error) {
-        logger.error(`Error fetching reviews for seller ID: ${userId}`, { error });
-        setError('Error fetching reviews. Please try again later.');
-      } finally {
-        setLoading(false);
-        setReload(false);
+
+        if (data.receivedReviews.length > 0) {
+          logger.info(`Fetched ${data.receivedReviews.length} reviews received by userID: ${userId}`);
+          setReceiverReviews(processReviews(data.receivedReviews));
+        } else {
+          logger.warn(`No received reviews found for userID: ${userId}`);
+          setReceiverReviews([]);
+        }          
+      } else {
+        logger.warn(`No reviews found for userID: ${userId}`);
+        setGiverReviews([]);
+        setReceiverReviews([]);
       }
-    };
+    } catch (error) {
+      logger.error(`Error fetching reviews for userID: ${userId}`, { error });
+      setError('Error fetching reviews. Please try again later.');
+    } finally {
+      setLoading(false);
+      setReload(false);
+    }
+  };
 
-    fetchSellerReviews();
-  }, [userId, currentUser, reload]);
+  useEffect(() => {
+    fetchUserReviews();
+  }, [userId, currentUser]);
 
   // Handle search logic
   const handleSearch = async () => {
     setReload(true);
     setError(null);
     try {
-      logger.info(`Searching reviews for seller ID: ${userId} with query: ${searchBarValue}`);
+      logger.info(`Searching reviews for userID: ${userId} with query: ${searchBarValue}`);
       const data = await fetchReviews(userId, searchBarValue);
 
-      if (data && data.length > 0) {
-        logger.info(`Found ${data.length} reviews for seller ID: ${userId}`);
-        const { giverReviews, receiverReviews } = processReviews(data, userId);
-        setGiverReviews(giverReviews);
-        setReceiverReviews(receiverReviews);
+      if (data) {
+        if (data.givenReviews.length > 0) {
+          logger.info(`Found ${data.givenReviews.length} reviews given by Pioneer: ${searchBarValue}`);
+          setGiverReviews(processReviews(data.givenReviews));
+          setToUser(data.givenReviews[0].review_giver_id);
+        } else {
+          logger.warn(`No given reviews found for Pioneer: ${searchBarValue}`);
+          setGiverReviews([]);
+        }
+        if (data.receivedReviews.length > 0) {
+          logger.info(`Found ${data.receivedReviews.length} reviews received by Pioneer: ${searchBarValue}`);
+          setReceiverReviews(processReviews(data.receivedReviews));
+          setToUser(data.givenReviews[0].review_receiver_id);
+        } else {
+          logger.warn(`No given reviews found for Pioneer: ${searchBarValue}`);
+          setReceiverReviews([]);
+        }
+        
       } else {
-        logger.warn(`No reviews found for seller ID: ${userId} with query: ${searchBarValue}`);
+        toast.error(t('SCREEN.REVIEWS.VALIDATION.NO_REVIEWS_FOUND', { search_value: searchBarValue }));
+        logger.warn(`No reviews found for Pioneer: ${searchBarValue}`);
         setGiverReviews([]);
         setReceiverReviews([]);
       }
     } catch (error) {
-      logger.error(`Error searching reviews for seller ID: ${userId}`, { error });
-      setError('Error searching reviews. Please try again later.');
+      logger.error(`Pioneer ${searchBarValue} not found`, { error });
+      return toast.error(t('SCREEN.REVIEWS.VALIDATION.NO_PIONEER_FOUND', { search_value: searchBarValue }));
     } finally {
       setReload(false);
     }
@@ -170,7 +191,7 @@ function SellerReviews({
 
         <ToggleCollapse header={t('SCREEN.REVIEWS.GIVE_REVIEW_SECTION_HEADER')}>
           <div>
-            <EmojiPicker sellerId={userId} setIsSaveEnabled={setIsSaveEnabled} currentUser={currentUser} setReload={setReload} />
+            <EmojiPicker sellerId={toUser} setIsSaveEnabled={setIsSaveEnabled} currentUser={currentUser} setReload={setReload} refresh={fetchUserReviews} />
           </div>
         </ToggleCollapse>      
         <ToggleCollapse header={t('SCREEN.REVIEWS.REVIEWS_GIVEN_SECTION_HEADER')}>
@@ -207,7 +228,7 @@ function SellerReviews({
                       </p>
                     </div>
                     <div className="flex justify-between items-center">
-                      <Link href={`/seller/reviews/feedback/${review.reviewId}?seller_name=${review.giver}`}>
+                      <Link href={`/seller/reviews/feedback/${review.reviewId}?user_name=${review.giver}`}>
                         <OutlineBtn label={t('SHARED.REPLY')} />
                       </Link>
                     </div>
diff --git a/src/components/shared/Review/emojipicker.tsx b/src/components/shared/Review/emojipicker.tsx
@@ -119,7 +119,8 @@ export default function EmojiPicker(props: any) {
           const newReview = await createReview(formDataToSend);
           if (newReview) {
             toast.success(t('SHARED.REACTION_RATING.VALIDATION.SUCCESSFUL_REVIEW_SUBMISSION'));
-            props.setReload(true)
+            props.setReload(true);
+            props.refresh()
             logger.info('Review submitted successfully');
           }
           resetReview();
diff --git a/src/components/shared/map/Map.tsx b/src/components/shared/map/Map.tsx
@@ -1,4 +1,5 @@
 import { useTranslations } from 'next-intl';
+import Image from 'next/image';
 import React, { useEffect, useState, useCallback, useContext, useRef } from 'react';
 import { MapContainer, Marker, Popup, TileLayer, useMapEvents } from 'react-leaflet';
 import L, { LatLngExpression, LatLngBounds, LatLngTuple } from 'leaflet';
@@ -302,7 +303,12 @@ const Map = ({
       {isSigningInUser ? (
         <div className="w-full flex-1 fixed bottom-0 h-[calc(100vh-76.19px)] left-0 right-0 bg-[#f5f1e6] ">
           <div className="flex justify-center items-center w-full h-full">
-            <img src="/default.png" width={120} height={140} alt="splashscreen" />
+            <Image 
+              src="/default.png" 
+              width={120} 
+              height={140} 
+              alt="splashscreen" 
+            />
           </div>
         </div>
       ) : (
diff --git a/src/components/shared/map/MapCenter.tsx b/src/components/shared/map/MapCenter.tsx
@@ -225,14 +225,14 @@ const MapCenter = ({ entryType }: MapCenterProps) => {
       </div>
       {/* Static Scope - should always be centered */}
       <div className="absolute z-10 pointer-events-none top-[54.2%] left-[49.4%] transform -translate-x-1/2 -translate-y-1/2 w-20 h-20 sm:w-16 sm:h-16">
-        <img
+        <Image
           src="/images/icons/scope.png"
-          alt="Scope"
           className="w-full h-full"
           style={{
             width: '65px',
             height: '65px'
           }}
+          alt="Scope"
         />
       </div>
       {showPopup && (
