Commit @c3b40a9d298f0be79d001ae33bc8dcc61ad78781

임동욱 09-22

fix: 검색 초기화가 검색 상자에 입력 중인 값까지 비우게 한다

주소만 되돌리면 적용 전 입력값(초안)이 목록 컨테이너 안에 남았다. 초기화 때 컨테이너를
다시 마운트(key)해 검색어·검색 대상 초안까지 비운다 — 학생·관리자 회원, 가맹몰 상세 목록.

Co-Authored-By: Claude Opus 5

@c3b40a9d298f0be79d001ae33bc8dcc61ad78781

d28c525

c3b40a9

app/(protected)/(basic)/admins/_components/admin-member-list.tsx

--- app/(protected)/(basic)/admins/_components/admin-member-list.tsx

+++ app/(protected)/(basic)/admins/_components/admin-member-list.tsx


     router.replace(buildAdminMemberHref(query, { ...patch, page: 1 }));
   }
 
+  // 검색 초기화 — 주소를 되돌리는 것만으론 아직 적용 안 한 입력값이 남는다. 목록 컨테이너를
+  // 다시 마운트해 검색 상자의 초안까지 비운다.
+  const [resetCount, setResetCount] = useState(0);
+  function resetSearch() {
+    setResetCount((count) => count + 1);
+    router.replace(ADMIN_MEMBERS_PATH);
+  }
+
   const columns: FoxListColumn<AdminMember>[] = [
     {
       key: 'no',

   return (
     <>
       <FoxListContainer<AdminMember>
+        key={resetCount}
         title="관리자 회원 목록"
         breadcrumb={[
           { label: '홈', href: '/' },

         keyword={query.keyword}
         toolbarActions={
           <FoxButtonGroup size="md">
-            {/* 검색어·검색 대상·정렬·페이지 크기·페이지를 모두 기본값으로 — URL이 상태라 주소만 되돌린다. */}
-            <FoxButton
-              type="default"
-              size="md"
-              label="검색 초기화"
-              onAction={() => router.replace(ADMIN_MEMBERS_PATH)}
-            />
+            <FoxButton type="default" size="md" label="검색 초기화" onAction={resetSearch} />
             <form action={ADMIN_MEMBERS_EXCEL_PATH} method="get">
               <FoxButton
                 type="secondary"

d28c525

c3b40a9

app/(protected)/(basic)/students/_components/student-list.tsx

--- app/(protected)/(basic)/students/_components/student-list.tsx

+++ app/(protected)/(basic)/students/_components/student-list.tsx


     router.replace(buildStudentMemberHref(query, { ...patch, page: 1 }));
   }
 
+  // 검색 초기화 — 주소를 되돌리는 것만으론 아직 적용 안 한 입력값이 남는다. 목록 컨테이너를
+  // 다시 마운트해 검색 상자의 초안까지 비운다.
+  const [resetCount, setResetCount] = useState(0);
+  function resetSearch() {
+    setResetCount((count) => count + 1);
+    router.replace(STUDENT_MEMBERS_PATH);
+  }
+
   const columns: FoxListColumn<StudentMember>[] = [
     {
       key: 'no',

   return (
     <>
       <FoxListContainer<StudentMember>
+      key={resetCount}
       title="학생 회원 목록"
       breadcrumb={[
         { label: '홈', href: '/' },

       keyword={query.keyword}
       toolbarActions={
         <FoxButtonGroup size="md">
-          {/* 검색어·검색 대상·정렬·페이지 크기·페이지를 모두 기본값으로 — URL이 상태라 주소만 되돌린다. */}
-          <FoxButton
-            type="default"
-            size="md"
-            label="검색 초기화"
-            onAction={() => router.replace(STUDENT_MEMBERS_PATH)}
-          />
+          <FoxButton type="default" size="md" label="검색 초기화" onAction={resetSearch} />
           {/* 네이티브 GET 폼이라야 한다 — 응답이 첨부파일(Content-Disposition)이라 라우터
               내비게이션으로는 처리할 수 없고, 브라우저가 화면을 둔 채 파일만 내려받는다.
               검색·페이징 값을 싣지 않는 것이 사양이다(파일은 항상 전체 데이터). */}

d28c525

c3b40a9

app/(protected)/(basic)/system/merchant-details/_components/merchant-detail-list.tsx

--- app/(protected)/(basic)/system/merchant-details/_components/merchant-detail-list.tsx

+++ app/(protected)/(basic)/system/merchant-details/_components/merchant-detail-list.tsx


     setSelectedIds(checked ? new Set(allIds) : new Set());
   }
 
-  /** 모든 필터를 비우고 첫 페이지로 — 초안과 URL을 함께 되돌린다. */
+  // 검색 상자의 초안은 목록 컨테이너 안에 있어 다시 마운트해야 비워진다.
+  const [resetCount, setResetCount] = useState(0);
+
+  /** 모든 필터를 비우고 첫 페이지로 — 초안·검색 상자·URL을 함께 되돌린다. */
   function resetFilters() {
     setDraft({ category: FILTER_ALL, visibility: FILTER_ALL, startDate: '', endDate: '' });
+    setResetCount((count) => count + 1);
     router.replace(MERCHANT_DETAILS_PATH);
   }
 

 
   return (
     <FoxListContainer<MerchantDetailSummary>
+      key={resetCount}
       title="가맹몰 상세 관리"
       description="지역상생몰(바우처 사용처)에 노출되는 업체를 등록·관리한다"
       breadcrumb={[

Add a comment

Open 0
Closed 0

List

...	...	@@ -63,6 +63,14 @@
63	63	router.replace(buildAdminMemberHref(query, { ...patch, page: 1 }));
64	64	}
65	65
	66	+ // 검색 초기화 — 주소를 되돌리는 것만으론 아직 적용 안 한 입력값이 남는다. 목록 컨테이너를
	67	+ // 다시 마운트해 검색 상자의 초안까지 비운다.
	68	+ const [resetCount, setResetCount] = useState(0);
	69	+ function resetSearch() {
	70	+ setResetCount((count) => count + 1);
	71	+ router.replace(ADMIN_MEMBERS_PATH);
	72	+ }
	73	+
66	74	const columns: FoxListColumn<AdminMember>[] = [
67	75	{
68	76	key: 'no',
...	...	@@ -136,6 +144,7 @@
136	144	return (
137	145	<>
138	146	<FoxListContainer<AdminMember>
	147	+ key={resetCount}
139	148	title="관리자 회원 목록"
140	149	breadcrumb={[
141	150	{ label: '홈', href: '/' },
...	...	@@ -183,13 +192,7 @@
183	192	keyword={query.keyword}
184	193	toolbarActions={
185	194	<FoxButtonGroup size="md">
186		- {/* 검색어·검색 대상·정렬·페이지 크기·페이지를 모두 기본값으로 — URL이 상태라 주소만 되돌린다. */}
187		- <FoxButton
188		- type="default"
189		- size="md"
190		- label="검색 초기화"
191		- onAction={() => router.replace(ADMIN_MEMBERS_PATH)}
192		- />
	195	+ <FoxButton type="default" size="md" label="검색 초기화" onAction={resetSearch} />
193	196	<form action={ADMIN_MEMBERS_EXCEL_PATH} method="get">
194	197	<FoxButton
195	198	type="secondary"

...	...	@@ -81,6 +81,14 @@
81	81	router.replace(buildStudentMemberHref(query, { ...patch, page: 1 }));
82	82	}
83	83
	84	+ // 검색 초기화 — 주소를 되돌리는 것만으론 아직 적용 안 한 입력값이 남는다. 목록 컨테이너를
	85	+ // 다시 마운트해 검색 상자의 초안까지 비운다.
	86	+ const [resetCount, setResetCount] = useState(0);
	87	+ function resetSearch() {
	88	+ setResetCount((count) => count + 1);
	89	+ router.replace(STUDENT_MEMBERS_PATH);
	90	+ }
	91	+
84	92	const columns: FoxListColumn<StudentMember>[] = [
85	93	{
86	94	key: 'no',
...	...	@@ -159,6 +167,7 @@
159	167	return (
160	168	<>
161	169	<FoxListContainer<StudentMember>
	170	+ key={resetCount}
162	171	title="학생 회원 목록"
163	172	breadcrumb={[
164	173	{ label: '홈', href: '/' },
...	...	@@ -206,13 +215,7 @@
206	215	keyword={query.keyword}
207	216	toolbarActions={
208	217	<FoxButtonGroup size="md">
209		- {/* 검색어·검색 대상·정렬·페이지 크기·페이지를 모두 기본값으로 — URL이 상태라 주소만 되돌린다. */}
210		- <FoxButton
211		- type="default"
212		- size="md"
213		- label="검색 초기화"
214		- onAction={() => router.replace(STUDENT_MEMBERS_PATH)}
215		- />
	218	+ <FoxButton type="default" size="md" label="검색 초기화" onAction={resetSearch} />
216	219	{/* 네이티브 GET 폼이라야 한다 — 응답이 첨부파일(Content-Disposition)이라 라우터
217	220	내비게이션으로는 처리할 수 없고, 브라우저가 화면을 둔 채 파일만 내려받는다.
218	221	검색·페이징 값을 싣지 않는 것이 사양이다(파일은 항상 전체 데이터). */}

...	...	@@ -98,9 +98,13 @@
98	98	setSelectedIds(checked ? new Set(allIds) : new Set());
99	99	}
100	100
101		- /** 모든 필터를 비우고 첫 페이지로 — 초안과 URL을 함께 되돌린다. */
	101	+ // 검색 상자의 초안은 목록 컨테이너 안에 있어 다시 마운트해야 비워진다.
	102	+ const [resetCount, setResetCount] = useState(0);
	103	+
	104	+ /** 모든 필터를 비우고 첫 페이지로 — 초안·검색 상자·URL을 함께 되돌린다. */
102	105	function resetFilters() {
103	106	setDraft({ category: FILTER_ALL, visibility: FILTER_ALL, startDate: '', endDate: '' });
	107	+ setResetCount((count) => count + 1);
104	108	router.replace(MERCHANT_DETAILS_PATH);
105	109	}
106	110
...	...	@@ -264,6 +268,7 @@
264	268
265	269	return (
266	270	<FoxListContainer<MerchantDetailSummary>
	271	+ key={resetCount}
267	272	title="가맹몰 상세 관리"
268	273	description="지역상생몰(바우처 사용처)에 노출되는 업체를 등록·관리한다"
269	274	breadcrumb={[

Delete comment