diff --git a/magnum_ui/static/dashboard/containers/baymodels/table/table.html b/magnum_ui/static/dashboard/containers/baymodels/table/table.html
index 8473ce97..8f6e3ba3 100644
--- a/magnum_ui/static/dashboard/containers/baymodels/table/table.html
+++ b/magnum_ui/static/dashboard/containers/baymodels/table/table.html
@@ -1,144 +1,134 @@
-<table ng-controller="containersBaymodelsTableController as table"
-  hz-table ng-cloak
-  st-table="table.baymodels"
-  st-safe-src="table.baymodelsSrc"
-  default-sort="name"
-  default-sort-reverse="false"
-  class="table table-striped table-rsp table-detail">
+<div>
+  <hz-magic-search-context ng-controller="containersBaymodelsTableController as table"
+    filter-facets="table.baymodelFacets">
+    <hz-magic-search-bar></hz-magic-search-bar>
+    <actions class="batch-action" allowed="table.baymodelResource.batchActions" type="batch"></actions>
+    <table hz-table ng-cloak st-magic-search
+      st-table="table.baymodels"
+      st-safe-src="table.baymodelsSrc"
+      default-sort="name"
+      default-sort-reverse="false"
+      class="table table-striped table-rsp table-detail">
 
-  <thead>
-    <!--
-      Table-batch-actions:
-      This is where batch actions like searching, creating, and deleting.
-    -->
-    <tr>
-      <th colspan="100" class="search-header">
-        <hz-magic-search-bar group-classes="input-group-sm" icon-classes="fa-search"
-          filter-facets="table.baymodelFacets">
-        </hz-magic-search-bar>
-      </th>
-    </tr>
-    <tr class="action-row">
-      <th colspan="100">
-        <actions allowed="table.baymodelResource.batchActions" type="batch"></actions>
-      </th>
-    </tr>
-    <!--
-      Table-column-headers:
-      The headers for the table columns
-    -->
-    <tr>
-      <th class="multi_select_column">
-        <input type="checkbox" hz-select-all="table.baymodels">
-      </th>
-
-      <th class="expander"></th>
-
-      <th class="rsp-p1" st-sort="name" st-sort-default translate>
-        Name
-      </th>
-
-      <th class="rsp-p2" st-sort="id" translate>
-        ID
-      </th>
-
-      <th class="rsp-p1" st-sort="coe" translate>
-        COE
-      </th>
-
-      <th class="rsp-p2" st-sort="network-driver" translate>
-        Network Driver
-      </th>
-
-      <th class="actions_column" translate>
-        Actions
-      </th>
-    </tr>
-  </thead>
-  <tbody>
-    <!--
-      Table-rows:
-      This is where we declaratively define the table columns.
-      Include multi_select_column if you want to select all.
-      Include expander if you want to inline details.
-      Include actions_column if you want to perform actions.
-      rsp-p1 rsp-p2 are responsive priority as user resizes window.
-    -->
-
-    <tr ng-repeat-start="bm in table.baymodels track by bm.id">
-
-      <td class="multi_select_column">
-        <input type="checkbox"
-          ng-model="tCtrl.selections[bm.id].checked"
-          hz-select="bm">
-      </td>
-
-      <td class="expander">
-        <i class="fa fa-chevron-right"
-          hz-expand-detail
-          duration="200">
-        </i>
-      </td>
-
-      <td class="rsp-p1"><a ng-href="project/baymodels/{$ bm.id $}">{$ bm.name|noName $}</a></td>
-      <td class="rsp-p2">{$ bm.id $}</td>
-      <td class="rsp-p1">{$ bm.coe $}</td>
-      <td class="rsp-p2">{$ bm.network_driver $}</td>
-
-      <td class="actions_column">
+      <thead>
         <!--
-          Table-row-action-column:
-          Actions taken here applies to a single item/row.
+          Table-column-headers:
+          The headers for the table columns
         -->
