diff --git a/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/Table.spec.ts b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/Table.spec.ts
new file mode 100644
index 00000000000..4e0c5f8a1c9
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/playwright/e2e/Features/Table.spec.ts
@@ -0,0 +1,88 @@
+/*
+ *  Copyright 2024 Collate.
+ *  Licensed under the Apache License, Version 2.0 (the "License");
+ *  you may not use this file except in compliance with the License.
+ *  You may obtain a copy of the License at
+ *  http://www.apache.org/licenses/LICENSE-2.0
+ *  Unless required by applicable law or agreed to in writing, software
+ *  distributed under the License is distributed on an "AS IS" BASIS,
+ *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *  See the License for the specific language governing permissions and
+ *  limitations under the License.
+ */
+import test, { expect } from '@playwright/test';
+import { SidebarItem } from '../../constant/sidebar';
+import { TableClass } from '../../support/entity/TableClass';
+import { createNewPage, redirectToHomePage } from '../../utils/common';
+import { sidebarClick } from '../../utils/sidebar';
+
+// use the admin user to login
+test.use({ storageState: 'playwright/.auth/admin.json' });
+
+const table1 = new TableClass();
+
+test.describe('Table pagination sorting search scenarios ', () => {
+  test.beforeAll('Setup pre-requests', async ({ browser }) => {
+    const { afterAction, apiContext } = await createNewPage(browser);
+
+    await table1.create(apiContext);
+
+    for (let i = 0; i < 17; i++) {
+      await table1.createTestCase(apiContext);
+    }
+
+    await afterAction();
+  });
+
+  test.afterAll('Clean up', async ({ browser }) => {
+    const { afterAction, apiContext } = await createNewPage(browser);
+
+    await table1.delete(apiContext);
+
+    await afterAction();
+  });
+
+  test.beforeEach('Visit home page', async ({ page }) => {
+    await redirectToHomePage(page);
+  });
+
+  test('Table pagination with sorting should works', async ({ page }) => {
+    await sidebarClick(page, SidebarItem.DATA_QUALITY);
+
+    const listTestCaseResponse = page.waitForResponse(
+      `/api/v1/dataQuality/testCases/search/list?**`
+    );
+
+    await page.getByText('By Test Cases').click();
+    await listTestCaseResponse;
+    await page.getByText('Name', { exact: true }).click();
+
+    await page.getByTestId('next').click();
+
+    expect(await page.locator('.ant-table-row').count()).toBe(10);
+  });
+
+  test('Table search with sorting should works', async ({ page }) => {
+    await sidebarClick(page, SidebarItem.DATA_QUALITY);
+
+    await page.getByText('By Test Cases').click();
+    await page.getByText('Name', { exact: true }).click();
+    await page.getByTestId('searchbar').click();
+    await page.getByTestId('searchbar').fill('temp-test-case');
+
+    await expect(page.getByTestId('search-error-placeholder')).toBeVisible();
+
+  });
+
+  test('Table filter with sorting should works', async ({ page }) => {
+    await sidebarClick(page, SidebarItem.DATA_QUALITY);
+
+    await page.getByText('By Test Cases').click();
+    await page.getByText('Name', { exact: true }).click();
+
+    await page.getByTestId('status-select-filter').locator('div').click();
+    await page.getByTitle('Queued').locator('div').click();
+
+    await expect(page.getByTestId('search-error-placeholder')).toBeVisible();
+  });
+});
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Pipeline/Execution/ListView/ListViewTab.component.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Pipeline/Execution/ListView/ListViewTab.component.test.tsx
index 6ccbfdc2885..2dc49e3c809 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Pipeline/Execution/ListView/ListViewTab.component.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Pipeline/Execution/ListView/ListViewTab.component.test.tsx
@@ -39,7 +39,7 @@ describe('Test ListViewTab Component', () => {
   it('Should render loader in table component', async () => {
     render(<ListView {...mockProps} loading />);
 
-    expect(screen.getByTestId('skeleton-table')).toBeInTheDocument();
+    expect(screen.getByTestId('loader')).toBeInTheDocument();
   });
 
   it('Should render component properly if not loading', async () => {
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Settings/Services/Ingestion/IngestionListTable.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Settings/Services/Ingestion/IngestionListTable.test.tsx
index 066927c8549..e53d42895f3 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/Settings/Services/Ingestion/IngestionListTable.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/Settings/Services/Ingestion/IngestionListTable.test.tsx
@@ -52,7 +52,7 @@ describe('IngestionListTable tests', () => {
   it('Should display the loader if the isLoading is true', async () => {
     render(<IngestionListTable {...mockIngestionListTableProps} isLoading />);
 
-    const loader = await screen.findByTestId('skeleton-table');
+    const loader = await screen.findByText('loader');
 
     expect(loader).toBeInTheDocument();
   });
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/Table/Table.test.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/Table/Table.test.tsx
index 2e167b2a3b1..8e1943b6b1a 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/Table/Table.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/Table/Table.test.tsx
@@ -18,25 +18,25 @@ describe('Table component', () => {
   it('should display skeleton loader if loading is true', async () => {
     render(<Table loading />);
 
-    expect(await screen.findByTestId('skeleton-table')).toBeInTheDocument();
+    expect(await screen.findByTestId('loader')).toBeInTheDocument();
   });
 
   it('should display skeleton loader if spinning is true', async () => {
     render(<Table loading={{ spinning: true }} />);
 
-    expect(await screen.findByTestId('skeleton-table')).toBeInTheDocument();
+    expect(await screen.findByTestId('loader')).toBeInTheDocument();
   });
 
   it('should not display skeleton loader if loading is false', () => {
     render(<Table loading={false} />);
 
-    expect(screen.queryByTestId('skeleton-table')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('loader')).not.toBeInTheDocument();
   });
 
   it('should not display skeleton loader if spinning is false', () => {
     render(<Table loading={{ spinning: false }} />);
 
-    expect(screen.queryByTestId('skeleton-table')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('loader')).not.toBeInTheDocument();
   });
 
   it('should render column label while loading', async () => {
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/Table/Table.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/Table/Table.tsx
index dba1ec3c571..76dc3b7a820 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/common/Table/Table.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/common/Table/Table.tsx
@@ -10,11 +10,10 @@
  *  See the License for the specific language governing permissions and
  *  limitations under the License.
  */
-import { Skeleton, SpinProps, Table as AntdTable, TableProps } from 'antd';
+import { SpinProps, Table as AntdTable, TableProps } from 'antd';
 import React, { useMemo } from 'react';
-import { SMALL_TABLE_LOADER_SIZE } from '../../../constants/constants';
-import { getUniqueArray } from '../../../utils/CommonUtils';
 import { getTableExpandableConfig } from '../../../utils/TableUtils';
+import Loader from '../Loader/Loader';
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
 const Table = <T extends object = any>({ loading, ...rest }: TableProps<T>) => {
@@ -23,42 +22,52 @@ const Table = <T extends object = any>({ loading, ...rest }: TableProps<T>) => {
     [loading]
   );
 
-  const dataSource = useMemo(
-    () => getUniqueArray(SMALL_TABLE_LOADER_SIZE) as T[],
-    []
-  );
+  // TODO: Need to remove the skeleton loading to fix: https://github.com/open-metadata/OpenMetadata/issues/16655
+  // Let's circle back once we have a better solution for this.
+  //   const dataSource = useMemo(
+  //     () => getUniqueArray(SMALL_TABLE_LOADER_SIZE) as T[],
+  //     []
+  //   );
 
-  if (isLoading) {
-    const { columns } = { ...rest };
-    const column = columns?.map((column) => {
-      return {
-        ...column,
-        render: () => (
-          <Skeleton
-            title
-            active={isLoading}
-            key={column.key}
-            paragraph={false}
-          />
-        ),
-      };
-    });
+  //   if (isLoading) {
+  //     const { columns } = { ...rest };
+  //     const column = columns?.map((column) => {
+  //       return {
+  //         ...column,
+  //         render: () => (
+  //           <Skeleton
+  //             title
+  //             active={isLoading}
+  //             key={column.key}
+  //             paragraph={false}
+  //           />
+  //         ),
+  //       };
+  //     });
 
-    return (
-      <AntdTable
-        {...rest}
-        columns={column}
-        data-testid="skeleton-table"
-        dataSource={dataSource}
-        expandable={undefined}
-      />
-    );
-  }
+  //     return (
+  //       <AntdTable
+  //         {...rest}
+  //         columns={column}
+  //         data-testid="skeleton-table"
+  //         dataSource={isEmpty(rest.dataSource) ? dataSource : rest.dataSource}
+  //         expandable={undefined}
+  //       />
+  //     );
+  //   }
 
   return (
     <AntdTable
       {...rest}
       expandable={{ ...getTableExpandableConfig<T>(), ...rest.expandable }}
+      loading={{
+        spinning: isLoading,
+        indicator: <Loader />,
+      }}
+      locale={{
+        ...rest.locale,
+        emptyText: isLoading ? null : rest.locale?.emptyText,
+      }}
     />
   );
 };
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/Persona/PersonaDetailsPage/PersonaDetailsPage.test.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/Persona/PersonaDetailsPage/PersonaDetailsPage.test.tsx
index b42686c40c9..242da0a8d9d 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/Persona/PersonaDetailsPage/PersonaDetailsPage.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/Persona/PersonaDetailsPage/PersonaDetailsPage.test.tsx
@@ -115,6 +115,27 @@ jest.mock('../../../context/PermissionProvider/PermissionProvider', () => ({
   }),
 }));
 
+jest.mock(
+  '../../../components/Settings/Users/UsersTab/UsersTabs.component',
+  () => ({
+    UsersTab: jest
+      .fn()
+      .mockImplementation(() => <div>UsersTabs.component</div>),
+  })
+);
+
+jest.mock('../../../utils/EntityUtils', () => ({
+  getEntityName: jest.fn().mockReturnValue('Persona'),
+}));
+
+jest.mock('../../../utils/PermissionsUtils', () => ({
+  DEFAULT_ENTITY_PERMISSION: jest.fn(),
+}));
+
+jest.mock('../../../utils/ToastUtils', () => ({
+  showErrorToast: jest.fn(),
+}));
+
 describe('PersonaDetailsPage', () => {
   it('Component should render', async () => {
     render(<PersonaDetailsPage />);
diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/ServiceVersionPage/ServiceVersionMainTabContent.test.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/ServiceVersionPage/ServiceVersionMainTabContent.test.tsx
index 8327955a500..e2a10cfbe69 100644
--- a/openmetadata-ui/src/main/resources/ui/src/pages/ServiceVersionPage/ServiceVersionMainTabContent.test.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/pages/ServiceVersionPage/ServiceVersionMainTabContent.test.tsx
@@ -175,7 +175,7 @@ describe('ServiceVersionMainTabContent tests', () => {
       wrapper: MemoryRouter,
     });
 
-    const loader = await screen.findByTestId('skeleton-table');
+    const loader = await screen.findByTestId('loader');
 
     expect(loader).toBeInTheDocument();
   });