From 417c0483279eaf4cd949e7791132f82094ff2ee4 Mon Sep 17 00:00:00 2001 From: stopmin Date: Sun, 21 Jul 2024 06:20:36 +0900 Subject: [PATCH 01/12] =?UTF-8?q?feat:=20=EA=B8=B0=EC=82=AC=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EA=B5=AC=EC=84=B1=20#104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/village/[id]/page.tsx | 53 +++++++++++++++++++++++++++++++++++ src/components/Headline.tsx | 8 +++--- src/mocks/villages.ts | 4 ++- 3 files changed, 60 insertions(+), 5 deletions(-) create mode 100644 src/app/village/[id]/page.tsx diff --git a/src/app/village/[id]/page.tsx b/src/app/village/[id]/page.tsx new file mode 100644 index 0000000..c6bb73e --- /dev/null +++ b/src/app/village/[id]/page.tsx @@ -0,0 +1,53 @@ +import Image from 'next/image'; + +import { Box, Card, CardContent, Stack, Typography } from '@mui/material'; + +import CommentCard from '@/components/CommentCard'; +import GradientBox from '@/components/GradientBox'; +import Headline from '@/components/Headline'; +import TooltipText from '@/components/TooltipText'; +import color from '@/constants/color'; +import hiddenGems from '@/mocks/villages'; + +const Page = async ({ params }: { params: { id: number } }) => { + // const article = await getArticle(params.id); + // const { data } = article; + const village = hiddenGems[params.id]; + + return ( + + + + + + + + + {village.imageUrl && ( + articleImage + )} + + + + + {village.content} + + + + + + + + + + ); +}; + +export default Page; diff --git a/src/components/Headline.tsx b/src/components/Headline.tsx index f5330dd..acfc5f8 100644 --- a/src/components/Headline.tsx +++ b/src/components/Headline.tsx @@ -2,9 +2,9 @@ import { Box, Typography, Stack } from '@mui/material'; interface HeadlineProps { title: string; - uploadDate: string; - viewCount: number; - source: string; + uploadDate?: string; + viewCount?: number; + source?: string; } const Headline = ({ title, uploadDate, viewCount, source }: HeadlineProps) => { @@ -15,7 +15,7 @@ const Headline = ({ title, uploadDate, viewCount, source }: HeadlineProps) => { - {uploadDate} | 조회 {viewCount}회 | {source} + {uploadDate || '날짜 없음'} | 조회 {viewCount !== undefined ? viewCount : '0'}회 | {source || '출처 없음'} diff --git a/src/mocks/villages.ts b/src/mocks/villages.ts index 95e13df..bab6e4b 100644 --- a/src/mocks/villages.ts +++ b/src/mocks/villages.ts @@ -1,4 +1,6 @@ -const hiddenGems = [ +import { Village } from '@/types'; + +const hiddenGems: Village[] = [ { id: 1, title: '정선 아우라지마을', From ee1273af00e22105a0f14738d3e9eee1d2faa5a3 Mon Sep 17 00:00:00 2001 From: stopmin Date: Sun, 21 Jul 2024 06:32:54 +0900 Subject: [PATCH 02/12] =?UTF-8?q?feat:=20=EA=B8=B0=EC=82=AC=20=EB=B0=91?= =?UTF-8?q?=EC=97=90=20=EC=A7=80=EB=8F=84=20=EC=B6=94=EA=B0=80=20=EB=B0=8F?= =?UTF-8?q?=20=ED=97=A4=EB=93=9C=EB=9D=BC=EC=9D=B8=20=EC=84=A4=EC=A0=95=20?= =?UTF-8?q?#104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/village/[id]/page.tsx | 14 +++++++++----- src/components/Headline.tsx | 3 ++- 2 files changed, 11 insertions(+), 6 deletions(-) diff --git a/src/app/village/[id]/page.tsx b/src/app/village/[id]/page.tsx index c6bb73e..5d05674 100644 --- a/src/app/village/[id]/page.tsx +++ b/src/app/village/[id]/page.tsx @@ -1,3 +1,5 @@ +'use client'; + import Image from 'next/image'; import { Box, Card, CardContent, Stack, Typography } from '@mui/material'; @@ -5,13 +7,11 @@ import { Box, Card, CardContent, Stack, Typography } from '@mui/material'; import CommentCard from '@/components/CommentCard'; import GradientBox from '@/components/GradientBox'; import Headline from '@/components/Headline'; -import TooltipText from '@/components/TooltipText'; +import KakaoMap from '@/components/KakaoMap'; import color from '@/constants/color'; import hiddenGems from '@/mocks/villages'; const Page = async ({ params }: { params: { id: number } }) => { - // const article = await getArticle(params.id); - // const { data } = article; const village = hiddenGems[params.id]; return ( @@ -19,7 +19,7 @@ const Page = async ({ params }: { params: { id: number } }) => { - + @@ -43,9 +43,13 @@ const Page = async ({ params }: { params: { id: number } }) => { - + + + + + ); }; diff --git a/src/components/Headline.tsx b/src/components/Headline.tsx index acfc5f8..6ff7895 100644 --- a/src/components/Headline.tsx +++ b/src/components/Headline.tsx @@ -15,7 +15,8 @@ const Headline = ({ title, uploadDate, viewCount, source }: HeadlineProps) => { - {uploadDate || '날짜 없음'} | 조회 {viewCount !== undefined ? viewCount : '0'}회 | {source || '출처 없음'} + {uploadDate} + {source && ` | 조회 ${viewCount}회 | ${source}`} From b0b5cfeb168d74a3d43ee5f72d6accdaac753e75 Mon Sep 17 00:00:00 2001 From: stopmin Date: Sun, 21 Jul 2024 06:36:14 +0900 Subject: [PATCH 03/12] =?UTF-8?q?feat:=20=EB=A7=90=ED=92=8D=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80=20#104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/village/[id]/page.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/app/village/[id]/page.tsx b/src/app/village/[id]/page.tsx index 5d05674..af074fa 100644 --- a/src/app/village/[id]/page.tsx +++ b/src/app/village/[id]/page.tsx @@ -21,6 +21,7 @@ const Page = async ({ params }: { params: { id: number } }) => { + {village.imageUrl && ( From 2cd0a81f16be2ad5913ebe1d72e91cf8d9eaf10a Mon Sep 17 00:00:00 2001 From: stopmin Date: Mon, 22 Jul 2024 00:52:20 +0900 Subject: [PATCH 04/12] =?UTF-8?q?feat:=20=ED=97=A4=EB=93=9C=EB=9D=BC?= =?UTF-8?q?=EC=9D=B8=20=EC=9B=90=EB=B3=B5=20#104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/village/[id]/page.tsx | 2 +- src/components/Headline.tsx | 9 ++++----- 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/src/app/village/[id]/page.tsx b/src/app/village/[id]/page.tsx index af074fa..8c2c85a 100644 --- a/src/app/village/[id]/page.tsx +++ b/src/app/village/[id]/page.tsx @@ -19,7 +19,7 @@ const Page = async ({ params }: { params: { id: number } }) => { - + diff --git a/src/components/Headline.tsx b/src/components/Headline.tsx index 6ff7895..f5330dd 100644 --- a/src/components/Headline.tsx +++ b/src/components/Headline.tsx @@ -2,9 +2,9 @@ import { Box, Typography, Stack } from '@mui/material'; interface HeadlineProps { title: string; - uploadDate?: string; - viewCount?: number; - source?: string; + uploadDate: string; + viewCount: number; + source: string; } const Headline = ({ title, uploadDate, viewCount, source }: HeadlineProps) => { @@ -15,8 +15,7 @@ const Headline = ({ title, uploadDate, viewCount, source }: HeadlineProps) => { - {uploadDate} - {source && ` | 조회 ${viewCount}회 | ${source}`} + {uploadDate} | 조회 {viewCount}회 | {source} From e7fa2f542e64c29f967ca5cc71f4a59b68c6a876 Mon Sep 17 00:00:00 2001 From: stopmin Date: Mon, 22 Jul 2024 01:24:29 +0900 Subject: [PATCH 05/12] =?UTF-8?q?feat:=20KakaoMap=20=EC=88=98=EC=A0=95=20#?= =?UTF-8?q?104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/village/page.tsx | 2 +- src/components/KakaoMap.tsx | 9 ++++++--- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/src/app/village/page.tsx b/src/app/village/page.tsx index 696ebc2..65cab7f 100644 --- a/src/app/village/page.tsx +++ b/src/app/village/page.tsx @@ -49,7 +49,7 @@ const Page = () => { 지도에서 보는 마을 - + {villages.slice(3).map((filteredItem) => ( diff --git a/src/components/KakaoMap.tsx b/src/components/KakaoMap.tsx index 92c6532..70f3247 100644 --- a/src/components/KakaoMap.tsx +++ b/src/components/KakaoMap.tsx @@ -16,10 +16,13 @@ interface Village { } interface KakaoMapProps { + initialLat: number; + initialLon: number; + level: number; villages: Village[]; } -const KakaoMap = ({ villages }: KakaoMapProps) => { +const KakaoMap = ({ villages, initialLat, initialLon, level }: KakaoMapProps) => { useEffect(() => { const initializeMap = () => { const container = document.getElementById('map'); @@ -28,8 +31,8 @@ const KakaoMap = ({ villages }: KakaoMapProps) => { } const options = { - center: new window.kakao.maps.LatLng(36.5, 127.5), - level: 13, + center: new window.kakao.maps.LatLng(initialLat, initialLon), + level, }; const map = new window.kakao.maps.Map(container, options); From 7528294e8b523577e085f50eddbb834c042c944f Mon Sep 17 00:00:00 2001 From: stopmin Date: Mon, 22 Jul 2024 01:28:27 +0900 Subject: [PATCH 06/12] feat: latitude, longitude #104 --- src/app/village/[id]/page.tsx | 2 +- src/components/KakaoMap.tsx | 6 +++--- src/mocks/villages.ts | 20 ++++++++++---------- src/types.ts | 4 ++-- 4 files changed, 16 insertions(+), 16 deletions(-) diff --git a/src/app/village/[id]/page.tsx b/src/app/village/[id]/page.tsx index 8c2c85a..90f1f78 100644 --- a/src/app/village/[id]/page.tsx +++ b/src/app/village/[id]/page.tsx @@ -49,7 +49,7 @@ const Page = async ({ params }: { params: { id: number } }) => { - + ); diff --git a/src/components/KakaoMap.tsx b/src/components/KakaoMap.tsx index 70f3247..0903e27 100644 --- a/src/components/KakaoMap.tsx +++ b/src/components/KakaoMap.tsx @@ -11,8 +11,8 @@ interface Village { title: string; content: string; imageUrl: string; - x: number; - y: number; + latitude: number; + longitude: number; } interface KakaoMapProps { @@ -37,7 +37,7 @@ const KakaoMap = ({ villages, initialLat, initialLon, level }: KakaoMapProps) => const map = new window.kakao.maps.Map(container, options); villages.forEach((village) => { - const markerPosition = new window.kakao.maps.LatLng(village.x, village.y); + const markerPosition = new window.kakao.maps.LatLng(village.latitude, village.longitude); const marker = new window.kakao.maps.Marker({ position: markerPosition, }); diff --git a/src/mocks/villages.ts b/src/mocks/villages.ts index bab6e4b..63312a0 100644 --- a/src/mocks/villages.ts +++ b/src/mocks/villages.ts @@ -8,8 +8,8 @@ const hiddenGems: Village[] = [ '정선 아우라지마을은 예쁜 계곡과 맑은 물로 유명한 곳이에요. ⛲\n이곳은 과거부터 민속촌 같은 분위기로 많은 이들이 찾아오는 명소였어요. 맑은 물과 푸른 자연 속에서 즐기는 여유로운 시간은 정말 특별해요. 특히, 여름에는 계곡에서 물놀이를 즐기기 좋고, 가을에는 단풍이 아름다워 산책하기 좋은 곳이에요. 🍁\n하지만 최근 몇 년 동안 관광객이 줄어들면서 마을 경제가 많이 어려워졌어요. 마을 주민들은 생계를 위해 힘든 시간을 보내고 있으며, 전통 문화를 유지하는데 어려움을 겪고 있어요. 😢\n우리가 이 아름다운 마을을 지키기 위해 더 많은 관심을 가져야 해요. 주말에 친구들과 함께 정선 아우라지마을을 방문해보세요. 맑은 공기와 아름다운 자연 속에서 힐링할 수 있을 거예요. 🌿', imageUrl: 'https://search.pstatic.net/common/?src=http%3A%2F%2Fblogfiles.naver.net%2FMjAyMDA4MjhfMjk0%2FMDAxNTk4NTg0NjU1NTQ2.Qu9sBGDkKOZ2KB7zm-cjwpKvA38o_ESEQ_Mnr-vyorsg.FMa1HkUp8kWxipC36WXSC6OlQpDF1YdKFp7B9jW3LfAg.PNG.lightboxlab%2FThumbnail.png&type=sc960_832', - x: 37.3793, - y: 128.6616, + latitude: 37.3793, + longitude: 128.6616, publishedAt: '2024-07-20', }, { @@ -19,8 +19,8 @@ const hiddenGems: Village[] = [ '청송 주왕산마을은 주왕산 국립공원 근처에 위치해 있어 멋진 자연 경관을 자랑해요. 🌄\n이곳은 사계절 내내 아름다운 풍경을 자랑하며, 특히 가을에는 단풍이 절경을 이루어 많은 사람들이 찾았던 곳이에요. 🍂\n그러나 최근 몇 년 동안 관광객이 급감하면서 마을 상권이 침체되어 많은 가게들이 문을 닫았어요. 주왕산의 아름다움을 즐기고 마을 주민들을 도와주기 위해 많은 이들이 방문해주었으면 해요. 😔\n주왕산마을에서 하이킹을 즐기고, 맑은 공기를 마시며 자연 속에서 힐링하는 시간을 가져보세요. 그리고 마을에서 운영하는 작은 상점과 카페들을 방문해 지역 경제에도 도움을 주었으면 좋겠어요. 🍃', imageUrl: 'https://search.pstatic.net/common/?src=http%3A%2F%2Fblogfiles.naver.net%2F20130124_272%2Fsung1735_1359006236881C5jrX_JPEG%2FKSS_8232.jpg&type=sc960_832', - x: 36.3446, - y: 129.0571, + latitude: 36.3446, + longitude: 129.0571, publishedAt: '2024-07-20', }, { @@ -30,8 +30,8 @@ const hiddenGems: Village[] = [ '양구 두타연마을은 아름다운 계곡과 울창한 숲으로 유명한 곳이에요. 🌳\n이곳은 자연의 아름다움을 그대로 간직하고 있어, 도시의 번잡함을 벗어나고 싶은 사람들에게 안성맞춤인 곳이에요. 🌲\n그러나 관광객 감소와 함께 농산물 판매가 줄어들어 마을 주민들의 생계가 어려워졌어요. 과거에는 많은 사람들이 찾았던 관광 명소였지만, 이제는 관심이 줄어들어 위기에 처해있답니다. 😢\n두타연마을에서 자연과 하나 되는 시간을 보내보세요. 계곡에서 피크닉을 즐기고, 숲 속을 산책하며 힐링하는 시간을 가질 수 있어요. 그리고 마을 주민들이 정성껏 키운 농산물도 구매해서 맛보세요. 우리의 작은 관심이 마을을 지키는 큰 힘이 된답니다. 🍃', imageUrl: 'https://search.pstatic.net/common/?src=http%3A%2F%2Fblogfiles.naver.net%2FMjAyMzA4MTZfMjA5%2FMDAxNjkyMTk2OTYxNjIy.vtgqtLu7296AUHuvKEEB6iAvkm-DTX8AOhNjqSYsqZwg.VM6kA-GRj4mljMW_V33BTkkI_yiicJYztqoglt5D9owg.JPEG.dewdoll%2F20221001_143251.jpg&type=sc960_832', - x: 38.1016, - y: 127.9897, + latitude: 38.1016, + longitude: 127.9897, publishedAt: '2024-07-20', }, { @@ -41,8 +41,8 @@ const hiddenGems: Village[] = [ '강진 청자골마을은 전통 청자 도자기로 유명한 곳이에요. 🏺\n이곳에서는 아름다운 청자 도자기를 직접 만들어보는 체험을 할 수 있어요. 도자기를 빚으며 느끼는 마음의 평온함은 정말 특별해요. 🎨\n하지만 최근 도자기 시장의 침체와 함께 관광객이 줄어들면서 마을 경제가 어려워졌어요. 😔\n청자골마을의 전통을 지키기 위해 많은 사람들이 방문해주어야 해요. 도자기 체험도 하고, 아름다운 자연도 즐길 수 있어요. 우리의 관심과 방문이 마을에 큰 도움이 될 거예요. 🌿', imageUrl: 'https://search.pstatic.net/common/?src=http%3A%2F%2Fblogfiles.naver.net%2FMjAyMzA5MTJfMTYx%2FMDAxNjk0NTAyMjUzMjA1.V6PItlGjqs-AdEjmwpDcUCQ9tc-ywWW9tLoJVvrS7y8g.mv2g_5bk7XkvgASzAV9ceDwOKkTCziQord1AiC-UBIwg.JPEG.fsohx10%2FIMG_4409.jpg&type=sc960_832', - x: 34.6421, - y: 126.7658, + latitude: 34.6421, + longitude: 126.7658, publishedAt: '2024-07-20', }, { @@ -52,8 +52,8 @@ const hiddenGems: Village[] = [ '함평 나비마을은 나비 축제로 유명한 곳이에요. 🦋\n봄이 되면 나비와 꽃이 가득한 이곳에서 아름다운 풍경을 감상할 수 있어요. 🌷\n하지만 축제 시즌 외에는 관광객이 거의 없어 마을 경제가 어려움을 겪고 있어요. 😢\n나비마을의 아름다움을 유지하고 마을 주민들을 돕기 위해서는 더 많은 관심과 방문이 필요해요. 나비와 꽃이 가득한 이곳에서 아름다운 추억을 만들어보세요. 🌼', imageUrl: 'https://search.pstatic.net/common/?src=http%3A%2F%2Fblogfiles.naver.net%2FMjAyNDA0MzBfMTIz%2FMDAxNzE0NDc0Mjc4NTc4.943crSOmERlWxQ-6cJRuqZubCIeG6e8ASLWPpSjEpi0g.b-N_ymLKV74Y8bAWWJCbNyjrkbcdLmsRgJbtpxeYvaUg.JPEG%2F_NZ74880.jpg-0.jpg&type=sc960_832', - x: 35.0633, - y: 126.5167, + latitude: 35.0633, + longitude: 126.5167, publishedAt: '2024-07-20', }, ]; diff --git a/src/types.ts b/src/types.ts index b6bb077..e533f97 100644 --- a/src/types.ts +++ b/src/types.ts @@ -33,7 +33,7 @@ export interface Village { title: string; content: string; imageUrl: string; - x: number; - y: number; + latitude: number; + longitude: number; publishedAt: string; } From 1217b296ea72c8db43c05b6d2d400e7f228e21ea Mon Sep 17 00:00:00 2001 From: stopmin Date: Mon, 22 Jul 2024 01:35:50 +0900 Subject: [PATCH 07/12] =?UTF-8?q?feat:=20viewcount=20=EC=88=98=EC=A0=95=20?= =?UTF-8?q?#104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/village/[id]/page.tsx | 13 +++++++++---- src/components/KakaoMap.tsx | 2 ++ src/mocks/villages.ts | 5 +++++ src/types.ts | 1 + 4 files changed, 17 insertions(+), 4 deletions(-) diff --git a/src/app/village/[id]/page.tsx b/src/app/village/[id]/page.tsx index 90f1f78..e98ecdd 100644 --- a/src/app/village/[id]/page.tsx +++ b/src/app/village/[id]/page.tsx @@ -19,7 +19,12 @@ const Page = async ({ params }: { params: { id: number } }) => { - + @@ -47,10 +52,10 @@ const Page = async ({ params }: { params: { id: number } }) => { + + + - - - ); }; diff --git a/src/components/KakaoMap.tsx b/src/components/KakaoMap.tsx index 0903e27..0879b0b 100644 --- a/src/components/KakaoMap.tsx +++ b/src/components/KakaoMap.tsx @@ -1,3 +1,5 @@ +'use client'; + import React, { useEffect } from 'react'; declare global { diff --git a/src/mocks/villages.ts b/src/mocks/villages.ts index 63312a0..55df388 100644 --- a/src/mocks/villages.ts +++ b/src/mocks/villages.ts @@ -11,6 +11,7 @@ const hiddenGems: Village[] = [ latitude: 37.3793, longitude: 128.6616, publishedAt: '2024-07-20', + viewCount: 3, }, { id: 2, @@ -22,6 +23,7 @@ const hiddenGems: Village[] = [ latitude: 36.3446, longitude: 129.0571, publishedAt: '2024-07-20', + viewCount: 2, }, { id: 3, @@ -33,6 +35,7 @@ const hiddenGems: Village[] = [ latitude: 38.1016, longitude: 127.9897, publishedAt: '2024-07-20', + viewCount: 3, }, { id: 4, @@ -44,6 +47,7 @@ const hiddenGems: Village[] = [ latitude: 34.6421, longitude: 126.7658, publishedAt: '2024-07-20', + viewCount: 5, }, { id: 5, @@ -55,6 +59,7 @@ const hiddenGems: Village[] = [ latitude: 35.0633, longitude: 126.5167, publishedAt: '2024-07-20', + viewCount: 6, }, ]; diff --git a/src/types.ts b/src/types.ts index e533f97..0a01c07 100644 --- a/src/types.ts +++ b/src/types.ts @@ -36,4 +36,5 @@ export interface Village { latitude: number; longitude: number; publishedAt: string; + viewCount: number; } From d4f94a8d20dad34c4535b04ff606054317d92866 Mon Sep 17 00:00:00 2001 From: stopmin Date: Mon, 22 Jul 2024 02:06:56 +0900 Subject: [PATCH 08/12] =?UTF-8?q?feat:=20marker=20=ED=81=B4=EB=A6=AD=20?= =?UTF-8?q?=EA=B0=80=EB=8A=A5=ED=95=9C=EC=A7=80=20=EC=95=84=EB=8B=8C?= =?UTF-8?q?=EC=A7=80=20=EA=B5=AC=EB=B6=84=20#104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/village/[id]/page.tsx | 12 +++++++++--- src/app/village/page.tsx | 2 +- src/components/KakaoMap.tsx | 16 ++++++++++++---- 3 files changed, 22 insertions(+), 8 deletions(-) diff --git a/src/app/village/[id]/page.tsx b/src/app/village/[id]/page.tsx index e98ecdd..80ae66c 100644 --- a/src/app/village/[id]/page.tsx +++ b/src/app/village/[id]/page.tsx @@ -49,11 +49,17 @@ const Page = async ({ params }: { params: { id: number } }) => { - + - - + + diff --git a/src/app/village/page.tsx b/src/app/village/page.tsx index 65cab7f..8a6be76 100644 --- a/src/app/village/page.tsx +++ b/src/app/village/page.tsx @@ -49,7 +49,7 @@ const Page = () => { 지도에서 보는 마을 - + {villages.slice(3).map((filteredItem) => ( diff --git a/src/components/KakaoMap.tsx b/src/components/KakaoMap.tsx index 0879b0b..09f05c8 100644 --- a/src/components/KakaoMap.tsx +++ b/src/components/KakaoMap.tsx @@ -22,13 +22,15 @@ interface KakaoMapProps { initialLon: number; level: number; villages: Village[]; + isMarkerClicked?: boolean; } -const KakaoMap = ({ villages, initialLat, initialLon, level }: KakaoMapProps) => { +const KakaoMap = ({ villages, initialLat, initialLon, level, isMarkerClicked = false }: KakaoMapProps) => { useEffect(() => { const initializeMap = () => { const container = document.getElementById('map'); if (!container) { + console.error('Map container not found'); return; } @@ -58,7 +60,9 @@ const KakaoMap = ({ villages, initialLat, initialLon, level }: KakaoMapProps) => }); window.kakao.maps.event.addListener(marker, 'click', () => { - window.location.href = `/village/${village.id}`; + if (isMarkerClicked) { + window.location.href = `/village/${village.id}`; + } }); }); }; @@ -77,15 +81,19 @@ const KakaoMap = ({ villages, initialLat, initialLon, level }: KakaoMapProps) => window.kakao.maps.load(() => { initializeMap(); }); + } else { + console.error('Kakao maps load function is not available'); } }; - script.onerror = () => {}; + script.onerror = () => { + console.error('Failed to load Kakao Maps script'); + }; document.head.appendChild(script); }; loadKakaoMap(); - }, [villages]); + }, [villages, initialLat, initialLon, level, isMarkerClicked]); return (
Date: Mon, 22 Jul 2024 02:32:50 +0900 Subject: [PATCH 09/12] =?UTF-8?q?feat:=20=EA=B8=B0=EC=82=AC=20=ED=81=B4?= =?UTF-8?q?=EB=A6=AD=ED=95=98=EB=A9=B4=20=EC=9D=B4=EB=8F=99=ED=95=98?= =?UTF-8?q?=EB=8F=84=EB=A1=9D=20=EC=84=A4=EC=A0=95=20#104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/newsletter/page.tsx | 2 ++ src/app/village/[id]/page.tsx | 2 +- src/app/village/page.tsx | 3 +++ src/components/NewsCardHorizontal.tsx | 5 +++-- src/components/NewsCardVertical.tsx | 30 ++++++++++++++++++++++----- 5 files changed, 34 insertions(+), 8 deletions(-) diff --git a/src/app/newsletter/page.tsx b/src/app/newsletter/page.tsx index 5cf44bb..56bdab5 100644 --- a/src/app/newsletter/page.tsx +++ b/src/app/newsletter/page.tsx @@ -58,6 +58,7 @@ const Page = () => { content={item.content} id={item.id} imageUrl={item.imageUrl} + path="newsletter" publishedAt={item.publishedAt.split('T')[0]} title={item.title} /> @@ -70,6 +71,7 @@ const Page = () => { content={filteredItem.content} id={filteredItem.id} imageUrl={filteredItem.imageUrl} + path="newsletter" publishedAt={filteredItem.publishedAt.split('T')[0]} title={filteredItem.title} /> diff --git a/src/app/village/[id]/page.tsx b/src/app/village/[id]/page.tsx index 80ae66c..f3ede73 100644 --- a/src/app/village/[id]/page.tsx +++ b/src/app/village/[id]/page.tsx @@ -12,7 +12,7 @@ import color from '@/constants/color'; import hiddenGems from '@/mocks/villages'; const Page = async ({ params }: { params: { id: number } }) => { - const village = hiddenGems[params.id]; + const village = hiddenGems[params.id - 1]; return ( diff --git a/src/app/village/page.tsx b/src/app/village/page.tsx index 8a6be76..e3b9817 100644 --- a/src/app/village/page.tsx +++ b/src/app/village/page.tsx @@ -39,7 +39,9 @@ const Page = () => { @@ -58,6 +60,7 @@ const Page = () => { content={filteredItem.content} id={filteredItem.id} imageUrl={filteredItem.imageUrl} + path="village" publishedAt="2024-01-20" title={filteredItem.title} /> diff --git a/src/components/NewsCardHorizontal.tsx b/src/components/NewsCardHorizontal.tsx index 623f5bd..a69239f 100644 --- a/src/components/NewsCardHorizontal.tsx +++ b/src/components/NewsCardHorizontal.tsx @@ -10,16 +10,17 @@ interface NewsCardHorizontalProps { content: string; publishedAt: string; imageUrl?: string; + path: string; } -const NewsCardHorizontal = ({ id, title, content, publishedAt, imageUrl }: NewsCardHorizontalProps) => { +const NewsCardHorizontal = ({ id, title, content, publishedAt, imageUrl, path }: NewsCardHorizontalProps) => { return ( {publishedAt} - + { +const NewsCardVertical = ({ id, date, title, description, imageUrl, path }: NewsCardVerticalProps) => { return ( - {imageUrl && ( - - )} + + {imageUrl && ( + + )} + {date} @@ -43,6 +49,20 @@ const NewsCardVertical = ({ date, title, description, imageUrl }: NewsCardVertic {description} + {imageUrl && ( + + articleImage + + )} ); }; From 58f51584af3f65068bde7927fb6a76c03dc6308b Mon Sep 17 00:00:00 2001 From: stopmin Date: Mon, 22 Jul 2024 02:37:36 +0900 Subject: [PATCH 10/12] =?UTF-8?q?feat:=20=EB=A7=81=ED=81=AC=20=EB=B2=94?= =?UTF-8?q?=EC=9C=84=20=ED=99=95=EC=9E=A5=20#104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/insight/page.tsx | 8 ++++- src/components/NewsCardVertical.tsx | 56 +++++++++++++++-------------- 2 files changed, 36 insertions(+), 28 deletions(-) diff --git a/src/app/insight/page.tsx b/src/app/insight/page.tsx index 0b1d79e..0960a89 100644 --- a/src/app/insight/page.tsx +++ b/src/app/insight/page.tsx @@ -101,7 +101,13 @@ const Page = () => { sx={{ cursor: 'pointer' }} onClick={() => handleInsightClick(insight)} > - + ))} diff --git a/src/components/NewsCardVertical.tsx b/src/components/NewsCardVertical.tsx index b48f2ae..6e289e0 100644 --- a/src/components/NewsCardVertical.tsx +++ b/src/components/NewsCardVertical.tsx @@ -22,38 +22,40 @@ const NewsCardVertical = ({ id, date, title, description, imageUrl, path }: News )} - - {date} - - - {title} - - - {description} - + + + {date} + + + {title} + + + {description} + + {imageUrl && ( Date: Mon, 22 Jul 2024 02:46:11 +0900 Subject: [PATCH 11/12] =?UTF-8?q?feat:=20=EB=A9=98=ED=8A=B8=EC=88=98?= =?UTF-8?q?=EC=A0=95=20#104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/village/[id]/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/village/[id]/page.tsx b/src/app/village/[id]/page.tsx index f3ede73..a71c820 100644 --- a/src/app/village/[id]/page.tsx +++ b/src/app/village/[id]/page.tsx @@ -50,7 +50,7 @@ const Page = async ({ params }: { params: { id: number } }) => { - + Date: Mon, 22 Jul 2024 02:58:45 +0900 Subject: [PATCH 12/12] =?UTF-8?q?feat:=20async=20=EB=B9=BC=EA=B8=B0=20#104?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/village/[id]/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/village/[id]/page.tsx b/src/app/village/[id]/page.tsx index a71c820..24a4d34 100644 --- a/src/app/village/[id]/page.tsx +++ b/src/app/village/[id]/page.tsx @@ -11,7 +11,7 @@ import KakaoMap from '@/components/KakaoMap'; import color from '@/constants/color'; import hiddenGems from '@/mocks/villages'; -const Page = async ({ params }: { params: { id: number } }) => { +const Page = ({ params }: { params: { id: number } }) => { const village = hiddenGems[params.id - 1]; return (