Skip to content

Commit d2f3d7c

Browse files
DevanshCodesDevanshCodes
committed
Integrated Backend + Many Features
1 parent b73ea44 commit d2f3d7c

33 files changed

+2604
-253
lines changed

‎package-lock.json‎

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

‎package.json‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,26 @@
33
"version": "0.1.0",
44
"private": true,
55
"dependencies": {
6-
"@material-ui/core": "^4.10.0",
6+
"@material-ui/core": "^4.10.2",
77
"@testing-library/jest-dom": "^4.2.4",
88
"@testing-library/react": "^9.3.2",
99
"@testing-library/user-event": "^7.1.2",
10+
"@tinymce/tinymce-react": "^3.6.0",
11+
"draft-js": "^0.11.6",
12+
"html-react-parser": "^0.13.0",
1013
"node-sass": "^4.14.1",
1114
"react": "^16.13.1",
1215
"react-beautiful-dnd": "^13.0.0",
1316
"react-bootstrap": "^1.0.1",
1417
"react-dom": "^16.13.1",
18+
"react-html-parser": "^2.0.2",
1519
"react-icons": "^3.10.0",
20+
"react-markdown-renderer": "^1.4.0",
1621
"react-router-dom": "^5.2.0",
17-
"react-scripts": "3.4.1"
22+
"react-scripts": "3.4.1",
23+
"react-tagsinput": "^3.19.0",
24+
"remarkable": "^2.0.1",
25+
"socket.io-client": "^2.3.0"
1826
},
1927
"scripts": {
2028
"start": "react-scripts start",

‎src/components/addTask/addTask.js‎

Whitespace-only changes.

‎src/components/addTask/addTask.scss‎

Whitespace-only changes.

‎src/components/announcements/announcement.js‎

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
import React, { Component } from "react";
2+
import announcementData from "../../jsonData/announcement";
3+
import { Avatar } from "@material-ui/core";
4+
import { Tabs, Tab } from "react-bootstrap";
5+
import { IconContext } from "react-icons";
6+
import { MdInfoOutline } from "react-icons/md";
7+
import "./announcement.scss";
8+
9+
class Announcements extends Component {
10+
constructor(props) {
11+
super(props);
12+
this.state = {};
13+
}
14+
15+
render() {
16+
return (
17+
<div>
18+
<div className="AnnouncementsHeading">Activities</div>
19+
<div className="navTabs">
20+
<Tabs defaultActiveKey="Announcements" id="uncontrolled-tab-example">
21+
<Tab
22+
eventKey="Announcements"
23+
title="Announcements"
24+
className="Announcementtab"
25+
>
26+
<div className="announcements">
27+
{announcementData.map((announcement) => {
28+
return (
29+
<div className="announcement">
30+
<div className="topannouncement">
31+
<Avatar
32+
className="avatar"
33+
src={announcement.avatarUrl}
34+
></Avatar>
35+
<div className="text">
36+
<div>{announcement.description}</div>
37+
<div className="bottomannouncement">
38+
{announcement.author}, {announcement.topicName}
39+
</div>
40+
</div>
41+
<IconContext.Provider
42+
value={{ color: "#F04B58", size: "24px" }}
43+
>
44+
<div className="icon">
45+
<MdInfoOutline />
46+
</div>
47+
</IconContext.Provider>
48+
</div>
49+
</div>
50+
);
51+
})}
52+
</div>
53+
</Tab>
54+
<Tab eventKey="Recents" title="Recents" className="recenttab">
55+
<div className="announcements">
56+
<div className="announcement">
57+
<div className="topannouncement">
58+
<Avatar className="avatar"></Avatar>
59+
<div className="text">
60+
<div>
61+
@Jaskirat Singh Mentioned you in the comments in the
62+
Topic: “Random”.
63+
</div>
64+
</div>
65+
</div>
66+
</div>
67+
<div className="announcement">
68+
<div className="topannouncement">
69+
<Avatar className="avatar"></Avatar>
70+
<div className="text">
71+
<div>
72+
@Jaskirat Singh Mentioned you in the comments in the
73+
Topic: “Random”.
74+
</div>
75+
</div>
76+
</div>
77+
</div>
78+
<div className="announcement">
79+
<div className="topannouncement">
80+
<Avatar className="avatar"></Avatar>
81+
<div className="text">
82+
<div>
83+
@Jaskirat Singh Mentioned you in the comments in the
84+
Topic: “Random”.
85+
</div>
86+
</div>
87+
</div>
88+
</div>
89+
<div className="announcement">
90+
<div className="topannouncement">
91+
<Avatar className="avatar"></Avatar>
92+
<div className="text">
93+
<div>
94+
@Jaskirat Singh Mentioned you in the comments in the
95+
Topic: “Random”.
96+
</div>
97+
</div>
98+
</div>
99+
</div>
100+
</div>
101+
</Tab>
102+
</Tabs>
103+
</div>
104+
</div>
105+
);
106+
}
107+
}
108+
109+
export default Announcements;

‎src/components/announcements/announcement.scss‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
.AnnouncementsHeading {
2+
margin: 10px 0 0 25px;
3+
font-family: Inter;
4+
font-style: normal;
5+
font-weight: bold;
6+
font-size: 20px;
7+
color: #1e3554;
8+
}
9+
.announcement {
10+
margin: 20px 0 0 0;
11+
}
12+
.topannouncement {
13+
display: flex;
14+
.bottomannouncement {
15+
margin-top: 5px;
16+
font-family: Inter;
17+
font-weight: 500;
18+
font-size: 13px;
19+
color: #8e8e8e;
20+
}
21+
.icon {
22+
margin: 0 20px 0 0;
23+
}
24+
.text {
25+
width: 22vw;
26+
}
27+
}
28+
.avatar {
29+
width: 24px;
30+
height: 24px;
31+
margin: 0 14px 0 0;
32+
}

‎src/components/editor/editor.js‎

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
import React, { Component } from "react";
2+
import { Button } from "react-bootstrap";
3+
import { Editor } from "@tinymce/tinymce-react";
4+
import Avatar from "@material-ui/core/Avatar";
5+
import "./editor.scss";
6+
import { GrFormClose } from "react-icons/gr";
7+
import ReactHtmlParser, {
8+
processNodes,
9+
convertNodeToElement,
10+
htmlparser2,
11+
} from "react-html-parser";
12+
13+
class EditorChat extends Component {
14+
constructor(props) {
15+
super(props);
16+
this.state = {
17+
content: "",
18+
contentValue: "",
19+
disabled: true,
20+
};
21+
this.handleEditorChange = this.handleEditorChange.bind(this);
22+
this.handleValue = this.handleValue.bind(this);
23+
}
24+
handleOnSubmit = () => {
25+
this.setState({ content: "" });
26+
};
27+
handleEditorChange(content) {
28+
if (content.length > 0) {
29+
this.setState({ disabled: false });
30+
} else {
31+
this.setState({ disabled: true });
32+
}
33+
this.setState({ content });
34+
}
35+
handleValue(value) {
36+
this.setState({ contentValue: value });
37+
}
38+
39+
render() {
40+
return (
41+
<div>
42+
<div className="discussionHeader">Write a New Discussion</div>
43+
{this.props.commenting ? (
44+
<div>
45+
<div className="chatHead">
46+
<div className="Reply">
47+
<div> Replying to: </div>
48+
<div className="icon" onClick={this.props.handleCommentOff}>
49+
<GrFormClose size={20} />
50+
</div>
51+
</div>
52+
<div className="chatReply">
53+
<Avatar
54+
src={this.props.chatReply.avatarurl}
55+
className="avatarReply"
56+
></Avatar>
57+
<div className="chatinforeply">
58+
<div className="usernamereply">
59+
{this.props.chatReply.username}
60+
</div>
61+
<div className="chatdescriptionreply">
62+
{ReactHtmlParser(
63+
this.props.chatReply.description.replace(/(&nbsp;)*/g, "")
64+
)}
65+
</div>
66+
</div>
67+
</div>
68+
</div>
69+
</div>
70+
) : (
71+
""
72+
)}
73+
<Editor
74+
initialValue="<p>Newb Content</p>"
75+
id="uuid"
76+
apiKey="8kftszxlfioswims1pl978knfa7p4qyoknx7afc7tvsvzruh"
77+
init={{
78+
height: 400,
79+
menubar: false,
80+
branding: false,
81+
plugins: [
82+
"advlist autolink lists link image preview",
83+
"charmap print preview anchor code",
84+
"searchreplace visualblocks codesample",
85+
"insertdatetime media table paste wordcount textpattern",
86+
],
87+
toolbar:
88+
// eslint-disable-next-line no-multi-str
89+
"undo redo | bold italic strikethrough \
90+
bullist numlist codesample code",
91+
}}
92+
value={this.state.content}
93+
onEditorChange={this.handleEditorChange}
94+
/>
95+
<Button
96+
type="submit"
97+
disabled={this.state.disabled}
98+
onClick={() =>
99+
this.props.handleSubmit(
100+
this.state.content,
101+
this.props.chatReply,
102+
this.handleOnSubmit
103+
)
104+
}
105+
className="sendchat"
106+
>
107+
Send
108+
</Button>
109+
</div>
110+
);
111+
}
112+
}
113+
114+
export default EditorChat;

‎src/components/editor/editor.scss‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
.sendchat {
2+
margin-top: 10px;
3+
}
4+
.Reply {
5+
width: 22.5vw;
6+
display: inline-flex;
7+
justify-content: space-between;
8+
.icon {
9+
cursor: pointer;
10+
margin-top: 2px;
11+
}
12+
}
13+
.chatReply {
14+
background: #f7f7f7;
15+
display: flex;
16+
width: 22.5vw;
17+
border-radius: 2px;
18+
margin: 6px 10px 6px 0px;
19+
padding: 7px 7px 7px 7px;
20+
border: solid #f04b58;
21+
border-width: 0 0 0 3px;
22+
.avatarReply {
23+
width: 23px;
24+
height: 23px;
25+
}
26+
.chatinforeply {
27+
margin-left: 10px;
28+
.usernamereply {
29+
font-family: Inter;
30+
font-style: normal;
31+
font-weight: 600;
32+
font-size: 14px;
33+
}
34+
.chatdescriptionreply {
35+
width: 18vw;
36+
font-family: Inter;
37+
font-style: normal;
38+
font-weight: normal;
39+
font-size: 13px;
40+
margin-top: 5px;
41+
line-height: 19px;
42+
p {
43+
margin-bottom: 0.25rem;
44+
}
45+
}
46+
}
47+
}

0 commit comments

Comments
 (0)