Finished feature 632

src/components/Cards/CreateOfferCard/FirstPart/ErrorMessage/ErrorMessage.js

   const formik = props.formik;
   return (
     <>
-      {formik.errors.nameOfProduct ? (
+      {formik.errors.nameOfProduct && formik.touched.nameOfProduct ? (
         <ErrorText>{formik.errors.nameOfProduct}</ErrorText>
-      ) : formik.errors.description ? (
+      ) : formik.errors.description && formik.touched.description ? (
         <ErrorText>{formik.errors.description}</ErrorText>
-      ) : formik.errors.location ? (
+      ) : formik.errors.location && formik.touched.location ? (
         <ErrorText>{formik.errors.location}</ErrorText>
-      ) : formik.errors.category ? (
+      ) : formik.errors.category && formik.touched.category ? (
         <ErrorText>{formik.errors.category}</ErrorText>
-      ) : formik.errors.subcategory ? (
+      ) : formik.errors.subcategory && formik.touched.subcategory ? (
         <ErrorText>{formik.errors.subcategory}</ErrorText>
-      ) : (<></>)}
+      ) : (
+        <></>
+      )}
     </>
   );
 };
 
 ErrorMessage.propTypes = {
-    formik: PropTypes.any,
+  formik: PropTypes.any,
 };
 
 export default ErrorMessage;

src/components/Cards/CreateOfferCard/FirstPart/FirstPartCreateOffer.js

     initialValues,
     validationSchema,
     onSubmit: handleSubmit,
-    validateOnBlur: true,
+    // validateOnBlur: true,
     enableReinitialize: true,
   });
 

src/components/Cards/FilterCard/FilterCard.js

       myOffers={props.myOffers}
       skeleton={props.skeleton}
     >
-      <SkeletonFilterCard
-        skeleton={props.skeleton}
-      />
+      <SkeletonFilterCard skeleton={props.skeleton} />
       {/* Header title for my offers */}
       {props.myOffers && <HeaderBack />}
 
         />
 
         {/* Locations */}
-        <LocationChoser filters={filters} ref={locationRef} />
+        {!props.myOffers && (
+          <LocationChoser filters={filters} ref={locationRef} />
+        )}
       </ContentContainer>
 
       <FilterFooter

src/components/Cards/ProfileCard/ProfileCard.styled.js

   box-sizing: border-box;
   padding: 0 50px;
   margin-top: 34px;
