Skip to content

Commit 77d0286

Browse files
vaibhavdarenvaibhavdaren
authored
Merge pull request #581 from ksraj123/feature-wikis
Wikis Feature
2 parents 3db63c6 + 4ef554f commit 77d0286

24 files changed

+1405
-10
lines changed

‎package-lock.json

+354-7
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+3-1
Original file line numberDiff line numberDiff line change
@@ -35,8 +35,10 @@
3535
"react-ga": "^3.1.2",
3636
"react-icons": "^3.10.0",
3737
"react-images": "^1.1.7",
38+
"react-loading-overlay": "^1.0.1",
3839
"react-lottie": "^1.2.3",
39-
"react-markdown-editor-lite": "^1.1.4",
40+
"react-markdown": "^4.3.1",
41+
"react-mde": "^10.2.1",
4042
"react-moment": "^0.9.7",
4143
"react-redux": "^7.2.0",
4244
"react-responsive": "^8.0.3",

‎src/actions/types.js

+1
Original file line numberDiff line numberDiff line change
@@ -53,5 +53,6 @@ export const GET_DEVICE_ANALYTICS ="GET_DEVICE_ANALYTICS"
5353
export const GET_MOSTVIEWED_ANALYTICS ="GET_MOSTVIEWED_ANALYTICS"
5454
export const GET_PROPOSALVIEW_ANALYTICS="GET_PROPOSALVIEW_ANALYTICS"
5555
export const ACTIVATE_DEACTIVATE_ACCOUNT_TOGGLER = "ACTIVATE_DEACTIVATE_ACCOUNT_TOGGLER";
56+
export const GET_WIKIS = "GET_WIKIS";
5657
export const CLEAR_INVITE_LINK = "CLEAR_INVITE_LINK";
5758
export const GET_LOGIN_OPTIONS = "GET_LOGIN_OPTIONS";

‎src/actions/wikisAction.js

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import axios from "axios";
2+
import { GET_WIKIS } from "./types";
3+
import { BASE_URL } from "./baseApi";
4+
import { errorHandler } from "../utils/errorHandler";
5+
6+
export const getWikis = () => async (dispatch) => {
7+
try {
8+
const res = await axios.get(`${BASE_URL}/wikis`);
9+
dispatch({
10+
type: GET_WIKIS,
11+
payload: res.data.wikis,
12+
});
13+
} catch (error) {
14+
dispatch(errorHandler(error));
15+
}
16+
};

‎src/reducers/index.js

+2
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import proposalReducer from "./proposalReducer";
1414
import adminReducers from "./adminReducers";
1515
import commentReducer from "./commentReducer";
1616
import analyticsReducer from './analyticsReducer';
17+
import wikisReducer from './wikisReducer';
1718

