[APM] Preserve query bar values in links (#29430)

elastic · Jan 30, 2019 · f9e2cd3 · f9e2cd3
1 parent b379751
commit f9e2cd3
Show file tree

Hide file tree

Showing 18 changed files with 154 additions and 149 deletions.
diff --git a/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/List/__test__/List.test.tsx b/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/List/__test__/List.test.tsx
@@ -26,7 +26,7 @@ describe('ErrorGroupOverview -> List', () => {
     const storeState = {};
     const wrapper = mount(
       <MemoryRouter>
-        <ErrorGroupList items={[]} urlParams={props.urlParams} />
+        <ErrorGroupList items={[]} urlParams={props.urlParams} location={{}} />
       </MemoryRouter>,
       storeState
     );

diff --git a/...m/public/components/app/ErrorGroupOverview/List/__test__/__snapshots__/List.test.tsx.snap b/...m/public/components/app/ErrorGroupOverview/List/__test__/__snapshots__/List.test.tsx.snap
@@ -531,7 +531,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
             >
               <a
                 className="euiLink euiLink--primary c0"
-                href="#/opbeans-python/errors/a0ce2c8978ef92cdf2ff163ae28576ee?_g=(time:(from:now-24h,mode:quick,to:now))&_a="
+                href="#/opbeans-python/errors/a0ce2c8978ef92cdf2ff163ae28576ee?_g=(time:(from:now-24h,mode:quick,to:now))"
               >
                 a0ce2
               </a>
@@ -556,7 +556,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
                   <a
                     aria-describedby="error-message-tooltip"
                     className="euiLink euiLink--primary c2"
-                    href="#/opbeans-python/errors/a0ce2c8978ef92cdf2ff163ae28576ee?_g=(time:(from:now-24h,mode:quick,to:now))&_a="
+                    href="#/opbeans-python/errors/a0ce2c8978ef92cdf2ff163ae28576ee?_g=(time:(from:now-24h,mode:quick,to:now))"
                     onBlur={[Function]}
                     onFocus={[Function]}
                   >
@@ -623,7 +623,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
             >
               <a
                 className="euiLink euiLink--primary c0"
-                href="#/opbeans-python/errors/f3ac95493913cc7a3cfec30a19d2120a?_g=(time:(from:now-24h,mode:quick,to:now))&_a="
+                href="#/opbeans-python/errors/f3ac95493913cc7a3cfec30a19d2120a?_g=(time:(from:now-24h,mode:quick,to:now))"
               >
                 f3ac9
               </a>
@@ -648,7 +648,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
                   <a
                     aria-describedby="error-message-tooltip"
                     className="euiLink euiLink--primary c2"
-                    href="#/opbeans-python/errors/f3ac95493913cc7a3cfec30a19d2120a?_g=(time:(from:now-24h,mode:quick,to:now))&_a="
+                    href="#/opbeans-python/errors/f3ac95493913cc7a3cfec30a19d2120a?_g=(time:(from:now-24h,mode:quick,to:now))"
                     onBlur={[Function]}
                     onFocus={[Function]}
                   >
@@ -715,7 +715,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
             >
               <a
                 className="euiLink euiLink--primary c0"
-                href="#/opbeans-python/errors/e90863d04b7a692435305f09bbe8c840?_g=(time:(from:now-24h,mode:quick,to:now))&_a="
+                href="#/opbeans-python/errors/e90863d04b7a692435305f09bbe8c840?_g=(time:(from:now-24h,mode:quick,to:now))"
               >
                 e9086
               </a>
@@ -740,7 +740,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
                   <a
                     aria-describedby="error-message-tooltip"
                     className="euiLink euiLink--primary c2"
-                    href="#/opbeans-python/errors/e90863d04b7a692435305f09bbe8c840?_g=(time:(from:now-24h,mode:quick,to:now))&_a="
+                    href="#/opbeans-python/errors/e90863d04b7a692435305f09bbe8c840?_g=(time:(from:now-24h,mode:quick,to:now))"
                     onBlur={[Function]}
                     onFocus={[Function]}
                   >
@@ -807,7 +807,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
             >
               <a
                 className="euiLink euiLink--primary c0"
-                href="#/opbeans-python/errors/8673d8bf7a032e387c101bafbab0d2bc?_g=(time:(from:now-24h,mode:quick,to:now))&_a="
+                href="#/opbeans-python/errors/8673d8bf7a032e387c101bafbab0d2bc?_g=(time:(from:now-24h,mode:quick,to:now))"
               >
                 8673d
               </a>
@@ -832,7 +832,7 @@ exports[`ErrorGroupOverview -> List should render with data 1`] = `
                   <a
                     aria-describedby="error-message-tooltip"
                     className="euiLink euiLink--primary c2"
-                    href="#/opbeans-python/errors/8673d8bf7a032e387c101bafbab0d2bc?_g=(time:(from:now-24h,mode:quick,to:now))&_a="
+                    href="#/opbeans-python/errors/8673d8bf7a032e387c101bafbab0d2bc?_g=(time:(from:now-24h,mode:quick,to:now))"
                     onBlur={[Function]}
                     onFocus={[Function]}
                   >

diff --git a/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/List/__test__/props.json b/x-pack/plugins/apm/public/components/app/ErrorGroupOverview/List/__test__/props.json
@@ -1,4 +1,5 @@
 {
+  "location": {},
   "urlParams": {
     "page": 0,
     "serviceName": "opbeans-python",

diff --git a/x-pack/plugins/apm/public/components/app/Main/Home.tsx b/x-pack/plugins/apm/public/components/app/Main/Home.tsx
@@ -13,7 +13,7 @@ import {
 } from 'x-pack/plugins/apm/public/components/shared/HistoryTabs';
 // @ts-ignore
 import { KueryBar } from '../../shared/KueryBar';
-import { SetupInstructionsLink } from '../../shared/SetupInstructionsLink';
+import { SetupInstructionsLink } from '../../shared/Links/SetupInstructionsLink';
 import { ServiceOverview } from '../ServiceOverview';
 import { TraceOverview } from '../TraceOverview';
 

diff --git a/x-pack/plugins/apm/public/components/app/ServiceOverview/view.tsx b/x-pack/plugins/apm/public/components/app/ServiceOverview/view.tsx
@@ -12,7 +12,7 @@ import { IServiceListItem } from 'x-pack/plugins/apm/server/lib/services/get_ser
 import { loadAgentStatus } from '../../../services/rest/apm/status_check';
 import { ServiceListRequest } from '../../../store/reactReduxRequest/serviceList';
 import { EmptyMessage } from '../../shared/EmptyMessage';
-import { SetupInstructionsLink } from '../../shared/SetupInstructionsLink';
+import { SetupInstructionsLink } from '../../shared/Links/SetupInstructionsLink';
 import { ServiceList } from './ServiceList';
 
 interface Props {

diff --git a/x-pack/plugins/apm/public/components/app/TraceOverview/TraceList.tsx b/x-pack/plugins/apm/public/components/app/TraceOverview/TraceList.tsx
@@ -12,8 +12,8 @@ import { ITransactionGroup } from 'x-pack/plugins/apm/server/lib/transaction_gro
 import { fontSizes, truncate } from '../../../style/variables';
 import { asMillis } from '../../../utils/formatters';
 import { ImpactBar } from '../../shared/ImpactBar';
+import { TransactionLink } from '../../shared/Links/TransactionLink';
 import { ITableColumn, ManagedTable } from '../../shared/ManagedTable';
-import { TransactionLink } from '../../shared/TransactionLink';
 
 const StyledTransactionLink = styled(TransactionLink)`
   font-size: ${fontSizes.large};

diff --git a/.../TransactionDetails/Transaction/WaterfallContainer/Waterfall/FlyoutTopLevelProperties.tsx b/.../TransactionDetails/Transaction/WaterfallContainer/Waterfall/FlyoutTopLevelProperties.tsx
@@ -11,8 +11,8 @@ import {
   TRANSACTION_NAME
 } from 'x-pack/plugins/apm/common/constants';
 import { KibanaLink } from 'x-pack/plugins/apm/public/components/shared/Links/KibanaLink';
+import { TransactionLink } from 'x-pack/plugins/apm/public/components/shared/Links/TransactionLink';
 import { StickyProperties } from 'x-pack/plugins/apm/public/components/shared/StickyProperties';
-import { TransactionLink } from 'x-pack/plugins/apm/public/components/shared/TransactionLink';
 import { Transaction } from 'x-pack/plugins/apm/typings/es_schemas/Transaction';
 
 interface Props {

diff --git a/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/index.tsx b/x-pack/plugins/apm/public/components/app/TransactionDetails/Transaction/index.tsx
@@ -18,8 +18,8 @@ import { Location } from 'history';
 import React from 'react';
 import { Transaction as ITransaction } from '../../../../../typings/es_schemas/Transaction';
 import { IUrlParams } from '../../../../store/urlParams';
+import { TransactionLink } from '../../../shared/Links/TransactionLink';
 import { TransactionActionMenu } from '../../../shared/TransactionActionMenu/TransactionActionMenu';
-import { TransactionLink } from '../../../shared/TransactionLink';
 import { StickyTransactionProperties } from './StickyTransactionProperties';
 import { TransactionPropertiesTable } from './TransactionPropertiesTable';
 import { IWaterfall } from './WaterfallContainer/Waterfall/waterfall_helpers/waterfall_helpers';

diff --git a/x-pack/plugins/apm/public/components/shared/KueryBar/view.js b/x-pack/plugins/apm/public/components/shared/KueryBar/view.js
@@ -59,7 +59,9 @@ class KueryBarView extends Component {
         selectionStart,
         indexPattern,
         boolFilter
-      )).filter(suggestion => !startsWith(suggestion.text, 'span.'));
+      ))
+        .filter(suggestion => !startsWith(suggestion.text, 'span.'))
+        .slice(0, 15);
 
       if (currentRequest !== this.currentRequest) {
         return;

diff --git a/x-pack/plugins/apm/public/components/shared/Links/KibanaLink.test.tsx b/x-pack/plugins/apm/public/components/shared/Links/KibanaLink.test.tsx
@@ -7,112 +7,20 @@
 import { shallow } from 'enzyme';
 import { Location } from 'history';
 import React from 'react';
-import url from 'url';
 import { UnconnectedKibanaLink } from './KibanaLink';
 
-function getUnconnectedKibanLink() {
-  const discoverQuery = {
-    _a: {
-      interval: 'auto',
-      query: {
-        language: 'lucene',
-        query: `context.service.name:"myServiceName" AND error.grouping_key:"myGroupId"`
-      },
-      sort: { '@timestamp': 'desc' }
-    }
-  };
-
-  return shallow(
-    <UnconnectedKibanaLink
-      location={{ search: '' } as Location}
-      pathname={'/app/kibana'}
-      hash={'/discover'}
-      query={discoverQuery}
-    >
-      Go to Discover
-    </UnconnectedKibanaLink>
-  );
-}
-
 describe('UnconnectedKibanaLink', () => {
-  it('should have correct url', () => {
-    const wrapper = getUnconnectedKibanLink();
-    const href = wrapper.find('EuiLink').prop('href') || '';
-    const { _g, _a } = getUrlQuery(href);
-    const { pathname } = url.parse(href);
-
-    expect(pathname).toBe('/app/kibana');
-    expect(_a).toBe(
-      '(interval:auto,query:(language:lucene,query:\'context.service.name:"myServiceName" AND error.grouping_key:"myGroupId"\'),sort:(\'@timestamp\':desc))'
-    );
-    expect(_g).toBe('(time:(from:now-24h,mode:quick,to:now))');
-  });
-
   it('should render correct markup', () => {
-    const wrapper = getUnconnectedKibanLink();
-    expect(wrapper).toMatchSnapshot();
-  });
-
-  it('should include existing _g values in link href', () => {
-    const wrapper = getUnconnectedKibanLink();
-    wrapper.setProps({
-      location: {
-        search:
-          '?_g=(refreshInterval:(pause:!t,value:0),time:(from:now-7d,mode:relative,to:now-1d))'
-      }
-    });
-    const href = wrapper.find('EuiLink').prop('href');
-    const { _g } = getUrlQuery(href);
-
-    expect(_g).toBe(
-      '(refreshInterval:(pause:!t,value:0),time:(from:now-7d,mode:relative,to:now-1d))'
-    );
-  });
-
-  it('should not throw due to hashed args', () => {
-    const wrapper = getUnconnectedKibanLink();
-    expect(() => {
-      wrapper.setProps({ location: { search: '?_g=H@whatever' } });
-    }).not.toThrow();
-  });
-
-  it('should use default time range when _g is empty', () => {
-    const wrapper = getUnconnectedKibanLink();
-    wrapper.setProps({ location: { search: '?_g=()' } });
-    const href = wrapper.find('EuiLink').prop('href') as string;
-    const { _g } = getUrlQuery(href);
-    expect(_g).toBe('(time:(from:now-24h,mode:quick,to:now))');
-  });
-
-  it('should merge in _g query values', () => {
-    const discoverQuery = {
-      _g: {
-        ml: {
-          jobIds: [1337]
-        }
-      }
-    };
-
     const wrapper = shallow(
       <UnconnectedKibanaLink
         location={{ search: '' } as Location}
         pathname={'/app/kibana'}
         hash={'/discover'}
-        query={discoverQuery}
       >
         Go to Discover
       </UnconnectedKibanaLink>
     );
 
-    const href = wrapper.find('EuiLink').prop('href') as string;
-    const { _g } = getUrlQuery(href);
-    expect(_g).toBe(
-      '(ml:(jobIds:!(1337)),time:(from:now-24h,mode:quick,to:now))'
-    );
+    expect(wrapper).toMatchSnapshot();
   });
 });
-
-function getUrlQuery(href?: string) {
-  const hash = url.parse(href!).hash!.slice(1);
-  return url.parse(hash, true).query;
-}
diff --git a/x-pack/plugins/apm/public/components/shared/Links/MLJobLink.test.tsx b/x-pack/plugins/apm/public/components/shared/Links/MLJobLink.test.tsx
@@ -34,7 +34,7 @@ describe('MLJobLink', () => {
     );
 
     expect(wrapper.prop('href')).toBe(
-      '/app/ml#/timeseriesexplorer?_g=(ml:(jobIds:!(myServiceName-myTransactionType-high_mean_response_time)),time:(from:now-24h,mode:quick,to:now))&_a='
+      '/app/ml#/timeseriesexplorer?_g=(ml:(jobIds:!(myServiceName-myTransactionType-high_mean_response_time)),time:(from:now-24h,mode:quick,to:now))'
     );
   });
 });
