From 89bd1c126af3d8e76eb60128c09115ea564d6634 Mon Sep 17 00:00:00 2001
From: kika88vk <69463446+kika88vk@users.noreply.github.com>
Date: Mon, 20 Nov 2023 13:06:24 +0200
Subject: [PATCH 1/2] Fix validation style

---
 src/components/AddProductForm/AddProductForm.jsx    | 13 ++++++++-----
 .../AddProductForm/AddProductForm.styled.js         | 12 +++++++++++-
 2 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/src/components/AddProductForm/AddProductForm.jsx b/src/components/AddProductForm/AddProductForm.jsx
index 57d9a37..3d3be28 100644
--- a/src/components/AddProductForm/AddProductForm.jsx
+++ b/src/components/AddProductForm/AddProductForm.jsx
@@ -54,9 +54,9 @@ const AddProductForm = ({ id, title, calories, onClick, onClickSuccess }) => {
     // product_id: Yup.string().required(),
     // date: Yup.string().required(),
     weight: Yup.number()
-      .max(700, 'Weight should be no more than 700 grams')
-      .required()
-      .positive(),
+      .max(700, 'Weight should not exceed 700 grams')
+      .required('Weight is required')
+      .positive('Weight must be above zero'),
     // calories: Yup.number().required(),
   });
 
@@ -94,7 +94,7 @@ const AddProductForm = ({ id, title, calories, onClick, onClickSuccess }) => {
         validationSchema={schema}
         onSubmit={handleSubmit}
       >
-        {({ values, setFieldValue }) => (
+        {({ values, errors, touched, setFieldValue }) => (
           <Form autoComplete="off">
             <Container>
               <InputsContainer>
@@ -122,10 +122,13 @@ const AddProductForm = ({ id, title, calories, onClick, onClickSuccess }) => {
                         }
                       }}
                       value={values.weight}
+                      border={
+                        errors.weight && touched.weight && '1px solid #D80027'
+                      }
                     />
                     <FieldLabel>grams</FieldLabel>
-                    <ErrorMessageStyled name="weight" component="p" />
                   </WeightInputLabel>
+                  <ErrorMessageStyled name="weight" component="p" />
                 </div>
               </InputsContainer>
 
diff --git a/src/components/AddProductForm/AddProductForm.styled.js b/src/components/AddProductForm/AddProductForm.styled.js
index bb8e89d..95d95e0 100644
--- a/src/components/AddProductForm/AddProductForm.styled.js
+++ b/src/components/AddProductForm/AddProductForm.styled.js
@@ -61,11 +61,14 @@ export const WeightInputLabel = styled.label`
 `;
 
 export const WeightInput = styled(InputEl)`
+border: ${props => props.border || '1px solid var(--color-main-one)'};
   @media screen and (min-width: 768px) {
     width: 155px;
   }
 `;
 
+
+
 export const FieldLabel = styled.span`
   position: absolute;
   top: 50%;
@@ -73,6 +76,8 @@ export const FieldLabel = styled.span`
   color: rgba(239, 237, 232, 0.4);
   transform: translate(0, -50%);
   /* color:; */
+  display: flex;
+  align-items: center;
 `;
 
 export const Calories = styled.p`
@@ -144,4 +149,9 @@ color: var(--color-wrong-one);
 margin-top: 4px;
 line-height: 1.5;
 letter-spacing: 0.12px;
-`
\ No newline at end of file
+@media screen and (min-width: 768px) {
+width: 155px;
+}
+
+`
+

From e5c70c4380e5bca2059a464111571a7140c47438 Mon Sep 17 00:00:00 2001
From: kika88vk <69463446+kika88vk@users.noreply.github.com>
Date: Mon, 20 Nov 2023 13:17:59 +0200
Subject: [PATCH 2/2] Update mealsSlice.js

---
 src/redux/meals/mealsSlice.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/redux/meals/mealsSlice.js b/src/redux/meals/mealsSlice.js
index f1f193a..d2c2a56 100644
--- a/src/redux/meals/mealsSlice.js
+++ b/src/redux/meals/mealsSlice.js
@@ -5,19 +5,19 @@ const mealInitialState = {
     isLoading: false,
     error: null,
     meals: [],
-    isMealAdd: false,
+    isMealAdd: null,
 };
 
 const onPending = (state) => {
     state.isLoading = true;
     state.error = null;
-    state.isMealAdd = false;
+    // state.isMealAdd = false;
 };
 
 const onRejected = (state, { payload }) => {
     state.isLoading = false;
     state.error = payload;
-    state.isMealAdd = null;
+    // state.isMealAdd = false;
 };
 
 const arrOfActs = [getDiaryMealsThunk, delDiaryMealsThunk, postDiaryMealsThunk];