From b7fb08f4c2683e7bef2034665c9f1dd25d2cad63 Mon Sep 17 00:00:00 2001
From: novice1993 <novice1993@gmail.com>
Date: Tue, 19 Sep 2023 15:39:14 +0900
Subject: [PATCH] =?UTF-8?q?[Feat]=20=EC=A2=85=EB=AA=A9=20=EA=B2=80?=
 =?UTF-8?q?=EC=83=89=20=EA=B4=80=EB=A0=A8=20=EC=95=8C=EB=A6=BC=20=ED=86=A0?=
 =?UTF-8?q?=EC=8A=A4=ED=8A=B8=20=EB=A9=94=EC=8B=9C=EC=A7=80=20=EA=B5=AC?=
 =?UTF-8?q?=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 목록에 없는 종목 검색할 시 안내 토스트 메세지 뜨도록 구현

Issues #122
---
 .../Headers/stockSearchComponent.tsx          | 44 ++++++++++++-------
 1 file changed, 27 insertions(+), 17 deletions(-)

diff --git a/client/src/components/Headers/stockSearchComponent.tsx b/client/src/components/Headers/stockSearchComponent.tsx
index 5ab47a05..b611e107 100644
--- a/client/src/components/Headers/stockSearchComponent.tsx
+++ b/client/src/components/Headers/stockSearchComponent.tsx
@@ -1,6 +1,7 @@
-import React, { useState } from 'react';
+import React, { useState } from "react";
 import { useDispatch } from "react-redux";
 import styled from "styled-components";
+import { toast } from "react-toastify";
 import { changeCompanyId } from "../../reducer/CompanyId-Reducer";
 import useGetCompanyList from "../../hooks/useGetCompanyList";
 
@@ -9,6 +10,12 @@ const search = "검색";
 const noExistCompany = "noExistCompany";
 const existCompany = "existCompany";
 
+const toastStyle = {
+  fontSize: "15px",
+  fontWeight: 350,
+  color: "black",
+};
+
 const StockSearchComponent: React.FC = () => {
   const dispatch = useDispatch();
   const { companyList } = useGetCompanyList();
@@ -21,15 +28,24 @@ const StockSearchComponent: React.FC = () => {
   const handleSearchCompany = () => {
     let searchResult: string = noExistCompany;
 
+    if (searchWord === "") {
+      return;
+    }
+
     companyList.forEach((company: CompanyProps) => {
       if (company.korName === searchWord) {
-        searchResult = existCompany ;
+        searchResult = existCompany;
         dispatch(changeCompanyId(company.companyId));
       }
     });
 
     if (searchResult === noExistCompany) {
-      dispatch(changeCompanyId(-1));
+      toast.error("존재하지 않는 종목입니다", {
+        style: toastStyle,
+        position: "top-right",
+        autoClose: 1500,
+      });
+      return;
     }
   };
 
@@ -42,12 +58,7 @@ const StockSearchComponent: React.FC = () => {
 
   return (
     <SearchContainer>
-      <StyledSearchInput 
-        value={searchWord}
-        onChange={handleChangeSearchWord} 
-        onKeyDown={handlePressEnterToSearch} 
-        placeholder={stockSearch}
-      />
+      <StyledSearchInput value={searchWord} onChange={handleChangeSearchWord} onKeyDown={handlePressEnterToSearch} placeholder={stockSearch} />
       <StyledSearchButton onClick={handleSearchCompany}>{search}</StyledSearchButton>
     </SearchContainer>
   );
@@ -56,20 +67,19 @@ const StockSearchComponent: React.FC = () => {
 export default StockSearchComponent;
 
 interface CompanyProps {
-    companyId: number;
-    code: string;
-    korName: string;
-    stockAsBiResponseDto: null;
-    stockInfResponseDto: null;
-  }
-  
+  companyId: number;
+  code: string;
+  korName: string;
+  stockAsBiResponseDto: null;
+  stockInfResponseDto: null;
+}
 
 // 스타일 정의
 
 const SearchContainer = styled.div`
   display: flex;
   align-items: center;
-  flex-grow: 0.7;  // 여기에 추가
+  flex-grow: 0.7; // 여기에 추가
 `;
 
 const StyledSearchInput = styled.input.attrs({