diff --git a/src/pages/AccountPage/UserForm/UserForm.jsx b/src/pages/AccountPage/UserForm/UserForm.jsx
index 8f0b942..450d963 100644
--- a/src/pages/AccountPage/UserForm/UserForm.jsx
+++ b/src/pages/AccountPage/UserForm/UserForm.jsx
@@ -28,6 +28,7 @@ import { format } from 'date-fns';
 import defaultAvatar from 'images/sprite.svg';
 import { useDispatch, useSelector } from 'react-redux';
 import {
+  selectIsLoading,
   selectUserAvatarURL,
   selectUserBirthday,
   selectUserEmail,
@@ -45,6 +46,7 @@ import {
   TELEGRAM_REGEX,
 } from '../../../constants/joiRegex';
 import { toast } from 'react-toastify';
+import { Loader } from 'components/Loader/Loader';
 
 export const UserForm = () => {
   const [image, setImage] = useState(null);
@@ -60,301 +62,303 @@ export const UserForm = () => {
   const telegram = useSelector(selectUserTelegram);
   const avatar = useSelector(selectUserAvatarURL);
   const birthday = useSelector(selectUserBirthday) || Date.now();
+  const isLoading = useSelector(selectIsLoading);
 
   const formattedDate = format(new Date(birthday), 'yyyy-MM-dd');
 
-  const handleUpload = async event => {
-    event.preventDefault();
-    if (!setImage) {
-      toast.error('Please select a file');
-      return true;
-    }
-  };
+  // const handleUpload = async event => {
+  //   console.log('handleUpload ');
+  //   event.preventDefault();
+  //   if (!setImage) {
+  //     toast.error('Please select a file');
+  //     return true;
+  //   }
+  // };
 
   const FILE_SIZE = 2 * 1024 * 1024;
   const SUPPORTED_FORMATS = ['image/jpg', 'image/jpeg', 'image/png'];
 
   return (
-    <Formik
-      initialValues={{ name, birthday: formattedDate, email, phone, telegram }}
-      validationSchema={Yup.object({
-        name: Yup.string()
-          .matches(NAME_REGEX, 'Allow letters, apostrophe, dash and spaces')
-          .min(3, 'Too short!')
-          .max(16, 'Too long!')
-          .required('Name is required'),
-        email: Yup.string()
-          .email('Invalid email')
-          .required('Email is required'),
-        birthday: Yup.date().required('Birthday is required').nullable(),
-        phone: Yup.string()
-          .matches(
-            PHONE_REGEX,
-            'Allow digits, spaces, dashes and can start with +'
-          )
-          .nullable(),
-        telegram: Yup.string()
-          .matches(
-            TELEGRAM_REGEX,
-            'Start with @ and contain only [a-z], [0-9] and underscores'
-          )
-          .max(16, 'Too long!')
-          .nullable(),
-        avatar: Yup.mixed()
-          .nullable()
-          .test('size', 'File too large', value => {
-            if (!value) {
-              return true;
-            }
-            const isGoodSize = value?.size <= FILE_SIZE;
-            if (!isGoodSize) {
-              toast.error('File too large');
-            }
-            return isGoodSize;
-          })
-          .test('format', 'Unsupported Format', value => {
-            if (!value) {
-              return true;
-            }
-            const isSupportedFormat = SUPPORTED_FORMATS.includes(value.type);
-            if (!isSupportedFormat) {
-              toast.error('Unsupported format');
-            }
-            return isSupportedFormat;
-          }),
-      })}
-      onSubmit={async (values, { setSubmitting }) => {
-        await dispatch(userForm(values)).unwrap();
-        setSubmitting(false);
-        toast.success('Form submitted successfully');
-      }}
-    >
-      {formik => (
-        <Form onSubmit={formik.handleSubmit}>
-          <AvatarBlock>
-            <LabelAva htmlFor="avatar">
-              {image ? (
-                <LabelImg alt="Avatar" src={image} width="48" height="48" />
-              ) : (
-                <>
-                  {avatar ? (
-                    <LabelImg
-                      alt="Avatar"
-                      src={avatar}
-                      width="48"
-                      height="48"
-                    />
-                  ) : (
-                    <DefaultSvg>
-                      <use
-                        xlinkHref={`${defaultAvatar}#${'profile-avatar-f'}`}
+    <>
+      {isLoading && <Loader />}
+      <Formik
+        initialValues={{
+          name,
+          birthday: formattedDate,
+          email,
+          phone,
+          telegram,
+        }}
+        validationSchema={Yup.object({
+          name: Yup.string()
+            .matches(NAME_REGEX, 'Allow letters, apostrophe, dash and spaces')
+            .min(3, 'Too short!')
+            .max(16, 'Too long!')
+            .required('Name is required'),
+          email: Yup.string()
+            .email('Invalid email')
+            .required('Email is required'),
+          birthday: Yup.date().required('Birthday is required').nullable(),
+          phone: Yup.string()
+            .matches(
+              PHONE_REGEX,
+              'Allow digits, spaces, dashes and can start with +'
+            )
+            .nullable(),
+          telegram: Yup.string()
+            .matches(
+              TELEGRAM_REGEX,
+              'Start with @ and contain only [a-z], [0-9] and underscores'
+            )
+            .max(16, 'Too long!')
+            .nullable(),
+          avatar: Yup.mixed()
+            .nullable()
+            .test('size', 'File too large', value => {
+              if (!value) {
+                return true;
+              }
+              const isGoodSize = value?.size <= FILE_SIZE;
+              if (!isGoodSize) {
+                toast.error('File too large');
+              }
+              return isGoodSize;
+            })
+            .test('format', 'Unsupported Format', value => {
+              if (!value) {
+                return true;
+              }
+              const isSupportedFormat = SUPPORTED_FORMATS.includes(value.type);
+              if (!isSupportedFormat) {
+                toast.error('Unsupported format');
+              }
+              return isSupportedFormat;
+            }),
+        })}
+        onSubmit={async (values, { setSubmitting }) => {
+          await dispatch(userForm(values)).unwrap();
+          setSubmitting(false);
+
+          toast.success('Form submitted successfully');
+        }}
+      >
+        {formik => (
+          <Form onSubmit={formik.handleSubmit}>
+            <AvatarBlock>
+              <LabelAva htmlFor="avatar">
+                {image ? (
+                  <LabelImg alt="Avatar" src={image} width="48" height="48" />
+                ) : (
+                  <>
+                    {avatar ? (
+                      <LabelImg
+                        alt="Avatar"
+                        src={avatar}
+                        width="48"
+                        height="48"
                       />
-                    </DefaultSvg>
-                  )}
-                </>
-              )}
-              <InputAva
-                ref={filePicker}
-                type="file"
-                id="avatar"
-                name="avatar"
-                onChange={event => {
-                  const file = event.target.files[0];
-                  formik.setFieldValue('avatar', file);
-                  setImage(URL.createObjectURL(file));
-                }}
-                accept={SUPPORTED_FORMATS.join(', ')}
-              />
-              <ButtonPlus>
-                <PlusSvg>
-                  <use xlinkHref={`${defaultAvatar}#${'profile-plus-s'}`} />
-                </PlusSvg>
-              </ButtonPlus>
-            </LabelAva>
+                    ) : (
+                      <DefaultSvg>
+                        <use
+                          xlinkHref={`${defaultAvatar}#${'profile-avatar-f'}`}
+                        />
+                      </DefaultSvg>
+                    )}
+                  </>
+                )}
+                <InputAva
+                  ref={filePicker}
+                  type="file"
+                  id="avatar"
+                  name="avatar"
+                  onChange={event => {
+                    const file = event.target.files[0];
+                    formik.setFieldValue('avatar', file);
+                    setImage(URL.createObjectURL(file));
+                  }}
+                  accept={SUPPORTED_FORMATS.join(', ')}
+                />
+                <ButtonPlus>
+                  <PlusSvg>
+                    <use xlinkHref={`${defaultAvatar}#${'profile-plus-s'}`} />
+                  </PlusSvg>
+                </ButtonPlus>
+              </LabelAva>
 
-            <TitleAvatar>{name}</TitleAvatar>
-            <TextAvatar>User</TextAvatar>
-          </AvatarBlock>
+              <TitleAvatar>{name}</TitleAvatar>
+              <TextAvatar>User</TextAvatar>
+            </AvatarBlock>
 
-          <FlexInput>
-            <Label htmlFor="name">
-              <LabelSpan
-                hasError={formik.touched.name && formik.errors.name}
-                success={formik.touched.name && !formik.errors.name}
-              >
-                User Name
-              </LabelSpan>
-              <Input
-                id="name"
-                name="name"
-                type="text"
-                placeholder="name"
-                onChange={formik.handleChange}
-                value={formik.values.name}
-                onBlur={formik.handleBlur}
-                hasError={formik.touched.name && formik.errors.name}
-                success={formik.touched.name && !formik.errors.name}
-                {...formik.getFieldProps('name')}
-              />
-              <Errors>
-                {formik.touched.name &&
-                  formik.errors.name &&
-                  formik.errors.name}
-              </Errors>
-              {/* {formik.touched.name && !formik.errors.name && (
+            <FlexInput>
+              <Label htmlFor="name">
+                <LabelSpan
+                  hasError={formik.touched.name && formik.errors.name}
+                  success={formik.touched.name && !formik.errors.name}
+                >
+                  User Name
+                </LabelSpan>
+                <Input
+                  id="name"
+                  name="name"
+                  type="text"
+                  placeholder="name"
+                  onChange={formik.handleChange}
+                  value={formik.values.name}
+                  onBlur={formik.handleBlur}
+                  hasError={formik.touched.name && formik.errors.name}
+                  success={formik.touched.name && !formik.errors.name}
+                  {...formik.getFieldProps('name')}
+                />
+                <Errors>{formik.touched.name && formik.errors.name}</Errors>
+                {/* {formik.touched.name && !formik.errors.name && (
                 <Success>Valid name</Success>
               )} */}
-            </Label>
+              </Label>
 
-            <BirthdayContainer>
-              <Label htmlFor="birthday">
-                <LabelSpan
-                  hasError={formik.errors.birthday}
+              <BirthdayContainer>
+                <Label htmlFor="birthday">
+                  <LabelSpan
+                    hasError={formik.errors.birthday}
+                    success={
+                      formik.touched.birthday || birthdayValidationCompleted
+                    }
+                  >
+                    Birthday
+                  </LabelSpan>
+                  <StyledIconContainer>
+                    <ArrowSvg>
+                      <use
+                        xlinkHref={`${defaultAvatar}#${'user-chevron-down-sf'}`}
+                      />
+                    </ArrowSvg>
+                  </StyledIconContainer>
+                </Label>
+                <GlobalStyles />
+                <StyledDatePick
+                  id="birthday"
+                  name="birthday"
+                  selected={new Date(formik.values.birthday)}
+                  onChange={date => {
+                    formik.setFieldValue('birthday', date);
+                    setBirthdayValidationCompleted(true);
+                  }}
+                  onBlur={formik.handleBlur}
+                  dateFormat="dd-MM-yyyy"
+                  maxDate={new Date()}
+                  placeholderText="dd-MM-yyyy"
+                  formatWeekDay={day => day.charAt(0)}
+                  calendarStartDay={1}
+                  hasError={formik.touched.birthday && formik.errors.birthday}
                   success={
                     formik.touched.birthday || birthdayValidationCompleted
                   }
-                >
-                  Birthday
-                </LabelSpan>
-                <StyledIconContainer>
-                  <ArrowSvg>
-                    <use
-                      xlinkHref={`${defaultAvatar}#${'user-chevron-down-sf'}`}
-                    />
-                  </ArrowSvg>
-                </StyledIconContainer>
-              </Label>
-              <GlobalStyles />
-              <StyledDatePick
-                id="birthday"
-                name="birthday"
-                selected={new Date(formik.values.birthday)}
-                onChange={date => {
-                  formik.setFieldValue('birthday', date);
-                  setBirthdayValidationCompleted(true);
-                }}
-                onBlur={formik.handleBlur}
-                dateFormat="dd-MM-yyyy"
-                maxDate={new Date()}
-                placeholderText="dd-MM-yyyy"
-                formatWeekDay={day => day.charAt(0)}
-                calendarStartDay={1}
-                hasError={formik.touched.birthday && formik.errors.birthday}
-                success={formik.touched.birthday || birthdayValidationCompleted}
-              />
-              <Errors>
-                {formik.touched.birthday &&
-                  formik.errors.birthday &&
-                  formik.errors.birthday}
-              </Errors>
-              {/* {formik.touched.birthday && !formik.errors.birthday && (
+                />
+                <Errors>
+                  {formik.touched.birthday && formik.errors.birthday}
+                </Errors>
+                {/* {formik.touched.birthday && !formik.errors.birthday && (
                 <Success>Valid birthday</Success>
               )} */}
-            </BirthdayContainer>
+              </BirthdayContainer>
 
-            <Label htmlFor="email">
-              <LabelSpan
-                hasError={formik.touched.email && formik.errors.email}
-                success={formik.touched.email && !formik.errors.email}
-              >
-                Email
-              </LabelSpan>
-              <Input
-                id="email"
-                name="email"
-                type="email"
-                placeholder="email"
-                onChange={formik.handleChange}
-                onBlur={formik.handleBlur}
-                value={formik.values.email}
-                hasError={formik.touched.email && formik.errors.email}
-                success={formik.touched.email && !formik.errors.email}
-                {...formik.getFieldProps('email')}
-              />
-              <Errors>
-                {formik.touched.email &&
-                  formik.errors.email &&
-                  formik.errors.email}
-              </Errors>
-              {/* {formik.touched.email && !formik.errors.email && (
+              <Label htmlFor="email">
+                <LabelSpan
+                  hasError={formik.touched.email && formik.errors.email}
+                  success={formik.touched.email && !formik.errors.email}
+                >
+                  Email
+                </LabelSpan>
+                <Input
+                  id="email"
+                  name="email"
+                  type="email"
+                  placeholder="email"
+                  onChange={formik.handleChange}
+                  onBlur={formik.handleBlur}
+                  value={formik.values.email}
+                  hasError={formik.touched.email && formik.errors.email}
+                  success={formik.touched.email && !formik.errors.email}
+                  {...formik.getFieldProps('email')}
+                />
+                <Errors>{formik.touched.email && formik.errors.email}</Errors>
+                {/* {formik.touched.email && !formik.errors.email && (
                 <Success>Valid email</Success>
               )} */}
-            </Label>
-            <Label htmlFor="phone">
-              <LabelSpan
-                hasError={formik.touched.phone && formik.errors.phone}
-                success={formik.touched.phone && !formik.errors.phone}
-              >
-                Phone
-              </LabelSpan>
-              <Input
-                id="phone"
-                name="phone"
-                type="phone"
-                onChange={formik.handleChange}
-                onBlur={formik.handleBlur}
-                placeholder="phone number"
-                value={
-                  formik.values.phone === '' || !formik.values.phone
-                    ? ''
-                    : formik.values.phone
-                }
-                hasError={formik.touched.phone && formik.errors.phone}
-                success={formik.touched.phone && !formik.errors.phone}
-                {...formik.getFieldProps('phone')}
-              />
-              <Errors>
-                {formik.touched.phone &&
-                  formik.errors.phone &&
-                  formik.errors.phone}
-              </Errors>
-              {/* {formik.touched.phone && !formik.errors.phone && (
+              </Label>
+              <Label htmlFor="phone">
+                <LabelSpan
+                  hasError={formik.touched.phone && formik.errors.phone}
+                  success={formik.touched.phone && !formik.errors.phone}
+                >
+                  Phone
+                </LabelSpan>
+                <Input
+                  id="phone"
+                  name="phone"
+                  type="phone"
+                  onChange={formik.handleChange}
+                  onBlur={formik.handleBlur}
+                  placeholder="phone number"
+                  value={
+                    formik.values.phone === '' || !formik.values.phone
+                      ? ''
+                      : formik.values.phone
+                  }
+                  hasError={formik.touched.phone && formik.errors.phone}
+                  success={formik.touched.phone && !formik.errors.phone}
+                  {...formik.getFieldProps('phone')}
+                />
+                <Errors>{formik.touched.phone && formik.errors.phone}</Errors>
+                {/* {formik.touched.phone && !formik.errors.phone && (
                 <Success>Valid phone</Success>
               )} */}
-            </Label>
-            <Label htmlFor="telegram">
-              <LabelSpan
-                hasError={formik.touched.telegram && formik.errors.telegram}
-                success={formik.touched.telegram && !formik.errors.telegram}
-              >
-                Telegram
-              </LabelSpan>
-              <Input
-                id="telegram"
-                name="telegram"
-                type="text"
-                onChange={formik.handleChange}
-                onBlur={formik.handleBlur}
-                placeholder="telegram"
-                value={
-                  formik.values.telegram === '' || !formik.values.telegram
-                    ? ''
-                    : formik.values.telegram
-                }
-                hasError={formik.touched.telegram && formik.errors.telegram}
-                success={formik.touched.telegram && !formik.errors.telegram}
-                {...formik.getFieldProps('telegram')}
-              />
-              <Errors>
-                {formik.touched.telegram &&
-                  formik.errors.telegram &&
-                  formik.errors.telegram}
-              </Errors>
-
-              {/* {formik.touched.telegram && !formik.errors.telegram && (
+              </Label>
+              <Label htmlFor="telegram">
+                <LabelSpan
+                  hasError={formik.touched.telegram && formik.errors.telegram}
+                  success={formik.touched.telegram && !formik.errors.telegram}
+                >
+                  Telegram
+                </LabelSpan>
+                <Input
+                  id="telegram"
+                  name="telegram"
+                  type="text"
+                  onChange={formik.handleChange}
+                  onBlur={formik.handleBlur}
+                  placeholder="telegram"
+                  value={
+                    formik.values.telegram === '' || !formik.values.telegram
+                      ? ''
+                      : formik.values.telegram
+                  }
+                  hasError={formik.touched.telegram && formik.errors.telegram}
+                  success={formik.touched.telegram && !formik.errors.telegram}
+                  {...formik.getFieldProps('telegram')}
+                />
+                <Errors>
+                  {formik.touched.telegram && formik.errors.telegram}
+                </Errors>
+                {/* {formik.touched.telegram && !formik.errors.telegram && (
                 <Success>Valid telegram</Success>
               )} */}
-            </Label>
-          </FlexInput>
-          <Button
-            onSubmit={handleUpload}
-            type="submit"
-            disabled={!(formik.isValid && formik.dirty)}
-          >
-            Save changes
-          </Button>
-        </Form>
-      )}
-    </Formik>
+              </Label>
+            </FlexInput>
+            <Button
+              // onSubmit={() => {
+              //   console.log('then ');
+              //   handleUpload().finally(() => {
+              //     setIsFormSubmitted(true);
+              //   });
+              // }}
+              type="submit"
+              disabled={!(formik.isValid && formik.dirty) || isLoading}
+            >
+              Save changes
+            </Button>
+          </Form>
+        )}
+      </Formik>
+    </>
   );
 };