Skip to content

Commit c8989bf

Browse files
authored
Merge pull request #161 from GoHawaiiForMe/feat/#158에러수정
Feat/#158에러수정
2 parents 3f901d0 + 93c29f1 commit c8989bf

11 files changed

Lines changed: 268 additions & 214 deletions

File tree

src/components/Gnb/NavBar.tsx

Lines changed: 20 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -57,8 +57,17 @@ const getNotification = () => {
5757
};
5858

5959
const NavBar = () => {
60-
const { isLoggedIn, nickName, role, coconut, email, phoneNumber, profileImage, setLogin } =
61-
useAuthStore();
60+
const {
61+
isLoggedIn,
62+
nickName,
63+
role,
64+
coconut,
65+
setCoconut,
66+
email,
67+
phoneNumber,
68+
profileImage,
69+
setLogin,
70+
} = useAuthStore();
6271
const [isOpenSidebar, setIsOpenSidebar] = useState<boolean>(false);
6372
const [isOpenNotification, setIsOpenNotification] = useState<boolean>(false);
6473
const [isOpenUserMenu, setIsOpenUserMenu] = useState<boolean>(false);
@@ -159,14 +168,17 @@ const NavBar = () => {
159168
const avatarImage = avatarImages.find((avatar) => avatar.key === profileImage);
160169
setUserImage(avatarImage ? avatarImage.src : user_img.src);
161170
setLogin(nickName, role, coconut, email, phoneNumber, profileImage);
171+
if (userData.coconut !== coconut) {
172+
handleCoconutChange(userData.coconut);
173+
}
162174
} catch (error) {
163175
console.error(error);
164176
}
165177
};
166178

167179
fetchUserInfo();
168180
}
169-
}, [setLogin]);
181+
}, [setLogin, coconut]);
170182