diff --git a/...mponents/shared/SetupInstructionsLink.tsx → ...ts/shared/Links/SetupInstructionsLink.tsx b/...mponents/shared/SetupInstructionsLink.tsx → ...ts/shared/Links/SetupInstructionsLink.tsx
@@ -7,7 +7,7 @@
 import { EuiButton } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import React from 'react';
-import { KibanaLink } from './Links/KibanaLink';
+import { KibanaLink } from './KibanaLink';
 
 export function SetupInstructionsLink({
   buttonFill = false

diff --git a/...lic/components/shared/TransactionLink.tsx → ...mponents/shared/Links/TransactionLink.tsx b/...lic/components/shared/TransactionLink.tsx → ...mponents/shared/Links/TransactionLink.tsx
@@ -5,9 +5,9 @@
  */
 
 import React from 'react';
-import { Transaction } from '../../../typings/es_schemas/Transaction';
-import { KibanaLink } from './Links/KibanaLink';
-import { legacyEncodeURIComponent } from './Links/url_helpers';
+import { Transaction } from '../../../../typings/es_schemas/Transaction';
+import { KibanaLink } from './KibanaLink';
+import { legacyEncodeURIComponent } from './url_helpers';
 
 interface TransactionLinkProps {
   transaction?: Transaction;

diff --git a/x-pack/plugins/apm/public/components/shared/Links/__snapshots__/KibanaLink.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/Links/__snapshots__/KibanaLink.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`UnconnectedKibanaLink should render correct markup 1`] = `
 <EuiLink
   color="primary"
-  href="/app/kibana#/discover?_a=(interval:auto,query:(language:lucene,query:'context.service.name:\\"myServiceName\\" AND error.grouping_key:\\"myGroupId\\"'),sort:('@timestamp':desc))&_g=(time:(from:now-24h,mode:quick,to:now))"
+  href="/app/kibana#/discover?_g=(time:(from:now-24h,mode:quick,to:now))"
   type="button"
 >
   Go to Discover

diff --git a/x-pack/plugins/apm/public/components/shared/Links/__snapshots__/MLJobLink.test.tsx.snap b/x-pack/plugins/apm/public/components/shared/Links/__snapshots__/MLJobLink.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`MLJobLink should render component 1`] = `
 <EuiLink
   color="primary"
-  href="/app/ml#/timeseriesexplorer?_g=(ml:(jobIds:!(myServiceName-myTransactionType-high_mean_response_time)),time:(from:now-24h,mode:quick,to:now))&_a="
+  href="/app/ml#/timeseriesexplorer?_g=(ml:(jobIds:!(myServiceName-myTransactionType-high_mean_response_time)),time:(from:now-24h,mode:quick,to:now))"
   type="button"
 />
 `;