Skip to content

Commit 11d7ec0

Browse files
author
Aishwarya Nair
committed
fix user edit profile function call bug
1 parent bfcc1eb commit 11d7ec0

File tree

4 files changed

+234
-175
lines changed

4 files changed

+234
-175
lines changed

‎Frontend/src/Components/LandingPage/LandingPage.jsx‎

Lines changed: 36 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,39 @@
1-
import React from 'react'
2-
import {useState} from 'react'
3-
import './LandingPage.css'
4-
import {Dashboard} from './Dashboard'
5-
import {UserProfile} from './UserProfile'
6-
import { AttemptHistory } from './AttemptHistory'
7-
import {NavigationPanel} from './NavigationPanel'
1+
import React from "react";
2+
import {useState} from "react";
3+
import "./LandingPage.css";
4+
import {Dashboard} from "./Dashboard";
5+
import {UserProfile} from "./UserProfile";
6+
import {AttemptHistory} from "./AttemptHistory";
7+
import {NavigationPanel} from "./NavigationPanel";
8+
import {getUserName} from "../../User/UserState";
89

9-
1010
export const LandingPage = () => {
11-
const [page_name, setPageName] = useState("Dashboard");
12-
const [isList, setIsList] = useState(true)
11+
const [page_name, setPageName] = useState("Dashboard");
12+
const [isList, setIsList] = useState(true);
13+
const [username, setUsername] = useState(getUserName());
1314

14-
return (
15-
<div className = "landing-container">
16-
<NavigationPanel setPageName = {setPageName} setIsList = {setIsList}/>
17-
18-
<div className="page-view">
19-
<div className="page-heading">
20-
{page_name}
21-
</div>
22-
{page_name === "Dashboard" ? <Dashboard/> : <div></div>}
23-
{page_name === "Attempt History" ? <AttemptHistory isList = {isList} setIsList = {setIsList}/> : <div></div>}
24-
{page_name === "User Profile" ? <UserProfile/> : <div></div>}
25-
</div>
26-
</div>
27-
)
28-
}
15+
return (
16+
<div className="landing-container">
17+
<NavigationPanel
18+
setPageName={setPageName}
19+
setIsList={setIsList}
20+
userName={username}
21+
/>
22+
23+
<div className="page-view">
24+
<div className="page-heading">{page_name}</div>
25+
{page_name === "Dashboard" ? <Dashboard /> : <div></div>}
26+
{page_name === "Attempt History" ? (
27+
<AttemptHistory isList={isList} setIsList={setIsList} />
28+
) : (
29+
<div></div>
30+
)}
31+
{page_name === "User Profile" ? (
32+
<UserProfile setUsername={setUsername} />
33+
) : (
34+
<div></div>
35+
)}
36+
</div>
37+
</div>
38+
);
39+
};

‎Frontend/src/Components/LandingPage/NavigationPanel.jsx‎

Lines changed: 45 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,48 @@
1-
import React from 'react'
2-
import "./NavigationPanel.css"
3-
import {getUserName} from "../../User/UserState"
1+
import {React, useState, useEffect, useCallback} from "react";
2+
import "./NavigationPanel.css";
43

5-
import home_icon from '../Assets/home.png'
6-
import user_icon from '../Assets/user-prof.png'
7-
import dummy_user from '../Assets/David.png'
8-
import history_icon from '../Assets/history.png'
4+
import home_icon from "../Assets/home.png";
5+
import user_icon from "../Assets/user-prof.png";
6+
import dummy_user from "../Assets/David.png";
7+
import history_icon from "../Assets/history.png";
98

10-
export const NavigationPanel = ({setPageName, setIsList}) => {
11-
const userName = getUserName();
12-
13-
return (
14-
<div className="navigation-panel">
15-
<div className="user-header">
16-
<img src = {dummy_user} className="user-icon" alt = ""/>
17-
<div className="user-name">{userName}</div>
18-
</div>
19-
<div className="nav-tabs">
20-
<div className="nav-tab" onClick = {() => {setPageName("Dashboard")}}>
21-
<img src = {home_icon} className="nav-icon" alt= ""/>
22-
<div className="nav-text"> Dashboard </div>
23-
</div>
24-
<div className="nav-tab" onClick = {() => {
25-
setPageName("Attempt History");
26-
setIsList(true)
27-
}}>
28-
<img src = {history_icon} className="nav-icon" alt= ""/>
29-
<div className="nav-text"> Attempt History </div>
30-
</div>
31-
<div className="nav-tab" onClick = {() => {setPageName("User Profile")}}>
32-
<img src = {user_icon} className="nav-icon" alt= ""/>
33-
<div className="nav-text"> User Profile</div>
34-
</div>
35-
</div>
9+
export const NavigationPanel = ({setPageName, setIsList, userName}) => {
10+
return (
11+
<div className="navigation-panel">
12+
<div className="user-header">
13+
<img src={dummy_user} className="user-icon" alt="" />
14+
<div className="user-name">{userName}</div>
15+
</div>
16+
<div className="nav-tabs">
17+
<div
18+
className="nav-tab"
19+
onClick={() => {
20+
setPageName("Dashboard");
21+
}}
22+
>
23+
<img src={home_icon} className="nav-icon" alt="" />
24+
<div className="nav-text"> Dashboard </div>
3625
</div>
37-
)
38-
}
26+
<div
27+
className="nav-tab"
28+
onClick={() => {
29+
setPageName("Attempt History");
30+
setIsList(true);
31+
}}
32+
>
33+
<img src={history_icon} className="nav-icon" alt="" />
34+
<div className="nav-text"> Attempt History </div>
35+
</div>
36+
<div
37+
className="nav-tab"
38+
onClick={() => {
39+
setPageName("User Profile");
40+
}}
41+
>
42+
<img src={user_icon} className="nav-icon" alt="" />
43+
<div className="nav-text"> User Profile</div>
44+
</div>
45+
</div>
46+
</div>
47+
);
48+
};

