Skip to content

Commit 067b398

Browse files
coderj001coderj001
committed
user profile update page is config
1 parent 5f88a1a commit 067b398

File tree

7 files changed

+145
-31
lines changed

7 files changed

+145
-31
lines changed

‎backend/core/serializer.py

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,17 +16,25 @@
1616
class UserSerializer(ModelSerializer):
1717
_id = SerializerMethodField(read_only=True)
1818
isAdmin = SerializerMethodField(read_only=True)
19+
name = SerializerMethodField()
20+
email = SerializerMethodField()
1921

2022
class Meta:
2123
model = get_user_model()
22-
fields = ('_id', 'username', 'email', 'isAdmin')
24+
fields = ('_id', 'name', 'email', 'isAdmin')
2325

2426
def get__id(self, obj):
2527
return obj.id
2628

2729
def get_isAdmin(self, obj):
2830
return obj.is_staff
2931

32+
def get_name(self, obj):
33+
return obj.first_name
34+
35+
def get_email(self, obj):
36+
return obj.username
37+
3038

3139
class UserSerializerWithToken(UserSerializer):
3240
token = SerializerMethodField(read_only=True)

‎frontend/src/Pages/UserProfilePage.jsx

Lines changed: 20 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@ import { useDispatch, useSelector } from "react-redux";
33
import { Form, Button, Row, Col } from "react-bootstrap";
44
import Loader from "../components/Loader";
55
import Message from "../components/Message";
6-
import { getUserDetails } from "../actions/userActions";
6+
import { getUserDetails, updateUserProfile } from "../actions/userActions";
7+
import { USER_UPDATE_PROFILE_RESET } from "../constants/userConstants";
78

