portainer/app/portainer/user-activity/activity-logs-view/activity-logs-datatable/activity-logs-datatable.html

<div class="datatable datatable-empty">
  <rd-widget>
    <rd-widget-body classes="no-padding">
      <div class="toolBar vertical-center !gap-x-5 !gap-y-1 flex-wrap">
        <div class="toolBarTitle vertical-center">
          <div class="widget-icon space-right">
            <pr-icon icon="'svg-clockrewind'"></pr-icon>
          </div>

          Activity Logs
          <be-feature-indicator feature="$ctrl.feature"></be-feature-indicator>
        </div>
        <div class="vertical-center">
          <datatable-searchbar on-change="($ctrl.onChangeKeyword)" value="$ctrl.keyword"></datatable-searchbar>
        </div>
      </div>
      <div class="table-responsive">
        <table class="table table-hover">
          <thead>
            <tr>
              <th class="small-column">
                <div class="vertical-center">
                  <table-column-header
                    col-title="'Time'"
                    can-sort="true"
                    is-sorted="$ctrl.sort.key === 'Timestamp'"
                    is-sorted-desc="$ctrl.sort.key === 'Timestamp' && $ctrl.sort.desc"
                    ng-click="$ctrl.changeSort('Timestamp')"
                  >
                  </table-column-header>
                </div>
              </th>
              <th class="small-column">
                <div class="vertical-center">
                  <table-column-header
                    col-title="'User'"
                    can-sort="true"
                    is-sorted="$ctrl.sort.key === 'Username'"
                    is-sorted-desc="$ctrl.sort.key === 'Username' && $ctrl.sort.desc"
                    ng-click="$ctrl.changeSort('Username')"
                  >
                  </table-column-header>
                </div>
              </th>
              <th class="small-column">
                <div class="vertical-center">
                  <table-column-header
                    col-title="'Environment'"
                    can-sort="true"
                    is-sorted="$ctrl.sort.key === 'Context'"
                    is-sorted-desc="$ctrl.sort.key === 'Context' && $ctrl.sort.desc"
                    ng-click="$ctrl.changeSort('Context')"
                  >
                  </table-column-header>
                </div>
              </th>

              <th>
                <div class="vertical-center">
                  <table-column-header col-title="'Action'" can-sort="false"> </table-column-header>
                </div>
              </th>
              <th>
                <div class="vertical-center">
                  <table-column-header col-title="'Payload'" can-sort="false"> </table-column-header>
                </div>
              </th>
            </tr>
          </thead>
          <tbody>
            <tr dir-paginate-start="item in $ctrl.logs | itemsPerPage: $ctrl.limit" total-items="$ctrl.totalItems" current-page="$ctrl.currentPage">
              <td></td>
              <td></td>
              <td></td>
              <td></td>
              <td></td>
            </tr>
            <tr dir-paginate-end ng-show="item.Expanded">
              <td colspan="5">
                <json-tree object="item.payload" root-name="containerInfo.Id" start-expanded="true"></json-tree>
              </td>
            </tr>
            <tr ng-if="!$ctrl.logs">
              <td class="text-center text-muted" colspan="5">Loading...</td>
            </tr>
            <tr ng-if="$ctrl.logs.length === 0">
              <td class="text-center text-muted" colspan="8"> No logs available. </td>
            </tr>
          </tbody>
        </table>
      </div>
      <div class="footer" ng-if="$ctrl.logs">
        <datatable-pagination limit="$ctrl.limit" on-change-limit="($ctrl.handleChangeLimit)" on-change-page="($ctrl.onChangePage)"></datatable-pagination>
      </div>
    </rd-widget-body>
  </rd-widget>
</div>