Skip to content

Commit 37e911a

Browse files
RupeshiyaRupeshiya
authored
Merge pull request #574 from Rupeshiya/user_activity
User activity
2 parents 48d0d88 + 82aae41 commit 37e911a

File tree

8 files changed

+218
-124
lines changed

8 files changed

+218
-124
lines changed

‎package-lock.json‎

Lines changed: 18 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/actions/usersAction.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -221,4 +221,6 @@ export const activateDeactivateToggler = () => async (dispatch) => {
221221
} catch (error) {
222222
dispatch(errorHandler(error))
223223
}
224-
}
224+
}
225+
226+
// GET USER'S ACTIVITY

‎src/user/Activity/Activity.js‎

Lines changed: 54 additions & 119 deletions
Original file line numberDiff line numberDiff line change
@@ -8,146 +8,81 @@ import { connect } from 'react-redux'
88
import { getEventById } from '../../actions/eventAction'
99
// import { getProjectById } from '../../actions/projectAction'
1010
import { getPostById } from '../../actions/postAction'
11-
import PostPopup from './Popups/PostPopup';
12-
import EventPopup from './Popups/EventPopup';
11+
import LeftNav from '../dashboard/Community/LeftNav'
12+
import OrgProfile from '../dashboard/Community/components/OrgProfile';
13+
import OrgPermission from '../dashboard/Community/components/OrgPermission';
14+
import OrgSettings from '../dashboard/Community/components/OrgSettings';
15+
import OrgAuth from '../dashboard/Community/components/OrgAuth';
16+
import OrgMaintenance from '../dashboard/Community/components/OrgMaintenance';
17+
import Users from './Users';
18+
import ActivityTimeline from './ActivityTimeline';
1319

1420
class Activity extends Component {
1521
constructor(props) {
1622
super(props);
1723
this.state = {
1824
org: true,
19-
showEvent: false,
20-
showPost: false,
21-
showProject: false,
22-
eventId: '',
23-
postId: ''
24-
}
25+
option: {
26+
profile: false,
27+
settings: false,
28+
permission: false,
29+
authentication: false,
30+
maintenance: false,
31+
activity: true,
32+
details: true
33+
},
34+
};
2535
}
2636

