feat(events-v2): Add proper links to elements in event table

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

@@ -81,11 +81,17 @@ export const SPECIAL_FIELDS = {
   },
   type: {
     fields: ['event.type'],
-    renderFunc: (data, {onSearch}) => (
-      <QueryLink onClick={() => onSearch(`event.type:${data['event.type']}`)}>
-        {data['event.type']}
-      </QueryLink>
-    ),
+    renderFunc: (data, {location, organization}) => {
+      const target = {
+        pathname: `/organizations/${organization.slug}/events/`,
+        query: {
+          ...location.query,
+          query: `event.type:${data['event.type']}`,
+        },
+      };
+
+      return <QueryLink to={target}>{data['event.type']}</QueryLink>;
+    },
   },
   project: {
     fields: ['project.name'],
@@ -104,7 +110,7 @@ export const SPECIAL_FIELDS = {
   },
   user: {
     fields: ['user', 'user.name', 'user.email', 'user.ip'],
-    renderFunc: (data, {onSearch}) => {
+    renderFunc: (data, {organization, location}) => {
       const userObj = {
         name: data['user.name'],
         email: data['user.email'],
@@ -117,7 +123,15 @@ export const SPECIAL_FIELDS = {
         return <Container>{badge}</Container>;
       }
 
-      return <QueryLink onClick={() => onSearch(`user:${data.user}`)}>{badge}</QueryLink>;
+      const target = {
+        pathname: `/organizations/${organization.slug}/events/`,
+        query: {
+          ...location.query,
+          query: `user:${data.user}`,
+        },
+      };
+
+      return <QueryLink to={target}>{badge}</QueryLink>;
     },
   },
   time: {

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

@@ -105,7 +105,6 @@ export default class Events extends AsyncComponent {
               organization={organization}
               data={data}
               isLoading={loading}
-              onSearch={this.handleSearch}
               location={location}
             />
             <Pagination pageLinks={dataPageLinks} />

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

@@ -1,8 +1,9 @@
 import styled from 'react-emotion';
 import space from 'app/styles/space';
 import overflowEllipsis from 'app/styles/overflowEllipsis';
+import Link from 'app/components/links/link';
 
-export const QueryLink = styled('a')`
+export const QueryLink = styled(Link)`
   ${overflowEllipsis};
   color: ${p => p.theme.foreground};
   padding: ${space(1)};

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

@@ -19,12 +19,11 @@ export default class Table extends React.Component {
     data: PropTypes.arrayOf(PropTypes.object),
     isLoading: PropTypes.bool,
     organization: SentryTypes.Organization.isRequired,
-    onSearch: PropTypes.func.isRequired,
     location: PropTypes.object,
   };
 
   renderBody() {
-    const {view, data, organization, onSearch, location} = this.props;
+    const {view, data, organization, location} = this.props;
     const {fields} = view.data;
 
     if (!data) {
@@ -41,17 +40,25 @@ export default class Table extends React.Component {
 
     return data.map((row, idx) => (
       <Row key={idx} className={getGridStyle(fields.length)}>
-        {fields.map(field => (
-          <Cell key={field}>
-            {SPECIAL_FIELDS.hasOwnProperty(field) ? (
-              SPECIAL_FIELDS[field].renderFunc(row, {organization, onSearch, location})
-            ) : (
-              <QueryLink onClick={() => onSearch(`${field}:${row[field]}`)}>
-                {row[field]}
-              </QueryLink>
-            )}
-          </Cell>
-        ))}
+        {fields.map(field => {
+          const target = {
+            pathname: `/organizations/${organization.slug}/events/`,
+            query: {
+              ...location.query,
+              query: `${field}:${row[field]}`,
+            },
+          };
+
+          return (
+            <Cell key={field}>
+              {SPECIAL_FIELDS.hasOwnProperty(field) ? (
+                SPECIAL_FIELDS[field].renderFunc(row, {organization, location})
+              ) : (
+                <QueryLink to={target}>{row[field]}</QueryLink>
+              )}
+            </Cell>
+          );
+        })}
       </Row>
     ));
   }