Rename CertifiedIcon to CertifiedBadge (#17715)

This commit is contained in:
Geido 2021-12-10 20:45:53 +02:00 committed by GitHub
parent b5b6ceb1b3
commit 4b969710e4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 32 additions and 32 deletions

View File

@ -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 = {

View File

@ -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);
});

View File

@ -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;

View File

@ -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}
/>

View File

@ -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}
/>{' '}

View File

@ -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}
/>{' '}

View File

@ -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"

View File

@ -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}
/>{' '}

View File

@ -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}
/>{' '}

View File

@ -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}
/>{' '}

View File

@ -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"