utils.tsx 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
  1. import {Query} from 'history';
  2. import cloneDeep from 'lodash/cloneDeep';
  3. import pick from 'lodash/pick';
  4. import WidgetArea from 'sentry-images/dashboard/widget-area.svg';
  5. import WidgetBar from 'sentry-images/dashboard/widget-bar.svg';
  6. import WidgetBigNumber from 'sentry-images/dashboard/widget-big-number.svg';
  7. import WidgetLine from 'sentry-images/dashboard/widget-line-1.svg';
  8. import WidgetTable from 'sentry-images/dashboard/widget-table.svg';
  9. import WidgetWorldMap from 'sentry-images/dashboard/widget-world-map.svg';
  10. import {parseArithmetic} from 'sentry/components/arithmeticInput/parser';
  11. import {getDiffInMinutes, getInterval} from 'sentry/components/charts/utils';
  12. import {PageFilters} from 'sentry/types';
  13. import {getUtcDateString, parsePeriodToHours} from 'sentry/utils/dates';
  14. import EventView from 'sentry/utils/discover/eventView';
  15. import {isEquation, stripEquationPrefix} from 'sentry/utils/discover/fields';
  16. import {
  17. DashboardDetails,
  18. DisplayType,
  19. Widget,
  20. WidgetQuery,
  21. WidgetType,
  22. } from 'sentry/views/dashboardsV2/types';
  23. export function cloneDashboard(dashboard: DashboardDetails): DashboardDetails {
  24. return cloneDeep(dashboard);
  25. }
  26. export function eventViewFromWidget(
  27. title: string,
  28. query: WidgetQuery,
  29. selection: PageFilters,
  30. widgetDisplayType?: DisplayType
  31. ): EventView {
  32. const {start, end, period: statsPeriod} = selection.datetime;
  33. const {projects, environments} = selection;
  34. // World Map requires an additional column (geo.country_code) to display in discover when navigating from the widget
  35. const fields =
  36. widgetDisplayType === DisplayType.WORLD_MAP &&
  37. !query.fields.includes('geo.country_code')
  38. ? ['geo.country_code', ...query.fields]
  39. : query.fields;
  40. const conditions =
  41. widgetDisplayType === DisplayType.WORLD_MAP &&
  42. !query.conditions.includes('has:geo.country_code')
  43. ? `${query.conditions} has:geo.country_code`.trim()
  44. : query.conditions;
  45. return EventView.fromSavedQuery({
  46. id: undefined,
  47. name: title,
  48. version: 2,
  49. fields,
  50. query: conditions,
  51. orderby: query.orderby,
  52. projects,
  53. range: statsPeriod ?? undefined,
  54. start: start ? getUtcDateString(start) : undefined,
  55. end: end ? getUtcDateString(end) : undefined,
  56. environment: environments,
  57. });
  58. }
  59. function coerceStringToArray(value?: string | string[] | null) {
  60. return typeof value === 'string' ? [value] : value;
  61. }
  62. export function constructWidgetFromQuery(query?: Query): Widget | undefined {
  63. if (query) {
  64. const queryNames = coerceStringToArray(query.queryNames);
  65. const queryConditions = coerceStringToArray(query.queryConditions);
  66. const queryFields = coerceStringToArray(query.queryFields);
  67. const queries: WidgetQuery[] = [];
  68. if (
  69. queryConditions &&
  70. queryNames &&
  71. queryFields &&
  72. typeof query.queryOrderby === 'string'
  73. ) {
  74. queryConditions.forEach((condition, index) => {
  75. queries.push({
  76. name: queryNames[index],
  77. conditions: condition,
  78. fields: queryFields,
  79. orderby: query.queryOrderby as string,
  80. });
  81. });
  82. }
  83. if (query.title && query.displayType && query.interval && queries.length > 0) {
  84. const newWidget: Widget = {
  85. ...(pick(query, ['title', 'displayType', 'interval']) as {
  86. displayType: DisplayType;
  87. interval: string;
  88. title: string;
  89. }),
  90. widgetType: WidgetType.DISCOVER,
  91. queries,
  92. };
  93. return newWidget;
  94. }
  95. }
  96. return undefined;
  97. }
  98. export function miniWidget(displayType: DisplayType): string {
  99. switch (displayType) {
  100. case DisplayType.BAR:
  101. return WidgetBar;
  102. case DisplayType.AREA:
  103. case DisplayType.TOP_N:
  104. return WidgetArea;
  105. case DisplayType.BIG_NUMBER:
  106. return WidgetBigNumber;
  107. case DisplayType.TABLE:
  108. return WidgetTable;
  109. case DisplayType.WORLD_MAP:
  110. return WidgetWorldMap;
  111. case DisplayType.LINE:
  112. default:
  113. return WidgetLine;
  114. }
  115. }
  116. export function getWidgetInterval(
  117. widget: Widget,
  118. datetimeObj: Partial<PageFilters['datetime']>
  119. ): string {
  120. // Don't fetch more than 66 bins as we're plotting on a small area.
  121. const MAX_BIN_COUNT = 66;
  122. // Bars charts are daily totals to aligned with discover. It also makes them
  123. // usefully different from line/area charts until we expose the interval control, or remove it.
  124. let interval = widget.displayType === 'bar' ? '1d' : widget.interval;
  125. if (!interval) {
  126. // Default to 5 minutes
  127. interval = '5m';
  128. }
  129. const desiredPeriod = parsePeriodToHours(interval);
  130. const selectedRange = getDiffInMinutes(datetimeObj);
  131. // selectedRange is in minutes, desiredPeriod is in hours
  132. // convert desiredPeriod to minutes
  133. if (selectedRange / (desiredPeriod * 60) > MAX_BIN_COUNT) {
  134. const highInterval = getInterval(datetimeObj, 'high');
  135. // Only return high fidelity interval if desired interval is higher fidelity
  136. if (desiredPeriod < parsePeriodToHours(highInterval)) {
  137. return highInterval;
  138. }
  139. }
  140. return interval;
  141. }
  142. export function getFieldsFromEquations(fields: string[]): string[] {
  143. // Gather all fields and functions used in equations and prepend them to the provided fields
  144. const termsSet: Set<string> = new Set();
  145. fields.filter(isEquation).forEach(field => {
  146. const parsed = parseArithmetic(stripEquationPrefix(field)).tc;
  147. parsed.fields.forEach(({term}) => termsSet.add(term as string));
  148. parsed.functions.forEach(({term}) => termsSet.add(term as string));
  149. });
  150. return Array.from(termsSet);
  151. }