Proyectos de Subversion LeadersLinked - SPA

import React, { useEffect, useState } from 'react'

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

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

import { Container } from '@mui/material'

import {

  fetchFeeds,

  setCurrentPage,

  setTimelineUrl

} from '../../redux/feed/feed.actions'

import { getBackendVars } from '../../services/backendVars'

import PaginationComponent from '@app/components/UI/PaginationComponent'

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

import AboutCompany from '@app/components/company/AboutCompany'

import CompanyActions from '@app/components/company/CompanyActions'

import CompanyFollowers from '@app/components/company/CompanyFollowers'

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

import GroupInfo from '@app/components/widgets/linkedin/InfoWidget'

import './styles/linkedin.scss'

const LinkedInCompany = () => {

  const [backendVars, setBackendVars] = useState(null)

  const [actionsUrls, setActionsUrls] = useState(null)

  const [isFollower, setIsFollower] = useState(false)

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

    ({ feed }) => feed

  )

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

  const { uuid } = useParams()

  const dispatch = useDispatch()

  const getCompanyVars = () => {

    getBackendVars(`/company/view/${uuid}`).then((vars) => {

      const actions = {}

      Object.entries(vars).forEach(([key, value]) => {

        if (!key.includes('link')) return

        actions[key] = value

      })

      setActionsUrls(actions)

      dispatch(setTimelineUrl(vars.link_timeline))

      setIsFollower(!!vars.link_unfollow)

      setBackendVars(vars)

    })

  }

  const onChangePageHandler = (currentPage) => {

    dispatch(setCurrentPage(currentPage))

    window.scrollTo(0, 0)

  }

  useEffect(() => {

    dispatch(fetchFeeds(timelineUrl, currentPage))

  }, [timelineUrl, currentPage])

  return (

    <Container>

      <AppGrid

        renderSidebar={() => (

          <GroupInfo

            cover={backendVars?.cover}

            image={backendVars?.image}

            name={backendVars?.company_name}

            overview={backendVars?.overview}

            id={backendVars?.company_uuid}

            totalMembers={backendVars?.total_followers}

            groupType={backendVars?.company_size}

            accessibility={backendVars?.industry}

          />

        )}

        renderMain={() => (

          <>

            <CompanyActions

              name={backendVars?.company_name}

              image={backendVars?.image}

              companyId={backendVars?.company_uuid}

              cover={backendVars?.cover}

              overview={backendVars?.overview}

              refetch={getCompanyVars}

              actionLinks={actionsUrls}

            />

            {!isFollower ? <AboutCompany {...backendVars} /> : null}

            {isFollower && !loading ? <FeedList feeds={allFeeds} /> : null}

            <PaginationComponent

              pages={pages}

              currentActivePage={currentPage}

              onChangePage={onChangePageHandler}

            />

          </>

        )}

        renderAside={() => (

          <>

            <CompanyFollowers companyId={uuid} />

            <AboutCompany {...backendVars} />

          </>

        )}

      />

    </Container>

  )

}

export default LinkedInCompany