git fetch

This commit is contained in:
Николай Полтщук 2023-01-03 01:03:12 +03:00
parent 405986d5d5
commit 3238bf221c
3 changed files with 61 additions and 80 deletions

View File

@ -10,7 +10,6 @@ import './profileHeader.scss'
export const ProfileHeader = () => {
const [isLoggingOut, setIsLoggingOut] = useState(false);
const [gitInfo, setGitInfo] = useState([])
const dispatch = useDispatch();
const userRole = useSelector(getRole);
const profileInfo = useSelector(getProfileInfo)
@ -22,11 +21,6 @@ export const ProfileHeader = () => {
}).then((profileInfo) => {
dispatch(setProfileInfo(profileInfo))
})
fetchGet({
link: `${process.env.REACT_APP_API_URL}/api/profile/portfolio-projects?card_id=${localStorage.getItem('cardId')}`,
}).then((responseGit) => {
setGitInfo(responseGit)
})
}, [])
return(
<header className='profileHeader'>

View File

@ -150,7 +150,7 @@
font-size: 18px;
line-height: 32px;
@media (max-width: 420px) {
@media (max-width: 660px) {
line-height: 20px;
}
}
@ -166,6 +166,7 @@
font-weight: 500;
font-size: 14px;
line-height: 32px;
white-space: nowrap;
@media (max-width: 520px) {
font-size: 12px;
@ -270,6 +271,10 @@
max-width: 350px;
width: 100%;
@media (max-width: 825px) {
max-width: 100%;
}
&__about {
display: flex;
align-items: center;
@ -289,6 +294,30 @@
font-size: 16px;
line-height: 32px;
margin-bottom: 0;
white-space: nowrap;
max-width: 300px;
overflow: hidden;
text-overflow: ellipsis;
@media (max-width: 1040px) {
max-width: 250px;
}
@media (max-width: 890px) {
max-width: 200px;
}
@media (max-width: 825px) {
max-width: 500px;
}
@media (max-width: 720px) {
max-width: 250px;
}
@media (max-width: 470px) {
max-width: 200px;
}
}
}

View File

@ -1,6 +1,6 @@
import React, {useState} from 'react';
import React, {useEffect, useState} from 'react';
import { ProfileHeader } from "../components/Profile/ProfileHeader";
import { getProfileInfo } from "../redux/outstaffingSlice";
import {getProfileInfo} from "../redux/outstaffingSlice";
import { useSelector } from "react-redux";
import {transformHtml} from "../helper";
import { Footer } from '../components/Footer/Footer'
@ -10,10 +10,19 @@ import rightArrow from "../images/arrowRight.png"
import gitImgItem from "../images/gitItemImg.png"
import './../components/Profile/profile.scss'
import {fetchGet} from "../server/server";
export const Profile = () => {
const profileInfo = useSelector(getProfileInfo)
const [openGit, setOpenGit] = useState(false);
const [gitInfo, setGitInfo] = useState([])
useEffect(() => {
fetchGet({
link: `${process.env.REACT_APP_API_URL}/api/profile/portfolio-projects?card_id=${localStorage.getItem('cardId')}`,
}).then((responseGit) => {
setGitInfo(responseGit)
})
}, [])
return(
<div className='profile'>
<ProfileHeader/>
@ -60,78 +69,27 @@ export const Profile = () => {
<button>Редактировать раздел</button>
</div>
<div className='profile__sectionGitItems'>
<div className='profile__sectionGitItem gitItem'>
<div className='gitItem__info'>
<div className='gitItem__info__about'>
<img src={gitImgItem} alt='gitImg' />
<div className='gitItem__info__name'>
<h4>cybershop-api</h4>
<p>Реактивная социальная сеть</p>
{gitInfo.length && gitInfo.map((itemGit) => {
return <div key={itemGit.id} className='profile__sectionGitItem gitItem'>
<div className='gitItem__info'>
<div className='gitItem__info__about'>
<img src={gitImgItem} alt='gitImg' />
<div className='gitItem__info__name'>
<h4>{itemGit.title}</h4>
<p>{itemGit.description}</p>
</div>
</div>
<div className='gitItem__info__specification'>
<span></span>
<p>{itemGit.main_stack}</p>
</div>
</div>
<a className='gitItem__link' href={itemGit.link} target="_blank">
<img src={rightArrow} alt='arrowRight' />
</a>
</div>
</div>
<div className='gitItem__info__specification'>
<span></span>
<p>JavaScript</p>
</div>
</div>
<a className='gitItem__link'>
<img src={rightArrow} alt='arrowRight' />
</a>
</div>
<div className='profile__sectionGitItem gitItem'>
<div className='gitItem__info'>
<div className='gitItem__info__about'>
<img src={gitImgItem} alt='gitImg' />
<div className='gitItem__info__name'>
<h4>cybershop-api</h4>
<p>Реактивная социальная сеть</p>
</div>
</div>
<div className='gitItem__info__specification'>
<span></span>
<p>JavaScript</p>
</div>
</div>
<a className='gitItem__link'>
<img src={rightArrow} alt='arrowRight' />
</a>
</div>
<div className='profile__sectionGitItem gitItem'>
<div className='gitItem__info'>
<div className='gitItem__info__about'>
<img src={gitImgItem} alt='gitImg' />
<div className='gitItem__info__name'>
<h4>cybershop-api</h4>
<p>Реактивная социальная сеть</p>
</div>
</div>
<div className='gitItem__info__specification'>
<span></span>
<p>JavaScript</p>
</div>
</div>
<a className='gitItem__link'>
<img src={rightArrow} alt='arrowRight' />
</a>
</div>
<div className='profile__sectionGitItem gitItem'>
<div className='gitItem__info'>
<div className='gitItem__info__about'>
<img src={gitImgItem} alt='gitImg' />
<div className='gitItem__info__name'>
<h4>cybershop-api</h4>
<p>Реактивная социальная сеть</p>
</div>
</div>
<div className='gitItem__info__specification'>
<span></span>
<p>JavaScript</p>
</div>
</div>
<a className='gitItem__link'>
<img src={rightArrow} alt='arrowRight' />
</a>
</div>
})
}
</div>
</div>
}