Finished feature 658

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

@@ -10,7 +10,7 @@ import { useTranslation } from "react-i18next";
 const ProfileStats = (props) => {
   const { t } = useTranslation();
   return (
-    <ProfileStatsContainer>
+    <ProfileStatsContainer className={props.className}>
       <ProfileStatsGrid>
         <StatsItem variant="subtitle2">
           <b>{props.profile?.statistics?.publishes?.count}</b>
@@ -39,6 +39,7 @@ const ProfileStats = (props) => {
 ProfileStats.propTypes = {
   profile: PropTypes.object,
   percentOfSucceededExchanges: PropTypes.number,
+  className: PropTypes.string,
 };
 
 export default ProfileStats;

src/components/ItemDetails/ItemDetails.styled.js

@@ -12,7 +12,7 @@ export const OfferIconContainer = styled(Box)`
 
   @media screen and (max-width: 600px) {
     margin-left: 0;
-    margin-top: 228px;
+    margin-top: 310px;
 
     svg {
       width: 14px;

src/components/ProfileMini/ProfileMini.js

@@ -3,6 +3,7 @@ import {
   ProfileHeader,
   ProfileHeaderIconContainer,
   ProfileHeaderText,
+  ProfileMiniStats,
 } from "./ProfileMini.styled";
 import { useSelector } from "react-redux";
 import { selectOffer } from "../../store/selectors/offersSelectors";
@@ -25,6 +26,7 @@ const ProfileMini = () => {
     if (offer?.offer?.userId?.toString() === userId?.toString()) return true;
     return false;
   }, [offer, userId]);
+  console.log(offer);
   return (
     <>
       {isLoadingOfferContent || isLoadingOfferContent === undefined ? (
@@ -40,6 +42,12 @@ const ProfileMini = () => {
             isMyProfile={isMyProfile}
             singleOffer
           />
+          <ProfileMiniStats
+            profile={offer.companyData}
+            percentOfSucceededExchanges={
+              offer.companyData?.statistics?.exchanges?.total
+            }
+          />
         </ProfileHeader>
       )}
     </>

src/components/ProfileMini/ProfileMini.styled.js

@@ -2,6 +2,7 @@ import styled from "styled-components";
 import { Box } from "@mui/system";
 import { Typography } from "@mui/material";
 import selectedTheme from "../../themes";
+import ProfileStats from "../Cards/ProfileCard/ProfileStats/ProfileStats";
 
 export const ProfileHeader = styled(Box)`
   margin-top: 60px;
@@ -34,3 +35,16 @@ export const ProfileHeaderText = styled(Typography)`
     font-size: 12px;
   }
 `;
+export const ProfileMiniStats = styled(ProfileStats)`
+  position: relative;
+  width: 100%;
+  margin-left: 0;
+  margin-top: -1rem;
+  margin-bottom: 36px;
+  border-radius: 0 0 4px 4px;
+  border: 1px solid ${selectedTheme.colors.primaryPurple};
+
+  @media (max-width: 600px) {
+    width: 92%;
+  }
+`;

src/components/UserReviews/UserReviews.styled.js

@@ -65,7 +65,7 @@ export const ReviewList = styled(List)`
   border: 1px solid ${selectedTheme.colors.borderNormal};
   overflow-y: auto;
   overflow-x: hidden;
-  max-height: ${(props) => (props.isProfileReviews ? "70vh" : "43vh")};
+  max-height: ${(props) => (props.isProfileReviews ? "70vh" : "39vh")};
 
   /* overflow-y: auto; */
   &::-webkit-scrollbar {