From 70f3f3fc57673451928f426c32e2513ed3e42911 Mon Sep 17 00:00:00 2001
From: Sagar Gopale <sagar.gopale@ibm.com>
Date: Thu, 4 Dec 2025 18:30:00 +0530
Subject: [PATCH] mgr/dashboard: fix-table-width

Fixes: https://tracker.ceph.com/issues/74089

Signed-off-by: Sagar Gopale <sagar.gopale@ibm.com>
(cherry picked from commit 1f691aff54a2ee38e4e32c5b329fc06b4226ee03)
---
 .../table-key-value/table-key-value.component.html         | 2 +-
 .../table-key-value/table-key-value.component.scss         | 7 +++++++
 .../datatable/table-key-value/table-key-value.component.ts | 6 ++++--
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.html b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.html
index 4dbaf63f32d..faa517c768c 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.html
@@ -1,4 +1,4 @@
-<div>
+<div class="key-value-table">
   <cd-table #table
             [data]="tableData || []"
             [columns]="columns"
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.scss b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.scss
index 962da03ac10..f2a687e1f3d 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.scss
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.scss
@@ -1,3 +1,10 @@
 .pre-wrap {
   white-space: pre-wrap;
 }
+
+.key-value-table .cds--data-table td {
+  max-width: 16rem;
+  overflow-wrap: break-word;
+  text-overflow: unset;
+  white-space: normal;
+}
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.ts
index e40ad113488..5e9c59e23d2 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/datatable/table-key-value/table-key-value.component.ts
@@ -6,7 +6,8 @@ import {
   OnInit,
   Output,
   TemplateRef,
-  ViewChild
+  ViewChild,
+  ViewEncapsulation
 } from '@angular/core';
 
 import _ from 'lodash';
@@ -32,7 +33,8 @@ interface KeyValueItem {
 @Component({
   selector: 'cd-table-key-value',
   templateUrl: './table-key-value.component.html',
-  styleUrls: ['./table-key-value.component.scss']
+  styleUrls: ['./table-key-value.component.scss'],
+  encapsulation: ViewEncapsulation.None
 })
 export class TableKeyValueComponent implements OnInit, OnChanges {
   @ViewChild(TableComponent, { static: true })
-- 
2.47.3