diff --git a/src/components/infiniteScroll.js b/src/components/infiniteScroll.js index 611e991a049abfbcaa26409b47b39c8c18ea343f..653d3649032c5f8bbc2cb0e1fa05ff3c94a9be23 100644 --- a/src/components/infiniteScroll.js +++ b/src/components/infiniteScroll.js @@ -6,20 +6,23 @@ import {ChannelItem} from "./channel/channelList"; function InfiniteScroll(props){ const [items, setItems] = useState([]); const [minId, setMinId] = useState(0); + const [minDate, setMinDate] = useState(''); const [isLoading, setIsLoading] = useState(false); + const [search, setSearch] =useState([]); + const page = props.pagename; const queryString1 = props.queryString1; const queryString2 = props.queryString2; + const min = props.min; const initialFetchData = async ()=>{ try{ const response = await fetch(`/api/${page}${queryString1}`); const jsonData = await response.json(); - - const newData = jsonData[page]; - setMinId(jsonData['minId']); if(page==='channels'){ + setMinDate(jsonData['minDate']); + const newData = jsonData[page]; if (newData.length > 0) { const components = []; for (let i = 0; i < newData.length; i += 2) { @@ -33,21 +36,31 @@ function InfiniteScroll(props){ ); components.push(component); - console.log('ne', newData[i]); } setItems((prevItem) => [...prevItem, ...components]); } - }else { - + }else if(page === 'recruits'){ + setMinId(jsonData['minId']); + const newData = jsonData[page]; if(newData.length > 0) { const components = newData.map((item) => ( <PageItem data={item}/> )); - + setItems(prevItem => [...prevItem, ...components]); } - console.log(`/api/${page}${queryString1}`); - } + } else{ + setMinId(jsonData['minId']); + const newData = jsonData['recruits']; + if(newData.length > 0) { + const components = newData.map((item) => ( + <PageItem data={item}/> + )); + + setSearch([]); + setSearch(prevItem => [...prevItem, ...components]); + } + } } catch(error){ console.log('Error during fetch:', error); @@ -56,24 +69,26 @@ function InfiniteScroll(props){ useEffect(() => { initialFetchData(); // 최초 렌더링 시에 데이터 가져오기 - console.log(`/api/${page}${queryString1}`); }, [page, queryString1, queryString2]); const fetchData = async ()=>{ - if (isLoading || minId === 0) return; + if (isLoading || minId === 0 || minDate === null) return; setIsLoading(true); try{ - const response = await fetch(`/api/${page}?minId=${minId}${queryString2}`); - console.log(`/api/${page}?minId=${minId}${queryString2}`); + const response = ''; + if(page === 'channels'){ + response = await fetch(`/api/${page}?${min}=${minDate}${queryString2}`); + }else{ + response = await fetch(`/api/${page}?${min}=${minId}${queryString2}`); + } + const jsonData = await response.json(); - - const newData = jsonData[page]; - setMinId(jsonData['minId']); if(page==='channels'){ - + setMinId(jsonData['minDate']); + const newData = jsonData[page]; if (newData.length > 0) { const components = []; for (let i = 0; i < newData.length; i += 2) { @@ -91,8 +106,9 @@ function InfiniteScroll(props){ } setItems((prevItem) => [...prevItem, ...components]); } - }else { - + }else if(page==='recruits'){ + setMinId(jsonData['minId']); + const newData = jsonData[page]; if(newData.length > 0) { const components = newData.map((item) => ( <PageItem data={item}/> @@ -100,7 +116,17 @@ function InfiniteScroll(props){ setItems(prevItem => [...prevItem, ...components]); } - } + } else{ + setMinId(jsonData['minId']); + const newData = jsonData["recruits"]; + if(newData.length > 0) { + const components = newData.map((item) => ( + <PageItem data={item}/> + )); + + setSearch(prevItem => [...prevItem, ...components]); + } + } } catch(error){ console.log('Error during fetch:', error); @@ -133,7 +159,11 @@ function InfiniteScroll(props){ return ( <div className="itemList"> - {items} + {page === "recruits" || page === "channels" ?( + items + ):( + search + )} {/* 로딩 중일 때 로딩 표시 */} {isLoading && <div className={InfiniteScrollStyles.loading}>Loading...</div>} diff --git a/src/components/recruit/modifyRecruit.js b/src/components/recruit/modifyRecruit.js index a29b2bf5ac8db10e61cbac4cdbf96c3064e94d00..3f763b01b7f98ad64632ea43915b834951b917b3 100644 --- a/src/components/recruit/modifyRecruit.js +++ b/src/components/recruit/modifyRecruit.js @@ -53,6 +53,7 @@ const ModifyRecruit=({isOpen, onClose, data})=>{ const handleSave = (e) => { e.preventDefault() + if(formData.info.timeCategory === "D"){ modifyInfo({ ...formData, diff --git a/src/components/recruit/recruitList.js b/src/components/recruit/recruitList.js index ab87b296f88b47c38137d97ba7fb2c945de16920..84e7ab616018e84b1713664f5b5cbcbc50bd308c 100644 --- a/src/components/recruit/recruitList.js +++ b/src/components/recruit/recruitList.js @@ -146,7 +146,6 @@ function RecruitList(){ const [generatedUrl, setGeneratedUrl] = useState('recruits'); const [firstQueryString, setFirstQueryString] = useState(''); const [secondQueryString, setSecondQueryString] = useState(''); - const [forceRender, setForceRender] = useState(false); const handleUrlGeneration = (url) => { setGeneratedUrl(url); @@ -159,11 +158,6 @@ function RecruitList(){ const handleSecondQueryString = (url) => { setSecondQueryString(url); }; - - useEffect(() => { - setForceRender((prev) => !prev); - console.log('Component has been re-rendered'); - }, [generatedUrl, firstQueryString, secondQueryString]) return( <div className={recruitListStyles.RecruitList}> @@ -177,6 +171,7 @@ function RecruitList(){ pagename={generatedUrl} queryString1={firstQueryString} queryString2={secondQueryString} + min='minId' /> </div> )