+  overflow: hidden;
 
   @media (max-width: 1200px) {
     padding: 0 36px 0 0;
 `;
 
 export const ProfileCardWrapper = styled(Card)`
-  border: 1px solid ${selectedTheme.colors.primaryPurple};
+  border: 1px solid ${selectedTheme.colors.borderNormal};
   background: ${(props) =>
     props.isMyProfile ? selectedTheme.colors.primaryPurple : "white"};
   width: 100%;
   min-width: fit-content;
   padding: 1rem;
   position: relative;
+  border-radius: 0 0 4px 4px;
 `;
 
 // export const ProfileName = styled(Typography)`

src/components/Cards/ProfileCard/ProfileStats/ProfileStats.styled.js

   padding-bottom: 1.3rem;
   margin-bottom: -1rem;
   margin-left: -1rem;
-  border-radius: 0 0 4px 4px;
+  /* border-radius: 0 0 4px 4px; */
 `;
 export const ProfileStatsGrid = styled(Grid)`
   display: flex;

src/components/Header/AboutHeader/AboutHeader.styled.js

   font-size: 16px;
   line-height: 22px;
   letter-spacing: 0.02em;
+  border-bottom: 0px solid ${selectedTheme.iconYellowColor};
   &:hover {
     border-bottom: 1px solid ${selectedTheme.colors.iconYellowColor};
   }

src/components/MarketPlace/Header/Header.js

 import React, { useMemo } from "react";
 import PropTypes from "prop-types";
 import {
-  ButtonContainer,
+  // ButtonContainer,
   CategoryHeaderIcon,
   HeaderAltLocation,
   HeaderButton,
   HeaderLocation,
   HeaderOptions,
   HeaderSelect,
-  HeaderText,
+  // HeaderText,
+  HeaderTitleContainer,
+  HeaderTitleText,
   HeaderWrapperContainer,
   IconStyled,
   PageTitleContainer,
   SelectOption,
+  SwapsHeaderIcon,
   SwapsIcon,
   SwapsTitle,
 } from "./Header.styled";
 import { useSelector } from "react-redux";
 import { selectHeaderString } from "../../../store/selectors/filtersSelectors";
 import useIsMobile from "../../../hooks/useIsMobile";
-import { ArrowButton } from "../../Buttons/ArrowButton/ArrowButton";
-import history from "../../../store/utils/history";
+// import { ArrowButton } from "../../Buttons/ArrowButton/ArrowButton";
+// import history from "../../../store/utils/history";
 
 const DownArrow = (props) => (
   <IconStyled {...props}>
   const handleChangeSelect = (event) => {
     sorting.changeSorting(event.target.value);
   };
-  const goBack = () => {
-    history.goBack();
-  };
+  // const goBack = () => {
+  //   history.goBack();
+  // };
 
   return (
     <>
                   <HeaderAltLocation>{altString}</HeaderAltLocation>
                 </>
               ) : (
-                <ButtonContainer onClick={goBack}>
-                  <ArrowButton side={"left"}></ArrowButton>
-                  <HeaderText>{t("profile.backToHome")}</HeaderText>
-                </ButtonContainer>
+                <HeaderTitleContainer>
+                  <SwapsHeaderIcon />
+                  <HeaderTitleText>{t("header.myOffers")}</HeaderTitleText>
+                </HeaderTitleContainer>
               )}
             </>
           </Tooltip>

src/components/MarketPlace/Header/Header.styled.js

     font-size: 14px;
   }
 `;
+export const SwapsHeaderIcon = styled(SwapsIcon)`
+  width: 18px;
+  height: 18px;
+`
+export const HeaderTitleContainer = styled(Box)`
+  position: relative;
+  left: 5px;
+`
+export const HeaderTitleText = styled(Typography)`
+  font-family: ${selectedTheme.fonts.textFont};
+  color: ${selectedTheme.colors.primaryText};
+  font-size: 16px;
+  position: relative;
+  bottom: 2px;
+`

src/components/Profile/ProfileOffers/ProfileOffers.js

                 isMyOffer={props.isMyProfile}
                 offer={item}
                 key={JSON.stringify(item)}
-                pinned
                 messageUser={messageUser}
               />
             ))

src/components/Profile/ProfileOffers/SelectSortField/SelectSortField.styled.js

   width: 210px;
   height: 35px;
   font-family: ${selectedTheme.fonts.textFont};
+  background: white;
   margin-top: 3px;
   font-weight: 400;
   position: absolute;

src/components/UserReviews/NoReviews/NoReviews.js

     <NoReviewsContainer>
       <NoReviewsText>{t("reviews.title")}</NoReviewsText>
       <NoReviewsAltText>{t("reviews.altTitle")}</NoReviewsAltText>
-      <UserReviewsSkeleton numOfElements={isMobile ? 1 : 2} />
+      <UserReviewsSkeleton noReviews numOfElements={isMobile ? 1 : 2} />
     </NoReviewsContainer>
   );
 };

src/components/UserReviews/NoReviews/NoReviews.styled.js

 import selectedTheme from "../../../themes"
 
 export const NoReviewsContainer = styled(Box)`
+  text-align: center;
+  margin-top: 36px;
 `
 export const NoReviewsText = styled(Typography)`
   color: ${selectedTheme.colors.primaryPurple};
   font-family: ${selectedTheme.fonts.textFont};
   text-align: center;
   font-weight: 700;
-  width: 100%;
+  width: 229px;
   
 `
 export const NoReviewsAltText = styled(Typography)`

