Merge pull request #39 from gdsc-ssu/feat/#38

[FEAT] 리뷰 생성 & 가게 더보기(:lm)
gdsc-ssu · Sep 1, 2023 · ebfddcb · ebfddcb
2 parents 89ba2ff + 7f11b7c
commit ebfddcb
Show file tree

Hide file tree

Showing 10 changed files with 84 additions and 51 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "up-d4te",
-	"version": "0.0.13",
+	"version": "0.0.14",
 	"description": "Recommend Dating Course in Korea with CLI",
 	"author": {
 		"name": "Sanghyeon Sim",

diff --git a/source/Output.js b/source/Output.js
@@ -10,8 +10,8 @@ const Output = ({list}) => {
 	const check = /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/;
 	return (
 		<Box marginY={1} flexDirection="column">
-			{list.map(item => (
-				<>
+			{list.map((item, index) => (
+				<Box key={index} flexDirection="column">
 					<Text color={theme.purple}>$ {item[1]} </Text>
 					<Newline />
 					{item[1] === 'ls' ? (
@@ -21,7 +21,7 @@ const Output = ({list}) => {
 					) : (
 						<Text color={theme.red}>{item[0][0]}</Text>
 					)}
-				</>
+				</Box>
 			))}
 		</Box>
 	);

diff --git a/source/Search.js b/source/Search.js
@@ -75,8 +75,12 @@ const Search = ({setlist, setStation, setId, setStoreName, setSingleShop}) => {
 			}
 			if (search.startsWith('vi ')) {
 				let storeId = search.slice(3, search.length);
-				setlist(list => [...list, [[], search]]);
 				getSinglePlaceCheck(storeId).then(res => {
+					if (res.data['statusCode'] == 404) {
+						setlist(list => [...list, [["해당하는 가게가 없습니다."], search]]);
+						setId(0);
+						return;
+					}
 					setSingleShop(res.data.body);
 					getReviewCheck(storeId).then(res => {
 						setSingleShop(data => ({...data, reviews: res.data.body}));

diff --git a/source/SearchContainer.js b/source/SearchContainer.js
@@ -25,7 +25,6 @@ const SearchContainer = ({userId}) => {
 					<Output list={list} />
 				) /* vi 창 들어기서 Id 값 다시 초기화 해줘야함.!*/
 			}
-			{/* {aaa ? <ShopDetail /> : ''} */}
 			{station ? ( // 타이핑된 역의 이름이 없을 경우, 입력 창 유지, 입력했을시, 맛집, 액티비티, 선택창 나옴.
 				<StationDetailType
 					setType={setType}

diff --git a/source/StationDetailType.js b/source/StationDetailType.js
@@ -43,11 +43,12 @@ const StationDetailType = ({
 			getAllPlaceCheck(1, station).then(res => {
 				if (res.data['statusCode'] == 404) {
 					setShops([]);
+					setStation('');
 				} else {
 					setShops(res.data.body);
+					setStation('');
 				}
 			});
-			setStation('');
 		}
 	});
 	return (

diff --git a/source/api/remote.js b/source/api/remote.js
@@ -45,11 +45,15 @@ const postRegister = (userId, eMail) =>
 		email: eMail,
 	});
 
+const postReview = (userId, placeId, content, star) =>
+	UpdateAxios.post(`review/user/${userId}/place/${placeId}`, {content, star});
+
 export {
 	getAllPlaceCheck,
 	getSinglePlaceCheck,
 	postShop,
 	getLoginCheck,
 	postRegister,
 	getReviewCheck,
+	postReview,
 };
diff --git a/source/component/EachShop.js b/source/component/EachShop.js
@@ -26,14 +26,18 @@ const EachShop = ({data, key, isEnd}) => {
 					<Text>
 						"menu" : {'['}
 						<Newline />
-						{data.menu.map((item, index, array) => (
-							<Text key={index}>
-								{' '}
-								{'{'} "{item.menuName}" : {item.menuPrice} {'}'}
-								{index !== array.length - 1 ? ',' : ''}
-								<Newline />
-							</Text>
-						))}
+						{data.menu ? (
+							data.menu.map((item, index, array) => (
+								<Text key={index}>
+									{' '}
+									{'{'} "{item.menuName}" : {item.menuPrice} {'}'}
+									{index !== array.length - 1 ? ',' : ''}
+									<Newline />
+								</Text>
+							))
+						) : (
+							<Text>메뉴가 없습니다.</Text>
+						)}
 						{']'},
 						<Newline />
 					</Text>

diff --git a/source/component/ListShop.js b/source/component/ListShop.js
@@ -6,17 +6,21 @@ import EachShop from './EachShop.js';
 import shoplist from '../examples/shoplist.js';
 
 const ListShop = ({shops, setShops, setType}) => {
-	let first = 0;
-	let last = 3;
 	const [confirmCommand, setConfirmCommand] = useState('');
+	const [shop, setShop] = useState(shops.slice(0, 3));
+	const [endMessage, setEndMessage] = useState(false);
 	const loadMore = () => {
-		setShops([...shops, ...shoplist.slice(first + 3, last + 3)]);
+		setShop([...shop, ...shops.slice(shop.length, shop.length + 1)]);
+
+		if (shops.length === shop.length) {
+			setEndMessage(true);
+		}
 	};
 
 	return (
 		<>
 			<Box marginY={1} flexDirection="column">
-				{shops.length === 0 ? (
+				{shop.length === 0 ? (
 					<Box flexDirection="column">
 						<Text>Status code: 404</Text>
 						<Text color={theme.red}>검색 결과가 없습니다.</Text>
@@ -25,24 +29,29 @@ const ListShop = ({shops, setShops, setType}) => {
 					<Box flexDirection="column">
 						<Text>{'['}</Text>
 						<Box marginLeft={2} flexDirection="column">
-							{shops.map((data, index) => (
-								<EachShop data={data} isEnd={index === shops.length - 1} />
-							))}
+							{shop.length !== 0 ? (
+								shop.map((data, index) => (
+									<EachShop data={data} isEnd={index === shops.length - 1} />
+								))
+							) : (
+								<Text>리스트가 없습니다.</Text>
+							)}
 						</Box>
 						<Text>{']'}</Text>
 					</Box>
 				)}
-
+				<Newline />
+				<Text>{endMessage ? '더 이상 불러올 리스트가 없습니다' : ''}</Text>
+				<Newline />
 				<Box flexDirection="column">
-					<Spacer />
 					<Text color={theme.red}>
 						<Newline />
 						Commands
 					</Text>
 					<Box>
 						<Text color={theme.commandFirst}>:q - quit</Text>
 						<Text> / </Text>
-						<Text color={theme.commandSecond}>:lm - load more reviews</Text>
+						<Text color={theme.commandSecond}>:lm - load more store</Text>
 					</Box>
 					<TextInput
 						value={confirmCommand}

diff --git a/source/component/ShopDetail.js b/source/component/ShopDetail.js
@@ -2,12 +2,14 @@ import React, {useState} from 'react';
 import {Text, Newline, Box, useInput} from 'ink';
 import TextInput from 'ink-text-input';
 import theme from '../Theme.js';
+import {postReview} from '../api/remote.js';
 
 const ShopDetail = ({id, setId, userId, singleShop}) => {
 	const [data, setData] = useState(singleShop);
 
+	const [reviewlist, setReviewlist] = useState(singleShop.reviews.slice(0, 3));
 	const [command, setCommand] = useState('');
-
+	const [endMessage, setEndMessage] = useState(false);
 	const [isAddReview, setIsAddReview] = useState(false);
 
 	const [content, setContent] = useState('');
@@ -23,16 +25,10 @@ const ShopDetail = ({id, setId, userId, singleShop}) => {
 			setIsAddReview(true);
 		}
 		if (command === ':lm') {
-			// TODO : load more reviews
-			const updatedReviews = [
-				...data.reviews,
-				{
-					userId: 'hoyeon',
-					content: 'content',
-					star: 3,
-				},
-			];
-			setData({...data, reviews: updatedReviews});
+			setReviewlist([
+				...reviewlist,
+				...singleShop.reviews.slice(reviewlist.length, reviewlist.length + 1),
+			]);
 		}
 		// handle invalid command
 		setCommand('');
@@ -50,16 +46,25 @@ const ShopDetail = ({id, setId, userId, singleShop}) => {
 
 	const onReivewSubmit = () => {
 		// TODO : add review
-		const updatedReviews = [
-			...data.reviews,
+
+		postReview(userId, id, content, star);
+		// const updatedReviews = [
+		// 	...data.reviews,
+		// 	{
+		// 		userId: userId,
+		// 		content: content,
+		// 		star: star,
+		// 	},
+		// ];
+		// setData({...data, reviews: updatedReviews});
+		setReviewlist([
+			...reviewlist,
 			{
 				userId: userId,
 				content: content,
 				star: star,
 			},
-		];
-
-		setData({...data, reviews: updatedReviews});
+		]);
 		setContent('');
 		setStar(5);
 		setIsAddReview(false);
@@ -69,7 +74,11 @@ const ShopDetail = ({id, setId, userId, singleShop}) => {
 		<>
 			{!isAddReview ? (
 				<>
-					<ShopView data={data} />
+					<ShopView
+						data={data}
+						reviewlist={reviewlist}
+						endMessage={endMessage}
+					/>
 					<Text color={'red'}>Commands</Text>
 					<Box>
 						<Text color={theme.commandFirst}>:q - quit</Text>
@@ -114,7 +123,7 @@ const ShopDetail = ({id, setId, userId, singleShop}) => {
 	);
 };
 
-const ShopView = ({data}) => {
+const ShopView = ({data, reviewlist, endMessage}) => {
 	const starRateString = '⭐'.repeat(Math.round(data.averageStar));
 
 	return (
@@ -158,18 +167,18 @@ const ShopView = ({data}) => {
 						"starRate" : "{starRateString} ({data.averageStar})",
 					</Text>
 				</Box>
-				{data.reviews.length > 0 ? (
+				{reviewlist.length > 0 ? (
 					<Box flexDirection="column">
 						<Box>
 							<Text>"reviews" : {'['}</Text>
 						</Box>
 						<Box flexDirection="column">
-							{data.reviews.map((item, index) => (
+							{reviewlist.map((item, index) => (
 								<ReviewView
 									writer={item.userId}
 									content={item.content}
 									starRate={item.star}
-									isEnd={index !== data.reviews.length - 1}
+									isEnd={index !== reviewlist.length - 1}
 								/>
 							))}
 						</Box>

diff --git a/source/component/ShopPost.js b/source/component/ShopPost.js
@@ -264,11 +264,14 @@ const ShopPost = ({userId, category, setStoreName}) => {
 
 	// 메뉴 추가
 	const addMenu = () => {
-		setMenuList([...menuList, {name: menuName, price: menuPrice}]);
-		setMenuName(''); // 입력 필드 초기화
-		setMenuPrice(0); // 입력 필드 초기화
-		setFocus(0); // 포커스 초기화
-	};
+        setMenuList([
+            ...menuList,
+            {name: menuName.split('\\')[0].trim(), price: menuPrice},
+        ]);
+        setMenuName(''); // 입력 필드 초기화
+        setMenuPrice(0); // 입력 필드 초기화
+        setFocus(0); // 포커스 초기화
+    };
 
 	const searchKakaoShops = async () => {
 		if (!shopTitle.length) {