27-
showPopup = (modalType, id) => {
28-
console.log('type ', modalType, this.state)
29-
30-
if (Boolean(modalType === "Event")) {
31-
// CHANGE HARD CODED DATA TO ID
32-
this.props.getEventById("5ef76594201b3f2dec2acf20");
33-
this.setState({
34-
showEvent: true,
35-
eventId: '5ef76594201b3f2dec2acf20'
36-
})
37-
}
38-
39-
if (Boolean(modalType === "Project")) {
40-
// CHANGE HARD CODED DATA TO ID
41-
this.props.history.push(`/5efca0d9081c631ed098944b/proj-info`)
42-
}
37+
changeOption = (name) => {
38+
const keys = Object.keys(this.state.option);
39+
let item = keys.filter((k) => k === name);
40+
console.log("changeOption items ", item);
41+
this.setState({ option: { profile: false } });
42+
this.setState({ option: { [name]: true } });
43+
this.setState({ view: name });
44+
};
4345

44-
if (Boolean(modalType === "Post")) {
45-
// CHANGE HARD CODED DATA TO ID
46-
this.props.getPostById("5efd836db08e9e369050cca1");
47-
this.setState({
48-
showEvent: false,
49-
showPost: true,
50-
postId: "5efd836db08e9e369050cca1",
51-
});
52-
}
53-
}
54-
55-
handleClose = () => {
56-
this.setState({
57-
showEvent: false,
58-
showPost: false
59-
})
46+
componentDidMount() {
47+
this.setState({ view: 'details' })
6048
}
6149

6250
render() {
63-
const { showEvent, showPost, eventId, postId } = this.state
64-
const activity = [
65-
{
66-
type: 'Post',
67-
text: "User X created a post!",
68-
},
69-
{
70-
type: 'Project',
71-
text: "User X created a Project!",
72-
},
73-
{
74-
type: 'Event',
75-
text: "User X created an Event!",
76-
},
77-
{
78-
type: 'Comment',
79-
text: "User X commented on GSOC !",
80-
},
81-
{
82-
type: 'Post',
83-
text: "User X created a post!",
84-
},
85-
{
86-
type: 'Event',
87-
text: "User X created an Event!",
88-
},
89-
{
90-
type: 'Comment',
91-
text: "User X commented on GSOC !",
92-
},
93-
{
94-
type: 'Post',
95-
text: "User X created a post!",
96-
},
97-
{
98-
type: 'Event',
99-
text: "User X created an Event!",
100-
},
101-
{
102-
type: 'Comment',
103-
text: "User X commented on GSOC !",
104-
},
105-
{
106-
type: 'Post',
107-
text: "User X created a post!",
108-
},
109-
{
110-
type: 'Event',
111-
text: "User X created an Event!",
112-
},
113-
{
114-
type: 'Comment',
115-
text: "User X commented on GSOC !",
116-
},
117-
];
51+
const { view } = this.state
11852

11953
return (
12054
<div className="overall_container">
12155
<div className="main_navigation">
122-
<Navigation orgSettings={this.state.org} />
56+
<Navigation orgSettings={this.state.org} user={this.props.user} />
12357
</div>
124-
<div className="user_activity_view">
58+
<div className="org_settings_view">
12559
<div className="main_section">
126-
<div className="timelines__container">
127-
<p className="activity__header">User activity</p>
128-
<Timeline mode="alternate">
129-
{activity.map((act, index) => (
130-
<Timeline.Item
131-
key={index}
132-
onClick={this.showPopup.bind(this, act.type, index)}
133-
>
134-
<p className="activity__link">{act.text}</p>
135-
</Timeline.Item>
136-
))}
137-
</Timeline>
60+
<div className="left_nav">
61+
<p className="header_text">Community Settings</p>
62+
<LeftNav
63+
data={{
64+
option: this.state.option,
65+
changeOption: this.changeOption.bind(this),
66+
}}
67+
/>
68+
</div>
69+
<div className="right_section">
70+
{view === "profile" ? <OrgProfile /> : null}
71+
{view === "permission" ? <OrgPermission /> : null}
72+
{view === "settings" ? <OrgSettings /> : null}
73+
{view === "authentication" ? <OrgAuth /> : null}
74+
{view === "maintenance" ? <OrgMaintenance /> : null}
75+
{view === "activity" ? (
76+
<Users
77+
handleOption={{ changeOption: this.changeOption.bind(this) }}
78+
/>
79+
) : null}
80+
{view === "details" ? (
81+
<ActivityTimeline />
82+
) : null}
13883
</div>
13984
</div>
14085
</div>
141-
<EventPopup
142-
show={showEvent}
143-
onHide={this.handleClose}
144-
eventId={eventId}
145-
/>
146-
<PostPopup
147-
show={showPost}
148-
onHide={this.handleClose}
149-
postId={postId}
150-
/>
15186
</div>
15287
);
15388
}

‎src/user/Activity/ActivityTimeline.js‎

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
import React from 'react'
2+
import { Timeline } from "antd";
3+
import "antd/dist/antd.css";
4+
import './activityTimeline.scss'
5+
import { Pagination } from 'antd'
6+
7+
export default function ActivityTimeline() {
8+
const activity = [{
9+
type: "Post",
10+
text: "User X created a post!",
11+
},
12+
{
13+
type: "Project",
14+
text: "User X created a Project!",
15+
},
16+
{
17+
type: "Event",
18+
text: "User X created an Event!",
19+
},
20+
{
21+
type: "Comment",
22+
text: "User X commented on GSOC !",
23+
},
24+
{
25+
type: "Post",
26+
text: "User X created a post!",
27+
},
28+
{
29+
type: "Event",
30+
text: "User X created an Event!",
31+
},
32+
{
33+
type: "Comment",
34+
text: "User X commented on GSOC !",
35+
},
36+
{
37+
type: "Post",
38+
text: "User X created a post!",
39+
},
40+
{
41+
type: "Event",
42+
text: "User X created an Event!",
43+
},
44+
{
45+
type: "Comment",
46+
text: "User X commented on GSOC !",
47+
},
48+
{
49+
type: "Post",
50+
text: "User X created a post!",
51+
},
52+
{
53+
type: "Event",
54+
text: "User X created an Event!",
55+
},
56+
{
57+
type: "Comment",
58+
text: "User X commented on GSOC !",
59+
},
60+
];
61+
62+
const onShowSizeChange = (currentPage, pageSize) => {
63+
console.log('currentPage pageSize ', currentPage, pageSize)
64+
// this.props.getMembers(pageSize, currentPage)
65+
}
66+
67+
const handlePagination = (pageNumber) => {
68+
console.log('page number ', pageNumber);
69+
// this.props.getMembers(10, pageNumber)
70+
}
71+
72+
return (
73+
<div className="activity__timeline">
74+
<div className="activity__timeline__header__container">
75+
<p className="activity__timeline__header">User activity</p>
76+
</div>
77+
<div className="activities__list">
78+
<Timeline>
79+
{activity.map((act, index) => (
80+
<Timeline.Item
81+
key={index}
82+
>
83+
<p className="activity__link">{act.text}</p>
84+
</Timeline.Item>
85+
))}
86+
</Timeline>
87+
<div className="pagination__container">
88+
<Pagination
89+
showSizeChanger
90+
onShowSizeChange={onShowSizeChange}
91+
defaultCurrent={1}
92+
total={500}
93+
onChange={handlePagination}
94+
/>
95+
</div>
96+
</div>
97+
</div>
98+
)
99+
}

‎src/user/Activity/Users.js‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,19 +42,24 @@ class Users extends Component {
4242
this.props.getMembers(10, pageNumber)
4343
}
4444

45+
handleViewOption = (name, userId) => {
46+
this.props.history.push(`/activity/${userId}`);
47+
this.props.handleOption.changeOption(name)
48+
}
49+
4550
render() {
4651
const { users } = this.state;
4752
return (
4853
<div className="activity__main__container">
4954
<div className="header__text">
50-
<p className="activity__header">Users activity</p>
55+
<p className="activity__header">Users List</p>
5156
</div>
5257
<div className="timeline__container">
5358
<Timeline>
5459
{users.map((user, index) => (
5560
<Timeline.Item
5661
key={index}
57-
onClick={() => this.props.history.push(`/activity/${user._id}`)}
62+
onClick={() => this.handleViewOption("details", user._id)}
5863
>
5964
<div className="user__wrapper">
6065
<img src={Img} alt="user_image" className="user__image mr-2"/>

0 commit comments

Comments
 (0)