durationChart.tsx 951 B

123456789101112131415161718192021222324252627282930313233
  1. import type {Series} from 'sentry/types/echarts';
  2. import {CHART_HEIGHT} from 'sentry/views/performance/database/settings';
  3. import {AVG_COLOR} from 'sentry/views/starfish/colours';
  4. import Chart, {ChartType} from 'sentry/views/starfish/components/chart';
  5. import ChartPanel from 'sentry/views/starfish/components/chartPanel';
  6. import {getDurationChartTitle} from 'sentry/views/starfish/views/spans/types';
  7. interface Props {
  8. isLoading: boolean;
  9. series: Series;
  10. error?: Error | null;
  11. }
  12. export function DurationChart({series, isLoading, error}: Props) {
  13. return (
  14. <ChartPanel title={getDurationChartTitle('http')}>
  15. <Chart
  16. height={CHART_HEIGHT}
  17. grid={{
  18. left: '0',
  19. right: '0',
  20. top: '8px',
  21. bottom: '0',
  22. }}
  23. data={[series]}
  24. loading={isLoading}
  25. error={error}
  26. chartColors={[AVG_COLOR]}
  27. type={ChartType.LINE}
  28. />
  29. </ChartPanel>
  30. );
  31. }