From: Sagar Gopale Date: Tue, 6 Jan 2026 07:56:42 +0000 (+0530) Subject: mgr/dashboard: empty-data-message X-Git-Tag: testing/wip-jcollin-testing-20260212.143545-tentacle~69^2 X-Git-Url: http://git-server-git.apps.pok.os.sepia.ceph.com/?a=commitdiff_plain;h=0aad65395d50512c61dea167b28fb5b4b6630c85;p=ceph-ci.git mgr/dashboard: empty-data-message Fixes: https://tracker.ceph.com/issues/74324 Signed-off-by: Sagar Gopale (cherry picked from commit a6ec02a28ac87f03f85dd431d43ea207c32bd8a3) Conflicts: src/pybind/mgr/dashboard/frontend/src/app/ceph/block/nvmeof-gateway-group/nvmeof-gateway-group.component.html src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/datatable.module.ts src/pybind/mgr/dashboard/frontend/src/app/shared/enum/icons.enum.ts --- diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/nvmeof-gateway-group/nvmeof-gateway-group.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/nvmeof-gateway-group/nvmeof-gateway-group.component.html new file mode 100644 index 00000000000..a06b87feb67 --- /dev/null +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/nvmeof-gateway-group/nvmeof-gateway-group.component.html @@ -0,0 +1,44 @@ + + + + + + + {{ created | date:'EEE d MMM, yyyy' }} + + + +
+ + @if (gateway.running > 0) { + + + {{ gateway.running }} + + } + + @if (gateway.error > 0) { + + + {{ gateway.error }} + + } + + +
+ diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/nvmeof-namespaces-list/nvmeof-namespaces-list.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/nvmeof-namespaces-list/nvmeof-namespaces-list.component.html index 6067a75ca2d..369c9b96acd 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/nvmeof-namespaces-list/nvmeof-namespaces-list.component.html +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/block/nvmeof-namespaces-list/nvmeof-namespaces-list.component.html @@ -8,7 +8,11 @@ (fetchData)="listNamespaces()" [columns]="namespacesColumns" selectionType="single" - (updateSelection)="updateSelection($event)"> + (updateSelection)="updateSelection($event)" + emptyStateTitle="No namespaces created." + i18n-emptyStateTitle + emptyStateMessage="Namespaces are storage volumes mapped to subsystems for host access. Create a namespace to start provisioning storage within a subsystem." + i18n-emptyStateMessage>
+ (updateSelection)="updateSelection($event)" + emptyStateTitle="No subsystems created" + i18n-emptyStateTitle + emptyStateMessage="Subsystems group NVMe namespaces and manage host access. Create a subsystem to start mapping NVMe volumes to hosts." + i18n-emptyStateMessage>
+ diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/icon/icon.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/icon/icon.component.scss index 96e56378367..7029711f53f 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/icon/icon.component.scss +++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/icon/icon.component.scss @@ -17,3 +17,7 @@ .warning-icon { color: theme.$support-caution-major; } + +.deploy-icon { + fill: theme.$layer-selected-disabled !important; +} diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/datatable.module.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/datatable.module.ts index 072c66220f0..456763d3b10 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/datatable.module.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/datatable.module.ts @@ -15,7 +15,10 @@ import { DialogModule, SelectModule, TagModule, - LayerModule + LayerModule, + InputModule, + GridModule, + LayoutModule } from 'carbon-components-angular'; import AddIcon from '@carbon/icons/es/add/16'; import FilterIcon from '@carbon/icons/es/filter/16'; @@ -26,6 +29,8 @@ import CloseIcon from '@carbon/icons/es/close/16'; import MaximizeIcon from '@carbon/icons/es/maximize/16'; import ArrowDown from '@carbon/icons/es/caret--down/16'; import ChevronDwon from '@carbon/icons/es/chevron--down/16'; +import CheckMarkIcon from '@carbon/icons/es/checkmark/32'; +import CubeIcon from '@carbon/icons/es/cube/32'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { FormlyModule } from '@ngx-formly/core'; @@ -99,7 +104,10 @@ import { TableDetailDirective } from './directives/table-detail.directive'; ThemeModule, SelectModule, TagModule, - LayerModule + LayerModule, + InputModule, + GridModule, + LayoutModule ], declarations: [ TableComponent, @@ -138,7 +146,9 @@ export class DataTableModule { CloseIcon, MaximizeIcon, ArrowDown, - ChevronDwon + ChevronDwon, + CheckMarkIcon, + CubeIcon ]); } } diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html index db4b5c1fb7c..7be41ed6030 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html +++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.html @@ -220,8 +220,26 @@ class="no-data" cdstabledata [attr.colspan]="visibleColumns.length + 2"> - No data to display +
+
+
+
+ + +
+ + {{ emptyStateTitle }} + + {{ emptyStateMessage }} + + +
+
@@ -333,6 +351,7 @@ + diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.ts index 5209574f34d..7018f706cb9 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table/table.component.ts @@ -22,7 +22,8 @@ import { BehaviorSubject, Observable, of, Subject, Subscription } from 'rxjs'; import { TableStatus } from '~/app/shared/classes/table-status'; import { CellTemplate } from '~/app/shared/enum/cell-template.enum'; -import { Icons } from '~/app/shared/enum/icons.enum'; +import { Icons, IconSize, ICON_TYPE } from '~/app/shared/enum/icons.enum'; + import { CdTableColumn } from '~/app/shared/models/cd-table-column'; import { CdTableColumnFilter } from '~/app/shared/models/cd-table-column-filter'; import { CdTableColumnFiltersChange } from '~/app/shared/models/cd-table-column-filters-change'; @@ -211,6 +212,22 @@ export class TableComponent implements AfterViewInit, OnInit, OnChanges, OnDestr @Input() scrollable: boolean = true; + /** + * Title to be displayed when there is no data + */ + @Input() + emptyStateTitle: string = $localize`No data available`; + /** + * Helper text to be displayed when there is no data + */ + @Input() + emptyStateMessage: string = $localize`There are currently no records to display.`; + /** + * Icon to be displayed when there is no data + */ + @Input() + emptyStateIcon: string = ICON_TYPE.deploy; + /** * Should be a function to update the input data if undefined nothing will be triggered * @@ -339,6 +356,7 @@ export class TableComponent implements AfterViewInit, OnInit, OnChanges, OnDestr } icons = Icons; + iconSize = IconSize; cellTemplates: { [key: string]: TemplateRef; } = {}; diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/enum/icons.enum.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/enum/icons.enum.ts index 2da51d986f2..bb11c7b47a5 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/shared/enum/icons.enum.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/enum/icons.enum.ts @@ -111,5 +111,9 @@ export const ICON_TYPE = { danger: 'warning--filled', infoCircle: 'information--filled', success: 'checkmark--filled', - warning: 'warning--alt--filled' + warning: 'warning--alt--filled', + deploy: 'deploy', + edit: 'edit', + error: 'error--filled', + notification: 'notification' } as const;