mirror of https://github.com/apache/superset.git
Rename CertifiedIcon to CertifiedBadge (#17715)
This commit is contained in:
parent
b5b6ceb1b3
commit
4b969710e4
|
@ -17,14 +17,14 @@
|
|||
* under the License.
|
||||
*/
|
||||
import React from 'react';
|
||||
import CertifiedIcon, { CertifiedIconProps } from '.';
|
||||
import CertifiedBadge, { CertifiedBadgeProps } from '.';
|
||||
|
||||
export default {
|
||||
title: 'CertifiedIconWithTooltip',
|
||||
title: 'CertifiedBadgeWithTooltip',
|
||||
};
|
||||
|
||||
export const InteractiveIcon = (args: CertifiedIconProps) => (
|
||||
<CertifiedIcon {...args} />
|
||||
export const InteractiveIcon = (args: CertifiedBadgeProps) => (
|
||||
<CertifiedBadge {...args} />
|
||||
);
|
||||
|
||||
InteractiveIcon.args = {
|
|
@ -19,29 +19,29 @@
|
|||
import React from 'react';
|
||||
import { render, screen } from 'spec/helpers/testing-library';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import CertifiedIcon from 'src/components/CertifiedIcon';
|
||||
import CertifiedBadge from 'src/components/CertifiedBadge';
|
||||
|
||||
test('renders with default props', () => {
|
||||
render(<CertifiedIcon />);
|
||||
render(<CertifiedBadge />);
|
||||
expect(screen.getByRole('img')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
test('renders a tooltip when hovered', async () => {
|
||||
render(<CertifiedIcon />);
|
||||
render(<CertifiedBadge />);
|
||||
userEvent.hover(screen.getByRole('img'));
|
||||
expect(await screen.findByRole('tooltip')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
test('renders with certified by', async () => {
|
||||
const certifiedBy = 'Trusted Authority';
|
||||
render(<CertifiedIcon certifiedBy={certifiedBy} />);
|
||||
render(<CertifiedBadge certifiedBy={certifiedBy} />);
|
||||
userEvent.hover(screen.getByRole('img'));
|
||||
expect(await screen.findByRole('tooltip')).toHaveTextContent(certifiedBy);
|
||||
});
|
||||
|
||||
test('renders with details', async () => {
|
||||
const details = 'All requirements have been met.';
|
||||
render(<CertifiedIcon details={details} />);
|
||||
render(<CertifiedBadge details={details} />);
|
||||
userEvent.hover(screen.getByRole('img'));
|
||||
expect(await screen.findByRole('tooltip')).toHaveTextContent(details);
|
||||
});
|
|
@ -21,17 +21,17 @@ import { t, supersetTheme } from '@superset-ui/core';
|
|||
import Icons, { IconType } from 'src/components/Icons';
|
||||
import { Tooltip } from 'src/components/Tooltip';
|
||||
|
||||
export interface CertifiedIconProps {
|
||||
export interface CertifiedBadgeProps {
|
||||
certifiedBy?: string;
|
||||
details?: string;
|
||||
size?: IconType['iconSize'];
|
||||
}
|
||||
|
||||
function CertifiedIcon({
|
||||
function CertifiedBadge({
|
||||
certifiedBy,
|
||||
details,
|
||||
size = 'l',
|
||||
}: CertifiedIconProps) {
|
||||
}: CertifiedBadgeProps) {
|
||||
return (
|
||||
<Tooltip
|
||||
id="certified-details-tooltip"
|
||||
|
@ -54,4 +54,4 @@ function CertifiedIcon({
|
|||
);
|
||||
}
|
||||
|
||||
export default CertifiedIcon;
|
||||
export default CertifiedBadge;
|
|
@ -30,7 +30,7 @@ import { Select } from 'src/components';
|
|||
import { FormLabel } from 'src/components/Form';
|
||||
import Button from 'src/components/Button';
|
||||
import Tabs from 'src/components/Tabs';
|
||||
import CertifiedIcon from 'src/components/CertifiedIcon';
|
||||
import CertifiedBadge from 'src/components/CertifiedBadge';
|
||||
import WarningIconWithTooltip from 'src/components/WarningIconWithTooltip';
|
||||
import DatabaseSelector from 'src/components/DatabaseSelector';
|
||||
import Label from 'src/components/Label';
|
||||
|
@ -292,7 +292,7 @@ function ColumnCollectionTable({
|
|||
editableColumnName ? (
|
||||
<StyledLabelWrapper>
|
||||
{record.is_certified && (
|
||||
<CertifiedIcon
|
||||
<CertifiedBadge
|
||||
certifiedBy={record.certified_by}
|
||||
details={record.certification_details}
|
||||
/>
|
||||
|
@ -302,7 +302,7 @@ function ColumnCollectionTable({
|
|||
) : (
|
||||
<StyledLabelWrapper>
|
||||
{record.is_certified && (
|
||||
<CertifiedIcon
|
||||
<CertifiedBadge
|
||||
certifiedBy={record.certified_by}
|
||||
details={record.certification_details}
|
||||
/>
|
||||
|
@ -1113,7 +1113,7 @@ class DatasourceEditor extends React.PureComponent {
|
|||
metric_name: (v, onChange, _, record) => (
|
||||
<FlexRowContainer>
|
||||
{record.is_certified && (
|
||||
<CertifiedIcon
|
||||
<CertifiedBadge
|
||||
certifiedBy={record.certified_by}
|
||||
details={record.certification_details}
|
||||
/>
|
||||
|
|
|
@ -20,7 +20,7 @@ import React, { useEffect, useState, useRef } from 'react';
|
|||
import cx from 'classnames';
|
||||
import { styled, t } from '@superset-ui/core';
|
||||
import { Tooltip } from 'src/components/Tooltip';
|
||||
import CertifiedIcon from '../CertifiedIcon';
|
||||
import CertifiedBadge from '../CertifiedBadge';
|
||||
|
||||
export interface EditableTitleProps {
|
||||
canEdit?: boolean;
|
||||
|
@ -39,7 +39,7 @@ export interface EditableTitleProps {
|
|||
certificationDetails?: string;
|
||||
}
|
||||
|
||||
const StyledCertifiedIcon = styled(CertifiedIcon)`
|
||||
const StyledCertifiedBadge = styled(CertifiedBadge)`
|
||||
vertical-align: middle;
|
||||
`;
|
||||
|
||||
|
@ -233,7 +233,7 @@ export default function EditableTitle({
|
|||
>
|
||||
{certifiedBy && (
|
||||
<>
|
||||
<StyledCertifiedIcon
|
||||
<StyledCertifiedBadge
|
||||
certifiedBy={certifiedBy}
|
||||
details={certificationDetails}
|
||||
/>{' '}
|
||||
|
|
|
@ -21,7 +21,7 @@ import { styled, useTheme } from '@superset-ui/core';
|
|||
import { AntdCard, Skeleton, ThinSkeleton } from 'src/common/components';
|
||||
import { Tooltip } from 'src/components/Tooltip';
|
||||
import ImageLoader, { BackgroundPosition } from './ImageLoader';
|
||||
import CertifiedIcon from '../CertifiedIcon';
|
||||
import CertifiedBadge from '../CertifiedBadge';
|
||||
|
||||
const ActionsWrapper = styled.div`
|
||||
width: 64px;
|
||||
|
@ -257,7 +257,7 @@ function ListViewCard({
|
|||
<Link to={url!}>
|
||||
{certifiedBy && (
|
||||
<>
|
||||
<CertifiedIcon
|
||||
<CertifiedBadge
|
||||
certifiedBy={certifiedBy}
|
||||
details={certificationDetails}
|
||||
/>{' '}
|
||||
|
|
|
@ -31,7 +31,7 @@ import DatabaseSelector, {
|
|||
DatabaseObject,
|
||||
} from 'src/components/DatabaseSelector';
|
||||
import RefreshLabel from 'src/components/RefreshLabel';
|
||||
import CertifiedIcon from 'src/components/CertifiedIcon';
|
||||
import CertifiedBadge from 'src/components/CertifiedBadge';
|
||||
import WarningIconWithTooltip from 'src/components/WarningIconWithTooltip';
|
||||
|
||||
const TableSelectorWrapper = styled.div`
|
||||
|
@ -123,7 +123,7 @@ const TableOption = ({ table }: { table: Table }) => {
|
|||
<Icons.Table iconSize="m" />
|
||||
)}
|
||||
{extra?.certification && (
|
||||
<CertifiedIcon
|
||||
<CertifiedBadge
|
||||
certifiedBy={extra.certification.certified_by}
|
||||
details={extra.certification.details}
|
||||
size="l"
|
||||
|
|
|
@ -44,7 +44,7 @@ import Timer from 'src/components/Timer';
|
|||
import CachedLabel from 'src/components/CachedLabel';
|
||||
import PropertiesModal from 'src/explore/components/PropertiesModal';
|
||||
import { sliceUpdated } from 'src/explore/actions/exploreActions';
|
||||
import CertifiedIcon from 'src/components/CertifiedIcon';
|
||||
import CertifiedBadge from 'src/components/CertifiedBadge';
|
||||
import ExploreActionButtons from '../ExploreActionButtons';
|
||||
import RowCountLabel from '../RowCountLabel';
|
||||
|
||||
|
@ -269,7 +269,7 @@ export class ExploreChartHeader extends React.PureComponent {
|
|||
<div className="title-panel">
|
||||
{slice?.certified_by && (
|
||||
<>
|
||||
<CertifiedIcon
|
||||
<CertifiedBadge
|
||||
certifiedBy={slice.certified_by}
|
||||
details={slice.certification_details}
|
||||
/>{' '}
|
||||
|
|
|
@ -58,7 +58,7 @@ import { Tooltip } from 'src/components/Tooltip';
|
|||
import Icons from 'src/components/Icons';
|
||||
import { nativeFilterGate } from 'src/dashboard/components/nativeFilters/utils';
|
||||
import setupPlugins from 'src/setup/setupPlugins';
|
||||
import CertifiedIcon from 'src/components/CertifiedIcon';
|
||||
import CertifiedBadge from 'src/components/CertifiedBadge';
|
||||
import ChartCard from './ChartCard';
|
||||
|
||||
const PAGE_SIZE = 25;
|
||||
|
@ -249,7 +249,7 @@ function ChartList(props: ChartListProps) {
|
|||
<a href={url} data-test={`${sliceName}-list-chart-title`}>
|
||||
{certifiedBy && (
|
||||
<>
|
||||
<CertifiedIcon
|
||||
<CertifiedBadge
|
||||
certifiedBy={certifiedBy}
|
||||
details={certificationDetails}
|
||||
/>{' '}
|
||||
|
|
|
@ -49,7 +49,7 @@ import ImportModelsModal from 'src/components/ImportModal/index';
|
|||
import OmniContainer from 'src/components/OmniContainer';
|
||||
|
||||
import Dashboard from 'src/dashboard/containers/Dashboard';
|
||||
import CertifiedIcon from 'src/components/CertifiedIcon';
|
||||
import CertifiedBadge from 'src/components/CertifiedBadge';
|
||||
import DashboardCard from './DashboardCard';
|
||||
import { DashboardStatus } from './types';
|
||||
|
||||
|
@ -266,7 +266,7 @@ function DashboardList(props: DashboardListProps) {
|
|||
<Link to={url}>
|
||||
{certifiedBy && (
|
||||
<>
|
||||
<CertifiedIcon
|
||||
<CertifiedBadge
|
||||
certifiedBy={certifiedBy}
|
||||
details={certificationDetails}
|
||||
/>{' '}
|
||||
|
|
|
@ -51,7 +51,7 @@ import withToasts from 'src/components/MessageToasts/withToasts';
|
|||
import { Tooltip } from 'src/components/Tooltip';
|
||||
import Icons from 'src/components/Icons';
|
||||
import FacePile from 'src/components/FacePile';
|
||||
import CertifiedIcon from 'src/components/CertifiedIcon';
|
||||
import CertifiedBadge from 'src/components/CertifiedBadge';
|
||||
import InfoTooltip from 'src/components/InfoTooltip';
|
||||
import ImportModelsModal from 'src/components/ImportModal/index';
|
||||
import { isFeatureEnabled, FeatureFlag } from 'src/featureFlags';
|
||||
|
@ -254,7 +254,7 @@ const DatasetList: FunctionComponent<DatasetListProps> = ({
|
|||
return (
|
||||
<FlexRowContainer>
|
||||
{parsedExtra?.certification && (
|
||||
<CertifiedIcon
|
||||
<CertifiedBadge
|
||||
certifiedBy={parsedExtra.certification.certified_by}
|
||||
details={parsedExtra.certification.details}
|
||||
size="l"
|
||||
|
|
Loading…
Reference in New Issue