yujunjun/datahub
2
0
Fork 0
mirror of https://github.com/datahub-project/datahub.git synced 2025-10-27 17:02:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(ui): move hard coded usages to color file (#14333)

Browse Source
This commit is contained in:
Aseem Bansal 2025-08-07 11:32:32 +05:30 committed by GitHub
parent 051002ead9
commit 791f2fd315
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
10 changed files with 23 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
datahub-web-react/src/alchemy-components/theme/foundations/colors.ts
View File

@ -124,4 +124,9 @@ const colors = {
}, },
}; };
export const SUCCESS_COLOR_HEX = '#52C41A';
export const FAILURE_COLOR_HEX = '#F5222D';
export const WARNING_COLOR_HEX = '#FA8C16';
export const ERROR_COLOR_HEX = '#FAAD14';
export default colors; export default colors;

5
datahub-web-react/src/app/entityV2/shared/tabs/Dataset/Governance/TestResultsSummary.tsx
View File

@ -4,6 +4,8 @@ import { Typography } from 'antd';
import React from 'react'; import React from 'react';
import styled from 'styled-components'; import styled from 'styled-components';
import { FAILURE_COLOR_HEX, SUCCESS_COLOR_HEX } from '@components/theme/foundations/colors';
import { ANTD_GRAY } from '@app/entityV2/shared/constants'; import { ANTD_GRAY } from '@app/entityV2/shared/constants';
const SummaryHeader = styled.div` const SummaryHeader = styled.div`
@ -40,9 +42,6 @@ type Props = {
summary: TestsSummary; summary: TestsSummary;
}; };
const SUCCESS_COLOR_HEX = '#52C41A';
const FAILURE_COLOR_HEX = '#F5222D';
const getSummaryIcon = (summary: TestsSummary) => { const getSummaryIcon = (summary: TestsSummary) => {
if (summary.total === 0) { if (summary.total === 0) {
return <StopOutlined style={{ color: ANTD_GRAY[6], fontSize: 28 }} />; return <StopOutlined style={{ color: ANTD_GRAY[6], fontSize: 28 }} />;

4
datahub-web-react/src/app/entityV2/shared/tabs/Dataset/Governance/testUtils.tsx
View File

@ -1,6 +1,8 @@
import { CheckCircleOutlined, CloseCircleOutlined } from '@ant-design/icons'; import { CheckCircleOutlined, CloseCircleOutlined } from '@ant-design/icons';
import React from 'react'; import React from 'react';
import { FAILURE_COLOR_HEX, SUCCESS_COLOR_HEX } from '@components/theme/foundations/colors';
import { TestResultType } from '@types'; import { TestResultType } from '@types';
/** /**
@ -20,8 +22,6 @@ export const getResultText = (result: TestResultType) => {
/** /**
* Returns the display color assoociated with an TestResultType * Returns the display color assoociated with an TestResultType
*/ */
const SUCCESS_COLOR_HEX = '#4db31b';
const FAILURE_COLOR_HEX = '#F5222D';
export const getResultColor = (result: TestResultType) => { export const getResultColor = (result: TestResultType) => {
switch (result) { switch (result) {

5
datahub-web-react/src/app/entityV2/shared/tabs/Dataset/Validations/AssertionResultTimeline.tsx
View File

@ -6,6 +6,8 @@ import { Bar } from '@visx/shape';
import { Maybe } from 'graphql/jsutils/Maybe'; import { Maybe } from 'graphql/jsutils/Maybe';
import React, { useMemo } from 'react'; import React, { useMemo } from 'react';
import { ERROR_COLOR_HEX, FAILURE_COLOR_HEX, SUCCESS_COLOR_HEX } from '@components/theme/foundations/colors';
import { ANTD_GRAY } from '@app/entityV2/shared/constants'; import { ANTD_GRAY } from '@app/entityV2/shared/constants';
import { LinkWrapper } from '@app/shared/LinkWrapper'; import { LinkWrapper } from '@app/shared/LinkWrapper';
@ -34,9 +36,6 @@ type Props = {
width: number; width: number;
}; };
const SUCCESS_COLOR_HEX = '#52C41A';
const FAILURE_COLOR_HEX = '#F5222D';
const ERROR_COLOR_HEX = '#FAAD14';
const INIT_COLOR_HEX = '#8C8C8C'; const INIT_COLOR_HEX = '#8C8C8C';
const getFillColor = (type: AssertionResultType) => { const getFillColor = (type: AssertionResultType) => {

5
datahub-web-react/src/app/entityV2/shared/tabs/Dataset/Validations/BooleanTimeline.tsx
View File

@ -5,6 +5,8 @@ import { scaleUtc } from '@visx/scale';
import { Bar } from '@visx/shape'; import { Bar } from '@visx/shape';
import React, { useMemo } from 'react'; import React, { useMemo } from 'react';
import { FAILURE_COLOR_HEX, SUCCESS_COLOR_HEX } from '@components/theme/foundations/colors';
import { ANTD_GRAY } from '@app/entityV2/shared/constants'; import { ANTD_GRAY } from '@app/entityV2/shared/constants';
export type BooleanResult = { export type BooleanResult = {
@ -30,9 +32,6 @@ type Props = {
width: number; width: number;
}; };
const SUCCESS_COLOR_HEX = '#52C41A';
const FAILURE_COLOR_HEX = '#F5222D';
/** /**
* True / false results displayed on a horizontal timeline. * True / false results displayed on a horizontal timeline.
*/ */

6
datahub-web-react/src/app/entityV2/shared/tabs/Dataset/Validations/DatasetAssertionsSummary.tsx
View File

@ -4,6 +4,8 @@ import { Typography } from 'antd';
import React from 'react'; import React from 'react';
import styled from 'styled-components'; import styled from 'styled-components';
import { ERROR_COLOR_HEX, FAILURE_COLOR_HEX, SUCCESS_COLOR_HEX } from '@components/theme/foundations/colors';
import { ANTD_GRAY } from '@app/entityV2/shared/constants'; import { ANTD_GRAY } from '@app/entityV2/shared/constants';
const SummaryHeader = styled.div` const SummaryHeader = styled.div`
@ -42,10 +44,6 @@ type Props = {
summary: AssertionsSummary; summary: AssertionsSummary;
}; };
const SUCCESS_COLOR_HEX = '#52C41A';
const FAILURE_COLOR_HEX = '#F5222D';
const ERROR_COLOR_HEX = '#FAAD14';
const getSummaryIcon = (summary: AssertionsSummary) => { const getSummaryIcon = (summary: AssertionsSummary) => {
if (summary.totalRuns === 0) { if (summary.totalRuns === 0) {
return <StopOutlined style={{ color: ANTD_GRAY[6], fontSize: 28 }} />; return <StopOutlined style={{ color: ANTD_GRAY[6], fontSize: 28 }} />;

6
datahub-web-react/src/app/entityV2/shared/tabs/Dataset/Validations/acrylUtils.tsx
View File

@ -5,6 +5,8 @@ import * as moment from 'moment-timezone';
import React from 'react'; import React from 'react';
import styled from 'styled-components'; import styled from 'styled-components';
import { FAILURE_COLOR_HEX, SUCCESS_COLOR_HEX, WARNING_COLOR_HEX } from '@components/theme/foundations/colors';
import { GenericEntityProperties } from '@app/entity/shared/types'; import { GenericEntityProperties } from '@app/entity/shared/types';
import { AssertionGroup, AssertionStatusSummary } from '@app/entityV2/shared/tabs/Dataset/Validations/acrylTypes'; import { AssertionGroup, AssertionStatusSummary } from '@app/entityV2/shared/tabs/Dataset/Validations/acrylTypes';
import { sortAssertions } from '@app/entityV2/shared/tabs/Dataset/Validations/assertionUtils'; import { sortAssertions } from '@app/entityV2/shared/tabs/Dataset/Validations/assertionUtils';
@ -15,10 +17,6 @@ import { GetDatasetAssertionsWithRunEventsQuery } from '@src/graphql/dataset.gen
import { Assertion, AssertionResultType, AssertionType, CronSchedule, EntityType } from '@types'; import { Assertion, AssertionResultType, AssertionType, CronSchedule, EntityType } from '@types';
export const SUCCESS_COLOR_HEX = '#52C41A';
export const FAILURE_COLOR_HEX = '#F5222D';
export const WARNING_COLOR_HEX = '#FA8C16';
const StyledApiOutlined = styled(ApiOutlined)` const StyledApiOutlined = styled(ApiOutlined)`
&& { && {
margin: 0px; margin: 0px;

5
datahub-web-react/src/app/entityV2/shared/tabs/Dataset/Validations/assertionUtils.tsx
View File

@ -2,6 +2,8 @@ import { CheckCircleOutlined, CloseCircleOutlined, ExclamationCircleOutlined, St
import QueryString from 'query-string'; import QueryString from 'query-string';
import React from 'react'; import React from 'react';
import { ERROR_COLOR_HEX, FAILURE_COLOR_HEX, SUCCESS_COLOR_HEX } from '@components/theme/foundations/colors';
// TODO // TODO
import { ANTD_GRAY } from '@app/entityV2/shared/constants'; import { ANTD_GRAY } from '@app/entityV2/shared/constants';
@ -57,9 +59,6 @@ export const getResultText = (result: AssertionResultType) => {
/** /**
* Returns the display color associated with an AssertionResultType * Returns the display color associated with an AssertionResultType
*/ */
const SUCCESS_COLOR_HEX = '#4db31b';
const FAILURE_COLOR_HEX = '#F5222D';
const ERROR_COLOR_HEX = '#FAAD14';
const INIT_COLOR_HEX = '#2F54EB'; const INIT_COLOR_HEX = '#2F54EB';
const NO_RESULTS_COLOR_HEX = ANTD_GRAY[8]; const NO_RESULTS_COLOR_HEX = ANTD_GRAY[8];

7
datahub-web-react/src/app/entityV2/shared/tabs/Dataset/Validations/contract/utils.tsx
View File

@ -7,13 +7,10 @@ import {
} from '@ant-design/icons'; } from '@ant-design/icons';
import React from 'react'; import React from 'react';
import { FAILURE_COLOR_HEX, SUCCESS_COLOR_HEX, WARNING_COLOR_HEX } from '@components/theme/foundations/colors';
import { ANTD_GRAY } from '@app/entityV2/shared/constants'; import { ANTD_GRAY } from '@app/entityV2/shared/constants';
import { AssertionStatusSummary } from '@app/entityV2/shared/tabs/Dataset/Validations/acrylTypes'; import { AssertionStatusSummary } from '@app/entityV2/shared/tabs/Dataset/Validations/acrylTypes';
import {
FAILURE_COLOR_HEX,
SUCCESS_COLOR_HEX,
WARNING_COLOR_HEX,
} from '@app/entityV2/shared/tabs/Dataset/Validations/acrylUtils';
import { DataContractCategoryType } from '@app/entityV2/shared/tabs/Dataset/Validations/contract/builder/types'; import { DataContractCategoryType } from '@app/entityV2/shared/tabs/Dataset/Validations/contract/builder/types';
import { Assertion, AssertionType, DataContract, DataContractState } from '@types'; import { Assertion, AssertionType, DataContract, DataContractState } from '@types';

7
datahub-web-react/src/app/entityV2/shared/tabs/Dataset/Validations/shared/styledComponents.tsx
View File

@ -1,12 +1,9 @@
import { CheckOutlined, ClockCircleOutlined, CloseOutlined, ExclamationCircleOutlined } from '@ant-design/icons'; import { CheckOutlined, ClockCircleOutlined, CloseOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
import styled from 'styled-components'; import styled from 'styled-components';
import { FAILURE_COLOR_HEX, SUCCESS_COLOR_HEX, WARNING_COLOR_HEX } from '@components/theme/foundations/colors';
import { ANTD_GRAY } from '@app/entityV2/shared/constants'; import { ANTD_GRAY } from '@app/entityV2/shared/constants';
import {
FAILURE_COLOR_HEX,
SUCCESS_COLOR_HEX,
WARNING_COLOR_HEX,
} from '@app/entityV2/shared/tabs/Dataset/Validations/acrylUtils';
export const StyledCheckOutlined = styled(CheckOutlined)` export const StyledCheckOutlined = styled(CheckOutlined)`
color: ${SUCCESS_COLOR_HEX}; color: ${SUCCESS_COLOR_HEX};