Proyectos de Subversion LeadersLinked - SPA

import React, { useEffect } from 'react'

import { useParams } from 'react-router-dom'

import { useDispatch, useSelector } from 'react-redux'

import { useFetch } from '@hooks'

import { feedTypes } from '@store/feed/feed.types'

import {

  fetchFeeds,

  setCurrentPage,

  setTimelineUrl

} from '@store/feed/feed.actions'

import Spinner from '@components/UI/Spinner'

import AppGrid from '@components/UI/layout/AppGrid'

import GroupWidget from '@components/widgets/linkedin/group-widget'

import GroupActions from '@components/group/group-actions/GroupActions'

import AboutGroup from '@components/group/AboutGroup'

import ShareComponent from '@components/dashboard/linkedin/share/ShareComponent'

import FeedList from '@components/dashboard/linkedin/feed-list/FeedList'

import Pagination from '@components/common/Pagination'

import Members from '@components/group/members/Members'

import ShareModal from '@components/modals/ShareModal'

const GroupPage = () => {

  const { uuid } = useParams()

  const dispatch = useDispatch()

  const { data, isLoading, refetch } = useFetch(`/group/view/${uuid}`)

  const { feeds, timelineUrl, currentPage, loading, pages } = useSelector(

    ({ feed }) => feed

  )

  const allFeeds = feeds.allIds.map((id) => feeds.byId[id])

  const onChangePageHandler = (currentPage) => {

    dispatch(setCurrentPage(currentPage))

    window.scrollTo(0, 0)

  }

  useEffect(() => {

    dispatch(fetchFeeds(timelineUrl, currentPage))

  }, [timelineUrl, currentPage])

  useEffect(() => {

    dispatch(setTimelineUrl(`/feed/timeline/${data.group_uuid}/group`))

  }, [data])

  if (isLoading) {

    return <Spinner />

  }

  return (

    <>

      <AppGrid

        renderSidebar={() => <GroupWidget group={data} />}

        renderMain={() => (

          <>

            <GroupActions {...data} refetch={refetch} />

            {data.without_feeds ? (

              <AboutGroup {...data} />

            ) : (

              <>

                <ShareComponent

                  feedType={feedTypes.GROUP}

                  postUrl={`/feed/add/group/${uuid}`}

                  image={data?.image}

                />

                <FeedList feeds={allFeeds} loading={loading} />

                <Pagination

                  pages={pages}

                  page={currentPage}

                  onChange={onChangePageHandler}

                />

              </>

            )}

          </>

        )}

        renderAside={() => (

          <>

            <Members id={data.group_uuid} />

            {!data.without_feeds && <AboutGroup {...data} />}

          </>

        )}

      />

      <ShareModal timelineUrl={timelineUrl} currentPage={currentPage} />

    </>

  )

}

export default GroupPage