From c0f4b63b61400d6dab453432b55ae6000d4a0bbf Mon Sep 17 00:00:00 2001
From: Yevhenii Lukashov <115802889+EuJinnLucaShow@users.noreply.github.com>
Date: Sat, 30 Sep 2023 21:10:13 +0300
Subject: [PATCH] Adding the ability to add and change avatar

Adding the ability to add and change avatar
---
 src/components/UserForm/UserForm.jsx       |  4 ++--
 src/components/UserMenu/UserMenu.jsx       | 11 +++--------
 src/components/UserProfile/UserProfile.jsx |  2 +-
 3 files changed, 6 insertions(+), 11 deletions(-)

diff --git a/src/components/UserForm/UserForm.jsx b/src/components/UserForm/UserForm.jsx
index 8810c59..1331896 100644
--- a/src/components/UserForm/UserForm.jsx
+++ b/src/components/UserForm/UserForm.jsx
@@ -17,7 +17,7 @@ import {
 } from './UserForm.styled';
 
 import { selectUser } from '../../redux/auth/selectors';
-import { updateUserParams } from '../../redux/auth/operations';
+import { getUserParams, updateUserParams } from '../../redux/auth/operations';
 
 const UserForm = () => {
   const dispatch = useDispatch();
@@ -96,7 +96,7 @@ const UserForm = () => {
       ...values,
     };
     dispatch(updateUserParams(sendData));
-    console.log(sendData);
+    dispatch(getUserParams());
   };
 
   return (
diff --git a/src/components/UserMenu/UserMenu.jsx b/src/components/UserMenu/UserMenu.jsx
index 4132990..f2f93d2 100644
--- a/src/components/UserMenu/UserMenu.jsx
+++ b/src/components/UserMenu/UserMenu.jsx
@@ -11,11 +11,10 @@ import {
   UserData,
 } from './UserMenu.styled';
 import { useDispatch, useSelector } from 'react-redux';
-import { getUserParams, logOut } from '../../redux/auth/operations';
+import { logOut } from '../../redux/auth/operations';
 import { useState } from 'react';
 import { Photo } from '../UserProfile/UserProfile.styled';
 import { selectUser } from '../../redux/auth/selectors';
-import { useEffect } from 'react';
 
 export const UserMenu = () => {
   const dispatch = useDispatch();
@@ -23,12 +22,8 @@ export const UserMenu = () => {
 
   const user = useSelector(selectUser);
 
-  useEffect(() => {
-    dispatch(getUserParams());
-  }, [dispatch]);
-
   const avatarUser = (
-    <Photo src={user.avatarUrl} width={46} height={46} alt="Avatar" />
+    <Photo src={user.avatarURL} width={46} height={46} alt="Avatar" />
   );
   const avatarLogo = (
     <SvgLogoUserHeader fill="var(--normal-color)">
@@ -84,7 +79,7 @@ export const UserMenu = () => {
             <use href={`${sprite}#icon-settings`}></use>
           </ProfileIcon>
         </NavLink>
-        <AvatarHeader>{user.avatarUrl ? avatarUser : avatarLogo}</AvatarHeader>
+        <AvatarHeader>{user.avatarURL ? avatarUser : avatarLogo}</AvatarHeader>
 
         <LogoutBtn type="button" onClick={handleLogOut}>
           <span>Logout</span>
diff --git a/src/components/UserProfile/UserProfile.jsx b/src/components/UserProfile/UserProfile.jsx
index c9fa487..358bf59 100644
--- a/src/components/UserProfile/UserProfile.jsx
+++ b/src/components/UserProfile/UserProfile.jsx
@@ -19,7 +19,7 @@ import { updateAvatar } from '../../redux/auth/operations';
 const UserProfile = () => {
   const dispatch = useDispatch();
   const user = useSelector(selectUser);
-  const [avatar, setAvatar] = useState('');
+  const [avatar, setAvatar] = useState(user.avatarURL);
 
   const avatarUser = <Photo src={avatar} width="100%" alt="Avatar" />;
   const avatarLogo = (