fix: user selectable list popover issues (#10799)

* fix: user selectable list popover issues

* fix: skip glossary tests

* fix: team cypress tests

---------

Co-authored-by: Chirag Madlani <12962843+chirag-madlani@users.noreply.github.com>
This commit is contained in:
karanh37 2023-04-06 22:55:45 +05:30 committed by GitHub
parent 42000053aa
commit c1cbee3d1b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 30 additions and 14 deletions

View File

@ -902,8 +902,6 @@ export const updateOwner = () => {
// Clicking on edit owner button // Clicking on edit owner button
cy.get('[data-testid="add-user"]').should('be.visible').click(); cy.get('[data-testid="add-user"]').should('be.visible').click();
verifyResponseStatusCode('@getUsers', 200);
cy.get('[data-testid="selectable-list"]') cy.get('[data-testid="selectable-list"]')
.find(`[title="${text.trim()}"]`) .find(`[title="${text.trim()}"]`)
.click(); .click();

View File

@ -15,7 +15,7 @@ import Loader from 'components/Loader/Loader';
import { ADD_USER_CONTAINER_HEIGHT, pagingObject } from 'constants/constants'; import { ADD_USER_CONTAINER_HEIGHT, pagingObject } from 'constants/constants';
import { EntityReference } from 'generated/entity/data/table'; import { EntityReference } from 'generated/entity/data/table';
import { Paging } from 'generated/type/paging'; import { Paging } from 'generated/type/paging';
import { cloneDeep } from 'lodash'; import { cloneDeep, isEmpty } from 'lodash';
import VirtualList from 'rc-virtual-list'; import VirtualList from 'rc-virtual-list';
import React, { UIEventHandler, useCallback, useEffect, useState } from 'react'; import React, { UIEventHandler, useCallback, useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@ -98,13 +98,21 @@ export const SelectableList = ({
fetchListOptions(); fetchListOptions();
}, []); }, []);
const handleSearch = async (search: string) => { const handleSearch = useCallback(
const { data, paging } = await fetchOptions(search); async (search: string) => {
const { data, paging } = await fetchOptions(search);
setUniqueOptions(data); setUniqueOptions(
setPagingInfo(paging); isEmpty(search)
setSearchText(search); ? sortUniqueListFromSelectedList(selectedItemsInternal, data)
}; : data
);
setPagingInfo(paging);
setSearchText(search);
},
[selectedItemsInternal]
);
const onScroll: UIEventHandler<HTMLElement> = async (e) => { const onScroll: UIEventHandler<HTMLElement> = async (e) => {
if ( if (
@ -150,6 +158,10 @@ export const SelectableList = ({
onUpdate([]); onUpdate([]);
}; };
const handleClearAllClick = () => {
setSelectedItemInternal(new Map());
};
return ( return (
<List <List
data-testid="selectable-list" data-testid="selectable-list"
@ -160,7 +172,7 @@ export const SelectableList = ({
color="primary" color="primary"
size="small" size="small"
type="text" type="text"
onClick={handleRemoveClick}> onClick={handleClearAllClick}>
{t('label.clear-entity', { entity: t('label.all-lowercase') })} {t('label.clear-entity', { entity: t('label.all-lowercase') })}
</Button> </Button>
<Space className="m-l-auto text-right"> <Space className="m-l-auto text-right">

View File

@ -46,7 +46,7 @@ export const UserSelectableList = ({
searchText, searchText,
1, 1,
PAGE_SIZE_MEDIUM, PAGE_SIZE_MEDIUM,
'', 'isBot:false',
'', '',
'', '',
SearchIndex.USER SearchIndex.USER
@ -70,7 +70,9 @@ export const UserSelectableList = ({
? { ? {
after, after,
} }
: undefined : undefined,
undefined,
false
); );
const filterData = getEntityReferenceListFromEntities( const filterData = getEntityReferenceListFromEntities(
data, data,

View File

@ -14,6 +14,7 @@
@update-btn-hover-bg: #e2e2e2; @update-btn-hover-bg: #e2e2e2;
.user-select-popover { .user-select-popover {
min-width: 275px;
.ant-popover-inner-content { .ant-popover-inner-content {
padding: 0; padding: 0;
} }

View File

@ -54,7 +54,7 @@ export const UserTeamSelectableList = ({
searchText, searchText,
1, 1,
PAGE_SIZE_MEDIUM, PAGE_SIZE_MEDIUM,
'', 'isBot:false',
'', '',
'', '',
SearchIndex.USER SearchIndex.USER
@ -79,7 +79,9 @@ export const UserTeamSelectableList = ({
? { ? {
after, after,
} }
: undefined : undefined,
undefined,
false
); );
const filterData = getEntityReferenceListFromEntities( const filterData = getEntityReferenceListFromEntities(
data, data,

View File

@ -29,6 +29,7 @@
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12); box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
border-radius: 6px; border-radius: 6px;
padding: 0; padding: 0;
min-width: 275px;
.ant-popover-inner { .ant-popover-inner {
box-shadow: none; box-shadow: none;