{{#ui/ui-toolbar dark=false light=false raised=false large=true bordered=false}}
	{{#if hasDocuments}}
		{{ui/ui-toolbar-icon icon=constants.Icon.Export color=constants.Color.Gray
			tooltip="Export as HTML" onClick=(action "onShowExport")}}
	{{/if}}
	{{#if pinState.isPinned}}
		{{ui/ui-toolbar-icon icon=constants.Icon.BookmarkDelete color=constants.Color.Yellow
			tooltip="Remove view from bookmarks" onClick=(action "onUnpin")}}
	{{else if session.authenticated}}
		{{ui/ui-toolbar-icon icon=constants.Icon.BookmarkAdd color=constants.Color.Gray
			tooltip="Bookmark this view" onClick=(action "onPin")}}
	{{/if}}

	{{#if (or permissions.spaceOwner permissions.spaceManage)}}
		{{ui/ui-toolbar-icon icon=constants.Icon.Settings color=constants.Color.Gray
			tooltip="Space settings" linkTo="folder.settings"}}
	{{/if}}
{{/ui/ui-toolbar}}

{{#if permissions.documentAdd}}
	{{#ui/ui-toolbar dark=false light=true raised=true large=true bordered=true}}
		{{ui/ui-toolbar-icon icon=constants.Icon.Plus color=constants.Color.Green}}
		{{ui/ui-toolbar-label label="CONTENT" color=constants.Color.Green}}
		{{#attach-popover class="ember-attacher-popper" hideOn="clickout" showOn="click" isShown=false}}
			<div class="menu">
				<a class="item" href="#" {{action "onShowEmptyDocModal"}}>Blank canvas</a>
				{{#if hasTemplates}}
					<a class="item" href="#" {{action "onShowTemplateDocModal"}}>From template</a>
				{{/if}}
				<a class="item" href="#" {{action "onShowImportDocModal"}}>Import files</a>
			</div>
		{{/attach-popover}}
	{{/ui/ui-toolbar}}

	<div id="empty-doc-modal" class="modal" tabindex="-1" role="dialog">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">Blank Canvas</div>
				<div class="modal-body">
					<form onsubmit={{action "onAddEmptyDoc"}}>
						<div class="form-group">
							<label for="empty-doc-name">Document Name</label>
							{{input id="empty-doc-name" type="text" value=emptyDocName placeholder="Enter name" class=(if emptyDocNameError "form-control mousetrap is-invalid" "form-control mousetrap") autocomplete="off"}}
						</div>
					</form>
				</div>
				<div class="modal-footer">
					{{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel dismiss=true}}
					{{ui/ui-button-gap}}
					{{ui/ui-button color=constants.Color.Green light=true label=constants.Label.Add onClick=(action "onAddEmptyDoc")}}
				</div>
			</div>
		</div>
	</div>
	<div id="template-doc-modal" class="modal" tabindex="-1" role="dialog">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">From Template</div>
				<div class="modal-body">
					<form onsubmit={{action "onAddTemplateDoc"}}>
						<div class="form-group">
							<label for="template-doc-name">Document Name</label>
							{{input id="template-doc-name" type="text" value=templateDocName placeholder="Enter name" class=(if templateDocNameError "form-control mousetrap is-invalid" "form-control mousetrap") autocomplete="off"}}
						</div>
						<div class="widget-list-picker">
							<ul class="options">
								{{#each templates as |item|}}
									<li class="option {{if item.selected "selected"}}" {{action "onSelectTemplate" item}}>
										<div class="text text-truncate">
											{{item.name}}<br>{{item.excerpt}}
										</div>
										{{#if item.selected}}
											<i class="dicon {{constants.Icon.Tick}}" />
										{{/if}}
									</li>
								{{/each}}
							</ul>
						</div>
					</form>
				</div>
				<div class="modal-footer">
					{{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel dismiss=true}}
					{{ui/ui-button-gap}}
					{{ui/ui-button color=constants.Color.Green light=true label=constants.Label.Add onClick=(action "onAddTemplateDoc")}}
				</div>
			</div>
		</div>
	</div>
	<div id="import-doc-modal" class="modal" tabindex="-1" role="dialog">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">Import Files</div>
				<div class="modal-body">
					<div class="import-zone">
						<button id="import-document-button" type="button" class="dmz-button-yellow-light text-center">
							<br>
							Click to select files or drag-drop files
							<br><br>
							.doc, .docx, .md, .markdown
							<br><br>
						</button>
						<div class="import-status">
							{{#each importStatus as |status|}}
								<p>{{status}}</p>
							{{/each}}
						</div>
					</div>
				</div>
				<div class="modal-footer">
					{{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel dismiss=true}}
				</div>
			</div>
		</div>
	</div>
{{/if}}

<div id="space-export-modal" class="modal" tabindex="-1" role="dialog">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">Export as HTML</div>
			<div class="modal-body">
				{{#if hasCategories}}
					<p>Export all space content as HTML or select categories.</p>
					{{#each categories as |cat|}}
						{{#ui/ui-checkbox selected=cat.exportSelected}}{{cat.category}}{{/ui/ui-checkbox}}
					{{/each}}
				{{else}}
					<p>All space content will be exported as a single self-enclosed HTML file.</p>
				{{/if}}
			</div>
			<div class="modal-footer">
				{{ui/ui-button color=constants.Color.Gray light=true label=constants.Label.Cancel dismiss=true}}
				{{ui/ui-button-gap}}
				{{ui/ui-button color=constants.Color.Green light=true label=constants.Label.Export onClick=(action "onExport")}}
			</div>
		</div>
	</div>
</div>
