yujunjun/OpenMetadata
1
0
Fork 0
mirror of https://github.com/open-metadata/OpenMetadata.git synced 2025-08-24 17:08:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fix #6893 : Ui improvements and bug fixes 2 (#6935)

Browse Source 
* Fix #6893 : Ui improvements and bug fixes

* Fixed failing unit tests

* Fixed failing cypress tests

* glossary page left panel styling changes
This commit is contained in:
Aniket Katkar 2022-08-26 14:14:22 +05:30 committed by GitHub
parent 6a85b34e3c
commit 1c6d2f2649
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 189 additions and 139 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
openmetadata-ui/src/main/resources/ui/cypress/integration/Pages/Teams.spec.js
View File

@ -146,7 +146,10 @@ describe('Teams flow should work properly', () => {
cy.get('.ant-table-row').should('contain', TEAM_DETAILS.ownername); cy.get('.ant-table-row').should('contain', TEAM_DETAILS.ownername);
//Removing the added user //Removing the added user
cy.get('.ant-btn').should('exist').should('be.visible').click(); cy.get('.ant-btn > [data-testid="image"]')
.should('exist')
.should('be.visible')
.click();
//Validating the user added //Validating the user added
cy.get('[data-testid="body-text"]').should( cy.get('[data-testid="body-text"]').should(
@ -156,10 +159,10 @@ describe('Teams flow should work properly', () => {
//Click on confirm button //Click on confirm button
cy.get('[data-testid="save-button"]').should('be.visible').click(); cy.get('[data-testid="save-button"]').should('be.visible').click();
// TODO: Remove cy.wait and wait for API to be completed before querying for new element // TODO: Remove cy.wait and wait for API to be completed before querying for new element
cy.wait(2000); cy.wait(2000);
// //
//Verify if user is removed //Verify if user is removed
cy.get('[data-testid="searchbar"]') cy.get('[data-testid="searchbar"]')
@ -311,6 +314,12 @@ describe('Teams flow should work properly', () => {
.should('be.visible') .should('be.visible')
.click(); .click();
cy.wait(1000);
cy.get('.ant-dropdown-menu-item')
.should('exist')
.should('be.visible')
.click();
cy.wait(1000); cy.wait(1000);
//Click on permanent delete option //Click on permanent delete option
cy.get('[data-testid="hard-delete-option"]') cy.get('[data-testid="hard-delete-option"]')

25
openmetadata-ui/src/main/resources/ui/src/components/CreateUser/CreateUser.component.tsx
View File

@ -16,6 +16,7 @@ import classNames from 'classnames';
import { cloneDeep, isEmpty, isUndefined } from 'lodash'; import { cloneDeep, isEmpty, isUndefined } from 'lodash';
import { EditorContentRef } from 'Models'; import { EditorContentRef } from 'Models';
import React, { useRef, useState } from 'react'; import React, { useRef, useState } from 'react';
import { getBotsPagePath, getUsersPagePath } from '../../constants/constants';
import { validEmailRegEx } from '../../constants/regex.constants'; import { validEmailRegEx } from '../../constants/regex.constants';
import { PageLayoutType } from '../../enums/layout.enum'; import { PageLayoutType } from '../../enums/layout.enum';
import { CreateUser as CreateUserSchema } from '../../generated/api/teams/createUser'; import { CreateUser as CreateUserSchema } from '../../generated/api/teams/createUser';
@ -60,6 +61,18 @@ const CreateUser = ({
validEmail: false, validEmail: false,
}); });
const slashedBreadcrumbList = [
{
name: forceBot ? 'Bots' : 'Users',
url: forceBot ? getBotsPagePath() : getUsersPagePath(),
},
{
name: `Create ${forceBot ? 'Bot' : 'User'}`,
url: '',
activeTitle: true,
},
];
/** /**
* common function to update user input in to the state * common function to update user input in to the state
* @param event change event for input/selection field * @param event change event for input/selection field
@ -215,17 +228,7 @@ const CreateUser = ({
return ( return (
<PageLayout <PageLayout
classes="tw-max-w-full-hd tw-h-full tw-pt-4" classes="tw-max-w-full-hd tw-h-full tw-pt-4"
header={ header={<TitleBreadcrumb titleLinks={slashedBreadcrumbList} />}
<TitleBreadcrumb
titleLinks={[
{
name: `Create ${forceBot ? 'Bot' : 'User'}`,
url: '',
activeTitle: true,
},
]}
/>
}
layout={PageLayoutType['2ColRTL']}> layout={PageLayoutType['2ColRTL']}>
<div className="tw-form-container"> <div className="tw-form-container">
<h6 className="tw-heading tw-text-base"> <h6 className="tw-heading tw-text-base">

13
openmetadata-ui/src/main/resources/ui/src/components/Glossary/Glossary.test.tsx
View File

@ -59,6 +59,19 @@ jest.mock('antd', () => ({
.fn() .fn()
.mockImplementation(({ children }) => <div>{children}</div>), .mockImplementation(({ children }) => <div>{children}</div>),
}, },
Dropdown: jest.fn().mockImplementation(({ children, overlay }) => (
<div>
{children}
{overlay}
</div>
)),
Menu: jest.fn().mockImplementation(({ items }) => (
<div>
{items.map((item: { key: string; label: JSX.Element }) => {
<div key={item.key}>{item.label}</div>;
})}
</div>
)),
})); }));
const mockProps = { const mockProps = {

97
openmetadata-ui/src/main/resources/ui/src/components/Glossary/GlossaryV1.component.tsx
View File

@ -12,14 +12,13 @@
*/ */
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Col, Input, Row, Space, Typography } from 'antd'; import { Col, Dropdown, Input, Menu, Row, Space, Typography } from 'antd';
import classNames from 'classnames'; import classNames from 'classnames';
import { cloneDeep, isEmpty } from 'lodash'; import { cloneDeep, isEmpty } from 'lodash';
import { GlossaryTermAssets, LoadingState } from 'Models'; import { GlossaryTermAssets, LoadingState } from 'Models';
import RcTree from 'rc-tree'; import RcTree from 'rc-tree';
import { DataNode, EventDataNode } from 'rc-tree/lib/interface'; import { DataNode, EventDataNode } from 'rc-tree/lib/interface';
import React, { Fragment, useEffect, useRef, useState } from 'react'; import React, { Fragment, useEffect, useRef, useState } from 'react';
import { Tooltip } from 'react-tippy';
import { useAuthContext } from '../../authentication/auth-provider/AuthProvider'; import { useAuthContext } from '../../authentication/auth-provider/AuthProvider';
import { FQN_SEPARATOR_CHAR } from '../../constants/char.constants'; import { FQN_SEPARATOR_CHAR } from '../../constants/char.constants';
import { TITLE_FOR_NON_ADMIN_ACTION } from '../../constants/constants'; import { TITLE_FOR_NON_ADMIN_ACTION } from '../../constants/constants';
@ -218,35 +217,43 @@ const GlossaryV1 = ({
const manageButtonContent = () => { const manageButtonContent = () => {
return ( return (
<div <Menu
className="tw-flex tw-items-center tw-gap-5 tw-p-1.5 tw-cursor-pointer" items={[
id="manage-button" {
onClick={() => setIsDelete(true)}> label: (
<div> <Space
<SVGIcons className="tw-cursor-pointer manage-button"
alt="Delete" size={8}
className="tw-w-12" onClick={(e) => {
icon={Icons.DELETE_GRADIANT} e.stopPropagation();
/> setIsDelete(true);
</div> setShowActions(false);
<div className="tw-text-left" data-testid="delete-button"> }}>
<p className="tw-font-medium"> <SVGIcons alt="Delete" icon={Icons.DELETE} />
Delete Glossary “{selectedData?.displayName || selectedData?.name}” <div className="tw-text-left" data-testid="delete-button">
</p> <p
<p className="tw-text-grey-muted tw-text-xs"> className="tw-font-medium"
Deleting this Glossary{' '} data-testid="delete-button-title">
{(selectedData as GlossaryTerm)?.glossary && 'Term'} will Delete
permanently remove its metadata from OpenMetadata. </p>
</p> <p className="tw-text-grey-muted tw-text-xs">
</div> Deleting this Glossary will permanently remove its metadata
</div> from OpenMetadata.
</p>
</div>
</Space>
),
key: 'delete-button',
},
]}
/>
); );
}; };
const fetchLeftPanel = () => { const fetchLeftPanel = () => {
return ( return (
<div className="tw-h-full tw-px-2" id="glossary-left-panel"> <div className="tw-h-full tw-px-1" id="glossary-left-panel">
<div className="tw-bg-white tw-shadow-box tw-border tw-border-border-gray tw-rounded-md tw-h-full tw-py-2"> <div className="tw-bg-white tw-h-full tw-py-2 left-panel-container">
<div className="tw-flex tw-justify-between tw-items-center tw-px-3"> <div className="tw-flex tw-justify-between tw-items-center tw-px-3">
<h6 className="tw-heading tw-text-base">Glossary</h6> <h6 className="tw-heading tw-text-base">Glossary</h6>
</div> </div>
@ -333,29 +340,27 @@ const GlossaryV1 = ({
</Button> </Button>
</NonAdminAction> </NonAdminAction>
<NonAdminAction position="bottom" title={TITLE_FOR_NON_ADMIN_ACTION}> <NonAdminAction position="bottom" title={TITLE_FOR_NON_ADMIN_ACTION}>
<Button <Dropdown
className="tw-h-8 tw-rounded tw-mb-1 tw-flex" align={{ targetOffset: [-12, 0] }}
data-testid="manage-button" overlay={manageButtonContent()}
disabled={isHasAccess} overlayStyle={{ width: '350px' }}
size="small" placement="bottomRight"
theme="primary" trigger={['click']}
variant="outlined" visible={showActions}
onClick={() => setShowActions(true)}> onVisibleChange={setShowActions}>
<span className="tw-mr-2">Manage</span> <Button
<Tooltip className="tw-rounded tw-flex tw-justify-center tw-w-8 tw-h-8 glossary-manage-button tw-mb-1 tw-flex"
arrow data-testid="manage-button"
arrowSize="big" disabled={isHasAccess}
disabled={!isAuthDisabled && !isAdminUser} size="small"
html={manageButtonContent()} theme="primary"
open={showActions} variant="outlined"
position="bottom-end" onClick={() => setShowActions(true)}>
theme="light"
onRequestClose={() => setShowActions(false)}>
<span> <span>
<FontAwesomeIcon icon="ellipsis-vertical" /> <FontAwesomeIcon icon="ellipsis-vertical" />
</span> </span>
</Tooltip> </Button>
</Button> </Dropdown>
</NonAdminAction> </NonAdminAction>
</div> </div>
</div> </div>

29
openmetadata-ui/src/main/resources/ui/src/components/Glossary/GlossaryV1.style.less
View File

@ -1,3 +1,9 @@
@box-shadow-color: rgba(0, 0, 0, 0.06);
@left-panel-border-color: rgb(229, 231, 235);
@manage-button-bg-primary: #7147e8;
@manage-dropdown-bg-primary: #d9ceee;
@white: #ffffff;
.display-name { .display-name {
.ant-typography { .ant-typography {
margin-bottom: 0; margin-bottom: 0;
@ -17,3 +23,26 @@
border-radius: 0.2rem; border-radius: 0.2rem;
margin-right: 0.3rem; margin-right: 0.3rem;
} }
.glossary-manage-button {
border: none;
background-color: @manage-dropdown-bg-primary;
}
.manage-button {
.ant-space-item:first-child {
width: 40px;
align-self: baseline;
}
}
.ant-dropdown-menu {
padding: 8px 0px;
background: @white;
border: 1px solid #dde3ea;
box-shadow: 1px 1px 3px rgb(0 0 0 / 12%);
border-radius: 4px;
.ant-dropdown-menu-item {
padding: 5px 16px;
}
}

87
openmetadata-ui/src/main/resources/ui/src/components/TeamDetails/TeamDetailsV1.tsx
View File

@ -28,7 +28,6 @@ import { cloneDeep, isEmpty, isUndefined, orderBy } from 'lodash';
import { ExtraInfo } from 'Models'; import { ExtraInfo } from 'Models';
import React, { Fragment, useEffect, useMemo, useState } from 'react'; import React, { Fragment, useEffect, useMemo, useState } from 'react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { Tooltip as TooltipTippy } from 'react-tippy';
import AppState from '../../AppState'; import AppState from '../../AppState';
import { import {
getTeamAndUserDetailsPath, getTeamAndUserDetailsPath,
@ -63,9 +62,9 @@ import { hasPemission } from '../../utils/PermissionsUtils';
import { getSettingPath, getTeamsWithFqnPath } from '../../utils/RouterUtils'; import { getSettingPath, getTeamsWithFqnPath } from '../../utils/RouterUtils';
import SVGIcons, { Icons } from '../../utils/SvgUtils'; import SVGIcons, { Icons } from '../../utils/SvgUtils';
import { Button } from '../buttons/Button/Button'; import { Button } from '../buttons/Button/Button';
import DeleteWidgetModal from '../common/DeleteWidget/DeleteWidgetModal';
import Description from '../common/description/Description'; import Description from '../common/description/Description';
import Ellipses from '../common/Ellipses/Ellipses'; import Ellipses from '../common/Ellipses/Ellipses';
import ManageButton from '../common/entityPageInfo/ManageButton/ManageButton';
import EntitySummaryDetails from '../common/EntitySummaryDetails/EntitySummaryDetails'; import EntitySummaryDetails from '../common/EntitySummaryDetails/EntitySummaryDetails';
import ErrorPlaceHolder from '../common/error-with-placeholder/ErrorPlaceHolder'; import ErrorPlaceHolder from '../common/error-with-placeholder/ErrorPlaceHolder';
import NextPrevious from '../common/next-previous/NextPrevious'; import NextPrevious from '../common/next-previous/NextPrevious';
@ -121,8 +120,6 @@ const TeamDetailsV1 = ({
state: boolean; state: boolean;
leave: boolean; leave: boolean;
}>(DELETE_USER_INITIAL_STATE); }>(DELETE_USER_INITIAL_STATE);
const [showAction, setShowAction] = useState(false);
const [isDelete, setIsDelete] = useState<boolean>(false);
const [searchTerm, setSearchTerm] = useState(''); const [searchTerm, setSearchTerm] = useState('');
const [table, setTable] = useState<Team[]>([]); const [table, setTable] = useState<Team[]>([]);
const [slashedDatabaseName, setSlashedDatabaseName] = useState< const [slashedDatabaseName, setSlashedDatabaseName] = useState<
@ -212,15 +209,15 @@ const TeamDetailsV1 = ({
render: (_, record) => ( render: (_, record) => (
<Space <Space
align="center" align="center"
className="tw-w-full tw-justify-center" className="tw-w-full tw-justify-center remove-icon"
size={8}> size={8}>
<Tooltip placement="bottom" title="Remove"> <Tooltip placement="bottom" title="Remove">
<ButtonAntd <ButtonAntd
icon={ icon={
<SVGIcons <SVGIcons
alt="Remove" alt="Remove"
className="tw-w-4" className="tw-w-4 tw-mb-2.5"
icon={Icons.DELETE} icon={Icons.ICON_REMOVE}
/> />
} }
type="text" type="text"
@ -231,33 +228,7 @@ const TeamDetailsV1 = ({
), ),
}, },
]; ];
}, []); }, [deleteUserHandler]);
const manageButtonContent = () => {
return (
<div
className="tw-flex tw-items-center tw-gap-5 tw-p-1.5 tw-cursor-pointer"
id="manage-button"
onClick={() => setIsDelete(true)}>
<div>
<SVGIcons
alt="Delete"
className="tw-w-12"
icon={Icons.DELETE_GRADIANT}
/>
</div>
<div className="tw-text-left" data-testid="delete-button">
<p className="tw-font-medium">
Delete Team “{getEntityName(currentTeam)}”
</p>
<p className="tw-text-grey-muted tw-text-xs">
Deleting this Team {getEntityName(currentTeam)} will permanently
remove its metadata from OpenMetadata.
</p>
</div>
</div>
);
};
const extraInfo: ExtraInfo = { const extraInfo: ExtraInfo = {
key: 'Owner', key: 'Owner',
@ -589,7 +560,7 @@ const TeamDetailsV1 = ({
return alreadyJoined ? ( return alreadyJoined ? (
isJoinable || hasAccess ? ( isJoinable || hasAccess ? (
<Button <Button
className="tw-h-8 tw-px-2 tw-mb-4 tw-ml-2" className="tw-h-8 tw-px-2"
data-testid="join-teams" data-testid="join-teams"
size="small" size="small"
theme="primary" theme="primary"
@ -600,7 +571,7 @@ const TeamDetailsV1 = ({
) : null ) : null
) : ( ) : (
<Button <Button
className="tw-h-8 tw-rounded tw-ml-2" className="tw-h-8 tw-rounded"
data-testid="leave-team-button" data-testid="leave-team-button"
size="small" size="small"
theme="primary" theme="primary"
@ -720,7 +691,7 @@ const TeamDetailsV1 = ({
className="tw-flex tw-justify-between tw-items-center" className="tw-flex tw-justify-between tw-items-center"
data-testid="header"> data-testid="header">
{getTeamHeading()} {getTeamHeading()}
<div className="tw-flex"> <Space align="center">
{!isUndefined(currentUser) && {!isUndefined(currentUser) &&
teamActionButton( teamActionButton(
!isAlreadyJoinedTeam(currentTeam.id), !isAlreadyJoinedTeam(currentTeam.id),
@ -729,30 +700,17 @@ const TeamDetailsV1 = ({
<NonAdminAction <NonAdminAction
position="bottom" position="bottom"
title={TITLE_FOR_NON_ADMIN_ACTION}> title={TITLE_FOR_NON_ADMIN_ACTION}>
<Button <ManageButton
className="tw-h-8 tw-rounded tw-mb-1 tw-ml-2 tw-flex" afterDeleteAction={afterDeleteAction}
data-testid="manage-button" buttonClassName="tw-p-4"
disabled={!hasAccess} entityId={currentTeam.id}
size="small" entityName={
theme="primary" currentTeam.fullyQualifiedName || currentTeam.name
variant="outlined" }
onClick={() => setIsDelete(true)}> entityType="team"
<TooltipTippy />
arrow
arrowSize="big"
disabled={!hasAccess}
html={manageButtonContent()}
open={showAction}
position="bottom-end"
theme="light"
onRequestClose={() => setShowAction(false)}>
<span>
<FontAwesomeIcon icon="ellipsis-vertical" />
</span>
</TooltipTippy>
</Button>
</NonAdminAction> </NonAdminAction>
</div> </Space>
</div> </div>
<div className="tw-mb-3"> <div className="tw-mb-3">
<Switch <Switch
@ -857,15 +815,6 @@ const TeamDetailsV1 = ({
onConfirm={handleRemoveUser} onConfirm={handleRemoveUser}
/> />
)} )}
<DeleteWidgetModal
afterDeleteAction={afterDeleteAction}
entityId={currentTeam.id}
entityName={currentTeam.fullyQualifiedName || currentTeam.name}
entityType="team"
visible={isDelete}
onCancel={() => setIsDelete(false)}
/>
</div> </div>
); );
}; };

7
openmetadata-ui/src/main/resources/ui/src/components/TeamDetails/teams.less
View File

@ -23,3 +23,10 @@
padding-left: 16px; padding-left: 16px;
} }
} }
.remove-icon {
.ant-btn {
height: 22px;
width: 22px;
}
}

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

@ -136,7 +136,7 @@ const UserListV1: FC<UserListV1Props> = ({
render: (_, record) => ( render: (_, record) => (
<Space <Space
align="center" align="center"
className="tw-w-full tw-justify-center" className="tw-w-full tw-justify-center action-icons"
size={8}> size={8}>
{showRestore && ( {showRestore && (
<Tooltip placement="bottom" title="Restore"> <Tooltip placement="bottom" title="Restore">
@ -144,7 +144,7 @@ const UserListV1: FC<UserListV1Props> = ({
icon={ icon={
<SVGIcons <SVGIcons
alt="Restore" alt="Restore"
className="tw-w-4" className="tw-w-4 tw-mb-2.5"
icon={Icons.RESTORE} icon={Icons.RESTORE}
/> />
} }
@ -161,7 +161,7 @@ const UserListV1: FC<UserListV1Props> = ({
icon={ icon={
<SVGIcons <SVGIcons
alt="Delete" alt="Delete"
className="tw-w-4" className="tw-w-4 tw-mb-2.5"
icon={Icons.DELETE} icon={Icons.DELETE}
/> />
} }

7
openmetadata-ui/src/main/resources/ui/src/components/UserList/usersList.less
View File

@ -24,3 +24,10 @@
} }
} }
} }
.action-icons {
.ant-btn {
height: 20px;
width: 20px;
}
}

5
openmetadata-ui/src/main/resources/ui/src/components/common/EntitySummaryDetails/EntitySummaryDetails.style.less Normal file
View File

@ -0,0 +1,5 @@
.entity-summary-details {
.ant-space-item {
position: relative;
}
}

7
openmetadata-ui/src/main/resources/ui/src/components/common/EntitySummaryDetails/EntitySummaryDetails.tsx
View File

@ -12,6 +12,7 @@ import { Button } from '../../buttons/Button/Button';
import OwnerWidgetWrapper from '../OwnerWidget/OwnerWidgetWrapper.component'; import OwnerWidgetWrapper from '../OwnerWidget/OwnerWidgetWrapper.component';
import ProfilePicture from '../ProfilePicture/ProfilePicture'; import ProfilePicture from '../ProfilePicture/ProfilePicture';
import TierCard from '../TierCard/TierCard'; import TierCard from '../TierCard/TierCard';
import './EntitySummaryDetails.style.less';
export interface GetInfoElementsProps { export interface GetInfoElementsProps {
data: ExtraInfo; data: ExtraInfo;
@ -151,7 +152,10 @@ const EntitySummaryDetails = ({
} }
return ( return (
<Space data-testid="entity-summary-details" direction="horizontal"> <Space
className="entity-summary-details"
data-testid="entity-summary-details"
direction="horizontal">
{retVal} {retVal}
{displayVal && ( {displayVal && (
<> <>
@ -254,6 +258,7 @@ const EntitySummaryDetails = ({
updateTier={updateTier} updateTier={updateTier}
/> />
} }
placement="bottomRight"
trigger={['click']}> trigger={['click']}>
<span <span
className="tw-flex" className="tw-flex"

4
openmetadata-ui/src/main/resources/ui/src/components/common/OwnerWidget/OwnerWidgetWrapper.component.tsx
View File

@ -12,7 +12,7 @@ import {
} from '../../../utils/UserDataUtils'; } from '../../../utils/UserDataUtils';
import DropDownList from '../../dropdown/DropDownList'; import DropDownList from '../../dropdown/DropDownList';
import { Status } from '../../ManageTab/ManageTab.interface'; import { Status } from '../../ManageTab/ManageTab.interface';
import './OwnerWidgetWrapper.module.css'; import './OwnerWidgetWrapper.style.less';
interface OwnerWidgetWrapperProps { interface OwnerWidgetWrapperProps {
currentOwner?: Table['owner']; currentOwner?: Table['owner'];
@ -160,7 +160,7 @@ const OwnerWidgetWrapper = ({
return visible ? ( return visible ? (
<DropDownList <DropDownList
className="dropdown" className="edit-owner-dropdown"
dropDownList={listOwners} dropDownList={listOwners}
groupType="tab" groupType="tab"
isLoading={isUserLoading} isLoading={isUserLoading}

3
openmetadata-ui/src/main/resources/ui/src/components/common/OwnerWidget/OwnerWidgetWrapper.module.css
View File

@ -1,3 +0,0 @@
.dropdown {
left: auto !important;
}

4
openmetadata-ui/src/main/resources/ui/src/components/common/OwnerWidget/OwnerWidgetWrapper.style.less Normal file
View File

@ -0,0 +1,4 @@
.dropdown-list.edit-owner-dropdown {
left: -120px;
top: 20px;
}

11
openmetadata-ui/src/main/resources/ui/src/components/common/entityPageInfo/ManageButton/ManageButton.tsx
View File

@ -13,6 +13,7 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { Button, Dropdown, Menu, Space } from 'antd'; import { Button, Dropdown, Menu, Space } from 'antd';
import classNames from 'classnames';
import React, { FC, useState } from 'react'; import React, { FC, useState } from 'react';
import { EntityType } from '../../../../enums/entity.enum'; import { EntityType } from '../../../../enums/entity.enum';
import { ANNOUNCEMENT_ENTITIES } from '../../../../utils/AnnouncementsUtils'; import { ANNOUNCEMENT_ENTITIES } from '../../../../utils/AnnouncementsUtils';
@ -22,6 +23,8 @@ import './ManageButton.less';
interface Props { interface Props {
allowSoftDelete?: boolean; allowSoftDelete?: boolean;
afterDeleteAction?: () => void;
buttonClassName?: string;
entityName: string; entityName: string;
entityId?: string; entityId?: string;
entityType?: string; entityType?: string;
@ -33,6 +36,8 @@ interface Props {
const ManageButton: FC<Props> = ({ const ManageButton: FC<Props> = ({
allowSoftDelete, allowSoftDelete,
afterDeleteAction,
buttonClassName,
deleteMessage, deleteMessage,
entityName, entityName,
entityType, entityType,
@ -116,7 +121,10 @@ const ManageButton: FC<Props> = ({
visible={showActions} visible={showActions}
onVisibleChange={setShowActions}> onVisibleChange={setShowActions}>
<Button <Button
className="tw-rounded tw-flex tw-justify-center tw-w-6 manage-dropdown-button" className={classNames(
'tw-rounded tw-flex tw-justify-center tw-w-6 manage-dropdown-button',
buttonClassName
)}
data-testid="manage-button" data-testid="manage-button"
size="small" size="small"
type="default" type="default"
@ -129,6 +137,7 @@ const ManageButton: FC<Props> = ({
</Dropdown> </Dropdown>
{isDelete && ( {isDelete && (
<DeleteWidgetModal <DeleteWidgetModal
afterDeleteAction={afterDeleteAction}
allowSoftDelete={allowSoftDelete} allowSoftDelete={allowSoftDelete}
deleteMessage={deleteMessage} deleteMessage={deleteMessage}
entityId={entityId || ''} entityId={entityId || ''}

8
openmetadata-ui/src/main/resources/ui/src/constants/constants.ts
View File

@ -444,6 +444,14 @@ export const getCreateUserPath = (bot: boolean) => {
return path; return path;
}; };
export const getUsersPagePath = () => {
return `${ROUTES.SETTINGS}/${GlobalSettingsMenuCategory.MEMBERS}/users`;
};
export const getBotsPagePath = () => {
return `${ROUTES.SETTINGS}/${GlobalSettingsMenuCategory.INTEGRATIONS}/bots`;
};
export const TIMEOUT = { export const TIMEOUT = {
USER_LIST: 60000, // 60 seconds for user retrieval USER_LIST: 60000, // 60 seconds for user retrieval
TOAST_DELAY: 5000, // 5 seconds timeout for toaster autohide delay TOAST_DELAY: 5000, // 5 seconds timeout for toaster autohide delay