feat(discover2) Make pagination functional again (#14395)

Restore the pagination button behavior and make the oldest/newest links
work as intended. We now pass `field` to the API to allow pagination
event ids to be constrained by the current event or 'reference' event.
We use the group conditions and reference event values to ensure that
the next/previous event are in the same 'group' as the modal looks at
groupings of events now.

Remove the `issue_title` alias. Using/having this alias makes grouping 
events into errors harder as the title doesn't serve as a grouping value
for pagination. By using a simple title we can paginate more easily in the
modal view, and we have less complexity overall.

Refs SEN-887

Author: markstory

src/sentry/api/bases/organization_events.py

@@ -8,6 +8,11 @@
 from sentry.models.project import Project
 
 
+class Direction(object):
+    NEXT = 0
+    PREV = 1
+
+
 class OrganizationEventsEndpointBase(OrganizationEndpoint):
     def get_snuba_query_args(self, request, organization, params):
         query = request.GET.get("query")
@@ -109,3 +114,36 @@ def prev_event_id(self, request, organization, snuba_args, event):
 
         if prev_event:
             return prev_event[1]
+
+    def oldest_event_id(self, snuba_args, event):
+        """
+        Returns the oldest event ID if there is a subsequent event matching the
+        conditions provided
+        """
+        return self._get_terminal_event_id(Direction.PREV, snuba_args, event)
+
+    def latest_event_id(self, snuba_args, event):
+        """
+        Returns the latest event ID if there is a newer event matching the
+        conditions provided
+        """
+        return self._get_terminal_event_id(Direction.NEXT, snuba_args, event)
+
+    def _get_terminal_event_id(self, direction, snuba_args, event):
+        if direction == Direction.NEXT:
+            time_condition = [["timestamp", ">", event.timestamp]]
+            orderby = ["-timestamp", "-event_id"]
+        else:
+            time_condition = [["timestamp", "<", event.timestamp]]
+            orderby = ["timestamp", "event_id"]
+
+        conditions = snuba_args["conditions"][:]
+        conditions.extend(time_condition)
+
+        result = eventstore.get_events(
+            conditions=conditions, filter_keys=snuba_args["filter_keys"], orderby=orderby, limit=1
+        )
+        if not result:
+            return None
+
+        return result[0].event_id

src/sentry/api/endpoints/organization_event_details.py

@@ -5,6 +5,7 @@
 from enum import Enum
 
 from sentry.api.bases import OrganizationEventsEndpointBase, OrganizationEventsError, NoProjects
+from sentry.api.event_search import get_reference_event_conditions
 from sentry import eventstore, features
 from sentry.models import SnubaEvent
 from sentry.models.project import Project
@@ -37,11 +38,17 @@ def get(self, request, organization, project_slug, event_id):
 
         # We return the requested event if we find a match regardless of whether
         # it occurred within the range specified
-        event = eventstore.get_event_by_id(project.id, event_id)
+        event = eventstore.get_event_by_id(project.id, event_id, eventstore.full_columns)
 
         if event is None:
             return Response({"detail": "Event not found"}, status=404)
 
+        # Scope the pagination related event ids to the current event
+        # This ensure that if a field list/groupby conditions were provided
+        # that we constrain related events to the query + current event values
+        snuba_args["conditions"].extend(
+            get_reference_event_conditions(snuba_args, event.snuba_data)
+        )
         next_event = eventstore.get_next_event_id(
             event, conditions=snuba_args["conditions"], filter_keys=snuba_args["filter_keys"]
         )
@@ -52,7 +59,8 @@ def get(self, request, organization, project_slug, event_id):
         data = serialize(event)
         data["nextEventID"] = next_event[1] if next_event else None
         data["previousEventID"] = prev_event[1] if prev_event else None
-
+        data["oldestEventID"] = self.oldest_event_id(snuba_args, event)
+        data["latestEventID"] = self.latest_event_id(snuba_args, event)
         data["projectSlug"] = project_slug
 
         return Response(data)

src/sentry/api/event_search.py

@@ -12,15 +12,16 @@
 from parsimonious.nodes import Node
 from parsimonious.grammar import Grammar, NodeVisitor
 
+from sentry import eventstore
+from sentry.models import Project
 from sentry.search.utils import (
     parse_datetime_range,
     parse_datetime_string,
     parse_datetime_value,
     InvalidQuery,
 )
 from sentry.utils.dates import to_timestamp
-from sentry.utils.snuba import SENTRY_SNUBA_MAP
-from sentry.models import Project
+from sentry.utils.snuba import SENTRY_SNUBA_MAP, get_snuba_column_name
 
 WILDCARD_CHARS = re.compile(r"[\*]")
 
@@ -650,7 +651,6 @@ def get_snuba_query_args(query=None, params=None):
 
 
 FIELD_ALIASES = {
-    "issue_title": {"aggregations": [["anyHeavy", "title", "issue_title"]]},
     "last_seen": {"aggregations": [["max", "timestamp", "last_seen"]]},
     "latest_event": {
         "aggregations": [
@@ -800,3 +800,44 @@ def resolve_field_list(fields, snuba_args):
         "groupby": groupby,
         "orderby": orderby,
     }
+
+
+def find_reference_event(snuba_args, reference_event_id):
+    try:
+        project_slug, event_id = reference_event_id.split(":")
+    except ValueError:
+        raise InvalidSearchQuery("Invalid reference event")
+    try:
+        project = Project.objects.get(
+            slug=project_slug, id__in=snuba_args["filter_keys"]["project_id"]
+        )
+    except Project.DoesNotExist:
+        raise InvalidSearchQuery("Invalid reference event")
+
+    reference_event = eventstore.get_event_by_id(project.id, event_id, eventstore.full_columns)
+    if not reference_event:
+        raise InvalidSearchQuery("Invalid reference event")
+
+    return reference_event
+
+
+def get_reference_event_conditions(snuba_args, reference_event):
+    """
+    Returns a list of additional conditions/filter_keys to
+    scope a query by the groupby fields using values from the reference event
+
+    This is a key part of pagination in the event details modal and
+    summary graph navigation.
+    """
+    conditions = []
+
+    # If we were given an project/event to use build additional
+    # conditions using that event and the non-aggregated columns
+    # we received in the querystring. This lets us find the oldest/newest.
+    # This only handles simple fields on the snuba_data dict.
+    for field in snuba_args.get("groupby", []):
+        prop = get_snuba_column_name(field)
+        value = reference_event.get(prop, None)
+        if value:
+            conditions.append([prop, "=", value])
+    return conditions

src/sentry/eventstore/base.py

@@ -23,6 +23,7 @@ class Columns(Enum):
     IP_ADDRESS = "ip_address"
     USER_ID = "user_id"
     USERNAME = "username"
+    TRANSACTION = "transaction"
 
 
 class EventStorage(Service):
@@ -50,6 +51,7 @@ class EventStorage(Service):
         Columns.PLATFORM,
         Columns.TITLE,
         Columns.TYPE,
+        Columns.TRANSACTION,
         # Required to provide snuba-only tags
         Columns.TAGS_KEY,
         Columns.TAGS_VALUE,

src/sentry/static/sentry/app/views/organizationEventsV2/data.jsx

@@ -17,7 +17,7 @@ import {QueryLink} from './styles';
 
 export const MODAL_QUERY_KEYS = ['eventSlug'];
 export const PIN_ICON = `image://${pinIcon}`;
-export const AGGREGATE_ALIASES = ['issue_title', 'last_seen', 'latest_event'];
+export const AGGREGATE_ALIASES = ['last_seen', 'latest_event'];
 
 export const ALL_VIEWS = deepFreeze([
   {
@@ -42,9 +42,9 @@ export const ALL_VIEWS = deepFreeze([
     id: 'errors',
     name: t('Errors'),
     data: {
-      fields: ['issue_title', 'count(id)', 'count_unique(user)', 'project', 'last_seen'],
+      fields: ['title', 'count(id)', 'count_unique(user)', 'project', 'last_seen'],
       columnNames: ['error', 'events', 'users', 'project', 'last seen'],
-      sort: ['-last_seen', '-issue_title'],
+      sort: ['-last_seen', '-title'],
       query: 'event.type:error',
     },
     tags: ['error.type', 'project.name'],
@@ -54,9 +54,9 @@ export const ALL_VIEWS = deepFreeze([
     id: 'csp',
     name: t('CSP'),
     data: {
-      fields: ['issue_title', 'count(id)', 'count_unique(user)', 'project', 'last_seen'],
+      fields: ['title', 'count(id)', 'count_unique(user)', 'project', 'last_seen'],
       columnNames: ['csp', 'events', 'users', 'project', 'last seen'],
-      sort: ['-last_seen', '-issue_title'],
+      sort: ['-last_seen', '-title'],
       query: 'event.type:csp',
     },
     tags: [
@@ -164,11 +164,12 @@ export const SPECIAL_FIELDS = {
   transaction: {
     sortField: 'transaction',
     renderFunc: (data, {location}) => {
+      const id = data.id || data.latest_event;
       const target = {
         pathname: location.pathname,
         query: {
           ...location.query,
-          eventSlug: `${data['project.name']}:${data.latest_event}`,
+          eventSlug: `${data['project.name']}:${id}`,
         },
       };
       return (
@@ -183,9 +184,10 @@ export const SPECIAL_FIELDS = {
   title: {
     sortField: 'title',
     renderFunc: (data, {location}) => {
+      const id = data.id || data.latest_event;
       const target = {
         pathname: location.pathname,
-        query: {...location.query, eventSlug: `${data['project.name']}:${data.id}`},
+        query: {...location.query, eventSlug: `${data['project.name']}:${id}`},
       };
       return (
         <Container>
@@ -255,25 +257,6 @@ export const SPECIAL_FIELDS = {
       return <QueryLink to={target}>{badge}</QueryLink>;
     },
   },
-  issue_title: {
-    sortField: 'issue_title',
-    renderFunc: (data, {location}) => {
-      const target = {
-        pathname: location.pathname,
-        query: {
-          ...location.query,
-          eventSlug: `${data['project.name']}:${data.latest_event}`,
-        },
-      };
-      return (
-        <Container>
-          <Link css={overflowEllipsis} to={target} aria-label={data.issue_title}>
-            {data.issue_title}
-          </Link>
-        </Container>
-      );
-    },
-  },
   last_seen: {
     sortField: 'last_seen',
     renderFunc: data => {

src/sentry/static/sentry/app/views/organizationEventsV2/eventModalContent.jsx

@@ -17,8 +17,8 @@ import ModalPagination from './modalPagination';
 import ModalLineGraph from './modalLineGraph';
 import RelatedEvents from './relatedEvents';
 import TagsTable from './tagsTable';
-import {AGGREGATE_ALIASES} from './data';
 import TransanctionView from './transactionView';
+import {hasAggregateField} from './utils';
 
 /**
  * Render the columns and navigation elements inside the event modal view.
@@ -27,10 +27,8 @@ import TransanctionView from './transactionView';
 const EventModalContent = props => {
   const {event, projectId, organization, location, view} = props;
 
-  // Known aggregate aliases and functions indicated grouped views.
-  const isGroupedView = !!view.data.fields.find(
-    field => AGGREGATE_ALIASES.includes(field) || field.match(/[a-z_]+\([a-z_\.]+\)/)
-  );
+  // Having an aggregate field means we want to show pagination/graphs
+  const isGroupedView = hasAggregateField(view);
   const eventJsonUrl = `/api/0/projects/${organization.slug}/${projectId}/events/${
     event.eventID
   }/json/`;
@@ -39,9 +37,7 @@ const EventModalContent = props => {
     <ColumnGrid>
       <HeaderBox>
         <EventHeader event={event} />
-        {isGroupedView && (
-          <ModalPagination view={view} event={event} location={location} />
-        )}
+        {isGroupedView && <ModalPagination event={event} location={location} />}
         {isGroupedView &&
           getDynamicText({
             value: (

src/sentry/static/sentry/app/views/organizationEventsV2/modalPagination.jsx

@@ -22,10 +22,8 @@ function buildTargets(event, location) {
   const urlMap = {
     previous: event.previousEventID,
     next: event.nextEventID,
-    // TODO(mark) Make latest, oldest work once we have new endpoints.
-    // `${event.eventID}:latest`,
-    latest: null,
-    oldest: null,
+    oldest: event.oldestEventID,
+    latest: event.latestEventID,
   };
 
   const links = {};

src/sentry/static/sentry/app/views/organizationEventsV2/utils.jsx

@@ -2,7 +2,7 @@ import {partial, pick, get} from 'lodash';
 
 import {DEFAULT_PER_PAGE} from 'app/constants';
 import {URL_PARAM} from 'app/constants/globalSelectionHeader';
-import {ALL_VIEWS, SPECIAL_FIELDS, FIELD_FORMATTERS} from './data';
+import {ALL_VIEWS, AGGREGATE_ALIASES, SPECIAL_FIELDS, FIELD_FORMATTERS} from './data';
 
 /**
  * Given a view id, return the corresponding view object
@@ -15,9 +15,25 @@ export function getCurrentView(requestedView) {
   return ALL_VIEWS.find(view => view.id === requestedView) || ALL_VIEWS[0];
 }
 
+/**
+ * Takes a view and determines if there are any aggregate fields in it.
+ *
+ * TODO(mark) This function should be part of an EventView abstraction
+ *
+ * @param {Object} view
+ * @returns {Boolean}
+ */
+export function hasAggregateField(view) {
+  return view.data.fields.some(
+    field => AGGREGATE_ALIASES.includes(field) || field.match(/[a-z_]+\([a-z_\.]+\)/)
+  );
+}
+
 /**
  * Takes a view and converts it into the format required for the events API
  *
+ * TODO(mark) This function should be part of an EventView abstraction
+ *
  * @param {Object} view
  * @returns {Object}
  */
@@ -51,6 +67,8 @@ export function getQuery(view, location) {
  * Generate a querystring based on the view defaults, current
  * location and any additional parameters
  *
+ * TODO(mark) This function should be part of an EventView abstraction
+ *
  * @param {Object} view defaults containing `.data.query`
  * @param {Location} browser location
  * @param {Object} additional parameters to merge into the query string.

src/sentry/utils/snuba.py

@@ -60,6 +60,7 @@
     "issue.id": "issue",
     "timestamp": "timestamp",
     "time": "time",
+    "transaction": "transaction",
     # We support type as both tag and a real column
     "event.type": "type",
     # user