<tr>
  <th width="1%"></th>
  <th ng-if="indexPattern.timeFieldName" data-test-subj="docTableHeaderField">
    <span>Time <i ng-class="headerClass(indexPattern.timeFieldName)" ng-click="cycleSortOrder(indexPattern.timeFieldName)" tooltip="Sort by time"></i></span>
  </th>
  <th ng-repeat="name in columns" data-test-subj="docTableHeaderField">
    <span class="table-header-name">
      {{name | shortDots}} <i ng-class="headerClass(name)" ng-click="cycleSortOrder(name)" tooltip="{{tooltip(name)}}" tooltip-append-to-body="1"></i>
    </span>
    <span class="table-header-move">
      <i
        class="fa fa-remove"
        ng-click="onRemoveColumn(name)"
        ng-if="canRemoveColumn(name)"
        tooltip-append-to-body="1"
        tooltip="Remove column"
      ></i>
      <i
        class="fa fa-angle-double-left"
        ng-click="moveColumnLeft(name)"
        ng-if="canMoveColumnLeft(name)"
        tooltip-append-to-body="1"
        tooltip="Move column to the left"
      ></i>
      <i
        class="fa fa-angle-double-right"
        ng-click="moveColumnRight(name)"
        ng-if="canMoveColumnRight(name)"
        tooltip-append-to-body="1"
        tooltip="Move column to the right"
      ></i>
    </span>
  </th>
</tr>
