[Code]: use absolute path for api path

x-pack/plugins/code/index.ts

@@ -21,7 +21,6 @@ export const code = (kibana: any) =>
     uiExports: {
       app: {
         title: 'Code',
-        description: 'Code Search Plugin',
         main: 'plugins/code/app',
         euiIconType: 'codeApp',
       },

x-pack/plugins/code/public/components/admin_page/admin.tsx

@@ -4,13 +4,11 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { EuiTab, EuiTabs } from '@elastic/eui';
 import React from 'react';
-
 import { connect } from 'react-redux';
-
-import { EuiTab, EuiTabs } from '@elastic/eui';
-
 import styled from 'styled-components';
+import url from 'url';
 
 import theme from '@elastic/eui/dist/eui_theme_light.json';
 import { parse as parseQuery } from 'querystring';
@@ -91,7 +89,7 @@ class AdminPage extends React.PureComponent<Props, State> {
 
   public getAdminTabClickHandler = (tab: AdminTabs) => () => {
     this.setState({ tab });
-    this.props.history.push(`/admin?tab=${tab}`);
+    this.props.history.push(url.format({ pathname: '/admin', query: { tab } }));
   };
 
   public renderTabs() {

x-pack/plugins/code/public/components/diff_page/diff.tsx

@@ -10,8 +10,8 @@ import React, { MouseEvent } from 'react';
 import { connect } from 'react-redux';
 import { Link, RouteComponentProps, withRouter } from 'react-router-dom';
 import styled from 'styled-components';
-import { SearchScope } from 'x-pack/plugins/code/model';
 import { CommitDiff, FileDiff } from '../../../common/git_diff';
+import { SearchScope } from '../../../model';
 import { changeSearchScope } from '../../actions';
 import { RootState } from '../../reducers';
 import { SearchBar } from '../search_page/search_bar';

x-pack/plugins/code/public/components/main/content.tsx

@@ -14,6 +14,7 @@ import { connect } from 'react-redux';
 import { RouteComponentProps } from 'react-router-dom';
 import { withRouter } from 'react-router-dom';
 import styled from 'styled-components';
+import chrome from 'ui/chrome';
 
 import { RepositoryUtils } from '../../../common/repository_utils';
 import { FileTree, FileTreeItemType, SearchScope, WorkerReservedProgress } from '../../../model';
@@ -157,7 +158,7 @@ class CodeContent extends React.PureComponent<Props> {
   public openRawFile = () => {
     const { path, resource, org, repo, revision } = this.props.match.params;
     const repoUri = `${resource}/${org}/${repo}`;
-    window.open(`../api/code/repo/${repoUri}/blob/${revision}/${path}`);
+    window.open(chrome.addBasePath(`/app/code/repo/${repoUri}/raw/${revision}/${path}`));
   };
 
   public renderButtons = () => {

x-pack/plugins/code/public/components/main/search_bar.tsx

@@ -4,9 +4,12 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { ParsedUrlQuery } from 'querystring';
 import React from 'react';
 import { RouteComponentProps, withRouter } from 'react-router-dom';
 import styled from 'styled-components';
+import url from 'url';
+
 import { SearchScope } from '../../../model';
 import { MainRouteParams, SearchScopeText } from '../../common/types';
 import {
@@ -40,20 +43,21 @@ export class CodeSearchBar extends React.Component<Props> {
     new RepositorySuggestionsProvider(),
   ];
 
-  public onSubmit = (query: string) => {
+  public onSubmit = (queryString: string) => {
     const { history } = this.props;
-    if (query.trim().length === 0) {
+    if (queryString.trim().length === 0) {
       return;
     }
-    let qs = '';
+    const query: ParsedUrlQuery = {
+      q: queryString,
+    };
     if (this.props.repoScope) {
-      qs = `&repoScope=${this.props.repoScope.join(',')}`;
+      query.repoScope = this.props.repoScope.join(',');
     }
     if (this.state.searchScope === SearchScope.REPOSITORY) {
-      history.push(`/search?q=${query}&scope=${SearchScope.REPOSITORY}${qs}`);
-    } else {
-      history.push(`/search?q=${query}${qs}`);
+      query.scope = SearchScope.REPOSITORY;
     }
+    history.push(url.format({ pathname: '/search', query }));
   };
 
   public onSelect = (item: AutocompleteSuggestion) => {

x-pack/plugins/code/public/components/query_bar/components/typeahead/suggestions_component.tsx

@@ -8,7 +8,7 @@ import { EuiFlexGroup, EuiText, EuiToken, IconType } from '@elastic/eui';
 import { isEmpty } from 'lodash';
 import React, { Component } from 'react';
 import { Link } from 'react-router-dom';
-import Url from 'url';
+import url from 'url';
 
 import {
   AutocompleteSuggestion,
@@ -102,7 +102,7 @@ export class SuggestionsComponent extends Component<Props> {
           </EuiFlexGroup>
         );
 
-        const viewMoreUrl = Url.format({
+        const viewMoreUrl = url.format({
           pathname: '/search',
           query: {
             q: this.props.query,

x-pack/plugins/code/public/components/query_bar/suggestions/file_suggestions_provider.ts

@@ -28,7 +28,7 @@ export class FileSuggestionsProvider extends AbstractSuggestionsProvider {
         queryParams.repoScope = repoScope.join(',');
       }
       const res = await kfetch({
-        pathname: `../api/code/suggestions/doc`,
+        pathname: `/api/code/suggestions/doc`,
         method: 'get',
         query: queryParams,
       });

x-pack/plugins/code/public/components/query_bar/suggestions/repository_suggestions_provider.ts

@@ -29,7 +29,7 @@ export class RepositorySuggestionsProvider extends AbstractSuggestionsProvider {
         queryParams.repoScope = repoScope.join(',');
       }
       const res = await kfetch({
-        pathname: `../api/code/suggestions/repo`,
+        pathname: `/api/code/suggestions/repo`,
         method: 'get',
         query: queryParams,
       });

x-pack/plugins/code/public/components/query_bar/suggestions/symbol_suggestions_provider.ts

@@ -33,7 +33,7 @@ export class SymbolSuggestionsProvider extends AbstractSuggestionsProvider {
         queryParams.repoScope = repoScope.join(',');
       }
       const res = await kfetch({
-        pathname: `../api/code/suggestions/symbol`,
+        pathname: `/api/code/suggestions/symbol`,
         method: 'get',
         query: queryParams,
       });

x-pack/plugins/code/public/components/search_page/pagination.tsx

@@ -7,7 +7,7 @@
 import { EuiFlexGroup, EuiFlexItem, EuiPagination } from '@elastic/eui';
 import querystring from 'querystring';
 import React from 'react';
-import Url from 'url';
+import url from 'url';
 
 import { history } from '../../utils/url';
 
@@ -22,7 +22,7 @@ export class Pagination extends React.PureComponent<Props> {
     const { query } = this.props;
     const queries = querystring.parse(history.location.search.replace('?', ''));
     history.push(
-      Url.format({
+      url.format({
         pathname: '/search',
         query: {
           ...queries,

x-pack/plugins/code/public/components/search_page/scope_tabs.tsx

@@ -8,7 +8,7 @@ import { EuiTab, EuiTabs } from '@elastic/eui';
 import querystring from 'querystring';
 import React from 'react';
 import styled from 'styled-components';
-import Url from 'url';
+import url from 'url';
 
 import { SearchScope } from '../../../model';
 import { history } from '../../utils/url';
@@ -32,7 +32,7 @@ export class ScopeTabs extends React.PureComponent<Props> {
       const { query } = this.props;
       const queries = querystring.parse(history.location.search.replace('?', ''));
       history.push(
-        Url.format({
+        url.format({
           pathname: '/search',
           query: {
             ...queries,

x-pack/plugins/code/public/components/search_page/search.tsx

@@ -10,7 +10,7 @@ import React from 'react';
 import { connect } from 'react-redux';
 import styled from 'styled-components';
 import chrome from 'ui/chrome';
-import Url from 'url';
+import url from 'url';
 
 import theme from '@elastic/eui/dist/eui_theme_light.json';
 import { DocumentSearchResult, SearchScope } from '../../../model';
@@ -92,7 +92,7 @@ class SearchPage extends React.PureComponent<Props, State> {
     const queries = querystring.parse(history.location.search.replace('?', ''));
     return () => {
       history.push(
-        Url.format({
+        url.format({
           pathname: '/search',
           query: {
             ...queries,
@@ -121,7 +121,7 @@ class SearchPage extends React.PureComponent<Props, State> {
     const queries = querystring.parse(history.location.search.replace('?', ''));
     return () => {
       history.push(
-        Url.format({
+        url.format({
           pathname: '/search',
           query: {
             ...queries,

x-pack/plugins/code/public/components/search_page/search_bar.tsx

@@ -6,7 +6,7 @@
 
 import querystring from 'querystring';
 import React from 'react';
-import Url from 'url';
+import url from 'url';
 
 import { SearchScope } from '../../../model';
 import { SearchScopeText } from '../../common/types';
@@ -34,7 +34,7 @@ export class SearchBar extends React.PureComponent<Props> {
     // Update the url and push to history as well.
     const queries = querystring.parse(history.location.search.replace('?', ''));
     history.push(
-      Url.format({
+      url.format({
         pathname: '/search',
         query: {
           ...queries,

x-pack/plugins/code/public/components/symbol_tree/code_symbol_tree.tsx

@@ -10,7 +10,9 @@ import theme from '@elastic/eui/dist/eui_theme_light.json';
 import React from 'react';
 import { Link } from 'react-router-dom';
 import styled from 'styled-components';
+import url from 'url';
 import { Location, SymbolKind } from 'vscode-languageserver-types/lib/umd/main';
+
 import { RepositoryUtils } from '../../../common/repository_utils';
 import { EuiSideNavItem } from '../../common/types';
 import { SymbolWithMembers } from '../../reducers/symbol';
@@ -100,7 +102,10 @@ export class CodeSymbolTree extends React.PureComponent<Props, { activePath?: st
             ))}
           <EuiFlexItem grow={1}>
             <Link
-              to={`${RepositoryUtils.locationToUrl(location)}?tab=structure`}
+              to={url.format({
+                pathname: RepositoryUtils.locationToUrl(location),
+                query: { tab: 'structure' },
+              })}
               className="code-link"
               onClick={this.getClickHandler(path)}
             >

x-pack/plugins/code/public/monaco/definition/definition_provider.ts

@@ -12,7 +12,7 @@ import { Location } from 'vscode-languageserver-types';
 import { LspRestClient, TextDocumentMethods } from '../../../common/lsp_client';
 
 export function provideDefinition(monaco: any, model: editor.ITextModel, position: any) {
-  const lspClient = new LspRestClient('../api/lsp');
+  const lspClient = new LspRestClient('/api/code/lsp');
   const lspMethods = new TextDocumentMethods(lspClient);
   function handleLocation(location: Location): languages.Location {
     return {
@@ -27,7 +27,7 @@ export function provideDefinition(monaco: any, model: editor.ITextModel, positio
   }
 
   async function handleQname(qname: string) {
-    const res: any = await kfetch({ pathname: `/api/lsp/symbol/${qname}` });
+    const res: any = await kfetch({ pathname: `/api/code/lsp/symbol/${qname}` });
     if (res.symbols) {
       return res.symbols.map((s: DetailSymbolInformation) =>
         handleLocation(s.symbolInformation.location)

x-pack/plugins/code/public/monaco/editor_service.ts

@@ -35,7 +35,7 @@ export class EditorService extends StandaloneCodeEditorServiceImpl {
   public static async findSymbolByQname(qname: string) {
     try {
       const response = await kfetch({
-        pathname: `/api/lsp/symbol/${qname}`,
+        pathname: `/api/code/lsp/symbol/${qname}`,
         method: 'GET',
       });
       return response as SymbolSearchResult;

x-pack/plugins/code/public/monaco/hover/hover_computer.ts

@@ -16,7 +16,7 @@ export class HoverComputer implements Computer<Hover> {
   private uri: string | null = null;
 
   constructor() {
-    const lspClient = new LspRestClient('../api/lsp');
+    const lspClient = new LspRestClient('/api/code/lsp');
     this.lspMethods = new TextDocumentMethods(lspClient);
   }
 

x-pack/plugins/code/public/monaco/textmodel_resolver.ts

@@ -5,6 +5,8 @@
  */
 
 import { editor, IDisposable, Uri } from 'monaco-editor';
+import chrome from 'ui/chrome';
+
 import { ImmortalReference } from './immortal_reference';
 
 export interface IReference<T> extends IDisposable {
@@ -52,7 +54,9 @@ export class TextModelResolverService implements ITextModelService {
     const repo = `${resource.authority}${resource.path}`;
     const revision = resource.query;
     const file = resource.fragment;
-    const response = await fetch(`../api/code/repo/${repo}/blob/${revision}/${file}`);
+    const response = await fetch(
+      chrome.addBasePath(`/api/code/repo/${repo}/blob/${revision}/${file}`)
+    );
     if (response.status === 200) {
       const contentType = response.headers.get('Content-Type');
 

x-pack/plugins/code/public/sagas/blame.ts

@@ -12,7 +12,7 @@ import { loadBlame, loadBlameFailed, LoadBlamePayload, loadBlameSuccess } from '
 import { blamePattern } from './patterns';
 
 function requestBlame(repoUri: string, revision: string, path: string) {
-  return kfetch({ pathname: `../api/code/repo/${repoUri}/blame/${revision}/${path}` });
+  return kfetch({ pathname: `/api/code/repo/${repoUri}/blame/${revision}/${path}` });
 }
 
 function* handleFetchBlame(action: Action<LoadBlamePayload>) {

x-pack/plugins/code/public/sagas/commit.ts

@@ -11,7 +11,7 @@ import { commitRoutePattern } from './patterns';
 
 function requestCommit(repo: string, commitId: string) {
   return kfetch({
-    pathname: `../api/code/repo/${repo}/diff/${commitId}`,
+    pathname: `/api/code/repo/${repo}/diff/${commitId}`,
   });
 }
 

x-pack/plugins/code/public/sagas/editor.ts

@@ -48,7 +48,7 @@ function* handleReferences(action: Action<TextDocumentPositionParams>) {
 
 function requestFindReferences(params: TextDocumentPositionParams) {
   return kfetch({
-    pathname: `../api/lsp/findReferences`,
+    pathname: `/api/code/lsp/findReferences`,
     method: 'POST',
     body: JSON.stringify(params),
   });
@@ -120,7 +120,7 @@ function* handleFile(repoUri: string, file: string, revision: string) {
 }
 
 function fetchRepo(repoUri: string) {
-  return kfetch({ pathname: `../api/code/repo/${repoUri}` });
+  return kfetch({ pathname: `/api/code/repo/${repoUri}` });
 }
 
 function* loadRepoSaga(action: any) {

x-pack/plugins/code/public/sagas/file.ts

@@ -6,7 +6,10 @@
 
 import { Action } from 'redux-actions';
 import { call, put, select, takeEvery, takeLatest } from 'redux-saga/effects';
+import chrome from 'ui/chrome';
 import { kfetch } from 'ui/kfetch';
+import Url from 'url';
+
 import { FileTree } from '../../model';
 import {
   fetchDirectory,
@@ -90,7 +93,7 @@ function requestRepoTree({
     query.parents = true;
   }
   return kfetch({
-    pathname: `../api/code/repo/${uri}/tree/${revision}/${path}`,
+    pathname: `/api/code/repo/${uri}/tree/${revision}/${path}`,
     query,
   });
 }
@@ -110,7 +113,7 @@ function* handleFetchBranches(action: Action<FetchRepoPayload>) {
 
 function requestBranches({ uri }: FetchRepoPayload) {
   return kfetch({
-    pathname: `../api/code/repo/${uri}/references`,
+    pathname: `/api/code/repo/${uri}/references`,
   });
 }
 
@@ -155,7 +158,7 @@ function requestCommits(
 ) {
   const pathStr = path ? `/${path}` : '';
   const options: any = {
-    pathname: `../api/code/repo/${uri}/history/${revision}${pathStr}`,
+    pathname: `/api/code/repo/${uri}/history/${revision}${pathStr}`,
   };
   if (loadMore) {
     options.query = { after: 1 };
@@ -171,11 +174,13 @@ export async function requestFile(
   line?: string
 ): Promise<FetchFileResponse> {
   const { uri, revision, path } = payload;
-  let url = `../api/code/repo/${uri}/blob/${revision}/${path}`;
+  const url = `/api/code/repo/${uri}/blob/${revision}/${path}`;
+  const query: any = {};
   if (line) {
-    url += '?line=' + line;
+    query.line = line;
   }
-  const response: Response = await fetch(url);
+  const response: Response = await fetch(chrome.addBasePath(Url.format({ pathname: url, query })));
+
   if (response.status >= 200 && response.status < 300) {
     const contentType = response.headers.get('Content-Type');