Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: reference table dropdown in add and edit query forms #19026

Open
wants to merge 10 commits into
base: main
Choose a base branch
from
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,7 @@ test('Query Entity', async ({ page }) => {
await page
.locator('div')
.filter({ hasText: new RegExp(`^${queryData.queryUsedIn.table1}$`) })
.first()
.click();

await clickOutside(page);
Expand Down Expand Up @@ -178,7 +179,11 @@ test('Query Entity', async ({ page }) => {
);
await page.keyboard.type(queryData.queryUsedIn.table2);
await tableSearchResponse;
await page.click(`[title="${queryData.queryUsedIn.table2}"]`);
await page
.locator('div')
.filter({ hasText: new RegExp(`^${queryData.queryUsedIn.table2}$`) })
.first()
.click();
await clickOutside(page);
const updateQueryResponse = page.waitForResponse(
(response) =>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,7 @@ const QueryCard: FC<QueryCardProp> = ({
return (
existingTable ?? {
id: (option.value as string) ?? '',
displayName: option.label as string,
displayName: option.labelValue as string,
type: EntityType.TABLE,
}
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ import { QUERY_USED_BY_TABLE_VIEW_CAP } from '../../../../constants/Query.consta
import { EntityType } from '../../../../enums/entity.enum';
import { SearchIndex } from '../../../../enums/search.enum';
import { searchData } from '../../../../rest/miscAPI';
import { getEntityName } from '../../../../utils/EntityUtils';
import { getEntityLabel, getEntityName } from '../../../../utils/EntityUtils';
import { AsyncSelect } from '../../../common/AsyncSelect/AsyncSelect';
import Loader from '../../../common/Loader/Loader';
import {
Expand Down Expand Up @@ -135,8 +135,9 @@ const QueryUsedByOtherTable = ({
);

return data.hits.hits.map((value) => ({
label: getEntityName(value._source),
label: getEntityLabel(value._source),
value: value._source.id,
labelValue: getEntityName(value._source),
aniketkatkar97 marked this conversation as resolved.
Show resolved Hide resolved
}));
} catch (error) {
return [];
Expand All @@ -149,11 +150,12 @@ const QueryUsedByOtherTable = ({
const options = await fetchTableEntity();
const { queryUsedIn = [] } = query;
const selectedValue = queryUsedIn.map((table) => ({
label: getEntityName(table),
label: getEntityLabel(table),
value: table.id,
labelValue: getEntityName(table),
}));

setInitialOptions(uniqBy([...selectedValue, ...options], 'value'));
setInitialOptions(uniqBy([...selectedValue, ...options], 'labelValue'));
} catch (error) {
setInitialOptions([]);
} finally {
Expand All @@ -171,7 +173,7 @@ const QueryUsedByOtherTable = ({
) : (
<AsyncSelect
api={fetchTableEntity}
className="w-min-15 w-full"
className="w-min-30 w-full"
data-testid="edit-query-used-in"
defaultValue={defaultValue}
mode="multiple"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,7 @@ export const AsyncSelect = ({
}}
onSelect={handleSelection}
{...restProps}
optionLabelProp="labelValue"
/>
);
};
Original file line number Diff line number Diff line change
Expand Up @@ -108,6 +108,7 @@ const AddQueryPage = () => {
const options = data.hits.hits.map((value) => ({
label: getEntityLabel(value._source),
value: value._source.id,
labelValue: getEntityName(value._source),
}));

return table
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -203,6 +203,9 @@
.w-min-20 {
min-width: 20rem;
}
.w-min-30 {
min-width: 30rem;
}
.w-min-60 {
min-width: 60rem;
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -163,11 +163,13 @@ export const getEntityLabel = (entity: {
name?: string;
fullyQualifiedName?: string;
}): JSX.Element => (
<Space direction="vertical" size={0}>
<Typography.Text>{getEntityName(entity)}</Typography.Text>
<Typography.Text className="text-gray-400 text-xs break-word">
<Space className="w-full whitespace-normal" direction="vertical" size={0}>
<Typography.Paragraph className="m-b-0">
{getEntityName(entity)}
</Typography.Paragraph>
<Typography.Paragraph className="text-grey-muted text-xs">
{entity?.fullyQualifiedName}
</Typography.Text>
</Typography.Paragraph>
</Space>
);

Expand Down
Loading