{"size": 737, "ext": "js", "max_stars_repo_path": "front/src/components/PainelAssunto.js", "max_stars_repo_name": "kibonusp/eagle-edu-selection", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "front/src/components/PainelAssunto.js", "max_issues_repo_name": "kibonusp/eagle-edu-selection", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "front/src/components/PainelAssunto.js", "max_forks_repo_name": "kibonusp/eagle-edu-selection", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 27.2962962963, "max_line_length": 102, "alphanum_fraction": 0.5834464043}
import '../styles/PainelAssunto.css';
import {useState, useEffect} from 'react';
import Assunto from './Assunto';

function PainelAssunto(props) {
    const [assuntos, setAssuntos] = useState();

    useEffect(() => {
        fetch(`http://localhost:3333/curso/${props.cursoId}/assunto`)
            .then(response => response.json())
            .then(data => setAssuntos(data));
    }, [props.cursoId]);

    let assuntoTags = '';
    if (assuntos)
        assuntoTags = assuntos.map(assunto => <Assunto key={assunto.id} assunto={assunto}></Assunto>);

    return(
        <div id="painel-assunto">
            <div id="div-branco">
                {assuntoTags}
            </div>
        </div>
    )
}

export default PainelAssunto;