-        <actions allowed="table.baymodelResource.itemActions" type="row" item="bm"></actions>
-      </td>
-    </tr>
-    <tr ng-repeat-end class="detail-row">
+        <tr>
+          <th class="multi_select_column">
+            <input type="checkbox" hz-select-all="table.baymodels">
+          </th>
+    
+          <th class="expander"></th>
+    
+          <th class="rsp-p1" st-sort="name" st-sort-default translate>
+            Name
+          </th>
+    
+          <th class="rsp-p2" st-sort="id" translate>
+            ID
+          </th>
+    
+          <th class="rsp-p1" st-sort="coe" translate>
+            COE
+          </th>
+    
+          <th class="rsp-p2" st-sort="network-driver" translate>
+            Network Driver
+          </th>
+    
+          <th class="actions_column" translate>
+            Actions
+          </th>
+        </tr>
+      </thead>
+      <tbody>
+        <!--
+          Table-rows:
+          This is where we declaratively define the table columns.
+          Include multi_select_column if you want to select all.
+          Include expander if you want to inline details.
+          Include actions_column if you want to perform actions.
+          rsp-p1 rsp-p2 are responsive priority as user resizes window.
+        -->
+    
+        <tr ng-repeat-start="bm in table.baymodels track by bm.id">
+    
+          <td class="multi_select_column">
+            <input type="checkbox"
+              ng-model="tCtrl.selections[bm.id].checked"
+              hz-select="bm">
+          </td>
+    
+          <td class="expander">
+            <i class="fa fa-chevron-right"
+              hz-expand-detail
+              duration="200">
+            </i>
+          </td>
+    
+          <td class="rsp-p1"><a ng-href="project/baymodels/{$ bm.id $}">{$ bm.name|noName $}</a></td>
+          <td class="rsp-p2">{$ bm.id $}</td>
+          <td class="rsp-p1">{$ bm.coe $}</td>
+          <td class="rsp-p2">{$ bm.network_driver $}</td>
+    
+          <td class="actions_column">
+            <!--
+              Table-row-action-column:
+              Actions taken here applies to a single item/row.
+            -->
+            <actions allowed="table.baymodelResource.itemActions" type="row" item="bm"></actions>
+          </td>
+        </tr>
+        <tr ng-repeat-end class="detail-row">
+          <!--
+            Detail-row:
+            Contains detailed information on this item.
+            Can be toggled using the chevron button.
+            Ensure colspan is greater or equal to number of column-headers.
+          -->
+          <td class="detail" colspan="100">
+            <!--
+              The responsive columns that disappear typically should reappear here
+              with the same responsive priority that they disappear.
+              E.g. table header with rsp-p2 should be here with rsp-alt-p2
+            -->
+            <div class="row">
+              <span class="rsp-alt-p2">
+                <dl class="col-xs-5">
+                  <dt translate>ID</dt>
+                  <dd>{$ bm.id $}</dd>
+                </dl>
+                <dl class="col-xs-3">
+                  <dt translate>Network Driver</dt>
+                  <dd>{$ bm.network_driver $}</dd>
+                </dl>
+              </span>
+            </div>
+            <div class="row">
+              <dl class="col-xs-5">
+                <dt translate>Image ID</dt>
+                <dd>{$ bm.image_id $}</dd>
+              </dl>
+              <dl class="col-xs-3">
+                <dt translate>Registry Enabled</dt>
+                <dd>{$ bm.registry_enabled $}</dd>
+              </dl>
+              <dl class="col-xs-4">
+                <dt translate>Labels</dt>
+                <dd ng-repeat="lbl in b.labels">{$ lbl $}</dd>
+              </dl>
+            </div>
+          </td>
+        </tr>
+        <tr hz-no-items items="table.baymodels"></tr>
+      </tbody>
       <!--
-        Detail-row:
-        Contains detailed information on this item.
-        Can be toggled using the chevron button.
-        Ensure colspan is greater or equal to number of column-headers.
+        Table-footer:
+        This is where we display number of items and pagination controls.
       -->
