From 3d1926aba09258d259a8ce93851780df1fe05b1b Mon Sep 17 00:00:00 2001
From: Tom Butcher <thomasbutcher15@gmail.com>
Date: Thu, 3 Sep 2026 15:22:30 +0100
Subject: [PATCH] Enhance MissingPlaceholder Integration in ObjectKanban and
 ObjectTable Components

- Added MissingPlaceholder component to ObjectKanban and ObjectTable for improved user feedback when no data is available.
- Updated ObjectKanban to display a custom message when no category property is selected.
- Modified ObjectTable to show MissingPlaceholder when there is no data and lazy loading is not active.
- Introduced height prop to MissingPlaceholder for better layout control.
---
 .../Dashboard/common/MissingPlaceholder.jsx   |  9 +++++---
 .../Dashboard/common/ObjectKanban.jsx         | 21 +++++++++++++------
 .../Dashboard/common/ObjectTable.jsx          |  9 ++++++++
 3 files changed, 30 insertions(+), 9 deletions(-)

diff --git a/src/components/Dashboard/common/MissingPlaceholder.jsx b/src/components/Dashboard/common/MissingPlaceholder.jsx
index 6d6be48e..9bf8c108 100644
--- a/src/components/Dashboard/common/MissingPlaceholder.jsx
+++ b/src/components/Dashboard/common/MissingPlaceholder.jsx
@@ -9,7 +9,8 @@ const MissingPlaceholder = ({
   hasBackground = true,
   hasBorder = true,
   mutedBorder = false,
-  padding = '16px'
+  padding = '16px',
+  height = undefined
 }) => {
   var border = undefined
   if (hasBorder == false) {
@@ -26,7 +27,8 @@ const MissingPlaceholder = ({
       }}
       styles={{
         body: {
-          padding: padding
+          padding: padding,
+          height: height
         }
       }}
     >
@@ -52,7 +54,8 @@ MissingPlaceholder.propTypes = {
   hasBackground: PropTypes.bool,
   hasBorder: PropTypes.bool,
   mutedBorder: PropTypes.bool,
-  padding: PropTypes.string
+  padding: PropTypes.string,
+  height: PropTypes.string
 }
 
 export default MissingPlaceholder
diff --git a/src/components/Dashboard/common/ObjectKanban.jsx b/src/components/Dashboard/common/ObjectKanban.jsx
index 23d28d90..f8cd096b 100644
--- a/src/components/Dashboard/common/ObjectKanban.jsx
+++ b/src/components/Dashboard/common/ObjectKanban.jsx
@@ -9,7 +9,7 @@ import {
   useRef,
   useState
 } from 'react'
-import { Empty, Flex } from 'antd'
+import { Flex } from 'antd'
 import PropTypes from 'prop-types'
 import classNames from 'classnames'
 import { ApiServerContext } from '../context/ApiServerContext'
@@ -27,6 +27,7 @@ import {
   toKanbanColumnsConfig
 } from './viewModeUtils'
 import { areValuesEqual } from '../utils/Utils'
+import MissingPlaceholder from './MissingPlaceholder'
 
 const KANBAN_COLUMN_WIDTH = KANBAN_DEFAULT_COLUMN_WIDTH
 const KANBAN_GAP = 16
@@ -917,17 +918,25 @@ const ObjectKanban = forwardRef(
 
     if (!categoryProperty) {
       return (
-        <Flex align='center' justify='center' style={{ height: '100%' }}>
-          <Empty description='Select a category property for kanban view' />
+        <Flex align='center' justify='center'>
+          <MissingPlaceholder
+            message='Select a category property to continue.'
+            hasBackground={true}
+            hasBorder={false}
+            height='260px'
+          />
         </Flex>
       )
     }
 
     if (hasLoaded && categoryValues.length === 0) {
       return (
-        <Flex align='center' justify='center' style={{ height: '100%' }}>
-          <Empty description='No category values found' />
-        </Flex>
+        <MissingPlaceholder
+          message='No data.'
+          hasBackground={true}
+          hasBorder={false}
+          height='260px'
+        />
       )
     }
 
diff --git a/src/components/Dashboard/common/ObjectTable.jsx b/src/components/Dashboard/common/ObjectTable.jsx
index 173f5ea5..ceadab9c 100644
--- a/src/components/Dashboard/common/ObjectTable.jsx
+++ b/src/components/Dashboard/common/ObjectTable.jsx
@@ -61,6 +61,7 @@ import { ObjectTableFilterContext } from './ObjectTableFilterContext'
 import ObjectListViewContext from '../context/ObjectListViewContext'
 import { isCardsView, isKanbanView, normalizeViewMode } from './viewModeUtils'
 import { areValuesEqual } from '../utils/Utils'
+import MissingPlaceholder from './MissingPlaceholder'
 import LoadingPlaceholder from './LoadingPlaceholder'
 
 const logger = loglevel.getLogger('DasboardTable')
@@ -2017,6 +2018,14 @@ const ObjectTable = forwardRef(
                 )
               })}
             </Row>
+            {!lazyLoading && tableData.length <= 0 && (
+              <MissingPlaceholder
+                message='No data.'
+                hasBackground={true}
+                hasBorder={false}
+                height='260px'
+              />
+            )}
             {lazyLoading && tableData.length <= 0 && (
               <LoadingPlaceholder
                 message='Loading, please wait...'