<xf:title>{{ phrase('user_change_log:') }} {$user.username}</xf:title>

<xf:if is="$changesGrouped">
	<div class="block">
		<div class="block-container">
			<div class="block-body">
				<xf:macro id="change_log_list" arg-changesGrouped="{$changesGrouped}" />
			</div>
		</div>
		<xf:pagenav page="{$page}" perpage="{$perPage}" total="{$total}"
			link="users/change-log" data="{$user}"
			wrapperclass="block-outer block-outer--after" />
	</div>
<xf:else />
	<div class="blockMessage">{{ phrase('no_changes_have_been_logged') }}</div>
</xf:if>

<xf:macro id="change_log_list" arg-changesGrouped="!">
	<xf:datalist data-xf-init="responsive-data-list">
	<thead>
		<xf:datarow rowtype="header">
			<xf:cell class="dataList-cell--minWidth">{{ phrase('field_name') }}</xf:cell>
			<xf:cell class="dataList-cell--minWidth">{{ phrase('old_value') }}</xf:cell>
			<xf:cell class="dataList-cell--minWidth">{{ phrase('new_value') }}</xf:cell>
		</xf:datarow>
	</thead>
	<xf:foreach loop="$changesGrouped" value="$group">
		<tbody class="dataList-rowGroup">
			<xf:datarow rowtype="subsection" rowclass="dataList-row--noHover">
				<xf:cell href="{{ link('users/edit', $group.content) }}" colspan="3">
					<span class="u-pullRight"><xf:date time="{$group.date}" /></span>
					<ul class="listInline listInline--bullet">
						<li><xf:avatar user="$group.content" size="xxs" href="" /> {$group.content.username}</li>
						<xf:if is="$group.editUser && $group.editUser.user_id != $group.content_id">
							<li>{{ phrase('edited_by_x', {'name': $group.editUser.username}) }}</li>
						</xf:if>
					</ul>
				</xf:cell>
			</xf:datarow>
			<xf:foreach loop="$group.changes" value="$change">
				<xf:datarow rowclass="{{ $change.protected ? 'dataList-row--protected' : '' }}">
					<xf:cell class="dataList-cell--minWidth">{$change.label}</xf:cell>
					<xf:cell class="dataList-cell--minWidth dataList-cell--breakWord">{$change.old}</xf:cell>
					<xf:cell class="dataList-cell--minWidth dataList-cell--breakWord">{$change.new}</xf:cell>
				</xf:datarow>
			</xf:foreach>
		</tbody>
	</xf:foreach>
	</xf:datalist>
</xf:macro>