From a7626af410ceb1f7f4e3dc05bdfbbda7219f403d Mon Sep 17 00:00:00 2001
From: ilan7empest <therecanbeonly1.1984@gmail.com>
Date: Mon, 13 Nov 2023 21:14:17 +0800
Subject: [PATCH] merge from development

---
 src/components/Table/TableView.js | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/components/Table/TableView.js b/src/components/Table/TableView.js
index 1b071eff6..2b5d7cca6 100644
--- a/src/components/Table/TableView.js
+++ b/src/components/Table/TableView.js
@@ -20,6 +20,7 @@ such restriction.
 import React from 'react'
 import PropTypes from 'prop-types'
 import { isEmpty } from 'lodash'
+import classnames from 'classnames'
 
 import ArtifactsTableRow from '../../elements/ArtifactsTableRow/ArtifactsTableRow'
 import ConsumerGroupShardLagTableRow from '../../elements/ConsumerGroupShardLagTableRow/ConsumerGroupShardLagTableRow'
@@ -76,11 +77,17 @@ const TableView = ({
   tableHeadRef,
   tablePanelRef
 }) => {
+  const tableClass = classnames(
+    'table',
+    'table-main',
+    !isEmpty(selectedItem) && 'table-with-details'
+  )
+
   return (
     <div className="table__flex">
       <div className="table__content" id="table-content" ref={tableContentRef}>
         <div className="table__wrapper">
-          <table className="table table-main" cellPadding="0" cellSpacing="0" ref={tableRef}>
+          <table className={tableClass} cellPadding="0" cellSpacing="0" ref={tableRef}>
             {pageData.tableHeaders && (
               <>
                 <thead className="table-header">