1 files changed, 57 insertions, 0 deletions
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/pool/pool-list/pool-list.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/pool/pool-list/pool-list.component.html
new file mode 100644
index 000000000..2d3ee6976
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/pool/pool-list/pool-list.component.html
@@ -0,0 +1,57 @@
+<ul ngbNav
+    #nav="ngbNav"
+    class="nav-tabs">
+  <li ngbNavItem>
+    <a ngbNavLink
+       i18n>Pools List</a>
+    <ng-template ngbNavContent>
+      <cd-table #table
+                id="pool-list"
+                [data]="pools"
+                [columns]="columns"
+                selectionType="single"
+                [hasDetails]="true"
+                [status]="tableStatus"
+                [autoReload]="-1"
+                (fetchData)="taskListService.fetch()"
+                (setExpandedRow)="setExpandedRow($event)"
+                (updateSelection)="updateSelection($event)">
+        <cd-table-actions id="pool-list-actions"
+                          class="table-actions"
+                          [permission]="permissions.pool"
+                          [selection]="selection"
+                          [tableActions]="tableActions">
+        </cd-table-actions>
+        <cd-pool-details cdTableDetail
+                         id="pool-list-details"
+                         [selection]="expandedRow"
+                         [permissions]="permissions"
+                         [cacheTiers]="cacheTiers">
+        </cd-pool-details>
+      </cd-table>
+    </ng-template>
+  </li>
+
+  <li ngbNavItem
+      *ngIf="permissions.grafana.read">
+    <a ngbNavLink
+       i18n>Overall Performance</a>
+    <ng-template ngbNavContent>
+      <cd-grafana [grafanaPath]="'ceph-pools-overview?'"
+                  uid="z99hzWtmk"
+                  grafanaStyle="two">
+      </cd-grafana>
+    </ng-template>
+  </li>
+</ul>
+
+<div [ngbNavOutlet]="nav"></div>
+
+<ng-template #poolUsageTpl
+             let-row="row">
+  <cd-usage-bar *ngIf="row.stats?.avail_raw?.latest"
+                [total]="row.stats.bytes_used.latest + row.stats.avail_raw.latest"
+                [used]="row.stats.bytes_used.latest"
+                decimals="2">
+  </cd-usage-bar>
+</ng-template>