‎Frontend/src/Components/LandingPage/UserProfile.css‎

Lines changed: 55 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1,84 +1,84 @@
11
.profile-container {
22
background: white;
33
border-radius: 10px;
4-
display:flex;
4+
display: flex;
55
flex-direction: column;
66
padding: 30px;
77
gap: 20px;
8-
}
9-
10-
.edit-container {
11-
display:flex;
12-
justify-content: flex-end
13-
}
14-
15-
.profile-section {
16-
display:flex;
17-
flex-direction: column;
8+
}
9+
10+
.edit-container {
11+
display: flex;
12+
justify-content: flex-end;
13+
}
14+
15+
.profile-section {
16+
display: flex;
17+
flex-direction: column;
1818
gap: 40px;
19-
}
20-
21-
.profile-edit {
19+
}
20+
21+
.profile-edit {
2222
width: 30px;
2323
height: 30px;
2424
cursor: pointer;
2525
-webkit-transition-duration: 0.2s; /* Safari */
2626
transition-duration: 0.2s;
2727
box-shadow: none;
28-
}
29-
30-
.profile-edit:hover {
28+
}
29+
30+
.profile-edit:hover {
3131
-webkit-filter: drop-shadow(3px 3px 1px rgba(100, 100, 111, 0.3));
32-
32+
3333
filter: drop-shadow(3px 3px 1px rgba(100, 100, 111, 0.3));
34-
}
35-
36-
.profile-info {
37-
display:flex;
34+
}
35+
36+
.profile-info {
37+
display: flex;
3838
flex-direction: column;
3939
gap: 5px;
40-
}
41-
42-
.profile-field {
40+
}
41+
42+
.profile-field {
4343
font-size: 20px;
4444
font-weight: 600;
45-
}
46-
47-
.profile-input {
45+
}
46+
47+
.profile-input {
4848
width: 35%;
49-
border:none;
49+
border: none;
5050
outline: none;
5151
border-bottom: 3px solid;
5252
font-size: 17px;
53-
}
54-
55-
.profile-submit-container{
53+
}
54+
55+
.profile-submit-container {
5656
display: flex;
5757
justify-content: center;
5858
align-items: center;
5959
gap: 30px;
6060
margin-top: 20px;
61-
}
62-
63-
.submit-btn {
61+
}
62+
63+
.submit-btn {
6464
width: 90px;
6565
height: 50px;
6666
color: #fff;
67-
background: #52CC65;
67+
background: #52cc65;
6868
border: none;
6969
border-radius: 5px;
7070
font-size: 19px;
7171
cursor: pointer;
7272
-webkit-transition-duration: 0.2s; /* Safari */
7373
transition-duration: 0.2s;
74-
}
75-
76-
.submit-btn:hover {
74+
}
75+
76+
.submit-btn:hover {
7777
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
7878
background: #4cbd5d;
79-
}
80-
81-
.cancel-btn {
79+
}
80+
81+
.cancel-btn {
8282
width: 90px;
8383
height: 50px;
8484
color: #fff;
@@ -90,9 +90,18 @@
9090
-webkit-transition-duration: 0.2s; /* Safari */
9191
transition-duration: 0.2s;
9292
box-shadow: none;
93-
}
94-
95-
.cancel-btn:hover {
93+
}
94+
95+
.cancel-btn:hover {
9696
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
9797
background: #868383;
98-
}
98+
}
99+
100+
.edit-profile-language-dropdown {
101+
width: 50%;
102+
height: fit-content;
103+
font-size: 16px;
104+
background: none;
105+
border: none;
106+
border-bottom: 3px solid;
107+
}

0 commit comments

Comments
 (0)