mirror of
https://github.com/open-metadata/OpenMetadata.git
synced 2025-11-02 11:39:12 +00:00
chore(ui): move persona as top level settings (#18171)
* chore(ui): pull persona as top level settings * fix tests * update breadcrumbs * add missing type * fix ui tests * fix settings router tests
This commit is contained in:
parent
6098a34687
commit
737c076999
@ -147,10 +147,7 @@ export const SETTINGS_OPTIONS_PATH = {
|
||||
GlobalSettingsMenuCategory.MEMBERS,
|
||||
`${GlobalSettingsMenuCategory.MEMBERS}.${GlobalSettingOptions.ADMINS}`,
|
||||
],
|
||||
[GlobalSettingOptions.PERSONA]: [
|
||||
GlobalSettingsMenuCategory.MEMBERS,
|
||||
`${GlobalSettingsMenuCategory.MEMBERS}.${GlobalSettingOptions.PERSONA}`,
|
||||
],
|
||||
[GlobalSettingOptions.PERSONA]: [GlobalSettingOptions.PERSONA],
|
||||
|
||||
// Access Control
|
||||
|
||||
@ -165,10 +162,6 @@ export const SETTINGS_OPTIONS_PATH = {
|
||||
|
||||
// Open-metadata
|
||||
|
||||
[GlobalSettingOptions.CUSTOMIZE_LANDING_PAGE]: [
|
||||
GlobalSettingsMenuCategory.PREFERENCES,
|
||||
`${GlobalSettingsMenuCategory.PREFERENCES}.${GlobalSettingOptions.CUSTOMIZE_LANDING_PAGE}`,
|
||||
],
|
||||
[GlobalSettingOptions.EMAIL]: [
|
||||
GlobalSettingsMenuCategory.PREFERENCES,
|
||||
`${GlobalSettingsMenuCategory.PREFERENCES}.${GlobalSettingOptions.EMAIL}`,
|
||||
|
||||
@ -102,15 +102,7 @@ test.describe.serial('Persona operations', () => {
|
||||
// Verify created persona details
|
||||
|
||||
await expect(
|
||||
page
|
||||
.getByTestId('persona-details-card')
|
||||
.getByText(PERSONA_DETAILS.displayName)
|
||||
).toBeVisible();
|
||||
|
||||
await expect(
|
||||
page
|
||||
.getByTestId('persona-details-card')
|
||||
.getByText(PERSONA_DETAILS.description)
|
||||
page.getByTestId(`persona-details-card-${PERSONA_DETAILS.name}`)
|
||||
).toBeVisible();
|
||||
|
||||
const personaResponse = page.waitForResponse(
|
||||
@ -120,8 +112,7 @@ test.describe.serial('Persona operations', () => {
|
||||
);
|
||||
|
||||
await page
|
||||
.locator('[data-testid="persona-details-card"]')
|
||||
.getByText(PERSONA_DETAILS.displayName)
|
||||
.getByTestId(`persona-details-card-${PERSONA_DETAILS.name}`)
|
||||
.click();
|
||||
|
||||
await personaResponse;
|
||||
@ -153,8 +144,7 @@ test.describe.serial('Persona operations', () => {
|
||||
page,
|
||||
}) => {
|
||||
await page
|
||||
.locator('[data-testid="persona-details-card"]')
|
||||
.getByText(PERSONA_DETAILS.displayName)
|
||||
.getByTestId(`persona-details-card-${PERSONA_DETAILS.name}`)
|
||||
.click();
|
||||
|
||||
await page.getByTestId('edit-description').click();
|
||||
@ -180,9 +170,7 @@ test.describe.serial('Persona operations', () => {
|
||||
|
||||
test('Persona rename flow should work properly', async ({ page }) => {
|
||||
await page
|
||||
.locator('[data-testid="persona-details-card"]')
|
||||
.getByText(PERSONA_DETAILS.displayName)
|
||||
|
||||
.getByTestId(`persona-details-card-${PERSONA_DETAILS.name}`)
|
||||
.click();
|
||||
|
||||
await updatePersonaDisplayName({ page, displayName: 'Test Persona' });
|
||||
@ -203,8 +191,7 @@ test.describe.serial('Persona operations', () => {
|
||||
|
||||
test('Remove users in persona should work properly', async ({ page }) => {
|
||||
await page
|
||||
.locator('[data-testid="persona-details-card"]')
|
||||
.getByText(PERSONA_DETAILS.displayName)
|
||||
.getByTestId(`persona-details-card-${PERSONA_DETAILS.name}`)
|
||||
.click();
|
||||
|
||||
await page
|
||||
@ -231,8 +218,7 @@ test.describe.serial('Persona operations', () => {
|
||||
|
||||
test('Delete persona should work properly', async ({ page }) => {
|
||||
await page
|
||||
.locator('[data-testid="persona-details-card"]')
|
||||
.getByText(PERSONA_DETAILS.displayName)
|
||||
.getByTestId(`persona-details-card-${PERSONA_DETAILS.name}`)
|
||||
.click();
|
||||
|
||||
await page.click('[data-testid="manage-button"]');
|
||||
|
||||
@ -21,7 +21,7 @@ export const navigateToCustomizeLandingPage = async (
|
||||
) => {
|
||||
const getPersonas = page.waitForResponse('/api/v1/personas*');
|
||||
|
||||
await settingClick(page, GlobalSettingOptions.CUSTOMIZE_LANDING_PAGE);
|
||||
await settingClick(page, GlobalSettingOptions.PERSONA);
|
||||
|
||||
await getPersonas;
|
||||
|
||||
@ -32,9 +32,11 @@ export const navigateToCustomizeLandingPage = async (
|
||||
);
|
||||
|
||||
// Navigate to the customize landing page
|
||||
await page.click(
|
||||
`[data-testid="persona-details-card-${personaName}"] [data-testid="customize-page-button"]`
|
||||
);
|
||||
await page.getByTestId(`persona-details-card-${personaName}`).click();
|
||||
|
||||
await page.getByRole('tab', { name: 'Customize UI' }).click();
|
||||
|
||||
await page.getByTestId('LandingPage').click();
|
||||
|
||||
expect((await getCustomPageDataResponse).status()).toBe(
|
||||
customPageDataResponse
|
||||
|
||||
@ -412,7 +412,7 @@ describe('SettingsRouter', () => {
|
||||
|
||||
it('should render PersonaPage component for persona list route', async () => {
|
||||
render(
|
||||
<MemoryRouter initialEntries={[`/settings/members/persona`]}>
|
||||
<MemoryRouter initialEntries={[`/settings/persona`]}>
|
||||
<SettingsRouter />
|
||||
</MemoryRouter>
|
||||
);
|
||||
@ -422,7 +422,7 @@ describe('SettingsRouter', () => {
|
||||
|
||||
it('should render PersonaDetailsPage component for persona details route', async () => {
|
||||
render(
|
||||
<MemoryRouter initialEntries={[`/settings/members/persona/testPersona`]}>
|
||||
<MemoryRouter initialEntries={[`/settings/persona/testPersona`]}>
|
||||
<SettingsRouter />
|
||||
</MemoryRouter>
|
||||
);
|
||||
|
||||
@ -160,6 +160,12 @@ const SettingsRouter = () => {
|
||||
|
||||
{/* Setting Page Routes with categories */}
|
||||
|
||||
<AdminProtectedRoute
|
||||
exact
|
||||
component={PersonaPage}
|
||||
path={getSettingPath(GlobalSettingOptions.PERSONA)}
|
||||
/>
|
||||
|
||||
<Route
|
||||
exact
|
||||
component={GlobalSettingCategoryPage}
|
||||
@ -203,22 +209,10 @@ const SettingsRouter = () => {
|
||||
)}>
|
||||
<Redirect to={getTeamsWithFqnPath(TeamType.Organization)} />
|
||||
</Route>
|
||||
<AdminProtectedRoute
|
||||
exact
|
||||
component={PersonaPage}
|
||||
path={getSettingPath(
|
||||
GlobalSettingsMenuCategory.MEMBERS,
|
||||
GlobalSettingOptions.PERSONA
|
||||
)}
|
||||
/>
|
||||
<AdminProtectedRoute
|
||||
exact
|
||||
component={PersonaDetailsPage}
|
||||
path={getSettingPath(
|
||||
GlobalSettingsMenuCategory.MEMBERS,
|
||||
GlobalSettingOptions.PERSONA,
|
||||
true
|
||||
)}
|
||||
path={getSettingPath(GlobalSettingOptions.PERSONA, '', true)}
|
||||
/>
|
||||
{/* Roles route start
|
||||
* Do not change the order of these route
|
||||
|
||||
@ -48,7 +48,9 @@ describe('PersonaDetailsCard Component', () => {
|
||||
});
|
||||
|
||||
expect(
|
||||
await screen.findByTestId('persona-details-card')
|
||||
await screen.findByTestId(
|
||||
`persona-details-card-${personaWithDescription.name}`
|
||||
)
|
||||
).toBeInTheDocument();
|
||||
});
|
||||
|
||||
@ -81,7 +83,7 @@ describe('PersonaDetailsCard Component', () => {
|
||||
userEvent.click(personaCardTitle);
|
||||
});
|
||||
|
||||
expect(mockPush).toHaveBeenCalledWith('/settings/members/persona/john-doe');
|
||||
expect(mockPush).toHaveBeenCalledWith('/settings/persona/john-doe');
|
||||
});
|
||||
|
||||
it('should not navigate when persona.fullyQualifiedName is missing', async () => {
|
||||
|
||||
@ -37,7 +37,7 @@ export const PersonaDetailsCard = ({ persona }: PersonaDetailsCardProps) => {
|
||||
<Card
|
||||
bodyStyle={{ height: '100%' }}
|
||||
className="h-full cursor-pointer"
|
||||
data-testid="persona-details-card"
|
||||
data-testid={`persona-details-card-${persona.name}`}
|
||||
onClick={handleCardClick}>
|
||||
<Space className="justify-between h-full" direction="vertical">
|
||||
<Card.Meta
|
||||
|
||||
@ -22,6 +22,7 @@ export enum GlobalSettingsMenuCategory {
|
||||
SERVICES = 'services',
|
||||
BOTS = 'bots',
|
||||
APPLICATIONS = 'apps',
|
||||
PERSONA = 'persona',
|
||||
}
|
||||
|
||||
export enum GlobalSettingOptions {
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "Custom Theme",
|
||||
"customise": "Customise",
|
||||
"customize-entity": "Customize {{entity}}",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "DAG",
|
||||
"dag-view": "DAG-Ansicht",
|
||||
"daily-active-users-on-the-platform": "Täglich aktive Benutzer auf der Plattform",
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "Custom Theme",
|
||||
"customise": "Customise",
|
||||
"customize-entity": "Customize {{entity}}",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "Dag",
|
||||
"dag-view": "DAG view",
|
||||
"daily-active-users-on-the-platform": "Daily Active Users on the Platform",
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "Custom Theme",
|
||||
"customise": "Personalizar",
|
||||
"customize-entity": "Personalizar {{entity}}",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "DAG",
|
||||
"dag-view": "Vista DAG",
|
||||
"daily-active-users-on-the-platform": "Usuarios activos diarios en la plataforma",
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "Thème personnalisé",
|
||||
"customise": "Personnaliser",
|
||||
"customize-entity": "Personnaliser {{entity}}",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "DAG",
|
||||
"dag-view": "Vue DAG",
|
||||
"daily-active-users-on-the-platform": "Utilisateurs Actifs Quotidiens sur la Plateforme",
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "Custom Theme",
|
||||
"customise": "התאמה אישית",
|
||||
"customize-entity": "התאם אישית את {{entity}}",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "גרף מופע",
|
||||
"dag-view": "תצוגת גרף מופע",
|
||||
"daily-active-users-on-the-platform": "משתמשים פעילים יומיים בפלטפורמה",
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "Custom Theme",
|
||||
"customise": "Customise",
|
||||
"customize-entity": "Customize {{entity}}",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "Dag",
|
||||
"dag-view": "DAGビュー",
|
||||
"daily-active-users-on-the-platform": "このプラットフォームのアクティブなユーザー",
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "Custom Theme",
|
||||
"customise": "Aanpassen",
|
||||
"customize-entity": "{{entity}} aanpassen",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "Dag",
|
||||
"dag-view": "DAG-weergave",
|
||||
"daily-active-users-on-the-platform": "Dagelijks actieve gebruikers op het platform",
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "تم سفارشی",
|
||||
"customise": "سفارشیسازی",
|
||||
"customize-entity": "سفارشیسازی {{entity}}",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "دگ",
|
||||
"dag-view": "نمای دگ",
|
||||
"daily-active-users-on-the-platform": "کاربران فعال روزانه در پلتفرم",
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "Custom Theme",
|
||||
"customise": "Personalizar",
|
||||
"customize-entity": "Personalizar {{entity}}",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "DAG",
|
||||
"dag-view": "Visualização DAG",
|
||||
"daily-active-users-on-the-platform": "Usuários Ativos Diários na Plataforma",
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "Custom Theme",
|
||||
"customise": "Customise",
|
||||
"customize-entity": "Customize {{entity}}",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "Dag",
|
||||
"dag-view": "Просмотр DAG",
|
||||
"daily-active-users-on-the-platform": "Количество активных пользователей на платформе",
|
||||
|
||||
@ -247,6 +247,7 @@
|
||||
"custom-theme": "自定义主题",
|
||||
"customise": "自定义",
|
||||
"customize-entity": "自定义{{entity}}",
|
||||
"customize-ui": "Customize UI",
|
||||
"dag": "DAG",
|
||||
"dag-view": "DAG 视图",
|
||||
"daily-active-users-on-the-platform": "平台上的每日活跃用户",
|
||||
|
||||
@ -18,6 +18,7 @@ import { isUndefined } from 'lodash';
|
||||
import React, { useCallback, useEffect, useMemo, useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useHistory } from 'react-router-dom';
|
||||
import { ReactComponent as CustomDashboardLogoIcon } from '../../../assets/svg/customize-landing-page-colored.svg';
|
||||
import { ReactComponent as IconPersona } from '../../../assets/svg/ic-personas.svg';
|
||||
import DescriptionV1 from '../../../components/common/EntityDescription/DescriptionV1';
|
||||
import ManageButton from '../../../components/common/EntityPageInfos/ManageButton/ManageButton';
|
||||
@ -28,6 +29,7 @@ import { UserSelectableList } from '../../../components/common/UserSelectableLis
|
||||
import EntityHeaderTitle from '../../../components/Entity/EntityHeaderTitle/EntityHeaderTitle.component';
|
||||
import { EntityName } from '../../../components/Modals/EntityNameModal/EntityNameModal.interface';
|
||||
import PageLayoutV1 from '../../../components/PageLayoutV1/PageLayoutV1';
|
||||
import SettingItemCard from '../../../components/Settings/SettingItemCard/SettingItemCard.component';
|
||||
import { UsersTab } from '../../../components/Settings/Users/UsersTab/UsersTabs.component';
|
||||
import {
|
||||
GlobalSettingOptions,
|
||||
@ -38,9 +40,11 @@ import { ResourceEntity } from '../../../context/PermissionProvider/PermissionPr
|
||||
import { SIZE } from '../../../enums/common.enum';
|
||||
import { EntityType } from '../../../enums/entity.enum';
|
||||
import { Persona } from '../../../generated/entity/teams/persona';
|
||||
import { PageType } from '../../../generated/system/ui/page';
|
||||
import { useFqn } from '../../../hooks/useFqn';
|
||||
import { getPersonaByName, updatePersona } from '../../../rest/PersonaAPI';
|
||||
import { getEntityName } from '../../../utils/EntityUtils';
|
||||
import { getCustomizePagePath } from '../../../utils/GlobalSettingsUtils';
|
||||
import { DEFAULT_ENTITY_PERMISSION } from '../../../utils/PermissionsUtils';
|
||||
import { getSettingPath } from '../../../utils/RouterUtils';
|
||||
import { showErrorToast } from '../../../utils/ToastUtils';
|
||||
@ -172,6 +176,15 @@ export const PersonaDetailsPage = () => {
|
||||
);
|
||||
};
|
||||
|
||||
const handleCustomizeItemClick = (category: string) => {
|
||||
history.push(
|
||||
getCustomizePagePath(
|
||||
personaDetails?.fullyQualifiedName as string,
|
||||
category as PageType
|
||||
)
|
||||
);
|
||||
};
|
||||
|
||||
if (isLoading) {
|
||||
return <Loader />;
|
||||
}
|
||||
@ -232,7 +245,7 @@ export const PersonaDetailsPage = () => {
|
||||
defaultActiveKey="users"
|
||||
items={[
|
||||
{
|
||||
label: 'Users',
|
||||
label: t('label.user-plural'),
|
||||
key: 'users',
|
||||
children: (
|
||||
<UsersTab
|
||||
@ -241,6 +254,29 @@ export const PersonaDetailsPage = () => {
|
||||
/>
|
||||
),
|
||||
},
|
||||
{
|
||||
label: t('label.customize-ui'),
|
||||
key: 'customize-ui',
|
||||
children: (
|
||||
<Row gutter={[16, 16]}>
|
||||
<Col span={8}>
|
||||
<SettingItemCard
|
||||
data={{
|
||||
label: t('label.customize-entity', {
|
||||
entity: t('label.landing-page'),
|
||||
}),
|
||||
description: t(
|
||||
'message.page-sub-header-for-customize-landing-page'
|
||||
),
|
||||
key: PageType.LandingPage,
|
||||
icon: CustomDashboardLogoIcon,
|
||||
}}
|
||||
onClick={handleCustomizeItemClick}
|
||||
/>
|
||||
</Col>
|
||||
</Row>
|
||||
),
|
||||
},
|
||||
]}
|
||||
tabBarExtraContent={
|
||||
<UserSelectableList
|
||||
|
||||
@ -55,11 +55,7 @@ export const PersonaPage = () => {
|
||||
} = usePaging();
|
||||
|
||||
const breadcrumbs: TitleBreadcrumbProps['titleLinks'] = useMemo(
|
||||
() =>
|
||||
getSettingPageEntityBreadCrumb(
|
||||
GlobalSettingsMenuCategory.MEMBERS,
|
||||
t('label.persona-plural')
|
||||
),
|
||||
() => getSettingPageEntityBreadCrumb(GlobalSettingsMenuCategory.PERSONA),
|
||||
[]
|
||||
);
|
||||
|
||||
|
||||
@ -17,7 +17,6 @@ import { ReactComponent as AdminIcon } from '../assets/svg/admin-colored.svg';
|
||||
import { ReactComponent as ApplicationIcon } from '../assets/svg/application-colored.svg';
|
||||
import { ReactComponent as BotIcon } from '../assets/svg/bot-colored.svg';
|
||||
import { ReactComponent as AppearanceIcon } from '../assets/svg/custom-logo-colored.svg';
|
||||
import { ReactComponent as CustomDashboardLogoIcon } from '../assets/svg/customize-landing-page-colored.svg';
|
||||
import { ReactComponent as DashboardIcon } from '../assets/svg/dashboard-colored.svg';
|
||||
import { ReactComponent as DatabaseIcon } from '../assets/svg/database-colored.svg';
|
||||
import { ReactComponent as EmailIcon } from '../assets/svg/email-colored.svg';
|
||||
@ -95,6 +94,10 @@ class GlobalSettingsClassBase {
|
||||
name: t('label.application-plural'),
|
||||
url: GlobalSettingsMenuCategory.APPLICATIONS,
|
||||
},
|
||||
[GlobalSettingsMenuCategory.PERSONA]: {
|
||||
name: t('label.persona'),
|
||||
url: GlobalSettingsMenuCategory.PERSONA,
|
||||
},
|
||||
};
|
||||
|
||||
protected updateSettingCategories(
|
||||
@ -266,14 +269,6 @@ class GlobalSettingsClassBase {
|
||||
key: `${GlobalSettingsMenuCategory.MEMBERS}.${GlobalSettingOptions.ADMINS}`,
|
||||
icon: AdminIcon,
|
||||
},
|
||||
|
||||
{
|
||||
label: t('label.persona-plural'),
|
||||
description: t('message.page-sub-header-for-persona'),
|
||||
isProtected: Boolean(isAdminUser),
|
||||
key: `${GlobalSettingsMenuCategory.MEMBERS}.${GlobalSettingOptions.PERSONA}`,
|
||||
icon: PersonasIcon,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
@ -311,17 +306,6 @@ class GlobalSettingsClassBase {
|
||||
key: `${GlobalSettingsMenuCategory.PREFERENCES}.${GlobalSettingOptions.APPEARANCE}`,
|
||||
icon: AppearanceIcon,
|
||||
},
|
||||
{
|
||||
label: t('label.customize-entity', {
|
||||
entity: t('label.landing-page'),
|
||||
}),
|
||||
description: t(
|
||||
'message.page-sub-header-for-customize-landing-page'
|
||||
),
|
||||
isProtected: Boolean(isAdminUser),
|
||||
key: `${GlobalSettingsMenuCategory.PREFERENCES}.${GlobalSettingOptions.CUSTOMIZE_LANDING_PAGE}`,
|
||||
icon: CustomDashboardLogoIcon,
|
||||
},
|
||||
{
|
||||
label: t('label.email'),
|
||||
description: t('message.email-configuration-message'),
|
||||
@ -515,6 +499,13 @@ class GlobalSettingsClassBase {
|
||||
key: GlobalSettingOptions.BOTS,
|
||||
icon: BotIcon,
|
||||
},
|
||||
{
|
||||
category: t('label.persona-plural'),
|
||||
description: t('message.page-sub-header-for-persona'),
|
||||
isProtected: Boolean(isAdminUser),
|
||||
key: GlobalSettingOptions.PERSONA,
|
||||
icon: PersonasIcon,
|
||||
},
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
@ -569,11 +569,10 @@ export const getClassificationVersionsPath = (
|
||||
};
|
||||
|
||||
export const getPersonaDetailsPath = (fqn: string) => {
|
||||
let path = ROUTES.SETTINGS_WITH_TAB_FQN;
|
||||
let path = ROUTES.SETTINGS_WITH_CATEGORY_FQN;
|
||||
|
||||
path = path
|
||||
.replace(PLACEHOLDER_SETTING_CATEGORY, GlobalSettingsMenuCategory.MEMBERS)
|
||||
.replace(PLACEHOLDER_ROUTE_TAB, GlobalSettingOptions.PERSONA)
|
||||
.replace(PLACEHOLDER_SETTING_CATEGORY, GlobalSettingOptions.PERSONA)
|
||||
.replace(PLACEHOLDER_ROUTE_FQN, getEncodedFqn(fqn));
|
||||
|
||||
return path;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user