Rev 6622 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
import React, { Suspense, useEffect } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import { fetchFeeds, setCurrentPage } from '../../redux/feed/feed.actions'
import EmptySection from '../UI/EmptySection'
import Spinner from '../UI/Spinner'
import Feed from '../feed/Feed'
const PaginationComponent = React.lazy(() =>
import('../UI/PaginationComponent')
)
const isDashboard = window.location.pathname.includes('dashboard')
const isMobile = window.innerWidth < 768
const FeedSection = ({ feed, image }) => {
const { allFeeds, timelineUrl, pages, currentPage, loading } = useSelector(
({ feed }) => feed
)
const labels = useSelector(({ intl }) => intl.labels)
const dispatch = useDispatch()
const fetchSpecificFeed = () => {
dispatch(fetchFeeds(timelineUrl + '/feed/' + feed, 1))
}
useEffect(() => {
if (feed) {
fetchSpecificFeed()
return
}
dispatch(fetchFeeds(timelineUrl, currentPage))
}, [timelineUrl, currentPage, feed])
const onChangePageHandler = (currentPage) => {
dispatch(setCurrentPage(currentPage))
dispatch(fetchFeeds(timelineUrl, currentPage))
window.scrollTo(0, 0)
}
if (loading) {
return <Spinner />
}
return (
<>
{allFeeds.length ? (
allFeeds.map((feed, index) => {
if (isMobile && isDashboard && index === 5) {
const PeopleYouMayKnow = React.lazy(() =>
import('../widgets/default/PeopleYouMayKnow')
)
return (
<>
<Suspense fallback={null}>
<PeopleYouMayKnow />
</Suspense>
<Feed
feed={feed}
key={feed.feed_unique}
owner_shared={feed.owner_shared}
image={image}
/>
</>
)
}
if (isMobile && isDashboard && index === 8) {
const HomeNews = React.lazy(() =>
import('../widgets/default/HomeNews')
)
return (
<>
<Suspense fallback={null}>
<HomeNews />
</Suspense>
<Feed
feed={feed}
key={feed.feed_unique}
owner_shared={feed.owner_shared}
image={image}
/>
</>
)
}
return (
<Feed
feed={feed}
key={feed.feed_unique}
owner_shared={feed.owner_shared}
image={image}
/>
)
})
) : (
<EmptySection message={labels.not_available_feeds} />
)}
<Suspense fallback={null}>
<PaginationComponent
onChangePage={onChangePageHandler}
pages={pages}
isRow
currentActivePage={currentPage}
/>
</Suspense>
</>
)
}
export default React.memo(FeedSection)