diff --git a/internal/portal/src/scenes/DestinationsList/DestinationEventsCell.tsx b/internal/portal/src/scenes/DestinationsList/DestinationEventsCell.tsx index 2b12cf7c..dc52fc42 100644 --- a/internal/portal/src/scenes/DestinationsList/DestinationEventsCell.tsx +++ b/internal/portal/src/scenes/DestinationsList/DestinationEventsCell.tsx @@ -4,10 +4,9 @@ import type { MetricsDataPoint } from "../../common/MetricsChart/useMetrics"; interface DestinationEventsCellProps { metricsData?: MetricsDataPoint[]; isLoading: boolean; + sampleCount: number; } -const EMPTY_SERIES_SAMPLE_COUNT = 6; - function formatCount(n: number): string { if (n >= 1_000_000) return `${(n / 1_000_000).toFixed(1)}M`; if (n >= 1_000) return `${(n / 1_000).toFixed(1)}k`; @@ -17,6 +16,7 @@ function formatCount(n: number): string { const DestinationEventsCell: React.FC = ({ metricsData, isLoading, + sampleCount, }) => { if (isLoading || !metricsData) { return ; @@ -28,7 +28,7 @@ const DestinationEventsCell: React.FC = ({ successful: d.metrics.successful_count ?? 0, failed: d.metrics.failed_count ?? 0, })) - : Array.from({ length: EMPTY_SERIES_SAMPLE_COUNT }, () => ({ + : Array.from({ length: sampleCount }, () => ({ successful: 0, failed: 0, })); diff --git a/internal/portal/src/scenes/DestinationsList/DestinationList.tsx b/internal/portal/src/scenes/DestinationsList/DestinationList.tsx index 51b633f1..2f053553 100644 --- a/internal/portal/src/scenes/DestinationsList/DestinationList.tsx +++ b/internal/portal/src/scenes/DestinationsList/DestinationList.tsx @@ -18,6 +18,8 @@ import type { Destination } from "../../typings/Destination"; import getLogo from "../../utils/logo"; import DestinationEventsCell from "./DestinationEventsCell"; +const DEFAULT_METRICS_SAMPLE_COUNT = 7; + const DestinationList: React.FC = () => { const { data: destinations } = useSWR("destinations"); const destination_types = useDestinationTypes(); @@ -35,6 +37,9 @@ const DestinationList: React.FC = () => { filters: {}, }, ); + const metricsSampleCount = + Object.values(batchedMetrics ?? {}).find((points) => points.length > 0) + ?.length ?? DEFAULT_METRICS_SAMPLE_COUNT; const [searchTerm, setSearchTerm] = useState(""); const [selectedStatus, setSelectedStatus] = useState>( @@ -146,6 +151,7 @@ const DestinationList: React.FC = () => { : undefined } isLoading={metricsLoading} + sampleCount={metricsSampleCount} />, ].filter((entry) => entry !== null), link: `/destinations/${destination.id}`,