diff --git a/src/Components/CollectionAuthor.js b/src/Components/CollectionAuthor.js index cc32c2fe89a6d2b7d5bda29e6e54e2a4640263e1..54ce444032c4e4cefc778371b1e8f4144188a320 100644 --- a/src/Components/CollectionAuthor.js +++ b/src/Components/CollectionAuthor.js @@ -19,6 +19,7 @@ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/> import React from 'react'; import { Grid } from '@material-ui/core'; import styled from 'styled-components'; +import { Link } from 'react-router-dom'; import CircularProgress from '@material-ui/core/CircularProgress'; import LinearProgress from '@material-ui/core/LinearProgress'; @@ -30,13 +31,19 @@ export default function CollectionAuthor(props) { justify="center" alignItems="center"> {props.imgsrc ? - <UserAvatar src={props.imgsrc}/> + <UserLink + to={`/usuario-publico/${props.author_id}`} + > + <UserAvatar src={props.imgsrc}/> + </UserLink> : <CircularProgress color="secondary"/> } <InfoText>Coleção organizada por:</InfoText> {props.name ? - <UserName>{props.name}</UserName> + <UserLink to={`/usuario-publico/${props.author_id}`} > + <UserName>{props.name}</UserName> + </UserLink> : <CircularProgress /> } @@ -58,3 +65,9 @@ const UserName = styled.h1` margin-top: 10px; color: #673ab7; ` +const UserLink = styled(Link)` + text-decoration: none; + &:focus, &:hover, &:visited, &:link, &:active { + text-decoration: none; + } +` diff --git a/src/Pages/CollectionPage.js b/src/Pages/CollectionPage.js index 2e789a4ba12b5a3547b571868c2484721bd3087b..13d3ce17caeb40bd02c0b62fbd3233b7317ccf35 100644 --- a/src/Pages/CollectionPage.js +++ b/src/Pages/CollectionPage.js @@ -56,6 +56,7 @@ export default function CollectionPage(props) { <Grid item xs={10} md={3}> <CollectionAuthor + author_id={collection.owner ? collection.owner.id : 0} name={collection.owner ? collection.owner.name : ""} imgsrc={collection.owner ? apiDomain+collection.owner.avatar : ''}/> </Grid>