documize/gui/app/templates/components/search/search-results.hbs

<div class="view-search">

	{{#if documents}}
		<div class="text-right">
			{{#ui/ui-button
				light=false
				outline=true
				uppercase=false
				color=constants.Color.Gray
				label=constants.Label.Sort}}

				{{#attach-popover class="ember-attacher-popper" hideOn="click" showOn="click" isShown=false placement="bottom-end" as |attacher|}}
					<i class="dicon {{constants.Icon.Cross}} closer" {{action attacher.hide}}/>
					<div class="container">
						<Ui::UiSpacer @size=100 />

						<div class="text-center">
							<ul class="ui-option-picker ui-option-picker-horiz">
								<li class="option {{if sortBy.name "selected"}}" {{action "onSetSort" "name"}}>
									<div class="text">Name</div>
								</li>
								<li class="option {{if sortBy.created "selected"}}" {{action "onSetSort" "created"}}>
									<div class="text">Created date</div>
								</li>
								<li class="option {{if sortBy.updated "selected"}}" {{action "onSetSort" "updated"}}>
									<div class="text">Last updated</div>
								</li>
							</ul>
						</div>

						<Ui::UiSpacer @size=100 />

						<div class="text-center">
							<ul class="ui-option-picker ui-option-picker-horiz">
								<li class="option {{if sortBy.asc "selected"}}" {{action "onSetSort" "asc"}}>
									<div class="text">Ascending</div>
								</li>
								<li class="option {{if sortBy.desc "selected"}}" {{action "onSetSort" "desc"}}>
									<div class="text">Descending</div>
								</li>
							</ul>
						</div>

						<Ui::UiSpacer @size=300 />

						{{ui/ui-button
							light=true
							color=constants.Color.Yellow
							label=constants.Label.Sort
							onClick=(action "onSortBy" attacher)}}
					</div>
				{{/attach-popover}}
			{{/ui/ui-button}}
		</div>

		<Ui::UiSpacer @size=200 />
	{{/if}}

	<div class="result-summary">{{resultPhrase}}</div>
	<ul class="documents">
		{{#each documents key="id" as |result|}}
			<li class="document">
				{{#link-to "document.index" result.spaceId result.spaceSlug result.documentId result.documentSlug (query-params currentPageId=result.itemId source=searchQuery) class="link"}}
					<div class="title">
						{{result.document}}
						{{#if (gt result.versionId.length 0)}}
							<span class="version">&nbsp;&nbsp;{{result.versionId}}</span>
						{{/if}}
					</div>
					<div class="space">{{result.space}}</div>
					<div class="snippet">{{result.excerpt}}</div>
					{{#if result.template}}
						<div class="template">Template</div>
					{{/if}}
					{{folder/document-tags documentTags=result.tags}}
				{{/link-to}}
			</li>
		{{/each}}
	</ul>

</div>