[APM] Ensure backwards compatibility for v1 and v2

Fix tests

Make interfaces versioned

Fix ts issues

Rename eventType to docType

WIP

Working prototype

Fix tests

Limit get_transaction by trace.id

package.json

@@ -180,6 +180,7 @@
     "topojson-client": "3.0.0",
     "trunc-html": "1.0.2",
     "trunc-text": "1.0.2",
+    "ts-optchain": "^0.1.1",
     "tslib": "^1.9.3",
     "type-detect": "^4.0.8",
     "uglifyjs-webpack-plugin": "^1.2.7",
@@ -213,14 +214,15 @@
     "@kbn/eslint-plugin-license-header": "link:packages/kbn-eslint-plugin-license-header",
     "@kbn/plugin-generator": "link:packages/kbn-plugin-generator",
     "@kbn/test": "link:packages/kbn-test",
+    "@octokit/rest": "^15.10.0",
     "@types/angular": "^1.6.50",
     "@types/angular-mocks": "^1.7.0",
-    "@octokit/rest": "^15.10.0",
     "@types/babel-core": "^6.25.5",
     "@types/bluebird": "^3.1.1",
     "@types/boom": "^7.2.0",
     "@types/chance": "^1.0.0",
     "@types/classnames": "^2.2.3",
+    "@types/d3": "^5.0.0",
     "@types/dedent": "^0.7.0",
     "@types/elasticsearch": "^5.0.26",
     "@types/enzyme": "^3.1.12",

x-pack/plugins/apm/common/constants.test.ts

@@ -30,8 +30,9 @@ import {
   USER_ID
 } from './constants';
 