171183
useEffect(() => {
172184
const handleOutsideClick = (event: MouseEvent) => {
@@ -201,13 +213,17 @@ const NavBar = () => {
201213
};
202214
}, [isOpenUserMenu, isOpenNotification, isOpenSidebar]);
203215

216+
const handleCoconutChange = (newCoconut: number) => {
217+
setCoconut(newCoconut);
218+
};
219+
204220
const hasUnreadNotifications = notificationData.some((notification) => !notification.isRead);
205221
const hasNotifications = realTimeNotifications.length > 0;
206222

207223
return (
208224
<div className="z-40 flex items-center justify-between border-b-2 border-color-line-100 bg-color-background-100 px-24 py-6 mobile:px-4 tablet:px-5 mobile-tablet:py-3">
209225
<div className="flex items-center">
210-
<div className="mr-14 text-2xl bold mobile-tablet:mr-0">
226+
<div className="bold mr-14 text-2xl mobile-tablet:mr-0">
211227
<Link href={NavigationPath.LANDING}>
212228
<Image src={logo} width={100} alt="니가가라하와이 로고" />
213229
</Link>

src/components/Landing/MapMarker.tsx

Lines changed: 31 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -108,9 +108,11 @@ export default function MapMarker() {
108108
return (
109109
<>
110110
<div className="bold mb-7 mt-7 flex justify-center">
111-
<h1 className="mb-10 mt-24 animate-bounce text-4xl">🛬 사용자 이용현황 🛬</h1>
111+
<h1 className="mb-10 mt-24 animate-bounce text-4xl mobile-tablet:text-2xl">
112+
🛬 사용자 이용현황 🛬
113+
</h1>
112114
</div>
113-
<div className="pc:-mr-16 pc:-ml-10 flex items-center rounded-xl bg-color-blue-400 bg-opacity-15 mobile-tablet:ml-0 mobile-tablet:flex-col">
115+
<div className="flex items-center rounded-xl bg-color-blue-400 bg-opacity-15 pc:-ml-10 pc:-mr-16 mobile-tablet:ml-0 mobile-tablet:flex-col">
114116
{/* 지도 */}
115117
<div className="sw-full mobile-tablet:order-2">
116118
<ComposableMap
@@ -158,35 +160,37 @@ export default function MapMarker() {
158160
{/* 통계 */}
159161
<div className="flex h-[400px] w-1/3 flex-col items-center rounded-xl bg-color-gray-50 p-4 shadow-2xl hover:scale-[1.05] pc:-ml-5 mobile-tablet:order-1 mobile-tablet:mt-10 mobile-tablet:w-[400px]">
160162
{selectedRegion ? (
161-
162163
<>
163-
<h2 className="text-lg bold">{regionNames[selectedRegion.name]} 통계</h2>
164+
<h2 className="bold text-lg">{regionNames[selectedRegion.name]} 통계</h2>
164165
<p>총 서비스 수: {selectedRegion.totalCount}</p>
165-
{ selectedRegion.totalCount === 0 ? (
166-
<div className="flex h-full w-full items-center justify-center">
167-
<p className="text-lg bold text-center">통계 자료가 없습니다!<br/>여러분의 꿈을 추가해 보세요! 🚀</p>
168-
</div>
169-
) : (
170-
<PieChart width={300} height={300}>
171-
<Pie
172-
data={selectedRegion.details}
173-
dataKey="value"
174-
nameKey="name"
175-
cx="50%"
176-
cy="50%"
177-
outerRadius={80}
178-
label
179-
>
180-
{selectedRegion.details.map((entry, index) => (
181-
<Cell key={`cell${index}`} fill={entry.fill} />
182-
))}
183-
</Pie>
184-
<Tooltip />
185-
</PieChart>
186-
)}
166+
{selectedRegion.totalCount === 0 ? (
167+
<div className="flex h-full w-full items-center justify-center">
168+
<p className="bold text-center text-lg">
169+
통계 자료가 없습니다!
170+
<br />
171+
여러분의 꿈을 추가해 보세요! 🚀
172+
</p>
173+
</div>
174+
) : (
175+
<PieChart width={300} height={300}>
176+
<Pie
177+
data={selectedRegion.details}
178+
dataKey="value"
179+
nameKey="name"
180+
cx="50%"
181+
cy="50%"
182+
outerRadius={80}
183+
label
184+
>
185+
{selectedRegion.details.map((entry, index) => (
186+
<Cell key={`cell${index}`} fill={entry.fill} />
187+
))}
188+
</Pie>
189+
<Tooltip />
190+
</PieChart>
191+
)}
187192
<p className="text-sm">마커를 클릭하면 해당 지역 통계를 볼 수 있습니다.</p>
188193
</>
189-
190194
) : (
191195
<p>마커를 클릭하면 해당 지역 통계를 볼 수 있습니다.</p>
192196
)}

src/features/DetailMaker.tsx

Lines changed: 69 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -171,17 +171,18 @@ export default function RequestDetailDreamer() {
171171
}, [isPlaceholderData, currentPage, itemsPerPage, totalItems, makerId, queryClient]);
172172

173173
const handleKakaoShare = () => {
174+
if (typeof window === "undefined") return;
175+
174176
const currentUrl = window.location.href;
175-
if (typeof window !== "undefined" && window.Kakao) {
176-
const Kakao = window.Kakao;
177-
Kakao.Share.createDefaultButton({
178-
container: "#kakaotalk-sharing-btn",
177+
if (window.Kakao) {
178+
window.Kakao.Share.sendDefault({
179179
objectType: "feed",
180180
content: {
181-
title: makerProfileInfo?.nickName || "Maker님",
182-
description: makerProfileInfo?.description || "여행 플랜 상세내용보기",
183-
imageUrl:
184-
"https://scontent-ssn1-1.cdninstagram.com/v/t51.29350-15/440535983_1166519591460822_7666710914928913519_n.jpg?stp=dst-jpg_e35_s1080x1080_tt6&_nc_ht=scontent-ssn1-1.cdninstagram.com&_nc_cat=106&_nc_ohc=CzF6FbL6gvEQ7kNvgHzHfiF&_nc_gid=947375cfb83d43c5abb8aeacb63ed59a&edm=ANTKIIoBAAAA&ccb=7-5&oh=00_AYDtqZ0h00aA8oATSGX48sg79D3ROGTLYUaZSjkcbYafCQ&oe=67A60D41&_nc_sid=d885a2",
181+
title: makerProfileInfo?.nickName || "Maker님" + " Maker님",
182+
description: makerProfileInfo?.description || "Maker의 설명",
183+
imageUrl: "https://ifh.cc/g/wvkbqP.png",
184+
imageWidth: 400,
185+
imageHeight: 200,
185186
link: {
186187
mobileWebUrl: currentUrl,
187188
webUrl: currentUrl,
@@ -190,30 +191,15 @@ export default function RequestDetailDreamer() {
190191
});
191192
}
192193
};
194+
193195
useEffect(() => {
194196
if (makerProfileInfo) {
195197
setIsFollowed(makerProfileInfo.isFollowed);
196198
}
197199
}, [makerProfileInfo]);
198200

199201
const handleFacebookShare = () => {
200-
if (typeof window !== "undefined" && window.FB) {
201-
const shareUrl = `https://fs2-4-team2-go-for-me.vercel.app/maker-detail/${makerId}`;
202-
203-
window.FB.ui(
204-
{
205-
method: "share",
206-
href: shareUrl,
207-
},
208-
(response) => {
209-
if (response) {
210-
alert("공유를 성공했습니다!");
211-
} else {
212-
console.error("공유 실패 - URL:", shareUrl);
213-
}
214-
},
215-
);
216-
}
202+
return window.open(`http://www.facebook.com/sharer/sharer.php?u=${location.href}`);
217203
};
218204

219205
const sharePromptContent = (
@@ -230,15 +216,16 @@ export default function RequestDetailDreamer() {
230216
);
231217

232218
return (
233-
<> <style>
234-
{`
219+
<>
220+
<style>
221+
{`
235222
@media (min-width: 744px) and (max-width: 2700px) {
236223
.main-container {
237224
padding: 0 24px;
238225
}
239226
}
240227
`}
241-
</style>
228+
</style>
242229
<div className="relative mt-20 grid w-full grid-cols-7 gap-10 mobile-tablet:flex mobile-tablet:flex-col">
243230
{/* 왼쪽 열 */}
244231
<div className="col-span-5 flex flex-col">
@@ -314,7 +301,7 @@ export default function RequestDetailDreamer() {
314301
</div>
315302
</div>
316303
<div className="flex flex-col gap-10 mobile-tablet:gap-10">
317-
<hr className="border-color-line-100 mt-10" />
304+
<hr className="mt-10 border-color-line-100" />
318305
<div>
319306
<div className="pc:hidden">{sharePromptContent}</div>
320307
</div>
@@ -346,64 +333,14 @@ export default function RequestDetailDreamer() {
346333
<p className="bold mb-8 text-2xl text-color-black-400 mobile-tablet:text-lg">
347334
서비스 가능 지역
348335
</p>
336+
349337
<Selector
350338
category="locations"
351339
selectedTypes={makerProfileInfo?.serviceArea ?? []}
352340
data={filteredLocations}
353-
className="flex gap-4"
341+
className="flex w-full gap-4 mobile-tablet:w-full"
354342
/>
355343
</div>
356-
<div>
357-
<div>
358-
<p className="mb-8 text-lg bold">리뷰({makerProfileInfo?.totalReviews})</p>
359-
<div className="mb-10 flex items-center justify-center gap-10 mobile:flex-col">
360-
<div className="flex flex-col items-center justify-center gap-4">
361-
<div className="flex items-end gap-2">
362-
<p className="text-[64px] bold leading-[76.38px]">
363-
{makerProfileInfo?.averageRating}
364-
</p>
365-
<p className="text-[38px] leading-[45.38px] text-color-gray-100">/5</p>
366-
</div>
367-
<div className="flex justify-end">
368-
<StarRating
369-
initialRating={Number(makerProfileInfo?.averageRating)}
370-
readonly={true}
371-
/>
372-
</div>
373-
</div>
374-
<div className="rounded-[16px] bg-color-background-200 px-[22px] py-4 shadow-md">
375-
<ReviewGraph reviewStats={reviewStats} />
376-
</div>
377-
</div>
378-
</div>
379-
{findMakerReview?.list && findMakerReview.list.length > 0 && (
380-
<>
381-
{findMakerReview?.list?.map((review, index) => (
382-
<div key={index} className="border-b border-color-line-100 py-8">
383-
<div className="flex items-center gap-3">
384-
<p className="border-r border-color-line-200 pr-3 text-md">
385-
{review.writer.nickName}
386-
</p>
387-
<p className="text-md text-color-gray-300">
388-
{formatToSimpleDate(review.createdAt)}
389-
</p>
390-
</div>
391-
<div className="mb-4 mt-2">
392-
<StarRating type={true} initialRating={review.rating} readonly={true} />
393-
</div>
394-
<p className="text-2lg">{review.content}</p>
395-
</div>
396-
))}
397-
<div className="my-8 mobile-tablet:mb-[104px]">
398-
<Pagination
399-
currentPage={currentPage}
400-
totalPages={totalPages}
401-
onPageChange={handlePageChange}
402-
/>
403-
</div>
404-
</>
405-
)}
406-
</div>
407344
</div>
408345
</div>
409346

@@ -451,6 +388,57 @@ export default function RequestDetailDreamer() {
451388
</div>
452389
</div>
453390
</div>
391+
<div>
392+
<div>
393+
<p className="bold mb-8 text-lg pc:mt-12">리뷰({makerProfileInfo?.totalReviews})</p>
394+
<div className="mb-10 flex items-center justify-center gap-10 mobile:flex-col">
395+
<div className="flex flex-col items-center justify-center gap-4">
396+
<div className="flex items-end gap-2">
397+
<p className="bold text-[64px] leading-[76.38px]">
398+
{makerProfileInfo?.averageRating}
399+
</p>
400+
<p className="text-[38px] leading-[45.38px] text-color-gray-100">/5</p>
401+
</div>
402+
<div className="flex justify-end">
403+
<StarRating
404+
initialRating={Number(makerProfileInfo?.averageRating)}
405+
readonly={true}
406+
/>
407+
</div>
408+
</div>
409+
<div className="rounded-[16px] bg-color-background-200 px-[22px] py-4 shadow-md mobile-tablet:mb-[104px]">
410+
<ReviewGraph reviewStats={reviewStats} />
411+
</div>
412+
</div>
413+
</div>
414+
{findMakerReview?.list && findMakerReview.list.length > 0 && (
415+
<>
416+
{findMakerReview?.list?.map((review, index) => (
417+
<div key={index} className="border-b border-color-line-100 py-8">
418+
<div className="flex items-center gap-3">
419+
<p className="border-r border-color-line-200 pr-3 text-md">
420+
{review.writer.nickName}
421+
</p>
422+
<p className="text-md text-color-gray-300">
423+
{formatToSimpleDate(review.createdAt)}
424+
</p>
425+
</div>
426+
<div className="mb-4 mt-2">
427+
<StarRating type={true} initialRating={review.rating} readonly={true} />
428+
</div>
429+
<p className="text-2lg">{review.content}</p>
430+
</div>
431+
))}
432+
<div className="my-8 mobile-tablet:mb-[104px]">
433+
<Pagination
434+
currentPage={currentPage}
435+
totalPages={totalPages}
436+
onPageChange={handlePageChange}
437+
/>
438+
</div>
439+
</>
440+
)}
441+
</div>
454442
{isLoginModalOpen && (
455443
<div>
456444
<ModalLayout label="알림" closeModal={() => setIsLoginModalOpen(false)}>

src/features/ProfileDreamer.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ export default function ProfileDreamer() {
4444
},
4545
onSuccess: () => {
4646
removeOAuthToken();
47+
alert("Dreamer님 가입을 축하드립니다!");
4748
router.push("/login");
4849
},
4950
onError: (error: any) => {

0 commit comments

Comments
 (0)