Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */
import React, { Suspense } from 'react'
import { useDispatch } from 'react-redux'
import { setTimelineUrl } from '../../../redux/feed/feed.actions'
import { feedTypes } from '../../../redux/feed/feed.types'
import NotificationAlert from '../../../shared/notification/NotificationAlert'
import SocialNetworks from './SocialNetworks'
import ShareFeed from '../share-feed/ShareFeed'
import PeopleYouMayKnow from '../../../shared/helpers/people-you-may-know/PeopleYouMayKnow'
import HomeNews from './HomeNews'
import WidgetHelper from '../../../shared/helpers/my-groups-helper/MyGroups'
import Spinner from '../../../shared/loading-spinner/Spinner'

// Lazy Components
const FeedSection = React.lazy(() => import('../feed-section/FeedSection'))

// Responsive Flags
const isMobile = window.innerWidth < 1200

const HomeSection = ({ routeTimeline, backendVars }) => {
  const dispatch = useDispatch()
  const { image, feed } = backendVars

  dispatch(setTimelineUrl(routeTimeline))

  return (
    <>
      <div className="main-section">
        <div className='main-section-data'>
          <div className="main-left-sidebar d-none d-md-flex">
            <WidgetHelper
              url="/helpers/my-groups"
              title={`${LABELS.MY_GROUPS}:`}
            />
            <WidgetHelper
              url="/helpers/groups-suggestion"
              title={`${LABELS.GROUPS}:`}
            />
            {isMobile && <PeopleYouMayKnow />}
            {isMobile && <HomeNews />}
            <SocialNetworks />
          </div>
          <div className='feed-section'>
            <ShareFeed
              image={image}
              feedType={feedTypes.DASHBOARD}
              postUrl="/feed/add"
            />
            <Suspense fallback={<Spinner />}>
              <FeedSection
                routeTimeline={routeTimeline}
                feed={feed}
                image={image}
              />
            </Suspense>
          </div>
          <div className='right-sidebar'>
            {!isMobile && <PeopleYouMayKnow />}
            {!isMobile && <HomeNews />}
          </div>
        </div>
      </div>
      <NotificationAlert />
    </>
  )
}

export default HomeSection