refactor: icon to icons for filterbadge components (#15557)

* initial commit

* fix test
This commit is contained in:
Phillip Kelley-Dotson 2021-07-07 20:53:35 -07:00 committed by GitHub
parent ae160f7f21
commit abd999bd6b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 7 additions and 8 deletions

View File

@ -38,7 +38,7 @@ describe('Dashboard filter', () => {
cy.get('.Select__placeholder:first').click();
// should show the filter indicator
cy.get('svg[data-test="filter"]:visible').should(nodes => {
cy.get('span[aria-label="filter"]:visible').should(nodes => {
expect(nodes.length).to.least(9);
});
@ -50,7 +50,7 @@ describe('Dashboard filter', () => {
cy.get('.Select__menu').first().contains('South Asia').click();
// should still have all filter indicators
cy.get('svg[data-test="filter"]:visible').should(nodes => {
cy.get('span[aria-label="filter"]:visible').should(nodes => {
expect(nodes.length).to.least(9);
});

View File

@ -26,7 +26,7 @@ import {
} from '@ant-design/icons';
import Popover from 'src/components/Popover';
import Collapse from 'src/components/Collapse';
import Icon from 'src/components/Icon';
import Icons from 'src/components/Icons';
import {
Indent,
Panel,
@ -169,9 +169,9 @@ const DetailsPanelPopover = ({
key="appliedCrossFilters"
header={
<Title bold color={theme.colors.primary.light1}>
<Icon
name="cross-filter-badge"
<Icons.CursorTarget
css={{ fill: theme.colors.primary.light1 }}
iconSize="xl"
/>
{t(
'Applied Cross Filters (%d)',

View File

@ -35,7 +35,7 @@ export const Pill = styled.div`
svg {
position: relative;
top: -1px;
top: -2px;
color: ${({ theme }) => theme.colors.grayscale.light5};
width: 1em;
height: 1em;

View File

@ -20,7 +20,6 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { useDispatch, useSelector } from 'react-redux';
import { uniqWith } from 'lodash';
import cx from 'classnames';
import Icon from 'src/components/Icon';
import Icons from 'src/components/Icons';
import { usePrevious } from 'src/common/hooks/usePrevious';
import { DataMaskStateWithId } from 'src/dataMask/types';
@ -199,7 +198,7 @@ export const FiltersBadge = ({ chartId }: FiltersBadgeProps) => {
isInactive && 'filters-inactive',
)}
>
<Icon name="filter" />
<Icons.Filter iconSize="m" />
{!isInactive && (
<span data-test="applied-filter-count">
{appliedIndicators.length + appliedCrossFilterIndicators.length}