From 00fe67bb836be321d5c2cf4b956f6ad8a3c8a7d4 Mon Sep 17 00:00:00 2001 From: Chirag Madlani <12962843+chirag-madlani@users.noreply.github.com> Date: Fri, 21 Apr 2023 12:26:23 +0530 Subject: [PATCH] fix(ui): alignment on summary panel (#11174) * fix(ui): alignment on summary panel teams name validation owner dropdown issue resolved * fix cypress issue for users count --- .../e2e/Flow/TotalCountForTeams&Users.spec.js | 2 +- .../DashboardSummary.component.tsx | 6 ++-- .../MlModelSummary.component.tsx | 6 ++-- .../PipelineSummary.component.tsx | 6 ++-- .../SummaryList/SummaryList.component.tsx | 2 +- .../SummaryListItems.component.tsx | 31 +++++++------------ .../SelectableList.component.tsx | 2 +- .../UserTeamSelectableList.component.tsx | 10 +++++- .../ui/src/pages/teams/AddTeamForm.tsx | 22 ++++++------- .../ui/src/utils/EntitySummaryPanelUtils.tsx | 28 +++++++++++------ 10 files changed, 65 insertions(+), 50 deletions(-) diff --git a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/TotalCountForTeams&Users.spec.js b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/TotalCountForTeams&Users.spec.js index 3e67fa014f0..7b2b0c0972d 100644 --- a/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/TotalCountForTeams&Users.spec.js +++ b/openmetadata-ui/src/main/resources/ui/cypress/e2e/Flow/TotalCountForTeams&Users.spec.js @@ -16,7 +16,7 @@ import { SEARCH_ENTITY_TABLE } from '../../constants/constants'; const TEAM_DETAILS = SEARCH_ENTITY_TABLE.table_1; const userURL = - '/api/v1/search/query?q=***&from=0&size=10&index=user_search_index'; + '/api/v1/search/query?q=**%20AND%20isBot:false&from=0&size=0&index=user_search_index'; const teamURL = '/api/v1/search/query?q=*%20AND%20teamType:Group&from=0&size=10&index=team_search_index'; diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/DashboardSummary/DashboardSummary.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/DashboardSummary/DashboardSummary.component.tsx index 7f3062604a1..e64149347a3 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/DashboardSummary/DashboardSummary.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/DashboardSummary/DashboardSummary.component.tsx @@ -125,6 +125,7 @@ function DashboardSummary({ {info.isLink ? ( @@ -136,9 +137,10 @@ function DashboardSummary({ {info.isExternal ? ( ) : null} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/MlModelSummary/MlModelSummary.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/MlModelSummary/MlModelSummary.component.tsx index e1f502f88b9..c7952c4a796 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/MlModelSummary/MlModelSummary.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/MlModelSummary/MlModelSummary.component.tsx @@ -91,15 +91,17 @@ function MlModelSummary({ {info.isLink ? ( {info.value} {info.isExternal ? ( ) : null} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/PipelineSummary/PipelineSummary.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/PipelineSummary/PipelineSummary.component.tsx index 449f1d40079..681037d1496 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/PipelineSummary/PipelineSummary.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/PipelineSummary/PipelineSummary.component.tsx @@ -93,6 +93,7 @@ function PipelineSummary({ {info.isLink ? ( @@ -100,9 +101,10 @@ function PipelineSummary({ {info.isExternal ? ( ) : null} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/SummaryList/SummaryList.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/SummaryList/SummaryList.component.tsx index f1ad7d1aec7..81e88fd0417 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/SummaryList/SummaryList.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/SummaryList/SummaryList.component.tsx @@ -29,7 +29,7 @@ export default function SummaryList({ const { t } = useTranslation(); return ( - + {isEmpty(formattedEntityData) ? (
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/SummaryList/SummaryListItems/SummaryListItems.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/SummaryList/SummaryListItems/SummaryListItems.component.tsx index 8e7dfca818c..2055b378a73 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/SummaryList/SummaryListItems/SummaryListItems.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/Explore/EntitySummaryPanel/SummaryList/SummaryListItems/SummaryListItems.component.tsx @@ -15,7 +15,6 @@ import { Col, Divider, Row, Space, Typography } from 'antd'; import TagsViewer from 'components/Tag/TagsViewer/tags-viewer'; import React from 'react'; import { useTranslation } from 'react-i18next'; -import { ReactComponent as IconTagGrey } from '../../../../../assets/svg/tag-grey.svg'; import { MAX_CHAR_LIMIT_ENTITY_SUMMARY } from '../../../../../constants/constants'; import { getTagValue } from '../../../../../utils/CommonUtils'; import { prepareConstraintIcon } from '../../../../../utils/TableUtils'; @@ -46,9 +45,9 @@ function SummaryListItem({ - + {entityDetails.type && ( - + {`${t( 'label.type' )}:`} @@ -63,11 +62,11 @@ function SummaryListItem({ {entityDetails.algorithm && ( <> - + - - + + {`${t( 'label.algorithm' )}:`} @@ -82,22 +81,16 @@ function SummaryListItem({ )} {entityDetails.tags && entityDetails.tags.length !== 0 && ( <> - + - - - - getTagValue(tag) - )} - /> - + + getTagValue(tag) + )} + /> )} diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/SelectableList/SelectableList.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/SelectableList/SelectableList.component.tsx index 9094bcf7eac..a0f648367a9 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/SelectableList/SelectableList.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/SelectableList/SelectableList.component.tsx @@ -119,7 +119,7 @@ export const SelectableList = ({ e.currentTarget.scrollHeight - e.currentTarget.scrollTop === ADD_USER_CONTAINER_HEIGHT && pagingInfo.after && - uniqueOptions.length !== pagingInfo.total + uniqueOptions.length <= pagingInfo.total ) { const { data, paging } = await fetchOptions(searchText, pagingInfo.after); diff --git a/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx b/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx index 3f43d1e6a8c..b546520d8c3 100644 --- a/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/components/common/UserTeamSelectableList/UserTeamSelectableList.component.tsx @@ -174,7 +174,15 @@ export const UserTeamSelectableList = ({ // Fetch and store count for Users tab const getUserCount = async () => { - const res = await searchData('', 1, 0, '', '', '', SearchIndex.USER); + const res = await searchData( + '', + 1, + 0, + 'isBot:false', + '', + '', + SearchIndex.USER + ); setUserPaging({ total: res.data.hits.total.value }); }; diff --git a/openmetadata-ui/src/main/resources/ui/src/pages/teams/AddTeamForm.tsx b/openmetadata-ui/src/main/resources/ui/src/pages/teams/AddTeamForm.tsx index ca0ce052318..af87aa1e309 100644 --- a/openmetadata-ui/src/main/resources/ui/src/pages/teams/AddTeamForm.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/pages/teams/AddTeamForm.tsx @@ -16,12 +16,12 @@ import { AxiosError } from 'axios'; import RichTextEditor from 'components/common/rich-text-editor/RichTextEditor'; import { EditorContentRef } from 'components/common/rich-text-editor/RichTextEditor.interface'; import { VALIDATION_MESSAGES } from 'constants/constants'; -import { isUndefined, toLower, trim } from 'lodash'; +import { ENTITY_NAME_REGEX } from 'constants/regex.constants'; +import { toLower, trim } from 'lodash'; import React, { useEffect, useMemo, useRef, useState } from 'react'; import { useTranslation } from 'react-i18next'; import { getTeams } from 'rest/teamsAPI'; import { Team, TeamType } from '../../generated/entity/teams/team'; -import { isUrlFriendlyName } from '../../utils/CommonUtils'; import { showErrorToast } from '../../utils/ToastUtils'; type AddTeamFormType = { @@ -112,19 +112,17 @@ const AddTeamForm: React.FC = ({ max: 128, whitespace: true, }, + { + pattern: ENTITY_NAME_REGEX, + message: t('message.entity-pattern-validation', { + entity: `${t('label.name')}`, + pattern: `- _ & . '`, + }), + }, { validator: (_, value) => { - if (!isUrlFriendlyName(value)) { - return Promise.reject( - t('message.special-character-not-allowed') - ); - } if ( - !isUndefined( - allTeam.find( - (item) => toLower(item.name) === toLower(value) - ) - ) + allTeam.some((team) => toLower(team.name) === toLower(value)) ) { return Promise.reject( t('message.entity-already-exists', { diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/EntitySummaryPanelUtils.tsx b/openmetadata-ui/src/main/resources/ui/src/utils/EntitySummaryPanelUtils.tsx index 2d803c23094..09122ab9fcf 100644 --- a/openmetadata-ui/src/main/resources/ui/src/utils/EntitySummaryPanelUtils.tsx +++ b/openmetadata-ui/src/main/resources/ui/src/utils/EntitySummaryPanelUtils.tsx @@ -11,7 +11,7 @@ * limitations under the License. */ -import { Space, Typography } from 'antd'; +import { Typography } from 'antd'; import { NO_DATA_PLACEHOLDER } from 'constants/constants'; import { isEmpty } from 'lodash'; import React from 'react'; @@ -65,12 +65,17 @@ export const getFormattedEntityData = ( name: chart.name, title: ( - - +
+ {getTitleName(chart)} - - + +
), type: chart.chartType, @@ -83,12 +88,17 @@ export const getFormattedEntityData = ( name: task.name, title: ( - - +
+ {getTitleName(task)} - - + +
), type: task.taskType,