From 9e9c47664edbe77f14eae2ca64c0a762bcf1b642 Mon Sep 17 00:00:00 2001
From: hain-tain <hain7ce@gmail.com>
Date: Thu, 21 Mar 2024 17:06:31 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EB=A1=9C=EA=B3=A0=20=ED=81=B4=EB=A6=AD?=
 =?UTF-8?q?=ED=95=A0=20=EA=B2=BD=EC=9A=B0=20searchBox=20value=20=EC=B4=88?=
 =?UTF-8?q?=EA=B8=B0=ED=99=94=20=ED=95=B4=EC=A3=BC=EB=8A=94=20=EA=B8=B0?=
 =?UTF-8?q?=EB=8A=A5=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/MovieHeader/MovieHeader.ts    | 13 +++++++++----
 src/components/MovieHeader/MovieSearchBox.ts |  6 ++++++
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/components/MovieHeader/MovieHeader.ts b/src/components/MovieHeader/MovieHeader.ts
index 4f614ebe1..5fcfe76b3 100644
--- a/src/components/MovieHeader/MovieHeader.ts
+++ b/src/components/MovieHeader/MovieHeader.ts
@@ -27,13 +27,18 @@ class MovieHeader {
     const $h1 = createElement({
       tagName: "h1",
       children: [$logo],
-      addEventListener: { click: logoClickHandler },
+      addEventListener: {
+        click: () => {
+          searchBox.clear();
+          logoClickHandler();
+        },
+      },
     });
-    const $searchBox = new MovieSearchBox({
+    const searchBox = new MovieSearchBox({
       searchBoxSubmitHandler,
-    }).$element;
+    });
 
-    return generateHeader({ children: [$h1, $searchBox] });
+    return generateHeader({ children: [$h1, searchBox.$element] });
   }
 }
 
diff --git a/src/components/MovieHeader/MovieSearchBox.ts b/src/components/MovieHeader/MovieSearchBox.ts
index 922fd381e..26bebf316 100644
--- a/src/components/MovieHeader/MovieSearchBox.ts
+++ b/src/components/MovieHeader/MovieSearchBox.ts
@@ -22,6 +22,12 @@ class MovieSearchBox {
     });
   }
 
+  clear() {
+    if (this.$element instanceof HTMLFormElement) {
+      this.$element.reset();
+    }
+  }
+
   private searchByQuery(e: Event) {
     e.preventDefault();