89
function UserProfilePage({ history }) {
910
const [name, setName] = useState("");
@@ -14,36 +15,49 @@ function UserProfilePage({ history }) {
1415

1516
const dispatch = useDispatch();
1617

17-
const { loading, user, error } = useSelector((state) => state.userDetails);
18+
const userDetails = useSelector((state) => state.userDetails);
19+
const { loading, user, error } = userDetails;
1820

1921
const { userInfo } = useSelector((state) => state.userLogin);
2022

23+
const userUpdateProfile = useSelector((state) => state.userUpdateProfile);
24+
const { success } = userUpdateProfile;
25+
2126
useEffect(() => {
2227
if (!userInfo) {
2328
history.push("/login");
2429
} else {
25-
if (!user || !user.name) {
30+
if (!user || !user.name || success) {
31+
dispatch({ type: USER_UPDATE_PROFILE_RESET });
2632
dispatch(getUserDetails("profile"));
2733
} else {
2834
setName(user.name);
2935
setEmail(user.email);
3036
}
3137
}
32-
}, []);
38+
}, [dispatch, history, userInfo, user, success]);
3339

3440
const submitHandler = (e) => {
3541
e.preventDefault();
3642
if (password !== confirmPassword) {
3743
setMessage("Passwords Don't Match");
3844
} else {
39-
console.log("Updating Profile...");
45+
dispatch(
46+
updateUserProfile({
47+
_id: user._id,
48+
name: name,
49+
email: email,
50+
password: password,
51+
})
52+
);
53+
setMessage("");
4054
}
4155
};
4256

4357
return (
4458
<Row>
4559
<Col md={3}>
46-
<h2>User Profile</h2>
60+
<h3>User Profile</h3>
4761

4862
{message && <Message variant="danger">{message}</Message>}
4963
{error && <Message variant="danger">{error}</Message>}

‎frontend/src/actions/userActions.jsx

Lines changed: 40 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,10 @@ import {
99
USER_DETAILS_REQUEST,
1010
USER_DETAILS_SUCCESS,
1111
USER_DETAILS_FAIL,
12+
USER_DETAILS_RESET,
13+
USER_UPDATE_PROFILE_REQUEST,
14+
USER_UPDATE_PROFILE_SUCCESS,
15+
USER_UPDATE_PROFILE_FAIL,
1216
} from "../constants/userConstants.jsx";
1317

1418
import axios from "axios";
@@ -43,6 +47,7 @@ export const login = (email, password) => async (dispatch) => {
4347
export const logout = () => (dispatch) => {
4448
localStorage.removeItem("userInfo");
4549
dispatch({ type: USER_LOGOUT });
50+
dispatch({ type: USER_DETAILS_RESET });
4651
};
4752

4853
export const register = (name, email, password) => async (dispatch) => {
@@ -81,8 +86,10 @@ export const getUserDetails = (id) => async (dispatch, getState) => {
8186
userLogin: { userInfo },
8287
} = getState();
8388
const config = {
84-
"Content-type": "application/json",
85-
Authorization: `Bearer ${userInfo.token}`,
89+
headers: {
90+
"Content-type": "application/json",
91+
Authorization: `Bearer ${userInfo.token}`,
92+
},
8693
};
8794
const { data } = await axios.get(`/api/users/${id}/`, config);
8895
dispatch({ type: USER_DETAILS_SUCCESS, payload: data });
@@ -96,3 +103,34 @@ export const getUserDetails = (id) => async (dispatch, getState) => {
96103
});
97104
}
98105
};
106+
107+
export const updateUserProfile = (user) => async (dispatch, getState) => {
108+
try {
109+
dispatch({ type: USER_UPDATE_PROFILE_REQUEST });
110+
const {
111+
userLogin: { userInfo },
112+
} = getState();
113+
const config = {
114+
headers: {
115+
"Content-type": "application/json",
116+
Authorization: `Bearer ${userInfo.token}`,
117+
},
118+
};
119+
const { data } = await axios.put(
120+
`/api/users/profile/update/`,
121+
user,
122+
config
123+
);
124+
dispatch({ type: USER_UPDATE_PROFILE_SUCCESS, payload: data });
125+
dispatch({ type: USER_LOGIN_SUCCESS, payload: data });
126+
localStorage.setItem("userInfo", JSON.stringify(data));
127+
} catch (err) {
128+
dispatch({
129+
type: USER_UPDATE_PROFILE_FAIL,
130+
payload:
131+
err.response && err.response.data.detail
132+
? err.response.data.detail
133+
: err.message,
134+
});
135+
}
136+
};

‎frontend/src/constants/userConstants.jsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,3 +11,9 @@ export const USER_REGISTER_FAIL = "USER_REGISTER_FAIL";
1111
export const USER_DETAILS_REQUEST = "USER_DETAILS_REQUEST";
1212
export const USER_DETAILS_SUCCESS = "USER_DETAILS_SUCCESS";
1313
export const USER_DETAILS_FAIL = "USER_DETAILS_FAIL";
14+
export const USER_DETAILS_RESET = "USER_DETAILS_RESET";
15+
16+
export const USER_UPDATE_PROFILE_REQUEST = "USER_UPDATE_PROFILE_REQUEST";
17+
export const USER_UPDATE_PROFILE_SUCCESS = "USER_UPDATE_PROFILE_SUCCESS";
18+
export const USER_UPDATE_PROFILE_FAIL = "USER_UPDATE_PROFILE_FAIL";
19+
export const USER_UPDATE_PROFILE_RESET = "USER_UPDATE_PROFILE_RESET";

‎frontend/src/reducers/userReducer.jsx

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,11 @@ import {
99
USER_DETAILS_REQUEST,
1010
USER_DETAILS_SUCCESS,
1111
USER_DETAILS_FAIL,
12+
USER_DETAILS_RESET,
13+
USER_UPDATE_PROFILE_REQUEST,
14+
USER_UPDATE_PROFILE_SUCCESS,
15+
USER_UPDATE_PROFILE_FAIL,
16+
USER_UPDATE_PROFILE_RESET,
1217
} from "../constants/userConstants.jsx";
1318

1419
export const userReducer = (state = {}, action) => {
@@ -47,6 +52,31 @@ export const userDetailsReducer = (state = { user: {} }, action) => {
4752
return { loading: false, user: action.payload };
4853
case USER_DETAILS_FAIL:
4954
return { loading: false, error: action.payload };
55+
case USER_DETAILS_RESET:
56+
return {};
57+
default:
58+
return state;
59+
}
60+
};
61+
62+
export const userUpdateProfileReducer = (state = {}, action) => {
63+
switch (action.type) {
64+
case USER_UPDATE_PROFILE_REQUEST:
65+
return { loading: true };
66+
case USER_UPDATE_PROFILE_SUCCESS:
67+
return {
68+
loading: false,
69+
success: true,
70+
userInfo: action.payload,
71+
};
72+
case USER_UPDATE_PROFILE_FAIL:
73+
return {
74+
loading: false,
75+
success: false,
76+
error: action.payload,
77+
};
78+
case USER_UPDATE_PROFILE_RESET:
79+
return {};
5080
default:
5181
return state;
5282
}

‎frontend/src/store.jsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import {
1010
userDetailsReducer,
1111
userReducer,
1212
userRegisterReducer,
13+
userUpdateProfileReducer,
1314
} from "./reducers/userReducer";
1415

1516
const reducer = combineReducers({
@@ -19,6 +20,7 @@ const reducer = combineReducers({
1920
userLogin: userReducer,
2021
userRegister: userRegisterReducer,
2122
userDetails: userDetailsReducer,
23+
userUpdateProfile: userUpdateProfileReducer,
2224
});
2325

2426
const cartItemsFromStorage = localStorage.getItem("cartItems")

‎frontend/yarn.lock

Lines changed: 38 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1091,7 +1091,7 @@
10911091
dependencies:
10921092
regenerator-runtime "^0.13.4"
10931093

1094-
"@babel/runtime@^7.1.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.12.5", "@babel/runtime@^7.13.8", "@babel/runtime@^7.6.3", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
1094+
"@babel/runtime@^7.1.2", "@babel/runtime@^7.12.1", "@babel/runtime@^7.13.8", "@babel/runtime@^7.6.3", "@babel/runtime@^7.8.7":
10951095
version "7.13.10"
10961096
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.13.10.tgz#47d42a57b6095f4468da440388fdbad8bebf0d7d"
10971097
integrity sha512-4QPkjJq6Ns3V/RgpEahRk+AGfL0eO6RHHtTWoNNr5mO49G6B5+X6d6THgWEAvTrznU5xYpbAlVKRYcsCgh/Akw==
@@ -1105,6 +1105,13 @@
11051105
dependencies:
11061106
regenerator-runtime "^0.13.4"
11071107

1108+
"@babel/runtime@^7.12.5", "@babel/runtime@^7.9.2":
1109+
version "7.14.6"
1110+
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.14.6.tgz#535203bc0892efc7dec60bdc27b2ecf6e409062d"
1111+
integrity sha512-/PCB2uJ7oM44tz8YhC4Z/6PeOKXp4K588f+5M3clr1M4zbqztlo0XEfJ2LEzj/FgwfgGcIdl8n7YYjTCI0BYwg==
1112+
dependencies:
1113+
regenerator-runtime "^0.13.4"
1114+
11081115
"@babel/template@^7.10.4", "@babel/template@^7.12.13", "@babel/template@^7.3.3":
11091116
version "7.12.13"
11101117
resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.12.13.tgz#530265be8a2589dbb37523844c5bcb55947fb327"
@@ -1642,37 +1649,38 @@
16421649
loader-utils "^2.0.0"
16431650

16441651
"@testing-library/dom@^7.28.1":
1645-
version "7.30.3"
1646-
resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-7.30.3.tgz#779ea9bbb92d63302461800a388a5a890ac22519"
1647-
integrity sha512-7JhIg2MW6WPwyikH2iL3o7z+FTVgSOd2jqCwTAHqK7Qal2gRRYiUQyURAxtbK9VXm/UTyG9bRihv8C5Tznr2zw==
1652+
version "7.31.2"
1653+
resolved "https://registry.yarnpkg.com/@testing-library/dom/-/dom-7.31.2.tgz#df361db38f5212b88555068ab8119f5d841a8c4a"
1654+
integrity sha512-3UqjCpey6HiTZT92vODYLPxTBWlM8ZOOjr3LX5F37/VRipW2M1kX6I/Cm4VXzteZqfGfagg8yXywpcOgQBlNsQ==
16481655
dependencies:
16491656
"@babel/code-frame" "^7.10.4"
16501657
"@babel/runtime" "^7.12.5"
16511658
"@types/aria-query" "^4.2.0"
16521659
aria-query "^4.2.2"
16531660
chalk "^4.1.0"
1654-
dom-accessibility-api "^0.5.4"
1661+
dom-accessibility-api "^0.5.6"
16551662
lz-string "^1.4.4"
16561663
pretty-format "^26.6.2"
16571664

16581665
"@testing-library/jest-dom@^5.11.4":
1659-
version "5.11.10"
1660-
resolved "https://registry.yarnpkg.com/@testing-library/jest-dom/-/jest-dom-5.11.10.tgz#1cd90715023e1627f5ed26ab3b38e6f22d77046c"
1661-
integrity sha512-FuKiq5xuk44Fqm0000Z9w0hjOdwZRNzgx7xGGxQYepWFZy+OYUMOT/wPI4nLYXCaVltNVpU1W/qmD88wLWDsqQ==
1666+
version "5.14.1"
1667+
resolved "https://registry.yarnpkg.com/@testing-library/jest-dom/-/jest-dom-5.14.1.tgz#8501e16f1e55a55d675fe73eecee32cdaddb9766"
1668+
integrity sha512-dfB7HVIgTNCxH22M1+KU6viG5of2ldoA5ly8Ar8xkezKHKXjRvznCdbMbqjYGgO2xjRbwnR+rR8MLUIqF3kKbQ==
16621669
dependencies:
16631670
"@babel/runtime" "^7.9.2"
16641671
"@types/testing-library__jest-dom" "^5.9.1"
16651672
aria-query "^4.2.2"
16661673
chalk "^3.0.0"
16671674
css "^3.0.0"
16681675
css.escape "^1.5.1"
1676+
dom-accessibility-api "^0.5.6"
16691677
lodash "^4.17.15"
16701678
redent "^3.0.0"
16711679

16721680
"@testing-library/react@^11.1.0":
1673-
version "11.2.6"
1674-
resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-11.2.6.tgz#586a23adc63615985d85be0c903f374dab19200b"
1675-
integrity sha512-TXMCg0jT8xmuU8BkKMtp8l7Z50Ykew5WNX8UoIKTaLFwKkP2+1YDhOLA2Ga3wY4x29jyntk7EWfum0kjlYiSjQ==
1681+
version "11.2.7"
1682+
resolved "https://registry.yarnpkg.com/@testing-library/react/-/react-11.2.7.tgz#b29e2e95c6765c815786c0bc1d5aed9cb2bf7818"
1683+
integrity sha512-tzRNp7pzd5QmbtXNG/mhdcl7Awfu/Iz1RaVHY75zTdOkmHCuzMhRL83gWHSgOAcjS3CCbyfwUHMZgRJb4kAfpA==
16761684
dependencies:
16771685
"@babel/runtime" "^7.12.5"
16781686
"@testing-library/dom" "^7.28.1"
@@ -1803,9 +1811,9 @@
18031811
"@types/istanbul-lib-report" "*"
18041812

18051813
"@types/jest@*":
1806-
version "26.0.22"
1807-
resolved "https://registry.yarnpkg.com/@types/jest/-/jest-26.0.22.tgz#8308a1debdf1b807aa47be2838acdcd91e88fbe6"
1808-
integrity sha512-eeWwWjlqxvBxc4oQdkueW5OF/gtfSceKk4OnOAGlUSwS/liBRtZppbJuz1YkgbrbfGOoeBHun9fOvXnjNwrSOw==
1814+
version "26.0.23"
1815+
resolved "https://registry.yarnpkg.com/@types/jest/-/jest-26.0.23.tgz#a1b7eab3c503b80451d019efb588ec63522ee4e7"
1816+
integrity sha512-ZHLmWMJ9jJ9PTiT58juykZpL7KjwJywFN3Rr2pTSkyQfydf/rk22yS7W8p5DaVUMQ2BQC7oYiU3FjbTM/mYrOA==
18091817
dependencies:
18101818
jest-diff "^26.0.0"
18111819
pretty-format "^26.0.0"
@@ -1909,9 +1917,9 @@
19091917
integrity sha512-W+bw9ds02rAQaMvaLYxAbJ6cvguW/iJXNT6lTssS1ps6QdrMKttqEAMEG/b5CR8TZl3/L7/lH0ZV5nNR1LXikA==
19101918

19111919
"@types/testing-library__jest-dom@^5.9.1":
1912-
version "5.9.5"
1913-
resolved "https://registry.yarnpkg.com/@types/testing-library__jest-dom/-/testing-library__jest-dom-5.9.5.tgz#5bf25c91ad2d7b38f264b12275e5c92a66d849b0"
1914-
integrity sha512-ggn3ws+yRbOHog9GxnXiEZ/35Mow6YtPZpd7Z5mKDeZS/o7zx3yAle0ov/wjhVB5QT4N2Dt+GNoGCdqkBGCajQ==
1920+
version "5.14.0"
1921+
resolved "https://registry.yarnpkg.com/@types/testing-library__jest-dom/-/testing-library__jest-dom-5.14.0.tgz#98eb7537cb5502bcca7a0d82acf5f245a2e6c322"
1922+
integrity sha512-l2P2GO+hFF4Liye+fAajT1qBqvZOiL79YMpEvgGs1xTK7hECxBI8Wz4J7ntACJNiJ9r0vXQqYovroXRLPDja6A==
19151923
dependencies:
19161924
"@types/jest" "*"
19171925

@@ -3231,14 +3239,22 @@ chalk@^3.0.0:
32313239
ansi-styles "^4.1.0"
32323240
supports-color "^7.1.0"
32333241

3234-
chalk@^4.0.0, chalk@^4.1.0:
3242+
chalk@^4.0.0:
32353243
version "4.1.0"
32363244
resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.0.tgz#4e14870a618d9e2edd97dd8345fd9d9dc315646a"
32373245
integrity sha512-qwx12AxXe2Q5xQ43Ac//I6v5aXTipYrSESdOgzrN+9XjgEpyjpKuvSGaN4qE93f7TQTlerQQ8S+EQ0EyDoVL1A==
32383246
dependencies:
32393247
ansi-styles "^4.1.0"
32403248
supports-color "^7.1.0"
32413249

3250+
chalk@^4.1.0:
3251+
version "4.1.1"
3252+
resolved "https://registry.yarnpkg.com/chalk/-/chalk-4.1.1.tgz#c80b3fab28bf6371e6863325eee67e618b77e6ad"
3253+
integrity sha512-diHzdDKxcU+bAsUboHLPEDQiw0qEe0qd7SYUn3HgcFlWgbDcfLGswOHYeGrHKzG9z6UYf01d9VFMfZxPM1xZSg==
3254+
dependencies:
3255+
ansi-styles "^4.1.0"
3256+
supports-color "^7.1.0"
3257+
32423258
char-regex@^1.0.2:
32433259
version "1.0.2"
32443260
resolved "https://registry.yarnpkg.com/char-regex/-/char-regex-1.0.2.tgz#d744358226217f981ed58f479b1d6bcc29545dcf"
@@ -4194,10 +4210,10 @@ doctrine@^3.0.0:
41944210
dependencies:
41954211
esutils "^2.0.2"
41964212

4197-
dom-accessibility-api@^0.5.4:
4198-
version "0.5.4"
4199-
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.4.tgz#b06d059cdd4a4ad9a79275f9d414a5c126241166"
4200-
integrity sha512-TvrjBckDy2c6v6RLxPv5QXOnU+SmF9nBII5621Ve5fu6Z/BDrENurBEvlC1f44lKEUVqOpK4w9E5Idc5/EgkLQ==
4213+
dom-accessibility-api@^0.5.6:
4214+
version "0.5.6"
4215+
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.6.tgz#3f5d43b52c7a3bd68b5fb63fa47b4e4c1fdf65a9"
4216+
integrity sha512-DplGLZd8L1lN64jlT27N9TVSESFR5STaEJvX+thCby7fuCHonfPpAlodYc3vuUYbDuDec5w8AMP7oCM5TWFsqw==
42014217

42024218
dom-converter@^0.2:
42034219
version "0.2.0"

0 commit comments

Comments
 (0)