datasetSelector.tsx 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. import {CompactSelect} from 'sentry/components/compactSelect';
  2. import {t} from 'sentry/locale';
  3. import type {NewQuery, SavedQuery} from 'sentry/types';
  4. import EventView from 'sentry/utils/discover/eventView';
  5. import {SavedQueryDatasets} from 'sentry/utils/discover/types';
  6. import {useLocation} from 'sentry/utils/useLocation';
  7. import {useNavigate} from 'sentry/utils/useNavigate';
  8. import useOrganization from 'sentry/utils/useOrganization';
  9. import {DEFAULT_EVENT_VIEW_MAP} from 'sentry/views/discover/data';
  10. import {
  11. getDatasetFromLocationOrSavedQueryDataset,
  12. getSavedQueryDataset,
  13. getSavedQueryWithDataset,
  14. } from 'sentry/views/discover/savedQuery/utils';
  15. export const DATASET_PARAM = 'queryDataset';
  16. export const DATASET_LABEL_MAP = {
  17. [SavedQueryDatasets.ERRORS]: t('Errors'),
  18. [SavedQueryDatasets.TRANSACTIONS]: t('Transactions'),
  19. [SavedQueryDatasets.DISCOVER]: t('Unknown'),
  20. };
  21. type Props = {
  22. eventView: EventView;
  23. isHomepage: boolean | undefined;
  24. savedQuery: SavedQuery | undefined;
  25. splitDecision?: SavedQueryDatasets;
  26. };
  27. export function DatasetSelector(props: Props) {
  28. const {savedQuery, isHomepage, splitDecision, eventView} = props;
  29. const location = useLocation();
  30. const organization = useOrganization();
  31. const navigate = useNavigate();
  32. const value = getSavedQueryDataset(organization, location, savedQuery, splitDecision);
  33. const options = [
  34. {
  35. value: SavedQueryDatasets.ERRORS,
  36. label: DATASET_LABEL_MAP[SavedQueryDatasets.ERRORS],
  37. },
  38. {
  39. value: SavedQueryDatasets.TRANSACTIONS,
  40. label: DATASET_LABEL_MAP[SavedQueryDatasets.TRANSACTIONS],
  41. },
  42. ];
  43. if (value === 'discover') {
  44. options.push({
  45. value: SavedQueryDatasets.DISCOVER,
  46. label: DATASET_LABEL_MAP[SavedQueryDatasets.DISCOVER],
  47. });
  48. }
  49. return (
  50. <CompactSelect
  51. triggerProps={{prefix: t('Dataset')}}
  52. value={value}
  53. options={options}
  54. onChange={newValue => {
  55. let nextEventView: EventView;
  56. if (eventView.id) {
  57. nextEventView = eventView.withDataset(
  58. getDatasetFromLocationOrSavedQueryDataset(undefined, newValue.value)
  59. );
  60. } else {
  61. const query = getSavedQueryWithDataset(
  62. DEFAULT_EVENT_VIEW_MAP[newValue.value]
  63. ) as NewQuery;
  64. nextEventView = EventView.fromNewQueryWithLocation(query, location);
  65. }
  66. const nextLocation = nextEventView.getResultsViewUrlTarget(
  67. organization.slug,
  68. isHomepage
  69. );
  70. navigate({
  71. ...location,
  72. query: {
  73. ...nextLocation.query,
  74. [DATASET_PARAM]: newValue.value,
  75. },
  76. });
  77. }}
  78. />
  79. );
  80. }