src/components/UserReviews/NoReviews/UserReviewsSkeleton/UserReviewsSkeleton.styled.js

   display: flex;
   flex-direction: row;
   & * {
-    background-color: ${(props) =>
-      props.skeleton
-        ? `${selectedTheme.colors.skeletonItemColor}`
-        : `${selectedTheme.colors.filterSkeletonBackgroundSecond}`};
-  }
-  & * {
+    background-color: ${selectedTheme.colors.skeletonItemColor};
     ${(props) =>
       props.skeleton &&
       css`
   width: 54px;
   height: 54px;
   border-radius: 100%;
+  background-color: ${selectedTheme.colors.skeletonItemColor};
   ${(props) =>
     props.skeleton &&
     css`
   height: 18px;
   margin-top: 18px;
   margin-left: 18px;
+  background-color: ${selectedTheme.colors.skeletonItemColor};
   ${(props) =>
     props.skeleton &&
     css`
 export const UserReviewsSkeletonSquareImage = styled(Box)`
   width: 54px;
   height: 54px;
-  background-color: ${(props) =>
-    props.skeleton
-      ? `${selectedTheme.colors.skeletonItemColor}`
-      : `${selectedTheme.colors.filterSkeletonBackgroundSecond}`};
-
+  background-color: ${selectedTheme.colors.skeletonItemColor};
   ${(props) =>
     props.skeleton &&
     css`
 export const UserReviewsSkeletonSquareInfoFirstLine = styled(Box)`
   width: 121px;
   height: 14px;
-  background-color: ${(props) =>
-    props.skeleton
-      ? `${selectedTheme.colors.skeletonItemColor}`
-      : `${selectedTheme.colors.filterSkeletonBackgroundSecond}`};
+  background-color: ${selectedTheme.colors.skeletonItemColor};
 
   ${(props) =>
     props.skeleton &&
   width: 78px;
   height: 18px;
   margin-top: 6px;
-  background-color: ${(props) =>
-    props.skeleton
-      ? `${selectedTheme.colors.skeletonItemColor}`
-      : `${selectedTheme.colors.filterSkeletonBackgroundSecond}`};
+  background-color: ${selectedTheme.colors.skeletonItemColor};
   ${(props) =>
     props.skeleton &&
     css`

src/components/UserReviews/UserReviews.styled.js

   /* @media (max-width: 1200px) {
     padding: 0 50px;
   } */
+  ${(props) =>
+    props.profile &&
+    `
+  position: relative;
+  top: -15px;
+  `}
   margin-top: ${(props) => (props.profile ? "60px" : "0")};
   @media (max-width: 600px) {
     position: relative;

src/pages/RegisterPages/Register/Register.js

         registerUser({ ...informations, ...values });
       }
     }
+    console.log({...informations, ...values})
     setInformations({ ...informations, ...values });
   };
 

src/pages/RegisterPages/Register/SecondPart/SecondPartOfRegistration.js

     },
     validationSchema: Yup.object().shape({
       nameOfFirm: Yup.string().required(t("login.usernameRequired")),
-      PIB: Yup.number()
+      PIB: Yup.string()
         .required(t("login.passwordRequired"))
-        .min(100000000, "PIB mora imati 9 karaktera!")
-        .max(999999999, "PIB mora imati 9 karaktera!"),
+        .min(9, t("register.PIBnoOfCharacters"))
+        .max(9, t("register.PIBnoOfCharacters")),
     }),
     onSubmit: props.handleSubmit,
     validateOnBlur: true,
         margin="normal"
         type="number"
         value={formik.values.PIB}
-        onChange={formik.handleChange}
+        onChange={(event) => {
+          formik.setFieldValue("PIB", event.target.value)
+        }}
         error={
           (formik.touched.PIB && Boolean(formik.errors.PIB)) || PIBTakenStatus
         }

src/validations/createOfferValidation/firstPartCreateOfferValidation.js

 
 export default (locations, categories, subcategories) =>
   Yup.object().shape({
-    nameOfProduct: Yup.string().required(i18next.t("offer.nameOfProductError")),
+    nameOfProduct: Yup.string().required(i18next.t("login.nameOfProductError")),
     description: Yup.string()
-      .required(i18next.t("offer.descriptionRequiredError"))
-      .min(8, i18next.t("offer.descriptionNoOfCharsError")),
+      .required(i18next.t("login.descriptionRequiredError"))
+      .min(8, i18next.t("login.descriptionNoOfCharsError")),
     location: Yup.string().oneOf(
       locations.map((l) => l.city),
-      i18next.t("offer.locationError")
+      i18next.t("login.locationError")
     ),
     category: Yup.string().oneOf(
       categories.map((c) => c.name),
-      i18next.t("offer.categoryError")
+      i18next.t("login.categoryError")
     ),
     subcategory: Yup.string().oneOf(
       subcategories || [],
-      i18next.t("offer.subcategoryError")
+      i18next.t("login.subcategoryError")
     ),
   });