WIP Collection Page

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;
+	}
+`

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>