-      <td class="detail" colspan="100">
-        <!--
-          The responsive columns that disappear typically should reappear here
-          with the same responsive priority that they disappear.
-          E.g. table header with rsp-p2 should be here with rsp-alt-p2
-        -->
-        <div class="row">
-          <span class="rsp-alt-p2">
-            <dl class="col-xs-5">
-              <dt translate>ID</dt>
-              <dd>{$ bm.id $}</dd>
-            </dl>
-            <dl class="col-xs-3">
-              <dt translate>Network Driver</dt>
-              <dd>{$ bm.network_driver $}</dd>
-            </dl>
-          </span>
-        </div>
-        <div class="row">
-          <dl class="col-xs-5">
-            <dt translate>Image ID</dt>
-            <dd>{$ bm.image_id $}</dd>
-          </dl>
-          <dl class="col-xs-3">
-            <dt translate>Registry Enabled</dt>
-            <dd>{$ bm.registry_enabled $}</dd>
-          </dl>
-          <dl class="col-xs-4">
-            <dt translate>Labels</dt>
-            <dd ng-repeat="lbl in b.labels">{$ lbl $}</dd>
-          </dl>
-        </div>
-      </td>
-    </tr>
-    <tr hz-no-items items="table.baymodels"></tr>
-  </tbody>
-  <!--
-    Table-footer:
-    This is where we display number of items and pagination controls.
-  -->
-  <tfoot hz-table-footer items="table.baymodels"></tfoot>
-</table>
+      <tfoot hz-table-footer items="table.baymodels"></tfoot>
+    </table>
+  </hz-magic-search-context>
+</div>
diff --git a/magnum_ui/static/dashboard/containers/bays/table/table.html b/magnum_ui/static/dashboard/containers/bays/table/table.html
index d0ffa18e..330062ec 100644
--- a/magnum_ui/static/dashboard/containers/bays/table/table.html
+++ b/magnum_ui/static/dashboard/containers/bays/table/table.html
@@ -1,149 +1,139 @@
-<table ng-controller="containersBaysTableController as table"
-  hz-table ng-cloak
-  st-table="table.bays"
-  st-safe-src="table.baysSrc"
-  default-sort="name"
-  default-sort-reverse="false"
-  class="table table-striped table-rsp table-detail">
-
-  <thead>
-    <!--
-      Table-batch-actions:
-      This is where batch actions like searching, creating, and deleting.
-    -->
-    <tr>
-      <th colspan="100" class="search-header">
-        <hz-magic-search-bar group-classes="input-group-sm" icon-classes="fa-search"
-          filter-facets="table.bayFacets">
-        </hz-magic-search-bar>
-      </th>
-    </tr>
-    <tr class="action-row">
-      <th colspan="100">
-        <actions allowed="table.bayResource.batchActions" type="batch"></actions>
-      </th>
-    </tr>
-    <!--
-      Table-column-headers:
-      The headers for the table columns
-    -->
-    <tr>
-      <th class="multi_select_column">
-        <input type="checkbox" hz-select-all="table.bays">
-      </th>
-
-      <th class="expander"></th>
-
-      <th class="rsp-p1" st-sort="name" st-sort-default translate>
-        Name
-      </th>
-
-      <th class="rsp-p2" st-sort="id" translate>
-        ID
-      </th>
-
-      <th class="rsp-p1" st-sort="status" translate>
-        Status
-      </th>
-
-      <th class="rsp-p2" st-sort="master_count" translate>
-        Master Count
-      </th>
-
-      <th class="rsp-p2" st-sort="node_count" translate>
-        Node Count
-      </th>
-
-      <th class="actions_column" translate>
-        Actions
-      </th>
-    </tr>
-  </thead>
-  <tbody>
-    <!--
-      Table-rows:
-      This is where we declaratively define the table columns.
-      Include multi_select_column if you want to select all.
-      Include expander if you want to inline details.
-      Include actions_column if you want to perform actions.
-      rsp-p1 rsp-p2 are responsive priority as user resizes window.
-    -->
-
-    <tr ng-repeat-start="b in table.bays track by b.id">
-
-      <td class="multi_select_column">
-        <input type="checkbox"
-          ng-model="tCtrl.selections[b.id].checked"
-          hz-select="b">
-      </td>
-
-      <td class="expander">
-        <span class="fa fa-chevron-right"
-          hz-expand-detail
-          duration="200">
-        </span>
-      </td>
-
-      <td class="rsp-p1"><a ng-href="project/bays/{$ b.id $}">{$ b.name|noName $}</a></td>
-      <td class="rsp-p2">{$ b.id $}</td>
-      <td class="rsp-p1">{$ b.status $}</td>
-      <td class="rsp-p2">{$ b.master_count $}</td>
-      <td class="rsp-p2">{$ b.node_count $}</td>
-
-      <td class="actions_column">
+<div>
+  <hz-magic-search-context ng-controller="containersBaysTableController as table"
+    filter-facets="table.bayFacets">
+    <hz-magic-search-bar></hz-magic-search-bar>
+    <actions class="batch-action" allowed="table.bayResource.batchActions" type="batch"></actions>
+    <table hz-table ng-cloak st-magic-search
+      st-table="table.bays"
+      st-safe-src="table.baysSrc"
+      default-sort="name"
+      default-sort-reverse="false"
+      class="table table-striped table-rsp table-detail">
+  
+      <thead>
         <!--