-describe('Transaction', () => {
+describe('Transaction v1', () => {
   const transaction: Transaction = {
+    version: 'v1',
     '@timestamp': new Date().toString(),
     beat: {
       hostname: 'beat hostname',
@@ -134,8 +135,120 @@ describe('Transaction', () => {
   });
 });
 
-describe('Span', () => {
+describe('Transaction v2', () => {
+  const transaction: Transaction = {
+    version: 'v2',
+    '@timestamp': new Date().toString(),
+    beat: {
+      hostname: 'beat hostname',
+      name: 'beat name',
+      version: 'beat version'
+    },
+    host: {
+      name: 'string;'
+    },
+    processor: {
+      name: 'transaction',
+      event: 'transaction'
+    },
+    timestamp: {
+      us: 1337
+    },
+    trace: {
+      id: 'trace id'
+    },
+    context: {
+      service: {
+        name: 'service name',
+        agent: {
+          name: 'agent name',
+          version: 'v1337'
+        },
+        language: {
+          name: 'nodejs',
+          version: 'v1337'
+        }
+      },
+      user: {
+        id: '1337'
+      },
+      request: {
+        url: {
+          full: 'http://www.elastic.co'
+        }
+      }
+    },
+    transaction: {
+      duration: {
+        us: 1337
+      },
+      id: 'transaction id',
+      name: 'transaction name',
+      result: 'transaction result',
+      sampled: true,
+      type: 'transaction type'
+    }
+  };
+
+  // service
+  it('SERVICE_NAME', () => {
+    expect(get(transaction, SERVICE_NAME)).toBe('service name');
+  });
+
+  it('SERVICE_AGENT_NAME', () => {
+    expect(get(transaction, SERVICE_AGENT_NAME)).toBe('agent name');
+  });
+
+  it('SERVICE_LANGUAGE_NAME', () => {
+    expect(get(transaction, SERVICE_LANGUAGE_NAME)).toBe('nodejs');
+  });
+
+  it('REQUEST_URL_FULL', () => {
+    expect(get(transaction, REQUEST_URL_FULL)).toBe('http://www.elastic.co');
+  });
+
+  it('USER_ID', () => {
+    expect(get(transaction, USER_ID)).toBe('1337');
+  });
+
+  // processor
+  it('PROCESSOR_NAME', () => {
+    expect(get(transaction, PROCESSOR_NAME)).toBe('transaction');
+  });
+
+  it('PROCESSOR_EVENT', () => {
+    expect(get(transaction, PROCESSOR_EVENT)).toBe('transaction');
+  });
+
+  // transaction
+  it('TRANSACTION_DURATION', () => {
+    expect(get(transaction, TRANSACTION_DURATION)).toBe(1337);
+  });
+
+  it('TRANSACTION_TYPE', () => {
+    expect(get(transaction, TRANSACTION_TYPE)).toBe('transaction type');
+  });
+
+  it('TRANSACTION_RESULT', () => {
+    expect(get(transaction, TRANSACTION_RESULT)).toBe('transaction result');
+  });
+
+  it('TRANSACTION_NAME', () => {
+    expect(get(transaction, TRANSACTION_NAME)).toBe('transaction name');
+  });
+
+  it('TRANSACTION_ID', () => {
+    expect(get(transaction, TRANSACTION_ID)).toBe('transaction id');
+  });
+
+  it('TRANSACTION_SAMPLED', () => {
+    expect(get(transaction, TRANSACTION_SAMPLED)).toBe(true);
+  });
+});
+
+describe('Span v1', () => {
   const span: Span = {
+    version: 'v1',
     '@timestamp': new Date().toString(),
     beat: {
       hostname: 'beat hostname',
@@ -174,6 +287,109 @@ describe('Span', () => {
       },
       name: 'span name',
       type: 'span type',
+      id: 1337
+    },
+    transaction: {
+      id: 'transaction id'
+    }
+  };
+
+  // service
+  it('SERVICE_NAME', () => {
+    expect(get(span, SERVICE_NAME)).toBe('service name');
+  });
+
+  it('SERVICE_AGENT_NAME', () => {
+    expect(get(span, SERVICE_AGENT_NAME)).toBe('agent name');
+  });
+
+  it('SERVICE_LANGUAGE_NAME', () => {
+    expect(get(span, SERVICE_LANGUAGE_NAME)).toBe('nodejs');
+  });
+
+  // processor
+  it('PROCESSOR_NAME', () => {
+    expect(get(span, PROCESSOR_NAME)).toBe('transaction');
+  });
+
+  it('PROCESSOR_EVENT', () => {
+    expect(get(span, PROCESSOR_EVENT)).toBe('span');
+  });
+
+  // span
+  it('SPAN_START', () => {
+    expect(get(span, SPAN_START)).toBe(1337);
+  });
+
+  it('SPAN_DURATION', () => {
+    expect(get(span, SPAN_DURATION)).toBe(1337);
+  });
+
+  it('SPAN_TYPE', () => {
+    expect(get(span, SPAN_TYPE)).toBe('span type');
+  });
+
+  it('SPAN_NAME', () => {
+    expect(get(span, SPAN_NAME)).toBe('span name');
+  });
+
+  it('SPAN_ID', () => {
+    expect(get(span, SPAN_ID)).toBe(1337);
+  });
+
+  it('SPAN_SQL', () => {
+    expect(get(span, SPAN_SQL)).toBe('db statement');
+  });
+
+  it('SPAN_HEX_ID', () => {
+    expect(get(span, SPAN_HEX_ID)).toBe(undefined);
+  });
+});
+
+describe('Span v2', () => {
+  const span: Span = {
+    version: 'v2',
+    '@timestamp': new Date().toString(),
+    beat: {
+      hostname: 'beat hostname',
+      name: 'beat name',
+      version: 'beat version'
+    },
+    host: {
+      name: 'string;'
+    },
+    processor: {
+      name: 'transaction',
+      event: 'span'
+    },
+    timestamp: {
+      us: 1337
+    },
+    trace: {
+      id: 'trace id'
+    },
+    context: {
+      db: {
+        statement: 'db statement'
+      },
+      service: {
+        name: 'service name',
+        agent: {
+          name: 'agent name',
+          version: 'v1337'
+        },
+        language: {
+          name: 'nodejs',
+          version: 'v1337'
+        }
+      }
+    },
+    span: {
+      duration: {
+        us: 1337
+      },
+      name: 'span name',
+      type: 'span type',
       id: 1337,
       hex_id: 'hex id'
     },
@@ -206,7 +422,7 @@ describe('Span', () => {
 
   // span
   it('SPAN_START', () => {
-    expect(get(span, SPAN_START)).toBe(1337);
+    expect(get(span, SPAN_START)).toBe(undefined);
   });
 
   it('SPAN_DURATION', () => {

x-pack/plugins/apm/public/components/app/TraceOverview/index.tsx

@@ -5,11 +5,12 @@
  */
 
 import { connect } from 'react-redux';
+import { IReduxState } from '../../../store/rootReducer';
 // @ts-ignore
 import { getUrlParams } from '../../../store/urlParams';
 import { TraceOverview as View } from './view';
 
-function mapStateToProps(state = {}) {
+function mapStateToProps(state = {} as IReduxState) {
   return {
     urlParams: getUrlParams(state)
   };

x-pack/plugins/apm/public/components/app/TransactionDetails/Distribution/__jest__/distribution.test.js

@@ -4,40 +4,49 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { getFormattedBuckets } from '../view';
+import { getFormattedBuckets } from '../index';
 
 describe('Distribution', () => {
   it('getFormattedBuckets', () => {
     const buckets = [
       { key: 0, count: 0 },
       { key: 20, count: 0 },
       { key: 40, count: 0 },
-      { key: 60, count: 5, transactionId: 'someTransactionId', sampled: true },
+      {
+        key: 60,
+        count: 5,
+        sample: {
+          transactionId: 'someTransactionId'
+        }
+      },
       {
         key: 80,
         count: 100,
-        transactionId: 'anotherTransactionId',
-        sampled: true
+        sample: {
+          transactionId: 'anotherTransactionId'
+        }
       }
     ];
     expect(getFormattedBuckets(buckets, 20)).toEqual([
-      { x: 20, x0: 0, y: 0, style: {} },
-      { x: 40, x0: 20, y: 0, style: {} },
-      { x: 60, x0: 40, y: 0, style: {} },
+      { x: 20, x0: 0, y: 0, style: { cursor: 'default' } },
+      { x: 40, x0: 20, y: 0, style: { cursor: 'default' } },
+      { x: 60, x0: 40, y: 0, style: { cursor: 'default' } },
       {
         x: 80,
         x0: 60,
         y: 5,
-        sampled: true,
-        transactionId: 'someTransactionId',
+        sample: {
+          transactionId: 'someTransactionId'
+        },
         style: { cursor: 'pointer' }
       },
       {
         x: 100,
         x0: 80,
         y: 100,
-        sampled: true,
-        transactionId: 'anotherTransactionId',
+        sample: {
+          transactionId: 'anotherTransactionId'
+        },
         style: { cursor: 'pointer' }
       }
     ]);