diff --git a/frontend/app/components/Dashboard/components/WidgetSessions/WidgetSessions.tsx b/frontend/app/components/Dashboard/components/WidgetSessions/WidgetSessions.tsx index 4a935f2a5..9371fbdbb 100644 --- a/frontend/app/components/Dashboard/components/WidgetSessions/WidgetSessions.tsx +++ b/frontend/app/components/Dashboard/components/WidgetSessions/WidgetSessions.tsx @@ -12,6 +12,7 @@ import AnimatedSVG, { ICONS } from 'Shared/AnimatedSVG/AnimatedSVG'; import { numberWithCommas } from 'App/utils'; import { HEATMAP } from 'App/constants/card'; import { connect } from 'react-redux'; +import { Tag } from "antd"; interface Props { className?: string; @@ -32,6 +33,7 @@ function WidgetSessions(props: Props) { const endTime = DateTime.fromMillis(filter.endTimestamp).toFormat('LLL dd, yyyy HH:mm'); const [seriesOptions, setSeriesOptions] = useState([{ label: 'All', value: 'all' }]); const hasFilters = filter.filters.length > 0 || (filter.startTimestamp !== dashboardStore.drillDownPeriod.start || filter.endTimestamp !== dashboardStore.drillDownPeriod.end); + const filterText = filter.filters.length > 0 ? filter.filters[0].value : ''; const writeOption = ({ value }: any) => setActiveSeries(value.value); useEffect(() => { @@ -117,13 +119,16 @@ function WidgetSessions(props: Props) { return (
-
-

{metricStore.clickMapSearch ? 'Clicks' : 'Sessions'}

-
- {metricStore.clickMapLabel ? `on "${metricStore.clickMapLabel}" ` : null} - between {startTime} and{' '} - {endTime}{' '} +
+
+

{metricStore.clickMapSearch ? 'Clicks' : 'Sessions'}

+
+ {metricStore.clickMapLabel ? `on "${metricStore.clickMapLabel}" ` : null} + between {startTime} and{' '} + {endTime}{' '} +
+ {hasFilters && widget.metricType === 'table' &&
{filterText}
}