-          Table-row-action-column:
-          Actions taken here applies to a single item/row.
+          Table-column-headers:
+          The headers for the table columns
         -->
-        <actions allowed="table.bayResource.itemActions" type="row" item="b"></actions>
-      </td>
-    </tr>
-    <tr ng-repeat-end class="detail-row">
+        <tr>
+          <th class="multi_select_column">
+            <input type="checkbox" hz-select-all="table.bays">
+          </th>
+    
+          <th class="expander"></th>
+    
+          <th class="rsp-p1" st-sort="name" st-sort-default translate>
+            Name
+          </th>
+    
+          <th class="rsp-p2" st-sort="id" translate>
+            ID
+          </th>
+    
+          <th class="rsp-p1" st-sort="status" translate>
+            Status
+          </th>
+    
+          <th class="rsp-p2" st-sort="master_count" translate>
+            Master Count
+          </th>
+    
+          <th class="rsp-p2" st-sort="node_count" translate>
+            Node Count
+          </th>
+    
+          <th class="actions_column" translate>
+            Actions
+          </th>
+        </tr>
+      </thead>
+      <tbody>
+        <!--
+          Table-rows:
+          This is where we declaratively define the table columns.
+          Include multi_select_column if you want to select all.
+          Include expander if you want to inline details.
+          Include actions_column if you want to perform actions.
+          rsp-p1 rsp-p2 are responsive priority as user resizes window.
+        -->
+    
+        <tr ng-repeat-start="b in table.bays track by b.id">
+    
+          <td class="multi_select_column">
+            <input type="checkbox"
+              ng-model="tCtrl.selections[b.id].checked"
+              hz-select="b">
+          </td>
+    
+          <td class="expander">
+            <span class="fa fa-chevron-right"
+              hz-expand-detail
+              duration="200">
+            </span>
+          </td>
+    
+          <td class="rsp-p1"><a ng-href="project/bays/{$ b.id $}">{$ b.name|noName $}</a></td>
+          <td class="rsp-p2">{$ b.id $}</td>
+          <td class="rsp-p1">{$ b.status $}</td>
+          <td class="rsp-p2">{$ b.master_count $}</td>
+          <td class="rsp-p2">{$ b.node_count $}</td>
+    
+          <td class="actions_column">
+            <!--
+              Table-row-action-column:
+              Actions taken here applies to a single item/row.
+            -->
+            <actions allowed="table.bayResource.itemActions" type="row" item="b"></actions>
+          </td>
+        </tr>
+        <tr ng-repeat-end class="detail-row">
+          <!--
+            Detail-row:
+            Contains detailed information on this item.
+            Can be toggled using the chevron button.
+            Ensure colspan is greater or equal to number of column-headers.
+          -->
+          <td class="detail" colspan="100">
+            <!--
+              The responsive columns that disappear typically should reappear here
+              with the same responsive priority that they disappear.
+              E.g. table header with rsp-p2 should be here with rsp-alt-p2
+            -->
+            <div class="row">
+              <span class="rsp-alt-p2">
+                <dl class="col-xs-5">
+                  <dt translate>ID</dt>
+                  <dd>{$ b.id $}</dd>
+                </dl>
+                <dl class="col-xs-3">
+                  <dt translate>Master Count</dt>
+                  <dd>{$ b.master_count $}</dd>
+                </dl>
+                <dl class="col-xs-3">
+                  <dt translate>Node Count</dt>
+                  <dd>{$ b.node_count $}</dd>
+                </dl>
+              </span>
+            </div>
+            <div class="row">
+              <dl class="col-xs-5">
+                <dt translate>Baymodel</dt>
+                <dd><a ng-href="project/baymodels/{$ b.baymodel_id $}">{$ b.baymodel_id $}</a></dd>
+              </dl>
+              <dl class="col-xs-3">
+                <dt translate>Node Addresses</dt>
+                <dd ng-repeat="addr in b.node_addresses">{$ addr $}</dd>
+              </dl>
+            </div>
+          </td>
+        </tr>
+        <tr hz-no-items items="table.bays"></tr>
+      </tbody>
       <!--
