Rev 4017 | Rev 5205 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
/* 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="Mis Grupos:"
/>
<WidgetHelper
url="/helpers/groups-suggestion"
title="Grupos:"
/>
{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;