utils.tsx 2.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. import {Location} from 'history';
  2. import {GridColumnOrder} from 'sentry/components/gridEditable';
  3. import SortLink from 'sentry/components/gridEditable/sortLink';
  4. import {t} from 'sentry/locale';
  5. import {SelectValue} from 'sentry/types';
  6. import {defined} from 'sentry/utils';
  7. import {decodeScalar} from 'sentry/utils/queryString';
  8. type ColorEncoding =
  9. | 'version' // this will use a concatenation of `app_version_name` and `app_version`
  10. | 'device_manufacturer'
  11. | 'device_model'
  12. | 'device_os_version'
  13. | 'transaction_name';
  14. const COLOR_ENCODING_LABELS: Record<ColorEncoding, string> = {
  15. version: t('App Version'),
  16. device_manufacturer: t('Device Manufacturer'),
  17. device_model: t('Device Model'),
  18. device_os_version: t('Device Os Version'),
  19. transaction_name: t('Transaction Name'),
  20. };
  21. export const COLOR_ENCODINGS: SelectValue<ColorEncoding>[] = Object.entries(
  22. COLOR_ENCODING_LABELS
  23. ).map(([value, label]) => ({label, value: value as ColorEncoding}));
  24. export function getColorEncodingFromLocation(location: Location): ColorEncoding {
  25. const colorCoding = decodeScalar(location.query.colorEncoding);
  26. if (defined(colorCoding) && COLOR_ENCODING_LABELS.hasOwnProperty(colorCoding)) {
  27. return colorCoding as ColorEncoding;
  28. }
  29. return 'transaction_name';
  30. }
  31. export function requestAnimationFrameTimeout(cb: () => void, timeout: number) {
  32. const rafId = {current: 0};
  33. const start = performance.now();
  34. function timer() {
  35. if (rafId.current) {
  36. window.cancelAnimationFrame(rafId.current);
  37. }
  38. if (performance.now() - start > timeout) {
  39. cb();
  40. return;
  41. }
  42. rafId.current = window.requestAnimationFrame(timer);
  43. }
  44. rafId.current = window.requestAnimationFrame(timer);
  45. return rafId;
  46. }
  47. export function renderTableHeader<K>(rightAlignedColumns: Set<K>) {
  48. return function (column: GridColumnOrder<K>, _columnIndex: number) {
  49. return (
  50. <SortLink
  51. align={rightAlignedColumns.has(column.key) ? 'right' : 'left'}
  52. title={column.name}
  53. direction={undefined}
  54. canSort={false}
  55. generateSortLink={() => undefined}
  56. />
  57. );
  58. };
  59. }
  60. export const DEFAULT_PROFILING_DATETIME_SELECTION = {
  61. start: null,
  62. end: null,
  63. utc: false,
  64. period: '24h',
  65. };