Dev

src/api/delete.ts

@@ -4,3 +4,8 @@ import { deleteInstance } from './axios';
 //검색 결과 반환
 export const deleteSearchWords = async (body: any) =>
   await deleteInstance('/searchWords', body);
+//WishList Controller
+
+//검색 결과 반환
+export const deleteWishLists = async (counselorId: number) =>
+  await deleteInstance(`/wishLists?counselorId=${counselorId}`);

src/api/patch.ts

@@ -36,3 +36,8 @@ export const patchReviews = async (body: any) =>
 //검색 결과 반환
 export const patchSearchWordsResults = async (sortType: string, body: any) =>
   await patchInstance(`/searchWords/results?sortType=${sortType}`, body);
+
+//Wishlist Controlloer
+//찜하기 추가
+export const patchWishLists = async (counselorId: number) =>
+  await patchInstance(`/wishLists?counselorId=${counselorId}`);

src/api/post.ts

@@ -38,3 +38,8 @@ export const postLetterMessageFirstQustion = async (body: any) =>
 // 퀴즈 통과 여부 수정
 export const postIsPassQuiz = async (body: any, parmas: any) =>
   await postInstance('counselors/quiz', body, parmas);
+
+//Wishlist Controlloer
+//찜하기 목록 가져오기
+export const postWishLists = async (body: any) =>
+  await postInstance('/wishLists', body);

src/components/Buyer/BuyerAvailCounselor/AvailCounselorSearchResult.tsx

@@ -12,21 +12,13 @@ interface AvailCounselorSearchResultsProps {
 export const AvailCounselorSearchResults = ({
   searchData,
 }: AvailCounselorSearchResultsProps) => {
-  //찜하기 배열 init
-  const initialBookmarkStates = searchData.map(
-    (data) => data.isWishList || false,
-  );
-  const [bookmarkStates, setBookmarkStates] = useState<boolean[]>(
-    initialBookmarkStates,
-  );
   return (
     <Wrapper>
       {searchData.map((value, index) => {
         return (
           <ReadyConsultCard
             // 나중에 id로 변경
             key={index}
-            index={index}
             counselorId={value.counselorId}
             tagList={AppendCategoryType(
               value.consultCategories,
@@ -37,8 +29,7 @@ export const AvailCounselorSearchResults = ({
             introduction={value.introduction}
             nickname={value.nickname}
             level={value.level}
-            bookmarkStates={bookmarkStates}
-            setBookmarkStates={setBookmarkStates}
+            isWishList={value.isWishList}
             rating={value.ratingAverage}
             totalReview={value.totalReview}
             consultType={value.consultTypes}

src/components/Buyer/BuyerCategoryResult/CategorySearchResult.tsx

@@ -24,9 +24,7 @@ export const CategorySearchResults = ({
       {searchData.map((value, index) => {
         return (
           <ReadyConsultCard
-            // 나중에 id로 변경
-            key={index}
-            index={index}
+            key={value.counselorId}
             counselorId={value.counselorId}
             tagList={AppendCategoryType(
               value.consultCategories,
@@ -37,8 +35,7 @@ export const CategorySearchResults = ({
             introduction={value.introduction}
             nickname={value.nickname}
             level={value.level}
-            bookmarkStates={bookmarkStates}
-            setBookmarkStates={setBookmarkStates}
+            isWishList={value.isWishList}
             rating={value.ratingAverage}
             totalReview={value.totalReview}
             consultType={value.consultTypes}

src/components/Buyer/BuyerCounselorProfile/CounselorReview.tsx

@@ -1,8 +1,8 @@
 import { getReviews } from 'api/get';
-import { useEffect, useState } from 'react';
+import { useEffect, useLayoutEffect, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import styled from 'styled-components';
-import { Grey1, Grey4, Grey6 } from 'styles/color';
+import { Grey1, Grey6 } from 'styles/color';
 import { Body1, Body2, Body3, Heading } from 'styles/font';
 import { HeartRate } from 'utils/HeartRate';
 import { Review } from 'utils/type';
@@ -17,7 +17,8 @@ export const CounselorReview = ({ counselorId }: CounselorReviewProps) => {
   const navigate = useNavigate();
   const [reviews, setReviews] = useState<Review[]>([]);
   const [isLoading, setIsLoading] = useRecoilState(isLoadingState);
-  useEffect(() => {
+
+  useLayoutEffect(() => {
     const fetchReviewData = async () => {
       setIsLoading(true);
       const params = {
@@ -30,8 +31,9 @@ export const CounselorReview = ({ counselorId }: CounselorReviewProps) => {
         alert('존재하지 않는 상담사의 리뷰 요청입니다.');
         navigate('/buyer');
       }
-      console.log(isLoading);
-      setIsLoading(false);
+      setTimeout(() => {
+        setIsLoading(false);
+      }, 1);
     };
     fetchReviewData();
   }, []);

src/components/Buyer/BuyerHome/HomeConsultInReady.tsx

@@ -2,8 +2,7 @@ import styled from 'styled-components';
 import { Subtitle } from 'styles/font';
 import { ReactComponent as More } from 'assets/icons/icon-more.svg';
 import { ReadyConsultCard } from '../Common/ReadyConsultCard';
-import { useState } from 'react';
-import { counselorDummyData as dummy } from 'utils/buyerDummy';
+
 import { useNavigate } from 'react-router-dom';
 import { SearchResultData } from 'utils/type';
 import { consultStyleToCharNum } from 'utils/convertStringToCharNum';
@@ -13,11 +12,6 @@ interface HomeConsultInReadyProps {
 }
 export const HomeConsultInReady = ({ searchData }: HomeConsultInReadyProps) => {
   const navigate = useNavigate();
-  //consult type은 1이면 편지,2 면 채팅 3이면 둘다
-  const initialBookmarkStates = dummy.map((data) => data.isBookmarked || false);
-  const [bookmarkStates, setBookmarkStates] = useState<boolean[]>(
-    initialBookmarkStates,
-  );
 
   return (
     <Wrapper>
@@ -36,9 +30,7 @@ export const HomeConsultInReady = ({ searchData }: HomeConsultInReadyProps) => {
         if (index <= 2) {
           return (
             <ReadyConsultCard
-              // 나중에 id로 변경
-              key={index}
-              index={index}
+              key={value.counselorId}
               counselorId={value.counselorId}
               tagList={AppendCategoryType(
                 value.consultCategories,
@@ -49,8 +41,7 @@ export const HomeConsultInReady = ({ searchData }: HomeConsultInReadyProps) => {
               introduction={value.introduction}
               nickname={value.nickname}
               level={value.level}
-              bookmarkStates={bookmarkStates}
-              setBookmarkStates={setBookmarkStates}
+              isWishList={value.isWishList}
               rating={value.ratingAverage}
               totalReview={value.totalReview}
               consultType={value.consultTypes}

src/components/Buyer/BuyerPayment/PaymentCard.tsx

@@ -7,6 +7,7 @@ import styled from 'styled-components';
 import { Green, Grey1, Grey3, Grey6, White } from 'styles/color';
 import { Body1, Body3 } from 'styles/font';
 import { isPaymentModalOpenState } from 'utils/atom';
+import { ConsultState } from 'utils/type';
 interface PaymentCardProps {
   counselorId: number;
   nickname: string;
@@ -80,6 +81,7 @@ export const PaymentCard = ({
                 onClick={() => {
                   setIsModalOpen(true);
                 }}
+                buttonTextType={2}
               />
             </div>
             <Space height="1.6rem" />