| 2964 |
stevensc |
1 |
import React, { Suspense } from "react";
|
| 1 |
www |
2 |
import { connect } from "react-redux";
|
|
|
3 |
import { setTimelineUrl } from "../../../redux/feed/feed.actions";
|
|
|
4 |
import { feedTypes } from "../../../redux/feed/feed.types";
|
| 2964 |
stevensc |
5 |
import { addNotification } from "../../../redux/notification/notification.actions";
|
| 1 |
www |
6 |
|
| 2964 |
stevensc |
7 |
const PeopleYouMayKnow = React.lazy(() => import("../../../shared/helpers/people-you-may-know/PeopleYouMayKnow"));
|
|
|
8 |
const NotificationAlert = React.lazy(() => import("../../../shared/notification/NotificationAlert"));
|
|
|
9 |
const FeedSection = React.lazy(() => import("../feed-section/FeedSection"));
|
|
|
10 |
const ShareFeed = React.lazy(() => import("../share-feed/ShareFeed"));
|
|
|
11 |
const ShareModal = React.lazy(() => import("../share-modal/ShareModal"));
|
|
|
12 |
const SuggestedGroupsHelper = React.lazy(() => ("../../../shared/helpers/suggested-groups-helper/SuggestedGroupsHelper"));
|
|
|
13 |
const HomeNews = React.lazy(() => import("./HomeNews"));
|
|
|
14 |
const SocialNetworks = React.lazy(() => import("./SocialNetworks"));
|
|
|
15 |
|
| 1 |
www |
16 |
import styles from "./HomeSection.module.scss";
|
|
|
17 |
|
|
|
18 |
const HomeSection = (props) => {
|
|
|
19 |
// props destructuring
|
|
|
20 |
const { routeTimeline, addNotification } = props;
|
|
|
21 |
|
|
|
22 |
// backendVars destructuring
|
|
|
23 |
const { image, fullName, country, visits, connections, description, feed } = props.backendVars;
|
|
|
24 |
|
|
|
25 |
// redux destructuring
|
|
|
26 |
const { setTimelineUrl } = props;
|
| 2207 |
stevensc |
27 |
|
| 1 |
www |
28 |
setTimelineUrl(routeTimeline);
|
|
|
29 |
return (
|
|
|
30 |
<div>
|
|
|
31 |
<div className="main-section">
|
|
|
32 |
<div className={styles.mainSection}>
|
| 1449 |
steven |
33 |
<div className="d-none d-sm-none d-md-block d-lg-block">
|
|
|
34 |
<div className={styles.sectionHeader}>
|
| 2964 |
stevensc |
35 |
<Suspense
|
|
|
36 |
fallback={
|
|
|
37 |
<div className="w-100 h-100" style={{ display: "flex", placeItems: 'center' }}>
|
|
|
38 |
<Spinner />
|
|
|
39 |
</div>
|
|
|
40 |
}
|
|
|
41 |
>
|
|
|
42 |
<SuggestedGroupsHelper />
|
|
|
43 |
</Suspense>
|
|
|
44 |
<Suspense
|
|
|
45 |
fallback={
|
|
|
46 |
<div className="w-100 h-100" style={{ display: "flex", placeItems: 'center' }}>
|
|
|
47 |
<Spinner />
|
|
|
48 |
</div>
|
|
|
49 |
}
|
|
|
50 |
>
|
|
|
51 |
<SocialNetworks />
|
|
|
52 |
</Suspense>
|
| 1447 |
steven |
53 |
</div>
|
| 1 |
www |
54 |
</div>
|
|
|
55 |
<div className={styles.feedSection}>
|
| 2964 |
stevensc |
56 |
<Suspense
|
|
|
57 |
fallback={
|
|
|
58 |
<div className="w-100 h-100" style={{ display: "flex", placeItems: 'center' }}>
|
|
|
59 |
<Spinner />
|
|
|
60 |
</div>
|
|
|
61 |
}
|
|
|
62 |
>
|
|
|
63 |
<ShareFeed image={image} feedType={feedTypes.DASHBOARD} postUrl="/feed/add" />
|
|
|
64 |
</Suspense>
|
|
|
65 |
<Suspense
|
|
|
66 |
fallback={
|
|
|
67 |
<div className="w-100 h-100" style={{ display: "flex", placeItems: 'center' }}>
|
|
|
68 |
<Spinner />
|
|
|
69 |
</div>
|
|
|
70 |
}
|
|
|
71 |
>
|
|
|
72 |
<FeedSection
|
|
|
73 |
routeTimeline={routeTimeline}
|
|
|
74 |
feed={feed}
|
|
|
75 |
image={image}
|
|
|
76 |
/>
|
|
|
77 |
</Suspense>
|
| 1 |
www |
78 |
</div>
|
|
|
79 |
<div className={styles.peopleYouMayKnow}>
|
| 2964 |
stevensc |
80 |
<Suspense
|
|
|
81 |
fallback={
|
|
|
82 |
<div className="w-100 h-100" style={{ display: "flex", placeItems: 'center' }}>
|
|
|
83 |
<Spinner />
|
|
|
84 |
</div>
|
|
|
85 |
}
|
|
|
86 |
>
|
|
|
87 |
<PeopleYouMayKnow />
|
|
|
88 |
</Suspense>
|
|
|
89 |
<Suspense
|
|
|
90 |
fallback={
|
|
|
91 |
<div className="w-100 h-100" style={{ display: "flex", placeItems: 'center' }}>
|
|
|
92 |
<Spinner />
|
|
|
93 |
</div>
|
|
|
94 |
}
|
|
|
95 |
>
|
|
|
96 |
<HomeNews />
|
|
|
97 |
</Suspense>
|
| 1 |
www |
98 |
</div>
|
|
|
99 |
</div>
|
|
|
100 |
</div>
|
|
|
101 |
<ShareModal />
|
|
|
102 |
<NotificationAlert />
|
|
|
103 |
</div>
|
|
|
104 |
);
|
|
|
105 |
};
|
|
|
106 |
|
|
|
107 |
// const mapStateToProps = (state) => ({
|
|
|
108 |
|
|
|
109 |
// })
|
|
|
110 |
|
|
|
111 |
const mapDispatchToProps = {
|
|
|
112 |
setTimelineUrl: (url) => setTimelineUrl(url),
|
|
|
113 |
addNotification: (notification) => addNotification(notification),
|
|
|
114 |
};
|
|
|
115 |
|
|
|
116 |
export default connect(null, mapDispatchToProps)(HomeSection);
|