From e3e4ec8b8325a90baf6f394b8a0c8b57a5c18de0 Mon Sep 17 00:00:00 2001 From: "focp212@naver.com" Date: Mon, 20 Oct 2025 09:51:04 +0900 Subject: [PATCH] page update --- src/pages/support/faq/list-page.tsx | 74 +++++++++++++++----------- src/pages/support/qna/list-page.tsx | 80 +++++++++++++++++------------ 2 files changed, 90 insertions(+), 64 deletions(-) diff --git a/src/pages/support/faq/list-page.tsx b/src/pages/support/faq/list-page.tsx index 1f4326f..e933118 100644 --- a/src/pages/support/faq/list-page.tsx +++ b/src/pages/support/faq/list-page.tsx @@ -20,25 +20,6 @@ export const FaqListPage = () => { const { t } = useTranslation(); const [onActionIntersect, setOnActionIntersect] = useState(false); - const onIntersect: IntersectionObserverCallback = (entries: Array) => { - entries.forEach((entry: IntersectionObserverEntry) => { - if(entry.isIntersecting){ - console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); - if(onActionIntersect){ - callList(); - } - } - else{ - console.log('Element is no longer intersecting with the root.'); - } - }); - }; - - const { setTarget } = useIntersectionObserver({ - threshold: 1, - onIntersect - }); - const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM); const [nextCursor, setNextCursor] = useState(null); const [searchCl, setSearchCl] = useState('HEAD'); @@ -54,26 +35,59 @@ export const FaqListPage = () => { }); const { mutateAsync: faqList } = useFaqListMutation(); - const callList = () => { + + const onIntersect: IntersectionObserverCallback = (entries: Array) => { + entries.forEach((entry: IntersectionObserverEntry) => { + if(entry.isIntersecting){ + console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); + if(onActionIntersect && !!nextCursor){ + callList('page'); + } + } + else{ + console.log('Element is no longer intersecting with the root.'); + } + }); + }; + + const { setTarget } = useIntersectionObserver({ + threshold: 1, + onIntersect + }); + const callList = (type?: string) => { setOnActionIntersect(false); let listParams: FaqListParams = { category: selectedCategory, searchCl: (!!searchValue)? searchCl: null, searchValue: searchValue, - ...{page: pageParam} + ...{ + page: pageParam + } }; + if(type === 'page'){ + if(listParams.page){ + listParams.page.cursor = nextCursor; + } + } + else{ + setNextCursor(null); + if(listParams.page){ + listParams.page.cursor = null; + } + } faqList(listParams).then((rs: FaqListResponse) => { - setResultList([ - ...resultList, - ...rs.content - ]); + if(type === 'page'){ + setResultList([ + ...resultList, + ...rs.content + ]); + } + else{ + setResultList(rs.content); + } if(rs.hasNext){ setNextCursor(rs.nextCursor); - setPageParam({ - ...pageParam, - cursor: rs.nextCursor - }); setOnActionIntersect(true); } else{ @@ -113,8 +127,8 @@ export const FaqListPage = () => { }; useEffect(() => { + setNextCursor(null); callList(); - // eslint-disable-next-line react-hooks/exhaustive-deps }, [selectedCategory]); return ( diff --git a/src/pages/support/qna/list-page.tsx b/src/pages/support/qna/list-page.tsx index 0995c39..3aa83a2 100644 --- a/src/pages/support/qna/list-page.tsx +++ b/src/pages/support/qna/list-page.tsx @@ -18,31 +18,12 @@ import useIntersectionObserver from '@/widgets/intersection-observer'; export const QnaListPage = () => { const { navigate } = useNavigate(); - - const [onActionIntersect, setOnActionIntersect] = useState(false); - const onIntersect: IntersectionObserverCallback = (entries: Array) => { - entries.forEach((entry: IntersectionObserverEntry) => { - if(entry.isIntersecting){ - console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); - if(onActionIntersect){ - callList(); - } - } - else{ - console.log('Element is no longer intersecting with the root.'); - } - }); - }; - - const { setTarget } = useIntersectionObserver({ - threshold: 1, - onIntersect - }); - + const { t } = useTranslation(); + const midOptions = useStore.getState().UserStore.selectOptionsMids; const userMid = useStore.getState().UserStore.mid; - const { t } = useTranslation(); - + + const [onActionIntersect, setOnActionIntersect] = useState(false); const [mid, setMid] = useState(userMid); const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM); const [nextCursor, setNextCursor] = useState(null); @@ -57,7 +38,27 @@ export const QnaListPage = () => { }); const { mutateAsync: qnaList } = useQnaListMutation(); - const callList = () => { + + const onIntersect: IntersectionObserverCallback = (entries: Array) => { + entries.forEach((entry: IntersectionObserverEntry) => { + if(entry.isIntersecting){ + console.log('Element is now intersecting with the root. [' + onActionIntersect + ']'); + if(onActionIntersect && !!nextCursor){ + callList('page'); + } + } + else{ + console.log('Element is no longer intersecting with the root.'); + } + }); + }; + + const { setTarget } = useIntersectionObserver({ + threshold: 1, + onIntersect + }); + + const callList = (type?: string) => { setOnActionIntersect(false); let listParams: QnaListParams = { mid: mid, @@ -66,18 +67,30 @@ export const QnaListPage = () => { page: pageParam } }; + if(type === 'page'){ + if(listParams.page){ + listParams.page.cursor = nextCursor; + } + } + else{ + setNextCursor(null); + if(listParams.page){ + listParams.page.cursor = null; + } + } qnaList(listParams).then((rs: QnaListResponse) => { - setResultList([ - ...resultList, - ...rs.content - ]); + if(type === 'page'){ + setResultList([ + ...resultList, + ...rs.content + ]); + } + else{ + setResultList(rs.content); + } if(rs.hasNext){ setNextCursor(rs.nextCursor); - setPageParam({ - ...pageParam, - cursor: rs.nextCursor - }); setOnActionIntersect(true); } else{ @@ -86,8 +99,6 @@ export const QnaListPage = () => { }); }; - - const getQnaList = () => { let rs = []; for(let i=0;i { }; useEffect(() => { + setNextCursor(null); callList(); }, [statusCode]);