{{#section/base-editor document=document folder=folder page=page busy=busy
	tip="Trello is the visual way to manage your projects and organize anything (https://trello.com)"
	isDirty=(action 'isDirty') onCancel=(action 'onCancel') onAction=(action 'onAction')}}

	{{#if authenticated}}
		{{#if noBoards}}
			<p>You have no team boards to share - personal boards are never shown</p>
		{{else}}
			<div class="form-group">
				<label>Select Board</label>
				{{ui-select id="boards-dropdown" content=boards action=(action 'onBoardChange') optionValuePath="id" optionLabelPath="name" selection=config.board}}
			</div>
			<div class="form-group">
				<label for="airtable-embed-cod">Select Lists</label>
				<div class="section-trello-board" style= {{boardStyle}}>
					<div class="section-trello-board-title">{{config.board.name}}</div>
					{{#each config.lists as |list|}}
						<div class="section-trello-list" {{action 'onListCheckbox' list.id}}>
							{{#if list.included}}
								<i class="material-icons widget-checkbox checkbox-gray section-trello-list-checkbox">check_box</i>
							{{else}}
								<i class="material-icons widget-checkbox checkbox-gray section-trello-list-checkbox">check_box_outline_blank</i>
							{{/if}}
							<span class="trello-list-title">{{list.name}}</span>
						</div>
					{{/each}}
					<div class="clearfix" />
				</div>
			</div>
		{{/if}}
	{{else}}
		<div class="btn btn-primary" {{action 'auth'}}>Authenticate</div>
	{{/if}}

{{/section/base-editor}}