diff --git a/src/components/form/textInput/index.js b/src/components/form/textInput/index.js
index 2957205..0f9058a 100644
--- a/src/components/form/textInput/index.js
+++ b/src/components/form/textInput/index.js
@@ -13,6 +13,7 @@ const TextInput = ({
readOnly = false,
type = 'text',
placeholder = '',
+ onClick,
onBlur: onBlurProp,
disabled = false,
maxLength = 280,
@@ -41,6 +42,7 @@ const TextInput = ({
onChange={onChange}
onKeyDown={onKeyDown}
onBlur={handleBlur}
+ onClick={onClick}
autoComplete={type === 'password' ? 'current-password' : undefined}
className={className}
disabled={disabled}
diff --git a/src/context/auth.js b/src/context/auth.js
index d57dc47..809872d 100644
--- a/src/context/auth.js
+++ b/src/context/auth.js
@@ -4,7 +4,7 @@ import Header from '../components/header';
import Modal from '../components/modal';
import Navigation from '../components/navigation';
import useAuth from '../hooks/useAuth';
-import { patchProfile, login, register, getUserById } from '../service/apiClient';
+import { patchProfile, login, register, getUserById, patchUser } from '../service/apiClient';
import { normalizeClaims } from '../service/tokenDecode';
import Loader from '../components/loader/Loader';
@@ -153,7 +153,7 @@ const AuthProvider = ({ children }) => {
const { id, ...body } = updatedUserData;
try {
- const res = await patchProfile(updatedUserData.id, body);
+ const res = await patchUser(updatedUserData.id, body);
if (!res.ok) {
console.error('Failed to created profile:', res.json());
return;
diff --git a/src/pages/profile/ProfilePage.jsx b/src/pages/profile/ProfilePage.jsx
index 8a183dc..4ccf123 100644
--- a/src/pages/profile/ProfilePage.jsx
+++ b/src/pages/profile/ProfilePage.jsx
@@ -12,11 +12,19 @@ import { ProfileEditButton } from './editButton';
import { getUserById } from '../../service/apiClient';
import Loader from '../../components/loader/Loader';
+import {
+ valEightChars,
+ valCapLetter,
+ valNumber,
+ valSpecialChar
+} from '../register/registrationValidation';
+
const ProfilePage = () => {
const { id: pathParamId } = useParams();
- const { user, setUser, onPatchProfile } = useAuth();
+ const { user, setUser, onPatchProfile, onCreateProfile } = useAuth();
const [isLoading, setIsLoading] = useState(null);
const [isEditing, setIsEditing] = useState(false);
+ const [canSave, setCanSave] = useState(false);
const [originalCurrentUser, setOriginalCurrentUser] = useState(user); // The original, before edit, state of the user we are looking at.
const [tempCurrentUser, setTempCurrentUser] = useState(user); // The edited, under/after edit, state of the user we are looking at.
@@ -66,12 +74,33 @@ const ProfilePage = () => {
setTempCurrentUser((prev) => ({ ...prev, [field]: value }));
};
+ useEffect(() => {
+ const password = tempCurrentUser?.password || '';
+
+ const isValid =
+ valEightChars(password) &&
+ valCapLetter(password) &&
+ valNumber(password) &&
+ valSpecialChar(password);
+
+ setCanSave(isValid || password === '');
+ }, [tempCurrentUser?.password]);
+
// When edit button gets toggled on/off
const toggleEdit = () => {
if (isEditing) {
tempCurrentUser.id = pathParamId || user.id;
+
const { cohort, ...tempCurrentUserWithoutCohort } = tempCurrentUser;
- onPatchProfile(tempCurrentUserWithoutCohort);
+ // if the password field is empty then patch without changing password, else patch with new password.
+
+ if (tempCurrentUser.password === '') {
+ onCreateProfile(tempCurrentUserWithoutCohort);
+ } else {
+ onPatchProfile(tempCurrentUserWithoutCohort);
+ }
+
+ tempCurrentUser.password = '';
if (!pathParamId || String(pathParamId) === String(user.id)) {
const { password, ...userWithoutPassword } = tempCurrentUser;
@@ -143,7 +172,7 @@ const ProfilePage = () => {
/>
{/* Edit button */}
-