-        Detail-row:
-        Contains detailed information on this item.
-        Can be toggled using the chevron button.
-        Ensure colspan is greater or equal to number of column-headers.
+        Table-footer:
+        This is where we display number of items and pagination controls.
       -->
-      <td class="detail" colspan="100">
-        <!--
-          The responsive columns that disappear typically should reappear here
-          with the same responsive priority that they disappear.
-          E.g. table header with rsp-p2 should be here with rsp-alt-p2
-        -->
-        <div class="row">
-          <span class="rsp-alt-p2">
-            <dl class="col-xs-5">
-              <dt translate>ID</dt>
-              <dd>{$ b.id $}</dd>
-            </dl>
-            <dl class="col-xs-3">
-              <dt translate>Master Count</dt>
-              <dd>{$ b.master_count $}</dd>
-            </dl>
-            <dl class="col-xs-3">
-              <dt translate>Node Count</dt>
-              <dd>{$ b.node_count $}</dd>
-            </dl>
-          </span>
-        </div>
-        <div class="row">
-          <dl class="col-xs-5">
-            <dt translate>Baymodel</dt>
-            <dd><a ng-href="project/baymodels/{$ b.baymodel_id $}">{$ b.baymodel_id $}</a></dd>
-          </dl>
-          <dl class="col-xs-3">
-            <dt translate>Node Addresses</dt>
-            <dd ng-repeat="addr in b.node_addresses">{$ addr $}</dd>
-          </dl>
-        </div>
-      </td>
-    </tr>
-    <tr hz-no-items items="table.bays"></tr>
-  </tbody>
-  <!--
-    Table-footer:
-    This is where we display number of items and pagination controls.
-  -->
-  <tfoot hz-table-footer items="table.bays"></tfoot>
-</table>
+      <tfoot hz-table-footer items="table.bays"></tfoot>
+    </table>
+  </hz-magic-search-context>
+</div>
\ No newline at end of file
diff --git a/magnum_ui/static/dashboard/containers/containers.scss b/magnum_ui/static/dashboard/containers/containers.scss
index 9bf5fef7..0ab5596e 100644
--- a/magnum_ui/static/dashboard/containers/containers.scss
+++ b/magnum_ui/static/dashboard/containers/containers.scss
@@ -1,7 +1,7 @@
 @import "baymodels/baymodels";
 @import "bays/bays";
 
-.table > thead > .action-row > th > actions {
+.batch-action {
   float: right;
   action-list {
     padding-left: 0.3em;