mirror of
https://github.com/open-metadata/OpenMetadata.git
synced 2025-08-27 18:36:08 +00:00
UI : Added header and sub-headers for the page (#9378)
* Added subheaders for the page * remove header from team and change setting button * changes as per comments
This commit is contained in:
Ashish Gupta
GitHub
parent
bac86cba69
commit
ba0f55d7c3
@ -1,4 +1,12 @@
|
||||
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8.47068 15.5H7.52929C6.76789 15.5 6.14841 14.8805 6.14841 14.1192V13.8007C5.82471 13.6972 5.5102 13.5667 5.20807 13.4103L4.98236 13.636C4.43571 14.1834 3.56006 14.1673 3.02929 13.6358L2.36393 12.9705C1.83222 12.4394 1.81692 11.564 2.3641 11.0174L2.58963 10.7919C2.43327 10.4898 2.30275 10.1753 2.19931 9.85156H1.88085C1.11948 9.85156 0.5 9.23211 0.5 8.47071V7.52929C0.5 6.76789 1.11948 6.14844 1.88088 6.14844H2.19934C2.30278 5.82471 2.4333 5.51023 2.58966 5.2081L2.36396 4.98242C1.8171 4.43615 1.83219 3.5607 2.36413 3.02935L3.02955 2.36396C3.56155 1.83122 4.437 1.81792 4.9826 2.36413L5.2081 2.58963C5.51023 2.4333 5.82474 2.30275 6.14844 2.19931V1.88085C6.14844 1.11945 6.76789 0.5 7.52932 0.5H8.47071C9.23211 0.5 9.85156 1.11945 9.85156 1.88085V2.19934C10.1753 2.30275 10.4898 2.4333 10.7919 2.58966L11.0176 2.36396C11.5643 1.81663 12.4399 1.83269 12.9707 2.36416L13.636 3.02949C14.1678 3.56062 14.183 4.43598 13.6359 4.98257L13.4103 5.2081C13.5667 5.51023 13.6972 5.82468 13.8007 6.14844H14.1191C14.8805 6.14844 15.5 6.76789 15.5 7.52929V8.47071C15.5 9.23211 14.8805 9.85156 14.1191 9.85156H13.8007C13.6972 10.1753 13.5667 10.4898 13.4103 10.7919L13.636 11.0176C14.1829 11.5639 14.1678 12.4393 13.6359 12.9707L12.9704 13.6361C12.4384 14.1688 11.563 14.1821 11.0174 13.6359L10.7919 13.4104C10.4898 13.5667 10.1753 13.6973 9.85156 13.8007V14.1192C9.85156 14.8805 9.23211 15.5 8.47068 15.5ZM5.35499 12.4874C5.77473 12.7356 6.22648 12.9232 6.6977 13.0448C6.89176 13.0948 7.02734 13.2699 7.02734 13.4703V14.1192C7.02734 14.3959 7.25255 14.6211 7.52932 14.6211H8.47071C8.74748 14.6211 8.97268 14.3959 8.97268 14.1192V13.4703C8.97268 13.2699 9.10827 13.0948 9.30233 13.0448C9.77355 12.9232 10.2253 12.7356 10.645 12.4874C10.8177 12.3853 11.0376 12.413 11.1795 12.5549L11.6391 13.0146C11.8373 13.213 12.1555 13.2084 12.3488 13.0148L13.0146 12.349C13.2075 12.1564 13.2139 11.8381 13.0148 11.6393L12.555 11.1794C12.4131 11.0376 12.3854 10.8177 12.4875 10.645C12.7357 10.2253 12.9232 9.77354 13.0448 9.3023C13.0949 9.10824 13.2699 8.97268 13.4703 8.97268H14.1192C14.3959 8.97268 14.6211 8.74751 14.6211 8.47074V7.52932C14.6211 7.25255 14.3959 7.02737 14.1192 7.02737H13.4703C13.2699 7.02737 13.0949 6.89179 13.0448 6.69775C12.9232 6.22651 12.7357 5.77476 12.4875 5.35505C12.3854 5.18237 12.4131 4.96247 12.555 4.82062L13.0146 4.36098C13.2133 4.16252 13.2081 3.84436 13.0148 3.65126L12.349 2.98549C12.1561 2.79225 11.8378 2.78659 11.6393 2.98531L11.1795 3.44513C11.0377 3.58701 10.8177 3.61479 10.6451 3.51266C10.2253 3.26442 9.77357 3.07689 9.30236 2.95528C9.1083 2.90521 8.97271 2.7302 8.97271 2.52978V1.88085C8.97271 1.60408 8.74751 1.37891 8.47074 1.37891H7.52935C7.25258 1.37891 7.02737 1.60408 7.02737 1.88085V2.52972C7.02737 2.73014 6.89179 2.90516 6.69772 2.95522C6.22651 3.07684 5.77476 3.26437 5.35502 3.5126C5.18229 3.6147 4.96241 3.58692 4.82056 3.44507L4.36095 2.98543C4.16278 2.78703 3.84453 2.79163 3.65126 2.98522L2.98543 3.65103C2.7926 3.84362 2.78615 4.16188 2.98525 4.36074L3.44507 4.82056C3.58692 4.96241 3.6147 5.18231 3.5126 5.35499C3.26437 5.7747 3.07687 6.22646 2.95525 6.6977C2.90516 6.89176 2.73014 7.02731 2.52975 7.02731H1.88088C1.60411 7.02734 1.37891 7.25252 1.37891 7.52929V8.47071C1.37891 8.74748 1.60411 8.97266 1.88088 8.97266H2.52972C2.73014 8.97266 2.90513 9.10824 2.95522 9.30227C3.07684 9.77352 3.26437 10.2253 3.51257 10.645C3.61467 10.8177 3.58689 11.0376 3.44504 11.1794L2.9854 11.6391C2.78671 11.8375 2.79189 12.1557 2.98522 12.3488L3.651 13.0145C3.84397 13.2078 4.16226 13.2134 4.36071 13.0147L4.8205 12.5549C4.92503 12.4504 5.1425 12.3617 5.35499 12.4874Z" fill="#7147E8" stroke="#7147E8" stroke-width="0.1"/>
|
||||
<path d="M8 11.2656C6.20038 11.2656 4.73633 9.80154 4.73633 8.00195C4.73633 6.20236 6.20038 4.73828 8 4.73828C9.79962 4.73828 11.2637 6.20236 11.2637 8.00195C11.2637 9.80154 9.79962 11.2656 8 11.2656ZM8 5.61719C6.68501 5.61719 5.61523 6.68699 5.61523 8.00195C5.61523 9.31691 6.68504 10.3867 8 10.3867C9.31496 10.3867 10.3848 9.31691 10.3848 8.00195C10.3848 6.68699 9.31499 5.61719 8 5.61719Z" fill="#7147E8" stroke="#7147E8" stroke-width="0.1"/>
|
||||
<g clip-path="url(#clip0_13820_30581)">
|
||||
<path d="M8.47068 15.5H7.52929C6.76789 15.5 6.14841 14.8805 6.14841 14.1192V13.8007C5.82471 13.6972 5.5102 13.5667 5.20807 13.4103L4.98236 13.636C4.43571 14.1834 3.56006 14.1673 3.02929 13.6358L2.36393 12.9705C1.83222 12.4394 1.81692 11.564 2.3641 11.0174L2.58963 10.7919C2.43327 10.4898 2.30275 10.1753 2.19931 9.85156H1.88085C1.11948 9.85156 0.5 9.23211 0.5 8.47071V7.52929C0.5 6.76789 1.11948 6.14844 1.88088 6.14844H2.19934C2.30278 5.82471 2.4333 5.51023 2.58966 5.2081L2.36396 4.98242C1.8171 4.43615 1.83219 3.5607 2.36413 3.02935L3.02955 2.36396C3.56155 1.83122 4.437 1.81792 4.9826 2.36413L5.2081 2.58963C5.51023 2.4333 5.82474 2.30275 6.14844 2.19931V1.88085C6.14844 1.11945 6.76789 0.5 7.52932 0.5H8.47071C9.23211 0.5 9.85156 1.11945 9.85156 1.88085V2.19934C10.1753 2.30275 10.4898 2.4333 10.7919 2.58966L11.0176 2.36396C11.5643 1.81663 12.4399 1.83269 12.9707 2.36416L13.636 3.02949C14.1678 3.56062 14.183 4.43598 13.6359 4.98257L13.4103 5.2081C13.5667 5.51023 13.6972 5.82468 13.8007 6.14844H14.1191C14.8805 6.14844 15.5 6.76789 15.5 7.52929V8.47071C15.5 9.23211 14.8805 9.85156 14.1191 9.85156H13.8007C13.6972 10.1753 13.5667 10.4898 13.4103 10.7919L13.636 11.0176C14.1829 11.5639 14.1678 12.4393 13.6359 12.9707L12.9704 13.6361C12.4384 14.1688 11.563 14.1821 11.0174 13.6359L10.7919 13.4104C10.4898 13.5667 10.1753 13.6973 9.85156 13.8007V14.1192C9.85156 14.8805 9.23211 15.5 8.47068 15.5V15.5ZM5.35499 12.4874C5.77473 12.7356 6.22648 12.9232 6.6977 13.0448C6.89176 13.0948 7.02734 13.2699 7.02734 13.4703V14.1192C7.02734 14.3959 7.25255 14.6211 7.52932 14.6211H8.47071C8.74748 14.6211 8.97269 14.3959 8.97269 14.1192V13.4703C8.97269 13.2699 9.10827 13.0948 9.30233 13.0448C9.77354 12.9232 10.2253 12.7356 10.645 12.4874C10.8177 12.3853 11.0376 12.413 11.1795 12.5549L11.6391 13.0146C11.8373 13.213 12.1555 13.2084 12.3488 13.0148L13.0146 12.349C13.2075 12.1564 13.2139 11.8381 13.0148 11.6393L12.555 11.1794C12.4131 11.0376 12.3854 10.8177 12.4875 10.645C12.7357 10.2253 12.9232 9.77354 13.0448 9.3023C13.0949 9.10824 13.2699 8.97269 13.4703 8.97269H14.1192C14.3959 8.97269 14.6211 8.74751 14.6211 8.47074V7.52932C14.6211 7.25255 14.3959 7.02737 14.1192 7.02737H13.4703C13.2699 7.02737 13.0949 6.89179 13.0448 6.69775C12.9232 6.22651 12.7357 5.77476 12.4875 5.35505C12.3854 5.18237 12.4131 4.96247 12.555 4.82062L13.0146 4.36098C13.2133 4.16252 13.2081 3.84436 13.0148 3.65126L12.349 2.98549C12.1561 2.79225 11.8378 2.78659 11.6393 2.98531L11.1795 3.44513C11.0377 3.58701 10.8177 3.61479 10.6451 3.51266C10.2253 3.26442 9.77357 3.07689 9.30236 2.95528C9.1083 2.90521 8.97271 2.7302 8.97271 2.52978V1.88085C8.97271 1.60408 8.74751 1.37891 8.47074 1.37891H7.52935C7.25258 1.37891 7.02737 1.60408 7.02737 1.88085V2.52972C7.02737 2.73014 6.89179 2.90516 6.69772 2.95522C6.22651 3.07684 5.77476 3.26437 5.35502 3.5126C5.18229 3.6147 4.96241 3.58692 4.82056 3.44507L4.36095 2.98543C4.16278 2.78703 3.84453 2.79163 3.65126 2.98522L2.98543 3.65103C2.7926 3.84362 2.78615 4.16187 2.98525 4.36074L3.44507 4.82056C3.58692 4.96241 3.6147 5.18231 3.5126 5.35499C3.26437 5.7747 3.07687 6.22646 2.95525 6.6977C2.90516 6.89176 2.73014 7.02731 2.52975 7.02731H1.88088C1.60411 7.02734 1.37891 7.25252 1.37891 7.52929V8.47071C1.37891 8.74748 1.60411 8.97266 1.88088 8.97266H2.52972C2.73014 8.97266 2.90513 9.10824 2.95522 9.30228C3.07684 9.77352 3.26437 10.2253 3.51257 10.645C3.61467 10.8177 3.58689 11.0376 3.44504 11.1794L2.9854 11.6391C2.78671 11.8375 2.79189 12.1557 2.98522 12.3488L3.651 13.0145C3.84397 13.2078 4.16226 13.2134 4.36071 13.0147L4.8205 12.5549C4.92503 12.4504 5.1425 12.3617 5.35499 12.4874V12.4874Z" fill="currentColor" stroke="currentColor" stroke-width="0.3"/>
|
||||
<path d="M8 11.2656C6.20038 11.2656 4.73633 9.80154 4.73633 8.00195C4.73633 6.20236 6.20038 4.73828 8 4.73828C9.79962 4.73828 11.2637 6.20236 11.2637 8.00195C11.2637 9.80154 9.79962 11.2656 8 11.2656V11.2656ZM8 5.61719C6.68501 5.61719 5.61523 6.68699 5.61523 8.00195C5.61523 9.31691 6.68504 10.3867 8 10.3867C9.31496 10.3867 10.3848 9.31691 10.3848 8.00195C10.3848 6.68699 9.31499 5.61719 8 5.61719V5.61719Z" fill="currentColor" stroke="currentColor" stroke-width="0.3"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_13820_30581">
|
||||
<rect width="16" height="16" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 4.1 KiB After Width: | Height: | Size: 4.3 KiB |
@ -25,6 +25,7 @@ import {
|
||||
PAGE_SIZE_LARGE,
|
||||
} from '../../constants/constants';
|
||||
import { BOTS_DOCS } from '../../constants/docs.constants';
|
||||
import { PAGE_HEADERS } from '../../constants/PageHeaders.constant';
|
||||
import { EntityType } from '../../enums/entity.enum';
|
||||
import { Bot, ProviderType } from '../../generated/entity/bot';
|
||||
import { Include } from '../../generated/type/include';
|
||||
@ -38,6 +39,7 @@ import ErrorPlaceHolder from '../common/error-with-placeholder/ErrorPlaceHolder'
|
||||
import NextPrevious from '../common/next-previous/NextPrevious';
|
||||
import RichTextEditorPreviewer from '../common/rich-text-editor/RichTextEditorPreviewer';
|
||||
import Searchbar from '../common/searchbar/Searchbar';
|
||||
import PageHeader from '../header/PageHeader.component';
|
||||
import Loader from '../Loader/Loader';
|
||||
import { BotListV1Props } from './BotListV1.interfaces';
|
||||
|
||||
@ -234,15 +236,11 @@ const BotListV1 = ({
|
||||
</Row>
|
||||
) : (
|
||||
<Row gutter={[16, 16]}>
|
||||
<Col span={8}>
|
||||
<Searchbar
|
||||
removeMargin
|
||||
placeholder={t('label.search-for-bots')}
|
||||
typingInterval={500}
|
||||
onSearch={handleSearch}
|
||||
/>
|
||||
<Col span={12}>
|
||||
<PageHeader data={PAGE_HEADERS.BOTS} />
|
||||
</Col>
|
||||
<Col span={16}>
|
||||
|
||||
<Col span={12}>
|
||||
<Space align="center" className="tw-w-full tw-justify-end" size={16}>
|
||||
<Space align="end" size={5}>
|
||||
<Switch
|
||||
@ -267,6 +265,14 @@ const BotListV1 = ({
|
||||
</Tooltip>
|
||||
</Space>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Searchbar
|
||||
removeMargin
|
||||
placeholder={t('label.search-for-bots')}
|
||||
typingInterval={500}
|
||||
onSearch={handleSearch}
|
||||
/>
|
||||
</Col>
|
||||
<Col span={24}>
|
||||
<Row>
|
||||
<Col span={24}>
|
||||
|
||||
@ -11,9 +11,9 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Button as ButtonAntd, Card, Col, Row, Tooltip } from 'antd';
|
||||
import { Button as ButtonAntd, Card, Col, Row, Space, Tooltip } from 'antd';
|
||||
import { isEmpty } from 'lodash';
|
||||
import React, { Fragment, useMemo } from 'react';
|
||||
import React, { Fragment, useCallback, useMemo } from 'react';
|
||||
import { Link, useHistory } from 'react-router-dom';
|
||||
import { useAuthContext } from '../../authentication/auth-provider/AuthProvider';
|
||||
import {
|
||||
@ -22,6 +22,7 @@ import {
|
||||
} from '../../constants/constants';
|
||||
import { CONNECTORS_DOCS } from '../../constants/docs.constants';
|
||||
import { NO_PERMISSION_FOR_ACTION } from '../../constants/HelperTextUtil';
|
||||
import { PAGE_HEADERS } from '../../constants/PageHeaders.constant';
|
||||
import { servicesDisplayName } from '../../constants/Services.constant';
|
||||
import { ServiceCategory } from '../../enums/service.enum';
|
||||
import { Operation } from '../../generated/entity/policies/policy';
|
||||
@ -43,6 +44,7 @@ import ErrorPlaceHolder from '../common/error-with-placeholder/ErrorPlaceHolder'
|
||||
import NextPrevious from '../common/next-previous/NextPrevious';
|
||||
import RichTextEditorPreviewer from '../common/rich-text-editor/RichTextEditorPreviewer';
|
||||
import { leftPanelAntCardStyle } from '../containers/PageLayout';
|
||||
import PageHeader from '../header/PageHeader.component';
|
||||
import { usePermissionProvider } from '../PermissionProvider/PermissionProvider';
|
||||
|
||||
interface ServicesProps {
|
||||
@ -79,12 +81,34 @@ const Services = ({
|
||||
[permissions, serviceName]
|
||||
);
|
||||
|
||||
const getServicePageHeader = useCallback(() => {
|
||||
switch (serviceName) {
|
||||
case ServiceCategory.DATABASE_SERVICES:
|
||||
return PAGE_HEADERS.DATABASES_SERVICES;
|
||||
case ServiceCategory.DASHBOARD_SERVICES:
|
||||
return PAGE_HEADERS.DASHBOARD_SERVICES;
|
||||
case ServiceCategory.MESSAGING_SERVICES:
|
||||
return PAGE_HEADERS.MESSAGING_SERVICES;
|
||||
case ServiceCategory.METADATA_SERVICES:
|
||||
return PAGE_HEADERS.METADATA_SERVICES;
|
||||
case ServiceCategory.ML_MODEL_SERVICES:
|
||||
return PAGE_HEADERS.ML_MODELS_SERVICES;
|
||||
case ServiceCategory.PIPELINE_SERVICES:
|
||||
return PAGE_HEADERS.PIPELINES_SERVICES;
|
||||
default:
|
||||
return PAGE_HEADERS.DATABASES_SERVICES;
|
||||
}
|
||||
}, [serviceName]);
|
||||
|
||||
return (
|
||||
<Row className="tw-justify-center" data-testid="services-container">
|
||||
{serviceData.length ? (
|
||||
<Fragment>
|
||||
<Col span={24}>
|
||||
<div className="tw-flex tw-justify-end" data-testid="header">
|
||||
<Space
|
||||
className="w-full justify-between m-b-lg"
|
||||
data-testid="header">
|
||||
<PageHeader data={getServicePageHeader()} />
|
||||
<Tooltip
|
||||
placement="left"
|
||||
title={
|
||||
@ -103,7 +127,7 @@ const Services = ({
|
||||
Add New Service
|
||||
</Button>
|
||||
</Tooltip>
|
||||
</div>
|
||||
</Space>
|
||||
</Col>
|
||||
<Col span={24}>
|
||||
<Row data-testid="data-container" gutter={[16, 16]}>
|
||||
|
||||
@ -26,18 +26,20 @@ import {
|
||||
import { SwitchChangeEventHandler } from 'antd/lib/switch';
|
||||
import { AxiosError } from 'axios';
|
||||
import classNames from 'classnames';
|
||||
import { isUndefined } from 'lodash';
|
||||
import { isUndefined, map } from 'lodash';
|
||||
import { SelectableOption } from 'Models';
|
||||
import React, { FC, useEffect, useMemo, useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Link, useParams } from 'react-router-dom';
|
||||
import { ReactComponent as ColumnProfileIcon } from '../../assets/svg/column-profile.svg';
|
||||
import { ReactComponent as DataQualityIcon } from '../../assets/svg/data-quality.svg';
|
||||
import { ReactComponent as SettingIcon } from '../../assets/svg/ic-settings-primery.svg';
|
||||
import { ReactComponent as NoDataIcon } from '../../assets/svg/no-data-icon.svg';
|
||||
import { ReactComponent as TableProfileIcon } from '../../assets/svg/table-profile.svg';
|
||||
import { getLatestTableProfileByFqn } from '../../axiosAPIs/tableAPI';
|
||||
import { getListTestCase, ListTestCaseParams } from '../../axiosAPIs/testAPI';
|
||||
import { API_RES_MAX_SIZE } from '../../constants/constants';
|
||||
import { PAGE_HEADERS } from '../../constants/PageHeaders.constant';
|
||||
import {
|
||||
INITIAL_TEST_RESULT_SUMMARY,
|
||||
PROFILER_FILTER_RANGE,
|
||||
@ -53,9 +55,9 @@ import {
|
||||
} from '../../utils/CommonUtils';
|
||||
import { updateTestResults } from '../../utils/DataQualityAndProfilerUtils';
|
||||
import { getAddDataQualityTableTestPath } from '../../utils/RouterUtils';
|
||||
import SVGIcons, { Icons } from '../../utils/SvgUtils';
|
||||
import { generateEntityLink } from '../../utils/TableUtils';
|
||||
import { showErrorToast } from '../../utils/ToastUtils';
|
||||
import PageHeader from '../header/PageHeader.component';
|
||||
import DataQualityTab from '../ProfilerDashboard/component/DataQualityTab';
|
||||
import { ProfilerDashboardTab } from '../ProfilerDashboard/profilerDashboard.interface';
|
||||
import ColumnProfileTable from './Component/ColumnProfileTable';
|
||||
@ -110,13 +112,21 @@ const TableProfilerV1: FC<TableProfilerProps> = ({ permissions }) => {
|
||||
return testCaseStatus;
|
||||
}, []);
|
||||
|
||||
const getPageHeader = useMemo(() => {
|
||||
if (isProfiler) {
|
||||
return PAGE_HEADERS.TABLE_PROFILE;
|
||||
} else if (isDataQuality) {
|
||||
return PAGE_HEADERS.DATA_QUALITY;
|
||||
} else {
|
||||
return PAGE_HEADERS.COLUMN_PROFILE;
|
||||
}
|
||||
}, [isProfiler, isDataQuality]);
|
||||
|
||||
const testCaseTypeOption = useMemo(() => {
|
||||
const testCaseStatus: SelectableOption[] = Object.entries(TestType).map(
|
||||
([key, value]) => ({
|
||||
label: key,
|
||||
value: value,
|
||||
})
|
||||
);
|
||||
const testCaseStatus: SelectableOption[] = map(TestType, (value, key) => ({
|
||||
label: key,
|
||||
value: value,
|
||||
}));
|
||||
testCaseStatus.unshift({
|
||||
label: t('label.all'),
|
||||
value: '',
|
||||
@ -321,100 +331,97 @@ const TableProfilerV1: FC<TableProfilerProps> = ({ permissions }) => {
|
||||
<Space
|
||||
className="tab-details-container w-full h-min-full"
|
||||
direction="vertical">
|
||||
<Space className="m-b-md w-full justify-end">
|
||||
{isDataQuality && (
|
||||
<>
|
||||
<Form.Item
|
||||
className="m-0"
|
||||
label={t('label.deleted', {
|
||||
entity: t('label.test-plural'),
|
||||
})}>
|
||||
<Switch
|
||||
checked={deleted}
|
||||
onClick={handleDeletedTestCaseClick}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item className="m-0 w-40" label={t('label.type')}>
|
||||
<Row className="m-b-md">
|
||||
<Col span={10}>
|
||||
<PageHeader data={getPageHeader} />
|
||||
</Col>
|
||||
<Col span={14}>
|
||||
<Space align="center" className="w-full justify-end">
|
||||
{isDataQuality && (
|
||||
<>
|
||||
<Form.Item
|
||||
className="m-0"
|
||||
label={t('label.deleted', {
|
||||
entity: t('label.test-plural'),
|
||||
})}>
|
||||
<Switch
|
||||
checked={deleted}
|
||||
onClick={handleDeletedTestCaseClick}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item className="m-0 w-40" label={t('label.type')}>
|
||||
<Select
|
||||
options={testCaseTypeOption}
|
||||
value={selectedTestType}
|
||||
onChange={handleTestCaseTypeChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item className="m-0 w-40" label={t('label.status')}>
|
||||
<Select
|
||||
options={testCaseStatusOption}
|
||||
value={selectedTestCaseStatus}
|
||||
onChange={handleTestCaseStatusChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
</>
|
||||
)}
|
||||
|
||||
{isProfiler && (
|
||||
<Select
|
||||
options={testCaseTypeOption}
|
||||
value={selectedTestType}
|
||||
onChange={handleTestCaseTypeChange}
|
||||
className="tw-w-32"
|
||||
options={timeRangeOption}
|
||||
value={selectedTimeRange}
|
||||
onChange={handleTimeRangeChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item className="m-0 w-40" label={t('label.status')}>
|
||||
<Select
|
||||
options={testCaseStatusOption}
|
||||
value={selectedTestCaseStatus}
|
||||
onChange={handleTestCaseStatusChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
</>
|
||||
)}
|
||||
)}
|
||||
|
||||
{isProfiler && (
|
||||
<Select
|
||||
className="tw-w-32"
|
||||
options={timeRangeOption}
|
||||
value={selectedTimeRange}
|
||||
onChange={handleTimeRangeChange}
|
||||
/>
|
||||
)}
|
||||
<Tooltip
|
||||
title={
|
||||
editTest
|
||||
? t('label.add-entity', {
|
||||
entity: t('label.test'),
|
||||
})
|
||||
: t('message.no-permission-for-action')
|
||||
}>
|
||||
<Link
|
||||
to={
|
||||
editTest
|
||||
? getAddDataQualityTableTestPath(
|
||||
ProfilerDashboardType.TABLE,
|
||||
`${table?.fullyQualifiedName}`
|
||||
)
|
||||
: '#'
|
||||
}>
|
||||
<Button
|
||||
className="rounded-4"
|
||||
data-testid="profiler-add-table-test-btn"
|
||||
disabled={!editTest}
|
||||
type="primary">
|
||||
{t('label.add-entity', {
|
||||
entity: t('label.test'),
|
||||
})}
|
||||
</Button>
|
||||
</Link>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip
|
||||
title={
|
||||
editTest
|
||||
? t('label.add-entity', {
|
||||
entity: t('label.test'),
|
||||
})
|
||||
: t('message.no-permission-for-action')
|
||||
}>
|
||||
<Link
|
||||
to={
|
||||
editTest
|
||||
? getAddDataQualityTableTestPath(
|
||||
ProfilerDashboardType.TABLE,
|
||||
`${table?.fullyQualifiedName}`
|
||||
)
|
||||
: '#'
|
||||
}>
|
||||
<Button
|
||||
className="rounded-4"
|
||||
data-testid="profiler-add-table-test-btn"
|
||||
disabled={!editTest}
|
||||
type="primary">
|
||||
{t('label.add-entity', {
|
||||
entity: t('label.test'),
|
||||
})}
|
||||
</Button>
|
||||
</Link>
|
||||
</Tooltip>
|
||||
|
||||
<Tooltip
|
||||
title={
|
||||
editTest
|
||||
? t('label.settings')
|
||||
: t('message.no-permission-for-action')
|
||||
}>
|
||||
<Button
|
||||
ghost
|
||||
className="flex items-center"
|
||||
data-testid="profiler-setting-btn"
|
||||
disabled={!editTest}
|
||||
icon={
|
||||
<SVGIcons
|
||||
alt="setting"
|
||||
className="mr-2"
|
||||
icon={
|
||||
editTest ? Icons.SETTINGS_PRIMERY : Icons.SETTINGS_GRAY
|
||||
}
|
||||
/>
|
||||
}
|
||||
type="primary"
|
||||
onClick={() => handleSettingModal(true)}>
|
||||
{t('label.settings')}
|
||||
</Button>
|
||||
</Tooltip>
|
||||
</Space>
|
||||
<Tooltip
|
||||
title={
|
||||
editTest
|
||||
? t('label.settings')
|
||||
: t('message.no-permission-for-action')
|
||||
}>
|
||||
<Button
|
||||
className="rounded-4 tw-w-8 flex justify-center manage-dropdown-button"
|
||||
data-testid="profiler-setting-btn"
|
||||
disabled={!editTest}
|
||||
type="primary"
|
||||
onClick={() => handleSettingModal(true)}>
|
||||
<SettingIcon className="text-primary self-center manage-dropdown-icon" />
|
||||
</Button>
|
||||
</Tooltip>
|
||||
</Space>
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
{isUndefined(profile) && (
|
||||
<div
|
||||
|
||||
@ -21,6 +21,7 @@ import { useHistory } from 'react-router-dom';
|
||||
import { updateUser } from '../../axiosAPIs/userAPI';
|
||||
import { PAGE_SIZE_MEDIUM, ROUTES } from '../../constants/constants';
|
||||
import { ADMIN_ONLY_ACTION } from '../../constants/HelperTextUtil';
|
||||
import { PAGE_HEADERS } from '../../constants/PageHeaders.constant';
|
||||
import { CreateUser } from '../../generated/api/teams/createUser';
|
||||
import { User } from '../../generated/entity/teams/user';
|
||||
import { Paging } from '../../generated/type/paging';
|
||||
@ -33,6 +34,7 @@ import DeleteWidgetModal from '../common/DeleteWidget/DeleteWidgetModal';
|
||||
import ErrorPlaceHolder from '../common/error-with-placeholder/ErrorPlaceHolder';
|
||||
import NextPrevious from '../common/next-previous/NextPrevious';
|
||||
import Searchbar from '../common/searchbar/Searchbar';
|
||||
import PageHeader from '../header/PageHeader.component';
|
||||
import Loader from '../Loader/Loader';
|
||||
import { commonUserDetailColumns } from '../Users/Users.util';
|
||||
import './usersList.less';
|
||||
@ -48,6 +50,7 @@ interface UserListV1Props {
|
||||
onShowDeletedUserChange: (value: boolean) => void;
|
||||
onSearch: (text: string) => void;
|
||||
afterDeleteAction: () => void;
|
||||
isAdminPage: boolean | undefined;
|
||||
}
|
||||
|
||||
const UserListV1: FC<UserListV1Props> = ({
|
||||
@ -61,6 +64,7 @@ const UserListV1: FC<UserListV1Props> = ({
|
||||
onShowDeletedUserChange,
|
||||
onPagingChange,
|
||||
afterDeleteAction,
|
||||
isAdminPage,
|
||||
}) => {
|
||||
const { isAdminUser } = useAuth();
|
||||
const { t } = useTranslation();
|
||||
@ -217,16 +221,12 @@ const UserListV1: FC<UserListV1Props> = ({
|
||||
|
||||
return (
|
||||
<Row className="user-listing" gutter={[16, 16]}>
|
||||
<Col span={8}>
|
||||
<Searchbar
|
||||
removeMargin
|
||||
placeholder="Search for user..."
|
||||
searchValue={searchTerm}
|
||||
typingInterval={500}
|
||||
onSearch={onSearch}
|
||||
<Col span={12}>
|
||||
<PageHeader
|
||||
data={isAdminPage ? PAGE_HEADERS.ADMIN : PAGE_HEADERS.USERS}
|
||||
/>
|
||||
</Col>
|
||||
<Col span={16}>
|
||||
<Col span={12}>
|
||||
<Space align="center" className="tw-w-full tw-justify-end" size={16}>
|
||||
<span>
|
||||
<Switch
|
||||
@ -247,6 +247,15 @@ const UserListV1: FC<UserListV1Props> = ({
|
||||
</Tooltip>
|
||||
</Space>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Searchbar
|
||||
removeMargin
|
||||
placeholder="Search for user..."
|
||||
searchValue={searchTerm}
|
||||
typingInterval={500}
|
||||
onSearch={onSearch}
|
||||
/>
|
||||
</Col>
|
||||
|
||||
<Col span={24}>
|
||||
<Table
|
||||
|
||||
@ -25,6 +25,11 @@
|
||||
.manage-dropdown-button {
|
||||
border: none;
|
||||
background-color: @manage-dropdown-bg-primary;
|
||||
padding: 0;
|
||||
|
||||
.ant-btn {
|
||||
padding: 0 8px 0 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.manage-dropdown-button:hover,
|
||||
|
||||
@ -0,0 +1,36 @@
|
||||
/*
|
||||
* Copyright 2022 Collate
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Typography } from 'antd';
|
||||
import React from 'react';
|
||||
import './PageHeader.style.less';
|
||||
|
||||
interface HeaderProps {
|
||||
data: {
|
||||
header: string;
|
||||
subHeader: string;
|
||||
};
|
||||
}
|
||||
|
||||
const PageHeader = ({ data: { header, subHeader } }: HeaderProps) => {
|
||||
return (
|
||||
<div className="page-header-container">
|
||||
<Typography.Title className="heading">{header}</Typography.Title>
|
||||
<Typography.Paragraph className="sub-heading">
|
||||
{subHeader}
|
||||
</Typography.Paragraph>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default PageHeader;
|
||||
@ -0,0 +1,30 @@
|
||||
/*
|
||||
* Copyright 2022 Collate
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
@import url('../../styles/variables.less');
|
||||
|
||||
.page-header-container {
|
||||
.heading {
|
||||
margin-bottom: 4px;
|
||||
color: @text-color-secondary;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.sub-heading {
|
||||
font-weight: 400;
|
||||
color: @text-grey-muted;
|
||||
line-height: 17px;
|
||||
font-size: 14px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,117 @@
|
||||
/*
|
||||
* Copyright 2021 Collate
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
export const PAGE_HEADERS = {
|
||||
ADVANCE_SEARCH: {
|
||||
header: 'Advanced Search',
|
||||
subHeader:
|
||||
'Discover the right data assets quickly using the syntax editor with and/or conditions.',
|
||||
},
|
||||
TABLE_PROFILE: {
|
||||
header: 'Table Profile',
|
||||
subHeader:
|
||||
'Monitor and understand your tables structure with the profiler.',
|
||||
},
|
||||
DATA_QUALITY: {
|
||||
header: 'Data Quality',
|
||||
subHeader:
|
||||
'Build trust in your data with quality tests and build reliable data products.',
|
||||
},
|
||||
COLUMN_PROFILE: {
|
||||
header: 'Column Profile',
|
||||
subHeader:
|
||||
'Monitor and understand your columns structure with the profiler',
|
||||
},
|
||||
ADMIN: {
|
||||
header: 'Admins',
|
||||
subHeader:
|
||||
'Know the other Admins in your organization, along with their Teams and Roles.',
|
||||
},
|
||||
USERS: {
|
||||
header: 'Users',
|
||||
subHeader:
|
||||
'Represent your entire organizational structure with hierarchical teams.',
|
||||
},
|
||||
TEAMS: {
|
||||
header: 'Teams',
|
||||
subHeader:
|
||||
'Represent your entire organizational structure with hierarchical teams.',
|
||||
},
|
||||
ROLES: {
|
||||
header: 'Roles',
|
||||
subHeader: 'Assign comprehensive role based access to Users or Teams.',
|
||||
},
|
||||
POLICIES: {
|
||||
header: 'Policies',
|
||||
subHeader:
|
||||
'Define policies with a set of rules for fine-grained access control.',
|
||||
},
|
||||
DATABASES_SERVICES: {
|
||||
header: 'Databases',
|
||||
subHeader: 'Ingest metadata from the most popular database services.',
|
||||
},
|
||||
MESSAGING_SERVICES: {
|
||||
header: 'Messaging',
|
||||
subHeader: 'Ingest metadata from the most used messaging services.',
|
||||
},
|
||||
DASHBOARD_SERVICES: {
|
||||
header: 'Dashboards',
|
||||
subHeader: 'Ingest metadata from the most popular dashboard services.',
|
||||
},
|
||||
PIPELINES_SERVICES: {
|
||||
header: 'Pipelines',
|
||||
subHeader: 'Ingest metadata from the most used pipeline services.',
|
||||
},
|
||||
ML_MODELS_SERVICES: {
|
||||
header: 'ML Models',
|
||||
subHeader: 'Ingest metadata from ML Model services through the UI',
|
||||
},
|
||||
METADATA_SERVICES: {
|
||||
header: 'Metadata',
|
||||
subHeader: 'Ingest metadata from metadata services, right from the UI.',
|
||||
},
|
||||
ACTIVITY_FEED: {
|
||||
header: 'Activity Feed',
|
||||
subHeader:
|
||||
'Monitor and understand your tables structure with the profiler.',
|
||||
},
|
||||
TABLES_CUSTOM_ATTRIBUTES: {
|
||||
header: 'Tables',
|
||||
subHeader:
|
||||
'Define additional properties for tables to serve your organizational needs.',
|
||||
},
|
||||
TOPICS_CUSTOM_ATTRIBUTES: {
|
||||
header: 'Topics',
|
||||
subHeader:
|
||||
'Define custom properties for topics to serve your organizational needs.',
|
||||
},
|
||||
DASHBOARD_CUSTOM_ATTRIBUTES: {
|
||||
header: 'Dashboards',
|
||||
subHeader:
|
||||
'Define custom attributes for dashboards to serve your organizational needs.',
|
||||
},
|
||||
PIPELINES_CUSTOM_ATTRIBUTES: {
|
||||
header: 'Pipelines',
|
||||
subHeader:
|
||||
'Define additional attributes for pipelines to serve your organizational needs.',
|
||||
},
|
||||
ML_MODELS_CUSTOM_ATTRIBUTES: {
|
||||
header: 'ML Models',
|
||||
subHeader:
|
||||
'Define custom properties for ML models to serve your organizational needs.',
|
||||
},
|
||||
BOTS: {
|
||||
header: 'Bots',
|
||||
subHeader: 'Create well-defined bots with scoped access permissions.',
|
||||
},
|
||||
};
|
||||
@ -15,13 +15,14 @@ import { Button as ButtonAntd, Col, Row, Tooltip } from 'antd';
|
||||
import { AxiosError } from 'axios';
|
||||
import { compare } from 'fast-json-patch';
|
||||
import { isEmpty, isUndefined } from 'lodash';
|
||||
import React, { useEffect, useMemo, useState } from 'react';
|
||||
import React, { useCallback, useEffect, useMemo, useState } from 'react';
|
||||
import { useHistory, useParams } from 'react-router-dom';
|
||||
import { getTypeByFQN, updateType } from '../../axiosAPIs/metadataTypeAPI';
|
||||
import { Button } from '../../components/buttons/Button/Button';
|
||||
import ErrorPlaceHolder from '../../components/common/error-with-placeholder/ErrorPlaceHolder';
|
||||
import TabsPane from '../../components/common/TabsPane/TabsPane';
|
||||
import { CustomPropertyTable } from '../../components/CustomEntityDetail/CustomPropertyTable';
|
||||
import PageHeader from '../../components/header/PageHeader.component';
|
||||
import Loader from '../../components/Loader/Loader';
|
||||
import { usePermissionProvider } from '../../components/PermissionProvider/PermissionProvider';
|
||||
import {
|
||||
@ -38,6 +39,7 @@ import {
|
||||
NO_PERMISSION_FOR_ACTION,
|
||||
NO_PERMISSION_TO_VIEW,
|
||||
} from '../../constants/HelperTextUtil';
|
||||
import { PAGE_HEADERS } from '../../constants/PageHeaders.constant';
|
||||
import { Type } from '../../generated/entity/type';
|
||||
import jsonData from '../../jsons/en';
|
||||
import { DEFAULT_ENTITY_PERMISSION } from '../../utils/PermissionsUtils';
|
||||
@ -139,6 +141,24 @@ const CustomEntityDetailV1 = () => {
|
||||
}
|
||||
};
|
||||
|
||||
const getCustomPageHeader = useCallback(() => {
|
||||
switch (tabAttributePath) {
|
||||
case ENTITY_PATH.tables:
|
||||
return PAGE_HEADERS.TABLES_CUSTOM_ATTRIBUTES;
|
||||
case ENTITY_PATH.topics:
|
||||
return PAGE_HEADERS.TOPICS_CUSTOM_ATTRIBUTES;
|
||||
case ENTITY_PATH.dashboards:
|
||||
return PAGE_HEADERS.DASHBOARD_CUSTOM_ATTRIBUTES;
|
||||
case ENTITY_PATH.pipelines:
|
||||
return PAGE_HEADERS.PIPELINES_CUSTOM_ATTRIBUTES;
|
||||
case ENTITY_PATH.mlmodels:
|
||||
return PAGE_HEADERS.ML_MODELS_CUSTOM_ATTRIBUTES;
|
||||
|
||||
default:
|
||||
return PAGE_HEADERS.TABLES_CUSTOM_ATTRIBUTES;
|
||||
}
|
||||
}, [tabAttributePath]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!isUndefined(tab)) {
|
||||
setActiveTab(1);
|
||||
@ -170,6 +190,9 @@ const CustomEntityDetailV1 = () => {
|
||||
className="m-y-xs"
|
||||
data-testid="custom-entity-container"
|
||||
gutter={[16, 16]}>
|
||||
<Col span={24}>
|
||||
<PageHeader data={getCustomPageHeader()} />
|
||||
</Col>
|
||||
<Col className="global-settings-tabs" span={24}>
|
||||
<TabsPane
|
||||
activeTab={activeTab}
|
||||
|
||||
@ -19,6 +19,7 @@ import { useHistory } from 'react-router-dom';
|
||||
import { getPolicies } from '../../../axiosAPIs/rolesAPIV1';
|
||||
import ErrorPlaceHolder from '../../../components/common/error-with-placeholder/ErrorPlaceHolder';
|
||||
import NextPrevious from '../../../components/common/next-previous/NextPrevious';
|
||||
import PageHeader from '../../../components/header/PageHeader.component';
|
||||
import Loader from '../../../components/Loader/Loader';
|
||||
import { usePermissionProvider } from '../../../components/PermissionProvider/PermissionProvider';
|
||||
import { ResourceEntity } from '../../../components/PermissionProvider/PermissionProvider.interface';
|
||||
@ -28,6 +29,7 @@ import {
|
||||
ROUTES,
|
||||
} from '../../../constants/constants';
|
||||
import { NO_PERMISSION_FOR_ACTION } from '../../../constants/HelperTextUtil';
|
||||
import { PAGE_HEADERS } from '../../../constants/PageHeaders.constant';
|
||||
import { Operation, Policy } from '../../../generated/entity/policies/policy';
|
||||
import { Paging } from '../../../generated/type/paging';
|
||||
import { checkPermission } from '../../../utils/PermissionsUtils';
|
||||
@ -115,7 +117,8 @@ const PoliciesListPage = () => {
|
||||
data-testid="policies-list-container"
|
||||
gutter={[16, 16]}>
|
||||
<Col span={24}>
|
||||
<Space align="center" className="tw-w-full tw-justify-end" size={16}>
|
||||
<Space className="w-full justify-between">
|
||||
<PageHeader data={PAGE_HEADERS.POLICIES} />
|
||||
<Tooltip
|
||||
placement="left"
|
||||
title={
|
||||
|
||||
@ -19,6 +19,7 @@ import { useHistory } from 'react-router-dom';
|
||||
import { getRoles } from '../../../axiosAPIs/rolesAPIV1';
|
||||
import ErrorPlaceHolder from '../../../components/common/error-with-placeholder/ErrorPlaceHolder';
|
||||
import NextPrevious from '../../../components/common/next-previous/NextPrevious';
|
||||
import PageHeader from '../../../components/header/PageHeader.component';
|
||||
import Loader from '../../../components/Loader/Loader';
|
||||
import { usePermissionProvider } from '../../../components/PermissionProvider/PermissionProvider';
|
||||
import { ResourceEntity } from '../../../components/PermissionProvider/PermissionProvider.interface';
|
||||
@ -28,6 +29,7 @@ import {
|
||||
ROUTES,
|
||||
} from '../../../constants/constants';
|
||||
import { NO_PERMISSION_FOR_ACTION } from '../../../constants/HelperTextUtil';
|
||||
import { PAGE_HEADERS } from '../../../constants/PageHeaders.constant';
|
||||
import { Operation } from '../../../generated/entity/policies/policy';
|
||||
import { Role } from '../../../generated/entity/teams/role';
|
||||
import { Paging } from '../../../generated/type/paging';
|
||||
@ -118,7 +120,8 @@ const RolesListPage = () => {
|
||||
data-testid="roles-list-container"
|
||||
gutter={[16, 16]}>
|
||||
<Col span={24}>
|
||||
<Space align="center" className="tw-w-full tw-justify-end" size={16}>
|
||||
<Space className="w-full justify-between">
|
||||
<PageHeader data={PAGE_HEADERS.ROLES} />
|
||||
<Tooltip
|
||||
placement="left"
|
||||
title={addRolePermission ? 'Add Role' : NO_PERMISSION_FOR_ACTION}>
|
||||
|
||||
@ -222,6 +222,7 @@ const UserListPageV1 = () => {
|
||||
afterDeleteAction={handleFetch}
|
||||
currentPage={currentPage}
|
||||
data={userList}
|
||||
isAdminPage={isAdminPage}
|
||||
isDataLoading={isDataLoading}
|
||||
paging={paging}
|
||||
searchTerm={searchValue}
|
||||
|
||||
@ -307,11 +307,6 @@
|
||||
}
|
||||
|
||||
/* Group CSS End*/
|
||||
.heading {
|
||||
font-weight: 500 !important;
|
||||
margin-bottom: 16px !important;
|
||||
color: @grey-body !important;
|
||||
}
|
||||
|
||||
.quick-filter-dropdown-trigger-btn {
|
||||
padding: 4px;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user