import React from 'react';
import { useTracker } from 'meteor/react-meteor-data';

const ListPersons = () => {

    return <ul class="list-group">
        {
            persons.map((person, i) => {
                return <li class="list-group-item">
                {{#if update _id}}
                    {{> quickForm type="update" collection="Persons" doc=this id=getFormId}}
                    <button data-button-update class="btn btn-danger">Cancel</button>
                {{else}}
                    <div class="jumbotron" style='background-image: url("{{#each backgroundPic.each}}{{link}}{{/each}}");'>
                    <h2>{{name}}</h2>
                    {{#each profilePic.each}}
                        <img style="max-width:150px;max-height:150px" src="{{link}}"/>
                    {{/each}}
                    </div>
                    <button data-button-update class="btn btn-default">Update</button>
                {{/if}}
                </li>
            })
        }
    </ul>
}