diff --git a/FrontEnd/src/components/ProfileDetail/MainInfo/TitleInfo.jsx b/FrontEnd/src/components/ProfileDetail/MainInfo/TitleInfo.jsx index 7787294b2..ce338693b 100644 --- a/FrontEnd/src/components/ProfileDetail/MainInfo/TitleInfo.jsx +++ b/FrontEnd/src/components/ProfileDetail/MainInfo/TitleInfo.jsx @@ -1,7 +1,9 @@ import { useState, useMemo } from 'react'; +import { useNavigate } from 'react-router-dom'; import { Badge } from 'antd'; import { StarOutlined, StarFilled } from '@ant-design/icons'; import { PropTypes } from 'prop-types'; +import classNames from 'classnames'; import useSWRMutation from 'swr/mutation'; import { useUser } from '../../../hooks'; @@ -10,6 +12,7 @@ import classes from './TitleInfo.module.css'; function TitleInfo({ isAuthorized, data }) { const { user } = useUser(); + const navigate = useNavigate(); const [isSaved, setIsSaved] = useState(data.is_saved); const profile = useMemo(() => { return { @@ -72,6 +75,10 @@ function TitleInfo({ isAuthorized, data }) { } }; + const navigateToEditProfile = () => { + navigate('/profile/user-info'); + }; + const filledStar = ( ); + const getStarVisibility = () => { + if (isAuthorized) { + return isSaved ? filledStar : outlinedStar; + } + }; + const CategoryBadges = ({ categories }) => { return ( <> @@ -133,15 +146,30 @@ function TitleInfo({ isAuthorized, data }) {
{profile.region}
- {isAuthorized && !ownProfile ? ( - + {isAuthorized ? ( + <> + {!ownProfile && ( + + )} + {ownProfile && ( + + Редагувати профіль + + )} + ) : null} ); diff --git a/FrontEnd/src/components/ProfileDetail/MainInfo/TitleInfo.module.css b/FrontEnd/src/components/ProfileDetail/MainInfo/TitleInfo.module.css index 47588be6a..43830cfde 100644 --- a/FrontEnd/src/components/ProfileDetail/MainInfo/TitleInfo.module.css +++ b/FrontEnd/src/components/ProfileDetail/MainInfo/TitleInfo.module.css @@ -1,6 +1,6 @@ .title-block { display: flex; - width: 1304px; + width: 1280px; padding: 16px 12px 8px 12px; align-items: flex-start; gap: 12px; @@ -26,10 +26,9 @@ .title-block__about { display: flex; - width: 1010px; flex-direction: column; align-items: flex-start; - flex-shrink: 0; + flex: 1 0 0; } .title-block__activity { @@ -77,7 +76,7 @@ .title-block__button { display: flex; - height: 34px; + height: 32px; padding: 5px 15px; justify-content: center; align-items: center; @@ -88,6 +87,10 @@ cursor: pointer; } +.title-block__link { + height: 22px; +} + .added_to_saved__button { background: var(--primary-green-80, #1F9A7C); }