yujunjun/OpenMetadata
1
0
Fork 0
mirror of https://github.com/open-metadata/OpenMetadata.git synced 2025-10-31 02:29:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

ui: fixed loading issue in table, and remove unwanted params from API in table profiler (#12668)

Browse Source 
* ui: fixed loading issue in table, and remove unwanted params from API in table profiler

* fixed unit test and addressing comment

* added "testDefinition" params to API as it required to for edit test
This commit is contained in:
Shailesh Parmar 2023-07-31 21:14:21 +05:30 committed by GitHub
parent 5f07c6281a
commit 43fdf78d73
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
15 changed files with 231 additions and 210 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
openmetadata-ui/src/main/resources/ui/src/components/BotListV1/BotListV1.component.tsx
View File

@ -267,21 +267,21 @@ const BotListV1 = ({
<Col span={24}> <Col span={24}>
<Row> <Row>
<Col span={24}> <Col span={24}>
<Table {loading ? (
bordered <Loader />
columns={columns} ) : (
dataSource={searchedData} <Table
loading={{ bordered
spinning: loading, columns={columns}
indicator: <Loader size="small" />, dataSource={searchedData}
}} locale={{
locale={{ emptyText: <FilterTablePlaceHolder />,
emptyText: <FilterTablePlaceHolder />, }}
}} pagination={false}
pagination={false} rowKey="name"
rowKey="name" size="small"
size="small" />
/> )}
</Col> </Col>
<Col span={24}> <Col span={24}>
{paging.total > PAGE_SIZE_LARGE && ( {paging.total > PAGE_SIZE_LARGE && (

5
openmetadata-ui/src/main/resources/ui/src/components/DataInsightDetail/TopActiveUsers.tsx
View File

@ -135,14 +135,15 @@ const TopActiveUsers: FC<Props> = ({ chartFilter }) => {
}} }}
/> />
}> }>
{isEmpty(mostActiveUsers) ? ( {isLoading ? (
<Loader />
) : isEmpty(mostActiveUsers) ? (
<EmptyGraphPlaceholder /> <EmptyGraphPlaceholder />
) : ( ) : (
<Table <Table
className="data-insight-table-wrapper" className="data-insight-table-wrapper"
columns={columns} columns={columns}
dataSource={mostActiveUsers} dataSource={mostActiveUsers}
loading={{ spinning: isLoading, indicator: <Loader /> }}
pagination={false} pagination={false}
size="small" size="small"
/> />

7
openmetadata-ui/src/main/resources/ui/src/components/DataInsightDetail/TopViewEntities.tsx
View File

@ -15,6 +15,7 @@ import { Card, Space, Table, Typography } from 'antd';
import { ColumnsType } from 'antd/lib/table'; import { ColumnsType } from 'antd/lib/table';
import { AxiosError } from 'axios'; import { AxiosError } from 'axios';
import PageHeader from 'components/header/PageHeader.component'; import PageHeader from 'components/header/PageHeader.component';
import Loader from 'components/Loader/Loader';
import { isEmpty, isUndefined } from 'lodash'; import { isEmpty, isUndefined } from 'lodash';
import React, { FC, useEffect, useMemo, useState } from 'react'; import React, { FC, useEffect, useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@ -27,7 +28,6 @@ import { ChartFilter } from '../../interface/data-insight.interface';
import { getDecodedFqn } from '../../utils/StringsUtils'; import { getDecodedFqn } from '../../utils/StringsUtils';
import { showErrorToast } from '../../utils/ToastUtils'; import { showErrorToast } from '../../utils/ToastUtils';
import ProfilePicture from '../common/ProfilePicture/ProfilePicture'; import ProfilePicture from '../common/ProfilePicture/ProfilePicture';
import Loader from '../Loader/Loader';
import './DataInsightDetail.less'; import './DataInsightDetail.less';
import { EmptyGraphPlaceholder } from './EmptyGraphPlaceholder'; import { EmptyGraphPlaceholder } from './EmptyGraphPlaceholder';
@ -130,14 +130,15 @@ const TopViewEntities: FC<Props> = ({ chartFilter }) => {
}} }}
/> />
}> }>
{isEmpty(mostViewedEntities) ? ( {isLoading ? (
<Loader />
) : isEmpty(mostViewedEntities) ? (
<EmptyGraphPlaceholder /> <EmptyGraphPlaceholder />
) : ( ) : (
<Table <Table
className="data-insight-table-wrapper" className="data-insight-table-wrapper"
columns={columns} columns={columns}
dataSource={mostViewedEntities} dataSource={mostViewedEntities}
loading={{ spinning: isLoading, indicator: <Loader /> }}
pagination={false} pagination={false}
size="small" size="small"
/> />

27
openmetadata-ui/src/main/resources/ui/src/components/DataQuality/TestSuites/TestSuites.component.tsx
View File

@ -198,18 +198,21 @@ export const TestSuites = ({ summaryPanel }: { summaryPanel: ReactNode }) => {
<Col span={24}>{summaryPanel}</Col> <Col span={24}>{summaryPanel}</Col>
<Col span={24}> <Col span={24}>
<Table {isLoading ? (
bordered <Loader />
columns={columns} ) : (
data-testid="test-suite-table" <Table
dataSource={testSuites.data} bordered
loading={{ spinning: isLoading, indicator: <Loader /> }} columns={columns}
locale={{ data-testid="test-suite-table"
emptyText: <FilterTablePlaceHolder />, dataSource={testSuites.data}
}} locale={{
pagination={false} emptyText: <FilterTablePlaceHolder />,
size="small" }}
/> pagination={false}
size="small"
/>
)}
</Col> </Col>
<Col span={24}> <Col span={24}>
{testSuites.paging.total > PAGE_SIZE && ( {testSuites.paging.total > PAGE_SIZE && (

8
openmetadata-ui/src/main/resources/ui/src/components/Glossary/ImportResult/GlossaryImportResult.component.tsx
View File

@ -216,16 +216,16 @@ export const GlossaryImportResult: FC<Props> = ({ csvImportResult }) => {
parseCsvFile(); parseCsvFile();
}, [csvImportResult.importResultsCsv]); }, [csvImportResult.importResultsCsv]);
if (loading) {
return <Loader />;
}
return ( return (
<Table <Table
bordered bordered
columns={columns} columns={columns}
data-testid="import-result-table" data-testid="import-result-table"
dataSource={parsedRecords} dataSource={parsedRecords}
loading={{
spinning: loading,
indicator: <Loader size="small" />,
}}
pagination={false} pagination={false}
rowKey="name" rowKey="name"
scroll={{ x: true }} scroll={{ x: true }}

46
openmetadata-ui/src/main/resources/ui/src/components/ProfilerDashboard/component/DataQualityTab.tsx
View File

@ -401,29 +401,29 @@ const DataQualityTab: React.FC<DataQualityTabProps> = ({
return ( return (
<Row gutter={16}> <Row gutter={16}>
<Col span={24}> <Col span={24}>
<Table {isLoading ? (
bordered <Loader />
className="test-case-table-container" ) : (
columns={columns} <Table
data-testid="test-case-table" bordered
dataSource={sortedData} className="test-case-table-container"
expandable={{ columns={columns}
...getTableExpandableConfig<TestCase>(), data-testid="test-case-table"
expandRowByClick: true, dataSource={sortedData}
rowExpandable: () => true, expandable={{
expandedRowRender: (recode) => <TestSummary data={recode} />, ...getTableExpandableConfig<TestCase>(),
}} expandRowByClick: true,
loading={{ rowExpandable: () => true,
indicator: <Loader size="small" />, expandedRowRender: (recode) => <TestSummary data={recode} />,
spinning: isLoading, }}
}} locale={{
locale={{ emptyText: <FilterTablePlaceHolder />,
emptyText: <FilterTablePlaceHolder />, }}
}} pagination={false}
pagination={false} rowKey="id"
rowKey="id" size="small"
size="small" />
/> )}
</Col> </Col>
<Col span={24}> <Col span={24}>
{!isUndefined(pagingData) && pagingData.paging.total > PAGE_SIZE && ( {!isUndefined(pagingData) && pagingData.paging.total > PAGE_SIZE && (

100
openmetadata-ui/src/main/resources/ui/src/components/TableProfiler/TableProfilerV1.tsx
View File

@ -31,6 +31,7 @@ import classNames from 'classnames';
import { SummaryCard } from 'components/common/SummaryCard/SummaryCard.component'; import { SummaryCard } from 'components/common/SummaryCard/SummaryCard.component';
import { SummaryCardProps } from 'components/common/SummaryCard/SummaryCard.interface'; import { SummaryCardProps } from 'components/common/SummaryCard/SummaryCard.interface';
import DatePickerMenu from 'components/DatePickerMenu/DatePickerMenu.component'; import DatePickerMenu from 'components/DatePickerMenu/DatePickerMenu.component';
import Loader from 'components/Loader/Loader';
import { DateRangeObject } from 'components/ProfilerDashboard/component/TestSummary'; import { DateRangeObject } from 'components/ProfilerDashboard/component/TestSummary';
import TabsLabel from 'components/TabsLabel/TabsLabel.component'; import TabsLabel from 'components/TabsLabel/TabsLabel.component';
import { useTourProvider } from 'components/TourProvider/TourProvider'; import { useTourProvider } from 'components/TourProvider/TourProvider';
@ -136,7 +137,7 @@ const TableProfilerV1: FC<TableProfilerProps> = ({
const [selectedTestCaseStatus, setSelectedTestCaseStatus] = const [selectedTestCaseStatus, setSelectedTestCaseStatus] =
useState<string>(''); useState<string>('');
const [selectedTestType, setSelectedTestType] = useState(''); const [selectedTestType, setSelectedTestType] = useState('');
const [isTestCaseLoading, setIsTestCaseLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [dateRangeObject, setDateRangeObject] = const [dateRangeObject, setDateRangeObject] =
useState<DateRangeObject>(DEFAULT_RANGE_DATA); useState<DateRangeObject>(DEFAULT_RANGE_DATA);
@ -379,11 +380,11 @@ const TableProfilerV1: FC<TableProfilerProps> = ({
}; };
const fetchAllTests = async (params?: ListTestCaseParams) => { const fetchAllTests = async (params?: ListTestCaseParams) => {
setIsTestCaseLoading(true); setIsLoading(true);
try { try {
const { data } = await getListTestCase({ const { data } = await getListTestCase({
...params, ...params,
fields: 'testCaseResult,entityLink,testDefinition,testSuite', fields: 'testCaseResult, testDefinition',
entityLink: generateEntityLink(datasetFQN || ''), entityLink: generateEntityLink(datasetFQN || ''),
includeAllTests: true, includeAllTests: true,
limit: API_RES_MAX_SIZE, limit: API_RES_MAX_SIZE,
@ -393,7 +394,7 @@ const TableProfilerV1: FC<TableProfilerProps> = ({
} catch (error) { } catch (error) {
showErrorToast(error as AxiosError); showErrorToast(error as AxiosError);
} finally { } finally {
setIsTestCaseLoading(false); setIsLoading(false);
} }
}; };
@ -444,11 +445,14 @@ const TableProfilerV1: FC<TableProfilerProps> = ({
// and the datasetFQN comes form url parameter which is already encoded, // and the datasetFQN comes form url parameter which is already encoded,
// we are decoding FQN below to avoid double encoding in the API function // we are decoding FQN below to avoid double encoding in the API function
const decodedDatasetFQN = decodeURIComponent(datasetFQN); const decodedDatasetFQN = decodeURIComponent(datasetFQN);
setIsLoading(true);
try { try {
const response = await getLatestTableProfileByFqn(decodedDatasetFQN); const response = await getLatestTableProfileByFqn(decodedDatasetFQN);
setTable(response); setTable(response);
} catch (error) { } catch (error) {
showErrorToast(error as AxiosError); showErrorToast(error as AxiosError);
} finally {
setIsLoading(false);
} }
}; };
@ -485,18 +489,20 @@ const TableProfilerV1: FC<TableProfilerProps> = ({
}, [viewTest, isTourOpen, isTableProfile, allTests]); }, [viewTest, isTourOpen, isTableProfile, allTests]);
useEffect(() => { useEffect(() => {
if ( const fetchProfiler =
!isTableDeleted && !isTableDeleted &&
datasetFQN && datasetFQN &&
!isTourOpen && !isTourOpen &&
(isTableProfile || isColumnProfile) (isTableProfile || isColumnProfile) &&
) { isUndefined(table);
if (fetchProfiler) {
fetchLatestProfilerData(); fetchLatestProfilerData();
} }
if (isTourOpen) { if (isTourOpen) {
setTable(mockDatasetData.tableDetails as unknown as Table); setTable(mockDatasetData.tableDetails as unknown as Table);
} }
}, [datasetFQN, isTourOpen, isTableProfile]); }, [datasetFQN, isTourOpen, isTableProfile, isColumnProfile]);
return ( return (
<Row <Row
@ -629,6 +635,7 @@ const TableProfilerV1: FC<TableProfilerProps> = ({
<Col key={summery.title}> <Col key={summery.title}>
<SummaryCard <SummaryCard
className={classNames(summery.className, 'h-full')} className={classNames(summery.className, 'h-full')}
isLoading={isLoading}
showProgressBar={false} showProgressBar={false}
title={summery.title} title={summery.title}
total={0} total={0}
@ -641,6 +648,7 @@ const TableProfilerV1: FC<TableProfilerProps> = ({
<Col key={key}> <Col key={key}>
<SummaryCard <SummaryCard
showProgressBar showProgressBar
isLoading={isLoading}
title={key} title={key}
total={selectedColumnTestsObj.totalTests} total={selectedColumnTestsObj.totalTests}
type={toLower(key) as SummaryCardProps['type']} type={toLower(key) as SummaryCardProps['type']}
@ -653,44 +661,50 @@ const TableProfilerV1: FC<TableProfilerProps> = ({
)} )}
</Row> </Row>
{isColumnProfile && ( {isLoading ? (
<ColumnProfileTable <Loader />
columnTests={columnTests} ) : (
columns={columns.map((col) => ({ <>
...col, {isColumnProfile && (
key: col.name, <ColumnProfileTable
}))} columnTests={columnTests}
dateRangeObject={dateRangeObject} columns={columns.map((col) => ({
hasEditAccess={editTest} ...col,
/> key: col.name,
)} }))}
dateRangeObject={dateRangeObject}
hasEditAccess={editTest}
/>
)}
{isDataQuality && ( {isDataQuality && (
<QualityTab <QualityTab
afterDeleteAction={fetchAllTests} afterDeleteAction={fetchAllTests}
isLoading={isTestCaseLoading} isLoading={isLoading}
showTableColumn={false} showTableColumn={false}
testCases={getFilterTestCase()} testCases={getFilterTestCase()}
testSuite={testSuite} testSuite={testSuite}
onTestCaseResultUpdate={handleResultUpdate} onTestCaseResultUpdate={handleResultUpdate}
onTestUpdate={handleTestUpdate} onTestUpdate={handleTestUpdate}
/> />
)} )}
{isTableProfile && ( {isTableProfile && (
<TableProfilerChart <TableProfilerChart
dateRangeObject={dateRangeObject} dateRangeObject={dateRangeObject}
showOperationGraph={showOperationGraph} showOperationGraph={showOperationGraph}
/> />
)} )}
{settingModalVisible && ( {settingModalVisible && (
<ProfilerSettingsModal <ProfilerSettingsModal
columns={columns} columns={columns}
tableId={table?.id || ''} tableId={table?.id || ''}
visible={settingModalVisible} visible={settingModalVisible}
onVisibilityChange={handleSettingModal} onVisibilityChange={handleSettingModal}
/> />
)}
</>
)} )}
</Space> </Space>
</Col> </Col>

10
openmetadata-ui/src/main/resources/ui/src/components/Team/TeamImportResult/TeamImportResult.component.tsx
View File

@ -199,6 +199,8 @@ export const TeamImportResult = ({
setIsLoading(false); setIsLoading(false);
}, },
}); });
} else {
setIsLoading(false);
} }
}; };
@ -207,16 +209,16 @@ export const TeamImportResult = ({
parseCsvFile(); parseCsvFile();
}, [csvImportResult.importResultsCsv]); }, [csvImportResult.importResultsCsv]);
if (loading) {
return <Loader />;
}
return ( return (
<Table <Table
bordered bordered
columns={columns} columns={columns}
data-testid="import-result-table" data-testid="import-result-table"
dataSource={parsedRecords} dataSource={parsedRecords}
loading={{
spinning: loading,
indicator: <Loader size="small" />,
}}
pagination={false} pagination={false}
rowKey="name*" rowKey="name*"
scroll={{ x: true }} scroll={{ x: true }}

10
openmetadata-ui/src/main/resources/ui/src/components/Team/UserImportResult/UserImportResult.component.tsx
View File

@ -191,6 +191,8 @@ export const UserImportResult = ({
setIsLoading(false); setIsLoading(false);
}, },
}); });
} else {
setIsLoading(false);
} }
}; };
@ -199,6 +201,10 @@ export const UserImportResult = ({
parseCsvFile(); parseCsvFile();
}, [csvImportResult.importResultsCsv]); }, [csvImportResult.importResultsCsv]);
if (loading) {
return <Loader />;
}
return ( return (
<Table <Table
bordered bordered
@ -206,10 +212,6 @@ export const UserImportResult = ({
columns={columns} columns={columns}
data-testid="import-result-table" data-testid="import-result-table"
dataSource={parsedRecords} dataSource={parsedRecords}
loading={{
spinning: loading,
indicator: <Loader size="small" />,
}}
pagination={false} pagination={false}
rowKey="name*" rowKey="name*"
scroll={{ x: true }} scroll={{ x: true }}

34
openmetadata-ui/src/main/resources/ui/src/components/UserList/UserListV1.tsx
View File

@ -252,23 +252,23 @@ const UserListV1: FC<UserListV1Props> = ({
</Col> </Col>
<Col span={24}> <Col span={24}>
<Table {isDataLoading ? (
bordered <Loader />
className="user-list-table" ) : (
columns={columns} <Table
data-testid="user-list-table" bordered
dataSource={data} className="user-list-table"
loading={{ columns={columns}
spinning: isDataLoading, data-testid="user-list-table"
indicator: <Loader size="small" />, dataSource={data}
}} locale={{
locale={{ emptyText: <FilterTablePlaceHolder />,
emptyText: <FilterTablePlaceHolder />, }}
}} pagination={false}
pagination={false} rowKey="id"
rowKey="id" size="small"
size="small" />
/> )}
</Col> </Col>
<Col span={24}> <Col span={24}>
{paging.total > PAGE_SIZE_MEDIUM && ( {paging.total > PAGE_SIZE_MEDIUM && (

60
openmetadata-ui/src/main/resources/ui/src/pages/AlertsPage/AlertsPage.tsx
View File

@ -185,37 +185,37 @@ const AlertsPage = () => {
</div> </div>
</Col> </Col>
<Col span={24}> <Col span={24}>
<Table {loading ? (
bordered <Loader />
columns={columns} ) : (
dataSource={alerts} <Table
loading={{ bordered
spinning: loading, columns={columns}
indicator: <Loader size="small" />, dataSource={alerts}
}} locale={{
locale={{ emptyText: !loading && (
emptyText: !loading && ( <ErrorPlaceHolder
<ErrorPlaceHolder permission
permission className="p-y-md"
className="p-y-md" doc={ALERTS_DOCS}
doc={ALERTS_DOCS} heading={t('label.alert')}
heading={t('label.alert')} type={ERROR_PLACEHOLDER_TYPE.CREATE}
type={ERROR_PLACEHOLDER_TYPE.CREATE} onClick={() =>
onClick={() => history.push(
history.push( getSettingPath(
getSettingPath( GlobalSettingsMenuCategory.NOTIFICATIONS,
GlobalSettingsMenuCategory.NOTIFICATIONS, GlobalSettingOptions.ADD_ALERTS
GlobalSettingOptions.ADD_ALERTS )
) )
) }
} />
/> ),
), }}
}} pagination={false}
pagination={false} rowKey="id"
rowKey="id" size="middle"
size="middle" />
/> )}
</Col> </Col>
<Col span={24}> <Col span={24}>
{Boolean( {Boolean(

29
openmetadata-ui/src/main/resources/ui/src/pages/DataInsightPage/KPIList.tsx
View File

@ -201,19 +201,22 @@ const KPIList = ({ viewKPIPermission }: { viewKPIPermission: boolean }) => {
return ( return (
<> <>
<Col span={24}> <Col span={24}>
<Table {isLoading ? (
bordered <Loader />
columns={columns} ) : (
data-testid="kpi-table" <Table
dataSource={kpiList} bordered
loading={{ spinning: isLoading, indicator: <Loader /> }} columns={columns}
locale={{ data-testid="kpi-table"
emptyText: noDataPlaceHolder, dataSource={kpiList}
}} locale={{
pagination={false} emptyText: noDataPlaceHolder,
rowKey="name" }}
size="small" pagination={false}
/> rowKey="name"
size="small"
/>
)}
</Col> </Col>
{kpiList.length > PAGE_SIZE_MEDIUM && ( {kpiList.length > PAGE_SIZE_MEDIUM && (
<Col span={24}> <Col span={24}>

8
openmetadata-ui/src/main/resources/ui/src/pages/DatabaseSchemaPage/SchemaTablesTab.tsx
View File

@ -144,7 +144,9 @@ function SchemaTablesTab({
</Row> </Row>
</Col> </Col>
<Col span={24}> <Col span={24}>
{isEmpty(tableData) && !showDeletedTables && !tableDataLoading ? ( {tableDataLoading ? (
<Loader />
) : isEmpty(tableData) && !showDeletedTables ? (
<ErrorPlaceHolder <ErrorPlaceHolder
className="mt-0-important" className="mt-0-important"
type={ERROR_PLACEHOLDER_TYPE.NO_DATA} type={ERROR_PLACEHOLDER_TYPE.NO_DATA}
@ -155,10 +157,6 @@ function SchemaTablesTab({
columns={tableColumn} columns={tableColumn}
data-testid="databaseSchema-tables" data-testid="databaseSchema-tables"
dataSource={tableData.data} dataSource={tableData.data}
loading={{
spinning: tableDataLoading,
indicator: <Loader size="small" />,
}}
locale={{ locale={{
emptyText: <ErrorPlaceHolder />, emptyText: <ErrorPlaceHolder />,
}} }}

34
openmetadata-ui/src/main/resources/ui/src/pages/ServiceDetailsPage/ServiceMainTabContent.tsx
View File

@ -289,23 +289,23 @@ function ServiceMainTabContent({
</Row> </Row>
</Col> </Col>
<Col data-testid="table-container" span={24}> <Col data-testid="table-container" span={24}>
<Table {isServiceLoading ? (
bordered <Loader />
columns={tableColumn} ) : (
components={tableComponent} <Table
data-testid="service-children-table" bordered
dataSource={data} columns={tableColumn}
loading={{ components={tableComponent}
spinning: isServiceLoading, data-testid="service-children-table"
indicator: <Loader size="small" />, dataSource={data}
}} locale={{
locale={{ emptyText: <ErrorPlaceHolder className="m-y-md" />,
emptyText: <ErrorPlaceHolder className="m-y-md" />, }}
}} pagination={false}
pagination={false} rowKey="id"
rowKey="id" size="small"
size="small" />
/> )}
{Boolean(!isNil(paging.after) || !isNil(paging.before)) && {Boolean(!isNil(paging.after) || !isNil(paging.before)) &&
!isEmpty(data) && ( !isEmpty(data) && (
<NextPrevious <NextPrevious

33
openmetadata-ui/src/main/resources/ui/src/pages/TagsPage/TagsPage.tsx
View File

@ -17,7 +17,6 @@ import {
Col, Col,
Row, Row,
Space, Space,
Spin,
Switch, Switch,
Table, Table,
Tooltip, Tooltip,
@ -1139,23 +1138,21 @@ const TagsPage = () => {
</Space> </Space>
</div> </div>
<Table {isTagsLoading ? (
bordered <Loader />
className={isClassificationDisabled ? 'opacity-60' : ''} ) : (
columns={tableColumn} <Table
data-testid="table" bordered
dataSource={tags} className={isClassificationDisabled ? 'opacity-60' : ''}
loading={{ columns={tableColumn}
indicator: ( data-testid="table"
<Spin indicator={<Loader size="small" />} size="small" /> dataSource={tags}
), pagination={false}
spinning: isTagsLoading, rowClassName={(record) => (record.disabled ? 'opacity-60' : '')}
}} rowKey="id"
pagination={false} size="small"
rowClassName={(record) => (record.disabled ? 'opacity-60' : '')} />
rowKey="id" )}
size="small"
/>
{paging.total > PAGE_SIZE && ( {paging.total > PAGE_SIZE && (
<NextPrevious <NextPrevious
currentPage={currentPage} currentPage={currentPage}