jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

change(ui): table widgets drilldown tag

Browse source
This commit is contained in:
Shekar Siri 2024-09-05 19:39:15 +05:30
parent 840f133f73
commit d73c481ab7
1 changed files with 11 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
frontend/app/components/Dashboard/components/WidgetSessions/WidgetSessions.tsx
View file

@ -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 (
<div className={cn(className, 'bg-white p-3 pb-0 rounded-lg shadow-sm border mt-3')}>
<div className='flex items-center justify-between'>
<div className='flex items-baseline'>
<h2 className='text-xl'>{metricStore.clickMapSearch ? 'Clicks' : 'Sessions'}</h2>
<div className='ml-2 color-gray-medium'>
{metricStore.clickMapLabel ? `on "${metricStore.clickMapLabel}" ` : null}
between <span className='font-medium color-gray-darkest'>{startTime}</span> and{' '}
<span className='font-medium color-gray-darkest'>{endTime}</span>{' '}
<div>
<div className='flex items-baseline'>
<h2 className='text-xl'>{metricStore.clickMapSearch ? 'Clicks' : 'Sessions'}</h2>
<div className='ml-2 color-gray-medium'>
{metricStore.clickMapLabel ? `on "${metricStore.clickMapLabel}" ` : null}
between <span className='font-medium color-gray-darkest'>{startTime}</span> and{' '}
<span className='font-medium color-gray-darkest'>{endTime}</span>{' '}
</div>
</div>
{hasFilters && widget.metricType === 'table' && <div className="py-2"><Tag closable onClose={clearFilters}>{filterText}</Tag></div>}
</div>
<div className='flex items-center gap-4'>