diff --git a/src/components/pages/master-data/product-category/ProductCategoryTable.tsx b/src/components/pages/master-data/product-category/ProductCategoryTable.tsx index e25dfd56..11199c73 100644 --- a/src/components/pages/master-data/product-category/ProductCategoryTable.tsx +++ b/src/components/pages/master-data/product-category/ProductCategoryTable.tsx @@ -1,6 +1,6 @@ 'use client'; -import { ChangeEventHandler, useEffect, useState } from 'react'; +import { ChangeEventHandler, useEffect, useRef, useState } from 'react'; import useSWR from 'swr'; import { CellContext, ColumnDef, SortingState } from '@tanstack/react-table'; import toast from 'react-hot-toast'; @@ -22,6 +22,7 @@ import { ProductCategoryApi } from '@/services/api/master-data'; import { cn } from '@/lib/helper'; import { isResponseError, isResponseSuccess } from '@/lib/api-helper'; import { useTableFilter } from '@/services/hooks/useTableFilter'; +import { useUiStore } from '@/stores/ui/ui.store'; import { ROWS_OPTIONS } from '@/config/constant'; const RowOptionsMenu = ({ @@ -80,6 +81,9 @@ const RowOptionsMenu = ({ }; const ProductCategoryTable = () => { + const { searchValue, setSearchValue, resetSearchValue } = useUiStore(); + const previousPathRef = useRef(null); + const { state: tableFilterState, updateFilter, @@ -87,7 +91,7 @@ const ProductCategoryTable = () => { setPageSize, toQueryString: getTableFilterQueryString, } = useTableFilter({ - initial: { search: '', nameSort: '' }, + initial: { search: searchValue, nameSort: '' }, paramMap: { page: 'page', pageSize: 'limit', nameSort: 'sort_name' }, }); @@ -188,6 +192,7 @@ const ProductCategoryTable = () => { }; const searchChangeHandler: ChangeEventHandler = (e) => { + setSearchValue(e.target.value); updateFilter('search', e.target.value); }; @@ -196,6 +201,28 @@ const ProductCategoryTable = () => { setPageSize(newVal.value as number); }; + useEffect(() => { + // Store current path on mount + previousPathRef.current = window.location.pathname; + + return () => { + const currentPath = window.location.pathname; + + // if both paths are within /master-data/product-category module + const isCurrentPathProductCategory = currentPath.includes( + '/master-data/product-category' + ); + const isPreviousPathProductCategory = previousPathRef.current?.includes( + '/master-data/product-category' + ); + + // reset if we outside product category module entirely + if (isPreviousPathProductCategory && !isCurrentPathProductCategory) { + resetSearchValue(); + } + }; + }, [resetSearchValue]); + useEffect(() => { const isNameSorted = sorting.find((sortItem) => sortItem.id === 'name'); if (!isNameSorted) {