From 65106653b5b123cfa0375160cec03a3cb38db667 Mon Sep 17 00:00:00 2001
From: Dongho Gang <gongdongho12@gmail.com>
Date: Sun, 19 Jul 2020 17:08:07 +0900
Subject: [PATCH] =?UTF-8?q?=EC=84=B8=EB=B6=80=20=EC=8A=A4=ED=83=80?=
 =?UTF-8?q?=EC=9D=BC=20=EC=A1=B0=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/LoginModalButton/LoginModalButton.tsx |  4 ++--
 src/containers/Home/Home.tsx                         | 12 +++++++++---
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/components/LoginModalButton/LoginModalButton.tsx b/src/components/LoginModalButton/LoginModalButton.tsx
index 54834e2..e5d15b9 100644
--- a/src/components/LoginModalButton/LoginModalButton.tsx
+++ b/src/components/LoginModalButton/LoginModalButton.tsx
@@ -46,9 +46,9 @@ const LoginModalButton: FunctionComponent<ILoginModalProps> = (props) => {
 
   return <>
     {
-      (token || '').length > 0 ? <FlexCenter>
+      (token || '').length > 0 ? <FlexCenter style={{ color: '#222' }}>
         {`${account?.name}님 안녕하세요`}
-        <Button type="primary" style={{ marginLeft: '4px' }} onClick={() => { onDrop() }} size={'small'}>
+        <Button type="primary" style={{ marginLeft: '8px' }} onClick={() => { onDrop() }} size={'small'}>
           로그아웃
         </Button>
       </FlexCenter> : (
diff --git a/src/containers/Home/Home.tsx b/src/containers/Home/Home.tsx
index 34251eb..685bff9 100644
--- a/src/containers/Home/Home.tsx
+++ b/src/containers/Home/Home.tsx
@@ -10,7 +10,7 @@ import axiosInstance from "api/AxiosInstance";
 import apiMeta from "api/meta";
 import queryString from 'query-string'
 import searchState from "state/search";
-import { useRecoilValue } from "recoil";
+import { useRecoilValue, useRecoilState } from "recoil";
 import { propsToStyle } from "utils";
 import styled from "styled-components";
 import accountState from "state/account";
@@ -82,7 +82,13 @@ const Home: FunctionComponent<ICardViewProps> = (props) => {
   const [loading, setLoading] = useState<boolean>(false);
   const [isLast, setIsLast] = useState<boolean>(false)
   // const [isSearch, setIsSearch] = useState<boolean>(false);
-  const search = useRecoilValue(searchState)
+  const [search, setSearch] = useRecoilState(searchState)
+
+  useEffect(() => {
+    return () => {
+      setSearch('')
+    }
+  }, [])
 
   useEffect(() => {
     onLoad(search, true);
@@ -149,7 +155,7 @@ const Home: FunctionComponent<ICardViewProps> = (props) => {
     <DefaultLayout haveSearch={true} onSearch={(value: string) => {
       setSavedKeyword(value)
     }}>
-      <InfinityScrollWrapper style={{ maxWidth: "1080px", width: '100%' }}>
+      <InfinityScrollWrapper style={{ maxWidth: "1080px", width: '100%', borderTop: '1px solid #eee', paddingTop: '20px' }}>
         <InfiniteScroll
           scrollableTarget={"list"}
           dataLength={items.length} //This is important field to render the next data