From dc14a64395481fb3d64d39fd459e08e77eac0b72 Mon Sep 17 00:00:00 2001
From: hjclover <107539614+hyeonjinan096@users.noreply.github.com>
Date: Tue, 2 Jul 2024 15:58:05 +0900
Subject: [PATCH] =?UTF-8?q?refactor:=20=EC=BD=94=EB=93=9C=20=EB=A6=AC?=
 =?UTF-8?q?=EB=B7=B0=20=EB=B0=98=EC=98=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../comment/_components/PostComment.tsx       |  4 +-
 .../(post)/search/_components/SearchBar.tsx   |  2 +-
 src/app/(post)/search/page.tsx                | 44 ++++++++++---------
 src/app/_components/ChipContainer.tsx         |  2 +-
 src/components/Icon/index.tsx                 |  2 +-
 src/components/TextInput/index.tsx            |  2 +-
 6 files changed, 29 insertions(+), 27 deletions(-)

diff --git a/src/app/(post)/comment/_components/PostComment.tsx b/src/app/(post)/comment/_components/PostComment.tsx
index 0947b2da..de60d894 100644
--- a/src/app/(post)/comment/_components/PostComment.tsx
+++ b/src/app/(post)/comment/_components/PostComment.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import React, { useState } from 'react';
+import React, { ChangeEvent, useState } from 'react';
 
 import { useParams } from 'next/navigation';
 
@@ -11,7 +11,7 @@ const PostComment = () => {
   const [comment, setComment] = useState('');
   const createComment = useCreateComment(postId);
 
-  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+  const handleChange = (e: ChangeEvent<HTMLInputElement>) => {
     setComment(e.target.value);
   };
 
diff --git a/src/app/(post)/search/_components/SearchBar.tsx b/src/app/(post)/search/_components/SearchBar.tsx
index e73daa61..f503c981 100644
--- a/src/app/(post)/search/_components/SearchBar.tsx
+++ b/src/app/(post)/search/_components/SearchBar.tsx
@@ -8,7 +8,7 @@ interface SearchBarProps {
   onSubmit: (input: string) => void;
 }
 
-const SearchBar: React.FC<SearchBarProps> = ({ onClear, onSubmit }) => {
+const SearchBar = ({ onClear, onSubmit }: SearchBarProps) => {
   const [input, setInput] = useState('');
 
   const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
diff --git a/src/app/(post)/search/page.tsx b/src/app/(post)/search/page.tsx
index a3016a53..7c438ff2 100644
--- a/src/app/(post)/search/page.tsx
+++ b/src/app/(post)/search/page.tsx
@@ -3,7 +3,7 @@
 import React, { useState } from 'react';
 
 import Link from 'next/link';
-import { useSearchParams } from 'next/navigation';
+import { useRouter, useSearchParams } from 'next/navigation';
 
 import { useGetPostListAPI } from '@/src/apis/postList';
 import { CATEGORY_MAP } from '@/src/app/(main)/constants';
@@ -16,18 +16,21 @@ import EmptyPage from '@/src/components/EmptyPage';
 import TopBar from '../../../components/Topbar';
 import SearchBar from './_components/SearchBar';
 
-const CreatePostPage = () => {
+const SearchPostPage = () => {
   const searchParams = useSearchParams();
+  const router = useRouter();
   const channel = (searchParams.get('channel') as ChannelType | null) ?? 'all';
   const [keyword, setKeyword] = useState('');
   const { content: posts } = useGetPostListAPI(keyword, CATEGORY_MAP[channel]);
 
   const handleRemoveClick = () => {
     setKeyword('');
+    router.push(`/search`);
   };
 
   const handleSubmit = (input: string) => {
     setKeyword(input);
+    router.push(`/search`);
   };
 
   return (
@@ -38,27 +41,26 @@ const CreatePostPage = () => {
       </TopBar.Container>
 
       {keyword !== '' && (
-        <ChipContainer currentChannel={channel} defaultPath='/search' />
-      )}
-
-      {keyword !== '' && (
-        <main className='flex h-full grow flex-col overflow-y-scroll'>
-          {posts.length ? (
-            posts.map((post, index) => (
-              <Link
-                href={`/result/${post.postId}`}
-                key={`${index}-${post.voteTitle}`}
-              >
-                <PostItem post={post} />
-              </Link>
-            ))
-          ) : (
-            <EmptyPage href='/createPost' text='작성 글이 없습니다.' />
-          )}
-        </main>
+        <>
+          <ChipContainer currentChannel={channel} defaultPath='/search' />
+          <main className='flex h-full grow flex-col overflow-y-scroll'>
+            {posts.length ? (
+              posts.map((post, index) => (
+                <Link
+                  href={`/result/${post.postId}`}
+                  key={`${index}-${post.voteTitle}`}
+                >
+                  <PostItem post={post} />
+                </Link>
+              ))
+            ) : (
+              <EmptyPage href='/createPost' text='작성 글이 없습니다.' />
+            )}
+          </main>
+        </>
       )}
     </>
   );
 };
 
-export default CreatePostPage;
+export default SearchPostPage;
diff --git a/src/app/_components/ChipContainer.tsx b/src/app/_components/ChipContainer.tsx
index 83b4faa5..c7b86de8 100644
--- a/src/app/_components/ChipContainer.tsx
+++ b/src/app/_components/ChipContainer.tsx
@@ -50,4 +50,4 @@ const ChipContainer = ({
   );
 };
 
-export default React.memo(ChipContainer);
+export default ChipContainer;
diff --git a/src/components/Icon/index.tsx b/src/components/Icon/index.tsx
index 7a8fdc9e..91e4eb88 100644
--- a/src/components/Icon/index.tsx
+++ b/src/components/Icon/index.tsx
@@ -2,7 +2,7 @@ import React, { ComponentProps } from 'react';
 
 import { IconName } from './type';
 
-interface IconProps extends ComponentProps<'svg'> {
+interface IconProps extends Omit<ComponentProps<'svg'>, 'width' | 'height'> {
   id: IconName;
   size?: number;
 }
diff --git a/src/components/TextInput/index.tsx b/src/components/TextInput/index.tsx
index c90e3adb..597d199a 100644
--- a/src/components/TextInput/index.tsx
+++ b/src/components/TextInput/index.tsx
@@ -47,4 +47,4 @@ const TextInput = forwardRef<HTMLInputElement, TextInputProps>(
 );
 
 TextInput.displayName = 'TextInput';
-export default React.memo(TextInput);
+export default TextInput;