1819
const rootReducer = combineReducers({
1920
auth: authReducers,
@@ -22,6 +23,7 @@ const rootReducer = combineReducers({
2223
notification: notificationReducer,
2324
error: errorReducer,
2425
dashboard: dashboardReducer,
26+
wikis: wikisReducer,
2527
insight: insightReducer,
2628
org: orgReducer,
2729
event: eventReducer,

‎src/reducers/wikisReducer.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { GET_WIKIS } from "../actions/types";
2+
const initialState = {
3+
wikis: "",
4+
};
5+
6+
export default (state = initialState, action) => {
7+
switch (action.type) {
8+
case GET_WIKIS: {
9+
console.log(`Action Recieved in reducer! ${action.type}`);
10+
console.log(action.payload);
11+
return {
12+
...state,
13+
wikis: action.payload,
14+
};
15+
}
16+
default: {
17+
return state;
18+
}
19+
}
20+
};

‎src/router.js

+2
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import Dashboard from "./user/dashboard/dashboard";
55
import PinnedPosts from "./user/pinned-posts/pinned-posts";
66
import Profile from "./user/profile/profile";
77
import Organization from "./user/organization/organization";
8+
import Wikis from "./user/wikis/Wikis";
89
import NotFound from "./404/notFound";
910
import Settings from "./user/dashboard/settings/Settings";
1011
import Projects from "./user/projects/projects";
@@ -35,6 +36,7 @@ const Router = () => (
3536
<PrivateRoute exact path="/profile/:id" component={Profile} />
3637
<PrivateRoute exact path="/:id/proj-info" component={ProjInfo} />
3738
<PrivateRoute exact path="/organization" component={Organization} />
39+
<PrivateRoute exact path="/wikis" component={Wikis} />
3840
<PrivateRoute exact path="/settings" component={Settings} />
3941
<PrivateRoute exact path="/projects" component={Projects} />
4042
<PrivateRoute exact path="/events" component={Events} />

‎src/user/dashboard/navigation/navigation.js

+11-2
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,11 @@ class Navigation extends Component {
105105
className={this.props.org ? "active" : "inactive"}
106106
link="/organization"
107107
/>
108-
108+
<ListItem
109+
name="Wikis"
110+
className={this.props.wikis ? "active" : "inactive"}
111+
link="/wikis"
112+
/>
109113
<ListItem
110114
name="Events"
111115
className={this.props.event ? "active" : "inactive"}
@@ -200,7 +204,12 @@ class Navigation extends Component {
200204
link="/organization"
201205
isMobile="true"
202206
/>
203-
207+
<ListItem
208+
name="Wikis"
209+
className={this.props.wikis ? "active" : "inactive"}
210+
link="/wikis"
211+
isMobile="true"
212+
/>
204213
<ListItem
205214
name="Events"
206215
className={this.props.event ? "active" : "inactive"}

‎src/user/wikis/Editor/Editor.js

+118
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
1+
import React, { Component } from "react";
2+
import DeleteOutlinedIcon from "@material-ui/icons/DeleteOutlined";
3+
import CancelButton from "@material-ui/icons/ClearOutlined";
4+
import SaveButton from "@material-ui/icons/SaveOutlined";
5+
import "react-mde/lib/styles/css/react-mde-all.css";
6+
import Button from "react-bootstrap/Button";
7+
import Form from "react-bootstrap/Form";
8+
import * as Showdown from "showdown";
9+
import ReactMde from "react-mde";
10+
import "./Editor.scss";
11+
12+
class Editor extends Component {
13+
constructor(props) {
14+
super(props);
15+
const { page } = this.props;
16+
this.state = {
17+
comments: "",
18+
selectedTab: "write",
19+
title: page?.title,
20+
content: page?.content,
21+
};
22+
}
23+
24+
handleSave = () => {
25+
const { title, content, comments } = this.state;
26+
const { page, newPage, sidebar, save } = this.props;
27+
save(
28+
{
29+
title,
30+
content,
31+
comments,
32+
history: page?.history,
33+
},
34+
newPage,
35+
sidebar
36+
);
37+
};
38+
39+
setContent = (content) => this.setState({ content });
40+
41+
setTitle = (evt) => this.setState({ title: evt.target.value });
42+
43+
setSelectedTab = (selectedTab) => this.setState({ selectedTab });
44+
45+
setComments = (evt) => this.setState({ comments: evt.target.value });
46+
47+
render() {
48+
const converter = new Showdown.Converter({
49+
tables: true,
50+
tasklists: true,
51+
strikethrough: true,
52+
simplifiedAutoLink: true,
53+
});
54+
const { title, content, selectedTab, comments } = this.state;
55+
const { deletePage, sidebar, newPage, page, cancel } = this.props;
56+
return (
57+
<div className="wiki-editor">
58+
<div className="wikis-top-controls">
59+
<Button
60+
variant="outline-danger"
61+
onClick={deletePage}
62+
disabled={sidebar || newPage || page.title === "Home"}
63+
>
64+
<span className="vc">
65+
<DeleteOutlinedIcon />
66+
Delete
67+
</span>
68+
</Button>
69+
<Button onClick={cancel} variant="light">
70+
<span className="vc">
71+
<CancelButton />
72+
Cancel
73+
</span>
74+
</Button>
75+
</div>
76+
<Form>
77+
<Form.Label className="field-title">Page Title</Form.Label>
78+
<Form.Control
79+
as="input"
80+
name="pageTitle"
81+
className="searchbar"
82+
value={title}
83+
onChange={this.setTitle}
84+
readOnly={!newPage}
85+
/>
86+
</Form>
87+
<ReactMde
88+
onChange={this.setContent}
89+
value={content}
90+
onTabChange={this.setSelectedTab}
91+
selectedTab={selectedTab}
92+
generateMarkdownPreview={(markdown) =>
93+
Promise.resolve(converter.makeHtml(markdown))
94+
}
95+
/>
96+
<Form>
97+
<Form.Label className="field-title">Comments</Form.Label>
98+
<Form.Control
99+
as="input"
100+
name="comments"
101+
className="searchbar"
102+
value={comments}
103+
onChange={this.setComments}
104+
/>
105+
</Form>
106+
<div className="wikis-top-controls">
107+
<Button variant="primary" onClick={this.handleSave}>
108+
<span className="vc">
109+
<SaveButton /> Save
110+
</span>
111+
</Button>
112+
</div>
113+
</div>
114+
);
115+
}
116+
}
117+
118+
export default Editor;

‎src/user/wikis/Editor/Editor.scss

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
.wiki-editor {
2+
padding: 50px 50px;
3+
.wikis-top-controls {
4+
display: flex;
5+
margin-bottom: 50px;
6+
justify-content: flex-end;
7+
.vc {
8+
display: flex;
9+
align-items: center;
10+
}
11+
* {
12+
margin: 0 5px;
13+
display: flex;
14+
align-items: center;
15+
}
16+
.btn {
17+
padding-left: 0.25rem;
18+
}
19+
}
20+
form {
21+
display: flex;
22+
align-items: center;
23+
label {
24+
margin: 0;
25+
height: 100%;
26+
width: 150px;
27+
display: flex;
28+
align-items: center;
29+
}
30+
margin-bottom: 50px;
31+
}
32+
.react-mde {
33+
margin-bottom: 50px;
34+
.mde-header {
35+
.mde-tabs {
36+
* {
37+
padding: 0 10px;
38+
margin-bottom: 0;
39+
}
40+
.selected {
41+
border: none;
42+
background-color: #ffffff;
43+
}
44+
}
45+
.mde-tabs:active {
46+
border: none;
47+
}
48+
}
49+
}
50+
}

‎src/user/wikis/History/History.js

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
import React from "react";
2+
import "./History.scss";
3+
import "antd/dist/antd.css";
4+
import { Timeline } from "antd";
5+
import Moment from 'react-moment'
6+
7+
const History = (props) => {
8+
const { page, view } = props;
9+
return (
10+
<div className="history">
11+
<Timeline>
12+
{page.history.map((ele, index) => {
13+
const body = JSON.parse(ele.body);
14+
return (
15+
<Timeline.Item key={index}>
16+
<div className="history-item" onClick={() => view(body.commit)}>
17+
<div className="line">
18+
<h5>{ele.user.login}</h5>
19+
<h5><Moment format="DD MMM YYYY">{ele.created_at}</Moment></h5>
20+
</div>
21+
<div className="line">
22+
<p>{body.comment}</p>
23+
<a
24+
href={`${ele.html_url.substring(
25+
0,
26+
ele.html_url.indexOf("/issues")
27+
)}/commit/${body.commit}`}
28+
>
29+
<p>{body.commit.substring(0, 8)}</p>
30+
</a>
31+
</div>
32+
</div>
33+
</Timeline.Item>
34+
);
35+
})}
36+
</Timeline>
37+
</div>
38+
);
39+
};
40+
41+
export default History;

‎src/user/wikis/History/History.scss

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
#wikis {
2+
.history {
3+
.history-item {
4+
.line {
5+
display: flex;
6+
cursor: pointer;
7+
font-family: Inter;
8+
align-items: center;
9+
justify-content: space-between;
10+
* {
11+
margin: 0px 10px;
12+
text-align: justify;
13+
}
14+
}
15+
}
16+
.history-item:hover {
17+
background-color: rgba(26, 115, 232, 0.1);
18+
}
19+
}
20+
}

0 commit comments

Comments
 (0)