- getListDateGroup 수정

- 알림톡 필터 추가
- 일부 부가서비스 엑셀다운로드 바텀시트 추가

src/pages/additional-service/payout/list-page.tsx

@@ -28,36 +28,14 @@ import { PayoutDisbursementStatusBtnGroup } from '@/entities/additional-service/
 import { ListDateGroup } from '@/entities/additional-service/ui/list-date-group';
 import { AdditionalServiceCategory } from '@/entities/additional-service/model/types';
 import { useStore } from '@/shared/model/store';
-import useIntersectionObserver from '@/widgets/intersection-observer';
 
 export const PayoutListPage = () => {
   const { navigate } = useNavigate();
   const userMid = useStore.getState().UserStore.mid;
 
-  const [onActionIntersect, setOnActionIntersect] = useState<boolean>(false);
-  const onIntersect: IntersectionObserverCallback = (entries: Array<IntersectionObserverEntry>) => {
-    entries.forEach((entry: IntersectionObserverEntry) => {
-      if (entry.isIntersecting) {
-        console.log('Element is now intersecting with the root. [' + onActionIntersect + ']');
-        if (onActionIntersect) {
-          callExtensionPayoutList();
-        }
-      }
-      else {
-        console.log('Element is no longer intersecting with the root.');
-      }
-    });
-  };
-
-  const { setTarget } = useIntersectionObserver({
-    threshold: 1,
-    onIntersect
-  });
-
   const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
   const [listItems, setListItems] = useState<Array<PayoutContent>>([]);
   const [filterOn, setFilterOn] = useState<boolean>(false);
-  const [nextCursor, setNextCursor] = useState<string | null>(null);
   const [pageParam, setPageParam] = useState<DefaultRequestPagination>(DEFAULT_PAGE_PARAM);
   const [mid, setMid] = useState<string>(userMid);
   const [searchDateType, setSearchDateType] = useState<PayoutSearchDateType>(PayoutSearchDateType.REQUEST_DATE);
@@ -83,17 +61,8 @@ export const PayoutListPage = () => {
 
   const callExtensionPayoutList = (option?: {
     sortType?: SortTypeKeys,
-    status?: PayoutDisbursementStatus,
-    resetPage?: boolean
+    status?: PayoutDisbursementStatus
   }) => {
-    setOnActionIntersect(false);
-
-    const currentPageParam = option?.resetPage
-      ? { ...DEFAULT_PAGE_PARAM, sortType: option?.sortType ?? sortType }
-      : { ...pageParam, sortType: option?.sortType ?? sortType };
-
-    setPageParam(currentPageParam);
-
 		let newMinAmount = minAmount;
 		if(!!minAmount && typeof(minAmount) === 'string'){
 			newMinAmount = parseInt(minAmount);
@@ -110,25 +79,16 @@ export const PayoutListPage = () => {
       status: option?.status ?? status,
       minAmount: newMinAmount,
       maxAmount: newMaxAmount,
-      page: currentPageParam
+      page: pageParam
     };
+
+    if(params.page){
+      params.page.sortType = option?.sortType || sortType;
+      setPageParam(params.page);
+    }
+
     extensionPayoutList(params).then((rs: ExtensionPayoutListResponse) => {
-      // resetPage면 기존 리스트 무시, 아니면 추가
-      setListItems(option?.resetPage ? rs.content : [
-        ...listItems,
-        ...rs.content
-      ]);
-      if (rs.hasNext) {
-        setNextCursor(rs.nextCursor);
-        setPageParam({
-          ...currentPageParam,
-          cursor: rs.nextCursor
-        });
-        setOnActionIntersect(true)
-      }
-      else {
-        setNextCursor(null);
-      }
+      setListItems(rs.content);
     });
   };
 
@@ -156,21 +116,18 @@ export const PayoutListPage = () => {
   const onClickToSort = (sort: SortTypeKeys) => {
     setSortType(sort);
     callExtensionPayoutList({
-      sortType: sort,
-      resetPage: true
+      sortType: sort
     });
   };
   const onClickToDisbursementStatus = (val: PayoutDisbursementStatus) => {
     setStatus(val);
     callExtensionPayoutList({
-      status: val,
-      resetPage: true
+      status: val
     });
   };
 
   useEffect(() => {
-    // 필터 조건이 변경되면 첫 페이지부터 다시 시작
-    callExtensionPayoutList({ resetPage: true });
+    callExtensionPayoutList();
   }, [
     mid,
     searchDateType,
@@ -298,7 +255,6 @@ export const PayoutListPage = () => {
             </section>
             <section className="transaction-list">
               { getListDateGroup() }
-              <div ref={setTarget}></div>
             </section>
             <div className="apply-row">
               <button