[Feat] 종목 검색 관련 알림 토스트 메시지 구현

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

Issues #122

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({