fix(#14369): added sort option in custom property table (#14537)

* added sort option in custom property table

* add comparision for displayName also, instead of just name

* added columnSorter utils fn

* fix type issue

* added unit test for columnSorter method
This commit is contained in:
Abhishek Porwal 2024-01-02 23:11:19 +05:30 committed by GitHub
parent 5e290d6d14
commit ba32ef1817
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 38 additions and 10 deletions

View File

@ -23,7 +23,7 @@ import { CUSTOM_PROPERTIES_DOCS } from '../../constants/docs.constants';
import { NO_PERMISSION_FOR_ACTION } from '../../constants/HelperTextUtil';
import { ERROR_PLACEHOLDER_TYPE, OPERATION } from '../../enums/common.enum';
import { CustomProperty } from '../../generated/entity/type';
import { getEntityName } from '../../utils/EntityUtils';
import { columnSorter, getEntityName } from '../../utils/EntityUtils';
import RichTextEditorPreviewer from '../common/RichTextEditor/RichTextEditorPreviewer';
import ConfirmationModal from '../Modals/ConfirmationModal/ConfirmationModal';
import { ModalWithMarkdownEditor } from '../Modals/ModalWithMarkdownEditor/ModalWithMarkdownEditor';
@ -89,6 +89,7 @@ export const CustomPropertyTable: FC<CustomPropertyTableProp> = ({
dataIndex: 'name',
key: 'name',
render: (_, record) => getEntityName(record),
sorter: columnSorter,
},
{
title: t('label.type'),

View File

@ -28,7 +28,7 @@ import {
} from '../../../generated/entity/type';
import { getTypeByFQN } from '../../../rest/metadataTypeAPI';
import { getEntityExtentionDetailsFromEntityType } from '../../../utils/CustomProperties/CustomProperty.utils';
import { getEntityName } from '../../../utils/EntityUtils';
import { columnSorter, getEntityName } from '../../../utils/EntityUtils';
import {
getChangedEntityNewValue,
getDiffByFieldName,
@ -172,6 +172,7 @@ export const CustomPropertyTable = <T extends ExtentionEntitiesKeys>({
key: 'name',
width: 200,
render: (_, record) => getEntityName(record),
sorter: columnSorter,
},
{
title: t('label.value'),

View File

@ -10,7 +10,7 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { highlightEntityNameAndDescription } from './EntityUtils';
import { columnSorter, highlightEntityNameAndDescription } from './EntityUtils';
import {
entityWithoutNameAndDescHighlight,
highlightedEntityDescription,
@ -19,6 +19,7 @@ import {
} from './mocks/EntityUtils.mock';
describe('EntityUtils unit tests', () => {
describe('highlightEntityNameAndDescription method', () => {
it('highlightEntityNameAndDescription method should return the entity with highlighted name and description', () => {
const highlightedEntity = highlightEntityNameAndDescription(
entityWithoutNameAndDescHighlight,
@ -28,4 +29,19 @@ describe('EntityUtils unit tests', () => {
expect(highlightedEntity.displayName).toBe(highlightedEntityDisplayName);
expect(highlightedEntity.description).toBe(highlightedEntityDescription);
});
});
describe('columnSorter method', () => {
it('columnSorter method should return 1 if the 2nd column should be come before 1st column', () => {
const result = columnSorter({ name: 'name2' }, { name: 'name1' });
expect(result).toBe(1);
});
it('columnSorter method should return -1 if the 1st column should be come before 2nd column', () => {
const result = columnSorter({ name: 'name1' }, { name: 'name2' });
expect(result).toBe(-1);
});
});
});

View File

@ -1790,3 +1790,13 @@ export const highlightEntityNameAndDescription = (
description: entityDescription,
};
};
export const columnSorter = (
col1: { name: string; displayName?: string },
col2: { name: string; displayName?: string }
) => {
const name1 = getEntityName(col1);
const name2 = getEntityName(col2);
return name1.localeCompare(name2);
};