diff options
| author | dujinkim <dujin.kim@dtsolution.co.kr> | 2025-09-17 09:08:16 +0000 |
|---|---|---|
| committer | dujinkim <dujin.kim@dtsolution.co.kr> | 2025-09-17 09:08:16 +0000 |
| commit | f7117370b9cc0c7b96bd1eb23a1b9f5b16cc8ceb (patch) | |
| tree | 4efb0a5ce420b44a402810fc19c35afc92ec5271 /components/data-table | |
| parent | c54e2acaed641b7ae2c1a7304b08626f9ca973db (diff) | |
| parent | 7433eea5b4bbc0899e255b88e1a7e91f26e9d95b (diff) | |
Merge branch 'dujinkim' of https://github.com/DTS-Development/SHI_EVCP into dujinkim
Diffstat (limited to 'components/data-table')
| -rw-r--r-- | components/data-table/data-table-filter-list.tsx | 20 | ||||
| -rw-r--r-- | components/data-table/data-table-grobal-filter.tsx | 15 |
2 files changed, 31 insertions, 4 deletions
diff --git a/components/data-table/data-table-filter-list.tsx b/components/data-table/data-table-filter-list.tsx index ea4b1f90..c79c9cfd 100644 --- a/components/data-table/data-table-filter-list.tsx +++ b/components/data-table/data-table-filter-list.tsx @@ -124,14 +124,27 @@ export function DataTableFilterList<TData>({ }) ) + // Page state to reset when filters change + const [, setPage] = useQueryState("page", { + parse: (str) => str ? parseInt(str) : 1, + serialize: (val) => val.toString(), + eq: (a, b) => a === b, + clearOnDefault: true, + shallow, + }) + const safeSetFilters = React.useCallback( (next: Filter<TData>[] | ((p: Filter<TData>[]) => Filter<TData>[])) => { setFilters((prev) => { const value = typeof next === "function" ? next(prev) : next + if (!deepEqual(prev, value)) { + // Reset page to 1 when filters change + void setPage(1); + } return deepEqual(prev, value) ? prev : value // <─ 달라진 게 없으면 그대로 }) }, - [setFilters] + [setFilters, setPage] ) @@ -145,11 +158,12 @@ export function DataTableFilterList<TData>({ }, [externalFilters, setFilters, safeSetFilters]); React.useEffect(() => { - if (externalJoinOperator) { + if (externalJoinOperator && externalJoinOperator !== joinOperator) { console.log("=== 외부 조인 연산자 적용 ===", externalJoinOperator); + void setPage(1); // Reset page when join operator changes setJoinOperator(externalJoinOperator); } - }, [externalJoinOperator, setJoinOperator]); + }, [externalJoinOperator, setJoinOperator, joinOperator, setPage]); // ✅ 필터 변경 시 부모에게 알림 diff --git a/components/data-table/data-table-grobal-filter.tsx b/components/data-table/data-table-grobal-filter.tsx index fa0c809c..5714d92a 100644 --- a/components/data-table/data-table-grobal-filter.tsx +++ b/components/data-table/data-table-grobal-filter.tsx @@ -19,12 +19,25 @@ export function DataTableGlobalFilter() { shallow: false, }) + // Page state to reset when search changes + const [, setPage] = useQueryState("page", { + parse: (str) => str ? parseInt(str) : 1, + serialize: (val) => val.toString(), + eq: (a, b) => a === b, + clearOnDefault: true, + shallow: false, + }) + // Local tempValue to update instantly on user keystroke const [tempValue, setTempValue] = React.useState(searchValue ?? "") // Debounced callback that sets the URL param after `delay` ms const debouncedSetSearch = useDebouncedCallback((value: string) => { - if (value !== searchValue) setSearchValue(value.trim() === "" ? null : value); + if (value !== searchValue) { + // Reset page to 1 when search changes + void setPage(1); + setSearchValue(value.trim() === "" ? null : value); + } }, 300) // When user types, update local `tempValue` immediately, |
