{{#if hasPages}}
	{{#each pages key="id" as |item index|}}
		{{#if canEdit}}
			<div class="start-section" data-index={{index}} data-before-id={{item.page.id}} id="add-section-button-{{item.page.id}}" {{action 'onShowSectionWizard' item.page}}>
				<div class="start-button">
					<div class="btn btn-success font-weight-bold">+ SECTION</div>
				</div>
			</div>
		{{else}}
			<div class="section-divider" />
		{{/if}}

		{{document/document-page document=document folder=folder page=item.page meta=item.meta pending=item.pending 
			permissions=permissions toEdit=toEdit roles=roles blocks=blocks
			onSavePage=(action 'onSavePage') onSavePageAsBlock=(action 'onSavePageAsBlock')
			onCopyPage=(action 'onCopyPage') onMovePage=(action 'onMovePage') onDeletePage=(action 'onDeletePage') refresh=(action refresh)}}
	{{/each}}

	{{#if canEdit}}
		<div class="start-section" data-index="0" data-before-id="0" id="add-section-button-0" {{action 'onShowSectionWizard'}}>
			<div class="start-button">
				<div class="btn btn-success font-weight-bold">+ SECTION</div>
			</div>
		</div>
	{{/if}}
{{/if}}

{{#unless hasPages}}
	{{#if canEdit}}
		<div class="start-section start-section-empty-state" data-index="-1" data-before-id="0" id="add-section-button-0" {{action 'onShowSectionWizard'}}>
			<div class="start-button">
				<div class="btn btn-success font-weight-bold">+ SECTION</div>
			</div>
		</div>
	{{/if}}
{{/unless}}

{{#if canEdit}}
	<div id="wizard-placeholder" class="hide margin-top-50" />
	<div id="new-section-wizard" class="new-section-wizard">
		<div class="container box">
			<div class="row clearfix">
				<div class="col-12 clearfix">
					<div class="float-right mb-5">
						<button type="button" class="btn btn-secondary" {{action 'onHideSectionWizard'}}>Cancel</button>
					</div>
				</div>
			</div>
			<div class="row">
				<div class="col-12">
					<div class="form-group">
						{{input type="text" id="new-section-name" value=newSectionName class=(if newSectionNameMissing 'form-control form-control-lg is-invalid' 'form-control form-control-lg') placeholder="Enter section name" autocomplete="off"}}
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col-12">
					<div class="form-group">
						<div class="new-section-caption">Insert section type</div>
						<ul class="preset-list">
							{{#each sections as |section|}}
								<li class="item" {{action 'onInsertSection' section}}>
									<div class="icon">
										<img class="img" src="/sections/{{section.contentType}}.png" srcset="/sections/{{section.contentType}}@2x.png" />
									</div>
									<div class='title'>{{section.title}}</div>
								</li>
							{{/each}}
						</ul>
					</div>
				</div>
			</div>

			<div class="row">
				<div class="col-12">
					{{#if hasBlocks}}
						<div class="new-section-caption">Insert re-usable content</div>
						<ul class="block-list">
							{{#each blocks as |block|}}
								<li class="item" title="{{block.firstname}} {{block.lastname}}, {{time-ago block.created}}, used: {{ block.used }}" data-toggle="tooltip" data-placement="top">
									<div class="actions">
										{{#if permissions.documentTemplate}}
											{{#link-to 'document.block' folder.id folder.slug document.id document.slug block.id class="button-icon-green button-icon-small align-middle"}}
												<i class="material-icons">edit</i>
											{{/link-to}}
											<div class="button-icon-gap" />
											<div id={{concat 'delete-block-button-' block.id}} class="button-icon-red button-icon-small align-middle" {{action 'onShowDeleteBlockModal' block.id}}>
												<i class="material-icons">delete</i>
											</div>
										{{/if}}
									</div>
									<div class="details" {{action 'onInsertBlock' block}}>
										<div class="title text-truncate">{{block.title}}</div>
										<div class="desc text-truncate">{{block.excerpt}}</div>
									</div>
								</li>
							{{/each}}
						</ul>
					{{else}}
						<div class="template-caption">You have no reusable content &mdash; publish any section as a template</div>
					{{/if}}
				</div>
			</div>
		</div>
	</div>
{{/if}}

{{#if permissions.documentTemplate}}
	{{#ui/ui-dialog title="Delete Content Block" confirmCaption="Delete" buttonType="btn-danger" show=showDeleteBlockDialog onAction=(action 'onDeleteBlock')}}
		<p>Are you sure you want to delete this re-usable content block?</p>
	{{/ui/ui-dialog}}
{{/if}}