From 23393091f2fc21f1aadbb60159fbaa1e6153ef15 Mon Sep 17 00:00:00 2001
From: Lucas Schoenfelder <les17@inf.ufpr.br>
Date: Wed, 20 May 2020 13:41:40 -0300
Subject: [PATCH] should be done
---
src/Components/Comment.js | 166 ++++++++++++++++++++++++++++++++++++++
1 file changed, 166 insertions(+)
create mode 100644 src/Components/Comment.js
diff --git a/src/Components/Comment.js b/src/Components/Comment.js
new file mode 100644
index 00000000..753d926b
--- /dev/null
+++ b/src/Components/Comment.js
@@ -0,0 +1,166 @@
+/*Copyright (C) 2019 Centro de Computacao Cientifica e Software Livre
+Departamento de Informatica - Universidade Federal do Parana
+
+This file is part of Plataforma Integrada MEC.
+
+Plataforma Integrada MEC is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+Plataforma Integrada MEC is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
+
+import React, {useState, useContext, useEffect} from 'react'
+import {Store} from '../Store.js'
+import styled from 'styled-components'
+import Grid from '@material-ui/core/Grid';
+import { Button } from '@material-ui/core';
+import {Link} from 'react-router-dom'
+import {apiDomain} from '../env';
+import noAvatar from "../img/default_profile.png";
+import Rating from '@material-ui/lab/Rating';
+import StarBorderIcon from '@material-ui/icons/StarBorder';
+
+export default function Comment (props) {
+ /*
+ Required props:
+ authorID = author id; links to public user page
+ authorAvatar = either a string denoting the author's avatar file location or null
+ rating = star rating
+ name = title (?)
+ authorName = author username
+ description = the user comment itself
+ createdAt
+ recurso : boolean; determines whether to display orange or purple font
+ */
+
+ const [editando, setEditando] = useState(false)
+ const {state} = useContext(Store)
+
+ var moment = require('moment')
+
+ return (
+ <Grid container style={{paddingLeft : "20px"}}>
+ <Grid item xs={1}>
+ {
+ props.authorID &&
+ <AvatarDiv>
+ <Link to={'/usuario-publico/' + props.authorID}>
+ <img src={props.authorAvatar ? apiDomain + props.authorAvatar : noAvatar} alt="author avatar"/>
+ </Link>
+ </AvatarDiv>
+ }
+ </Grid>
+
+ <Grid item xs={10}>
+ <Comentario>
+ <div className="star-rating-container">
+ <Rating
+ name="read-only"
+ value={props.rating}
+ readOnly
+ size="small"
+ style={{color:"#666"}}
+ emptyIcon={<StarBorderIcon fontSize="inherit" style={{color : "#a5a5a5"}} />}
+ />
+ </div>
+
+ {
+ props.name &&
+ <strong>{props.name}</strong>
+ }
+
+
+ <div>
+ {
+ editando ?
+ (
+ [
+ <span>edita ai irmao</span>
+ ]
+ )
+ :
+ (
+ [
+ <p>
+ {
+ props.authorID &&
+ <Link
+ to={'/usuario-publico/' + props.authorID}
+ style={{
+ fontWeight : "bolder",
+ color : props.recurso ? "#ff7f00" : "#673ab7"
+ }}
+ >
+ {props.authorName}
+ </Link>
+ }
+ : {props.description}
+ </p>
+ ]
+ )
+ }
+ </div>
+
+ {
+ props.authorID !== state.currentUser.userId &&
+ <span className="date">
+ {moment(props.createdAt).format("DD/MM/YYYY")}
+ </span>
+ }
+ </Comentario>
+ </Grid>
+ </Grid>
+ )
+}
+
+const Comentario = styled.div`
+ @media screen and (max-width: 990px) {
+ padding-left : 55px !important;
+ }
+ font-size : 14px;
+
+ .star-rating-container {
+ width : 100px;
+ }
+
+ p {
+ margin : 0 0 10px;
+ padding-left : 2px
+ }
+
+ a {
+ text-decoration : none !important;
+ }
+
+ .date {
+ color : #ababab;
+ font-size : 12px;
+ font-weight : lighter;
+ padding-left : 3px;
+ }
+`
+
+const AvatarDiv = styled.div`
+ text-align : center;
+ float : left;
+ position : relative;
+ width : 65px;
+ height : 65px;
+ a {
+ text-decoration : none !important;
+ }
+
+ img {
+ width : 100% !important;
+ height : 100% !important;
+ border-radius : 100%
+ vertical-align : middle;
+ }
+`
--
GitLab