<div class="col-sm-6">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="#">Home</a></li>
    <li class="breadcrumb-item active"><a href="#textmessages">Text Messages</a></li>
  </ol>

  <ul class="nav nav-tabs" role="tablist">
    <li role="presentation" class="{{#when tab 'eq' 'cust'}}active{{/when}}" id="cust"><a href="#" aria-controls="profile" role="tab" data-toggle="tab" class="tabSwitch" data-type="cust">Customers</a></li>
    <li role="presentation" class="{{#when tab 'eq' 'topic'}}active{{/when}}" id="topic"><a href="#" aria-controls="messages" role="tab" data-toggle="tab" class="tabSwitch" data-type="topic">Topic</a></li>
  </ul>

  {{#when tab 'eq' 'cust'}}
    <table class="table striped" id="showActivity">
      <thead>
        <tr>
          <th>Customer Number</th>
          <th>Customer Name</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        {{#each useractivity}}
          <tr>
            <td>{{customer.phone}}</td>
            <td>{{customer.name}}</td>
            <td> <button class="btn btn-warning btn-xs" data-id="{{this._id}}" id="messages">Messages</button> </td>
          </tr>
        {{/each}}
      </tbody>
    </table>
  {{/when}}

  {{#when tab 'eq' 'topic'}}
    <table class="table striped" id="showActivity">
      <thead>
        <tr>
          <th>Customer Number</th>
          <th>Topic</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        {{#each useractivity}}
          <tr>
            <td>{{data.customer.name}}</td>
            <td>{{data.topic.type}} </td>
            <td>{{topic}}</td>
            <td> <button class="btn btn-warning btn-xs" data-id="{{this._id}}" id="messages">Messages</button> </td>
          </tr>
        {{/each}}
      </tbody>
    </table>
  {{/when}}

</div>

<div class="col-sm-6" id="showmessage">
  
</div>