Skip to content

Commit 59d3b87

Browse files
committed
update student dashboard
1 parent 66b4edd commit 59d3b87

File tree

10 files changed

+293
-82
lines changed

10 files changed

+293
-82
lines changed

src/components/Dashboard/UserCard.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ function UserCard({
2121
<div className="user-info">
2222
<img
2323
src={`https://github.com/${data.username}.png`}
24-
alt="Profile Picture"
24+
className="profile-pic"
2525
/>
2626
<div className="details">
2727
<h2>{data.name}</h2>

src/components/Footer.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,15 @@
11
import { Link } from "react-router-dom";
22
import "../styles/footer.css";
3+
import { DISCORD_INVITE } from "../util/constants";
34

4-
function Footer() {
5+
function Footer() { // TODO: fix links
56
return (
67
<div className="footer">
78
<div className="link-content">
89
<div className="section">
910
<div className="section-title">Social Groups</div>
1011
<div className="links">
11-
<a href="https://discord.gg/efFwh6fnjk">Discord</a>
12+
<a href={DISCORD_INVITE}>Discord</a>
1213
<a href="https://www.linkedin.com/company/kharagpur-open-source-society/">
1314
LinkedIn
1415
</a>

src/data/studentResources.json

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
[
2+
{
3+
"message": "Everything you need to ace KWoC",
4+
"url": "https://medium.com/kharagpur-open-source-society/an-informal-introduction-to-kwoc-62fc5e686f79",
5+
"avatar": "https://raw.githubusercontent.com/kossiitkgp/design/master/logo/koss/main/koss-logo.svg"
6+
},
7+
{
8+
"message": "Codeacademy: Learn Git",
9+
"url": "https://www.codecademy.com/learn/learn-git",
10+
"avatar": "https://www.codecademy.com/favicon.ico",
11+
"noAvatarRounding": true
12+
},
13+
{
14+
"message": "Git Flight Rules: Cookbook for Git",
15+
"url": "https://github.com/k88hudson/git-flight-rules",
16+
"avatar": "https://github.com/k88hudson.png"
17+
},
18+
{
19+
"message": "GitHub: Hello World Tutorial",
20+
"url": "https://guides.github.com/activities/hello-world/",
21+
"avatar": "https://github.com/github.png"
22+
}
23+
]

src/pages/MentorDashboard.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ function MentorDashboard() {
6969
);
7070

7171
return (
72-
<div className="mentor-dash">
72+
<div className="mentor-dash dashboard">
7373
{data ? (
7474
<>
7575
<UserCard username={data.username} name={data.name} auth={auth} />

src/pages/StudentDashboard.tsx

Lines changed: 114 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,16 @@ import { useNavigate } from "react-router-dom";
66
import "../styles/student-dashboard.css";
77
import UserCard from "../components/Dashboard/UserCard";
88
import { HiOutlineDocumentReport } from "react-icons/hi";
9-
import { END_EVALS_ENDED, MID_EVALS_ENDED } from "../util/constants";
9+
import {
10+
DISCORD_INVITE,
11+
END_EVALS_ENDED,
12+
MID_EVALS_ENDED,
13+
STUDENT_MANUAL,
14+
} from "../util/constants";
1015
import LinesChanged from "../components/LinesChanged";
16+
import StudentResources from "../data/studentResources.json";
17+
import { IoDocument } from "react-icons/io5";
18+
import Button from "../components/Button";
1119

1220
type StudentDashData = IEndpointTypes["student/dashboard"]["response"];
1321

@@ -56,36 +64,38 @@ function StudentDashboard() {
5664
}, []);
5765

5866
return (
59-
<div className="student-dash">
67+
<div className="student-dash dashboard">
6068
{data ? (
6169
<>
6270
<UserCard username={data.username} name={data.name} auth={auth} />
6371

64-
<div className="stats-container">
65-
<div className="stats">
66-
<div className="stat-card">
67-
<h3>Total PRs</h3>
68-
<p>{data.pull_count}</p>
69-
</div>
70-
<div className="stat-card">
71-
<h3>Total Commits</h3>
72-
<p>{data.commit_count}</p>
73-
</div>
74-
<div className="stat-card">
75-
{/* Lines Added/Removed */}
76-
<h3>Lines Changed</h3>
77-
<LinesChanged lines_added={data.lines_added} lines_removed={data.lines_removed} />
78-
</div>
79-
<div className="stat-card">
80-
<h3>Languages Used</h3>
81-
<p>
82-
{data.languages_used.length === 0
83-
? "None"
84-
: data.languages_used.join(", ")}
85-
</p>
86-
</div>
72+
<div className="stats">
73+
<div className="stat-card">
74+
<h3>Total PRs</h3>
75+
<p>{data.pull_count}</p>
76+
</div>
77+
<div className="stat-card">
78+
<h3>Total Commits</h3>
79+
<p>{data.commit_count}</p>
8780
</div>
81+
<div className="stat-card">
82+
<h3>Lines Changed</h3>
83+
<LinesChanged
84+
lines_added={data.lines_added}
85+
lines_removed={data.lines_removed}
86+
/>
87+
</div>
88+
<div className="stat-card">
89+
<h3>Languages Used</h3>
90+
<p>
91+
{data.languages_used.length === 0
92+
? "None"
93+
: data.languages_used.join(", ")}
94+
</p>
95+
</div>
96+
</div>
8897

98+
<div className="info">
8999
<div className="evaluation">
90100
<div className="eval">
91101
<div className="eval-header">
@@ -120,6 +130,85 @@ function StudentDashboard() {
120130
</p>
121131
</div>
122132
</div>
133+
134+
<div className="details">
135+
<h3>Projects Worked On</h3>
136+
{data.projects_worked.length === 0 ? (
137+
<p>None</p>
138+
) : (
139+
<div className="projects-worked">
140+
{data.projects_worked.map((project) => (
141+
<a
142+
href={project.repo_link}
143+
target="_blank"
144+
rel="noreferrer"
145+
>
146+
{project.name}
147+
</a>
148+
))}
149+
</div>
150+
)}
151+
152+
<h3>Merged Pull Requests</h3>
153+
{data.pull_count === 0 ? <p>None</p> : data.pulls.join(", ")}
154+
</div>
155+
</div>
156+
157+
<h2>Resources</h2>
158+
<div className="resources">
159+
{StudentResources.map((resource) => (
160+
<a
161+
href={resource.url}
162+
key={resource.message}
163+
target="_blank"
164+
rel="noreferrer"
165+
>
166+
<div className="resource">
167+
{resource.avatar ? (
168+
<img src={resource.avatar} alt={resource.message} />
169+
) : (
170+
<IoDocument className="icon" size="30px" />
171+
)}
172+
<p>{resource.message}</p>
173+
</div>
174+
</a>
175+
))}
176+
</div>
177+
178+
<h2>Other Links</h2>
179+
<div className="links">
180+
<div className="link-card">
181+
<h3>Projects</h3>
182+
<p>
183+
Discover exciting projects that you can contribute to and
184+
collaborate on. Each project is an opportunity to apply your
185+
skills, learn new technologies, and make a real impact.
186+
</p>
187+
<Button to="/projects" className="blue">
188+
View Projects
189+
</Button>
190+
</div>
191+
<div className="link-card">
192+
<h3>Student's Manual</h3>
193+
<p>
194+
Download the KWoC Student's Manual for comprehensive information
195+
about the program's structure, guidelines and expectations.
196+
</p>
197+
<Button to={STUDENT_MANUAL} className="blue">
198+
Student Manual
199+
</Button>
200+
</div>
201+
<div className="link-card">
202+
<h3>Stay Connected</h3>
203+
<p>
204+
Connect with fellow participants, mentors and organisers. Join
205+
our discord server to engage in discussions, seek help, and stay
206+
updated on the latest program announcements.
207+
</p>
208+
<Button to={DISCORD_INVITE} className="blue">
209+
Discord
210+
</Button>
211+
</div>
123212
</div>
124213
</>
125214
) : status == "loading" ? (

src/styles/Dashboard/user-card.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
height: 120px;
1010
object-fit: cover;
1111
margin-right: 20px;
12+
background-color: gray;
1213
}
1314

1415
& .details {

src/styles/index.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,10 @@ body {
1212
color: #ffffff;
1313
}
1414

15+
* {
16+
box-sizing: border-box;
17+
}
18+
1519
.App {
1620
min-height: 100vh;
1721
overflow-x: hidden;

src/styles/mentor-dashboard.css

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,9 @@
6767
}
6868
}
6969
}
70+
}
7071

72+
.dashboard {
7173
& .resources {
7274
border-radius: 10px;
7375
display: flex;
@@ -102,4 +104,10 @@
102104
.mentor-dash {
103105
width: 90vw;
104106
}
107+
108+
.dashboard {
109+
& .resources {
110+
flex-direction: column;
111+
}
112+
}
105113
}

0 commit comments

Comments
 (0)