/*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, useEffect } from 'react';
import axios from 'axios';
import { Grid } from '@material-ui/core';
import styled from 'styled-components';
import CollectionReview from './CollectionReview.js';
import { apiUrl, apiDomain } from '../env';

export default function CollectionDescription(props) {
	// eslint-disable-next-line
	const [download_url, setDownloadUrl] = useState('');

	useEffect(() => {
		const body = {
			"package": {
				"object": [{ "type": "Collection", "id": props.collection_id }]
			}
		};
		axios
			.post(apiUrl + '/package', body)
			.catch(err => {
				if (err.response && err.response.status === 302) {
					setDownloadUrl(apiDomain + '/' + err.response.data.url);
				}
			});
	}, [props.collection_id]);

	return (
		<Grid container direction="column" justify="center" alignItems="center" spacing={5}
            style={props.contrast === "" ? {color: "#666"} : {color: "white"}}
        >
			<Grid
				item
				justify="center"
				alignItems="center"
			>
				<Title>{props.title}</Title>
			</Grid>
			<Grid
				item
				direction="row"
				justify="center"
				alignItems="center"
			>
				<Grid item>
					<CollectionReview
                        contrast={props.contrast}
						stars={props.stars}
						liked={props.liked}
						likes={props.likes}
						scrollToComment={props.scrollToComments}
						id={props.collection_id} />
				</Grid>
				{/* <Grid item container sm={8}
					direction="column" justify="center" alignItems="flex-end"
				>
					<Grid item style={{marginBottom: 10}}>
						<DownloadAnchor href={download_url} >
							<DownloadButton
								variant="outlined"
								color="primary"
								startIcon={<GetAppIcon fontSize="large"/>}
								size="large"
							>
								<ButtonText>Baixar Coleção</ButtonText>
							</DownloadButton>
						</DownloadAnchor>
					</Grid>
					<Grid item>
						<FollowCollectionButton user_id={state.currentUser.id} collection_id={props.collection_id}/>
					</Grid>
				</Grid> */}
			</Grid>

		</Grid>
	);
}

const Title = styled.h1`
	font-size: 2.5em;
	text-align: center
`