Merge pull request #37 from gdsc-ssu/feat/#36

[#36] 가게 등록 API

README.md

@@ -1,7 +1,7 @@
 # up-d4te
 
 > This is the recommend dating course in korea with CLI. <br>
-> This project is made by [ink](https://github.com/vadimdemedes/ink), you can own cli project with it.<br>
+> This project is made by [ink](https://github.com/vadimdemedes/ink), you can make your own cli project with it.<br>
 > You can see project repository [here](https://github.com/gdsc-ssu/up-date-cli).
 
 ## Install

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "up-d4te",
-	"version": "0.0.10",
+	"version": "0.0.12",
 	"description": "Recommend Dating Course in Korea with CLI",
 	"author": {
 		"name": "Sanghyeon Sim",

source/Login.js

@@ -2,34 +2,48 @@ import React, {useState} from 'react';
 import {Text, Box, useInput} from 'ink';
 import TextInput from 'ink-text-input';
 import theme from './Theme.js';
+import {getLoginCheck} from './api/remote.js';
 
 const Login = ({userId, setId, setShow}) => {
 	const [nextStepInfo, setNextStepInfo] = useState(false);
 	const [eMail, setEMail] = useState('');
 	const [loginSuccess, setLoginSuccess] = useState(true);
+	const [isLoading, setIsLoading] = useState(false);
 
 	useInput((input, key) => {
 		if (!key) return;
 
 		if (key.return) {
 			if (nextStepInfo) {
-				if (userId === 'hoyeon' && eMail == 'hello') {
-					setShow(true);
-				} else {
-					setId('');
-					setEMail('');
-					setLoginSuccess(false);
-				}
+				setIsLoading(true);
+				setEMail('');
+				let tempUserId = userId;
+
+				getLoginCheck(userId, eMail).then(res => {
+					if (res.data['statusCode'] == 200) {
+						setShow(true);
+						// 로그인 중 아이디 변경 방지
+						setId(tempUserId);
+					} else {
+						setId('');
+						setEMail('');
+						setLoginSuccess(false);
+						setIsLoading(false);
+					}
+				});
 			}
 
 			setNextStepInfo(!nextStepInfo);
-		} else if (input === 'c') {
-			process.exit(0);
+		}
+
+		if (key.escape) {
+			process.exit();
 		}
 	});
 
 	return (
 		<Box marginY={1} flexDirection="column">
+			{isLoading ? <Text>Loading...</Text> : ''}
 			{loginSuccess ? '' : <Text color={theme.red}>ID or EMail is wrong</Text>}
 			<Box>
 				<Text color={theme.neonGreen}>ID: </Text>

source/Register.js

@@ -2,11 +2,12 @@ import React, {useState} from 'react';
 import {Text, Box, useInput} from 'ink';
 import TextInput from 'ink-text-input';
 import theme from './Theme.js';
+import {postRegister} from './api/remote.js';
 
 const Register = ({setIsSelected, setSpaceStep}) => {
 	const [nextStepInfo, setNextStepInfo] = useState(0);
-	const [Id, setId] = useState('');
-	const [Password, setPassword] = useState('');
+	const [userId, setUserId] = useState('');
+	const [eMail, setEMail] = useState('');
 	const [girlfriend, setGirlfriend] = useState('');
 	const [openMessage, setOpenMessage] = useState('');
 
@@ -17,6 +18,7 @@ const Register = ({setIsSelected, setSpaceStep}) => {
 			if (nextStepInfo === 2) {
 				setSpaceStep('login');
 				setIsSelected(true);
+				postRegister(userId, eMail);
 			}
 			setNextStepInfo(nextStepInfo + 1);
 		}
@@ -34,21 +36,21 @@ const Register = ({setIsSelected, setSpaceStep}) => {
 			<Box>
 				<Text color={theme.neonGreen}>NEW ID: </Text>
 				{nextStepInfo === 0 ? (
-					<TextInput value={Id} onChange={setId} />
+					<TextInput value={userId} onChange={setUserId} />
 				) : (
-					<Text>{Id}</Text>
+					<Text>{userId}</Text>
 				)}
 			</Box>
 			<Box>
 				{nextStepInfo === 1 ? (
 					<>
 						<Text color={theme.neonGreen}>NEW EMAIL: </Text>
-						<TextInput value={Password} onChange={setPassword} />
+						<TextInput value={eMail} onChange={setEMail} />
 					</>
 				) : nextStepInfo === 2 ? (
 					<>
 						<Text color={theme.neonGreen}>NEW EMAIL: </Text>
-						<Text> {Password}</Text>
+						<Text> {eMail}</Text>
 					</>
 				) : (
 					''

source/Search.js

@@ -47,7 +47,7 @@ const Search = ({setlist, setStation, setId, setStoreName, setSingleShop}) => {
 			}
 		}
 
-		if (minDistance <= 2) {
+		if (minDistance <= 1) {
 			return `Command not found. Did you mean "${closestCommand}"?`;
 		}
 
@@ -60,14 +60,16 @@ const Search = ({setlist, setStation, setId, setStoreName, setSingleShop}) => {
 		if (key.return) {
 			setPreviousCommand(search);
 			if (search === 'ls') {
-				setlist(list => [...list, [data.location, search]]);
+				setlist(list => [...list, [data.locations, search]]);
 				setSearch('');
 				return;
 			}
 			if (search.startsWith('cd ')) {
-				let station = search.slice(3, search.length);
-				setlist(list => [...list, [[], search]]);
-				setStation(station);
+				let station = search.slice(3, search.length).trim();
+				if (data.locations.includes(station)) {
+					setlist(list => [...list, [[], search]]);
+					setStation(station);
+				}
 				setSearch('');
 				return;
 			}

source/SearchContainer.js

@@ -44,7 +44,7 @@ const SearchContainer = ({userId}) => {
 					singleShop={singleShop}
 				/>
 			) : storeName ? (
-				<ShopPost setStoreName={setStoreName} />
+				<ShopPost userId={userId} setStoreName={setStoreName} />
 			) : (
 				<Search
 					setlist={setlist}

source/StationDetailType.js

@@ -41,7 +41,11 @@ const StationDetailType = ({
 				setlist(list => [...list, [[], `${station} 술집`]]);
 			}
 			getAllPlaceCheck(1, station).then(res => {
-				setShops(res.data.body); // shoplist.slice(first, last)
+				if (res.data['statusCode'] == 404) {
+					setShops([]);
+				} else {
+					setShops(res.data.body);
+				}
 			});
 			setStation('');
 		}

source/api/remote.js

@@ -12,4 +12,44 @@ const getSinglePlaceCheck = placeId => UpdateAxios.get(`/place/${placeId}`);
 const getReviewCheck = placeId =>
 	UpdateAxios.get(`/review/place/${placeId}?page=1`);
 
-export {getAllPlaceCheck, getSinglePlaceCheck, getReviewCheck};
+const postShop = (
+	userId,
+	name,
+	phoneNumber,
+	location,
+	start_at,
+	end_at,
+	latitude,
+	longitude,
+	url,
+	menu,
+) =>
+	UpdateAxios.post(`/place/user/${userId}`, {
+		name,
+		phoneNumber,
+		location,
+		start_at,
+		end_at,
+		latitude,
+		longitude,
+		url,
+		menu,
+	});
+
+const getLoginCheck = (userId, eMail) =>
+	UpdateAxios.get(`/user/${userId}?email=${eMail}`);
+
+const postRegister = (userId, eMail) =>
+	UpdateAxios.post(`/user`, {
+		id: userId,
+		email: eMail,
+	});
+
+export {
+	getAllPlaceCheck,
+	getSinglePlaceCheck,
+	postShop,
+	getLoginCheck,
+	postRegister,
+	getReviewCheck,
+};

source/component/EachShop.js

@@ -38,10 +38,7 @@ const EachShop = ({data, key, isEnd}) => {
 						<Newline />
 					</Text>
 
-					<Text>
-						"starRate" : "{data.averageStar}",
-						<Newline />
-					</Text>
+					<Text>"starRate" : "{data.averageStar}"</Text>
 				</Text>
 			</Box>
 			<Text>{isEnd ? '}' : '},'}</Text>

source/component/ListShop.js

@@ -3,52 +3,65 @@ import {Text, Box, Newline, Spacer} from 'ink';
 import theme from '../Theme.js';
 import TextInput from 'ink-text-input';
 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 loadMore = () => {
+		// if (shops)
 		setShops([...shops, ...shoplist.slice(first + 3, last + 3)]);
 	};
 
 	return (
-		<Box marginY={1} flexDirection="column">
-			<Text>{'['}</Text>
-			<Box marginLeft={2} flexDirection="column">
-				{shops.map((data, index, key) => (
-					<EachShop data={data} key={key} isEnd={index === shops.length - 1} />
-				))}
-			</Box>
-			<Text>{']'}</Text>
-			<Box flexDirection="column">
-				<Spacer />
-				<Text color={'red'}>
-					<Newline />
-					Commands
-				</Text>
-				<Box>
-					<Text color={'yellow'}>:q - quit</Text>
-					<Text> / </Text>
-					<Text color={'green'}>:lm - load more reviews</Text>
+		<>
+			<Box marginY={1} flexDirection="column">
+				{shops.length === 0 ? (
+					<Box flexDirection="column">
+						<Text>Status code: 404</Text>
+						<Text color={theme.red}>검색 결과가 없습니다.</Text>
+					</Box>
+				) : (
+					<Box flexDirection="column">
+						<Text>{'['}</Text>
+						<Box marginLeft={2} flexDirection="column">
+							{shops.map((data, index) => (
+								<EachShop data={data} isEnd={index === shops.length - 1} />
+							))}
+						</Box>
+						<Text>{']'}</Text>
+					</Box>
+				)}
+
+				<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>
+					</Box>
+					<TextInput
+						value={confirmCommand}
+						onChange={setConfirmCommand}
+						onSubmit={() => {
+							if (confirmCommand == ':q') {
+								setType('');
+							} else if (confirmCommand == ':lm') {
+								loadMore();
+								setConfirmCommand('');
+							} else {
+								setConfirmCommand('');
+							}
+						}}
+					/>
 				</Box>
-				<TextInput
-					value={confirmCommand}
-					onChange={setConfirmCommand}
-					onSubmit={() => {
-						if (confirmCommand == ':q') {
-							//TODO : 저장하고 종료
-							setType('');
-						} else if (confirmCommand == ':lm') {
-							loadMore();
-							setConfirmCommand('');
-						} else {
-							setConfirmCommand('');
-						}
-					}}
-				/>
 			</Box>
-		</Box>
+		</>
 	);
 };