Skip to content

Commit

Permalink
Get rid of ui/i18n in Discover (elastic#62799)
Browse files Browse the repository at this point in the history
  • Loading branch information
@maryia-lapata
maryia-lapata authored Apr 8, 2020
1 parent 314c4f7 commit 3d6fd68
Show file tree
Hide file tree
Showing 15 changed files with 412 additions and 395 deletions.
1 change: 0 additions & 1 deletion src/legacy/core_plugins/kibana/public/discover/get_inner_angular.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -201,7 +201,6 @@ function createDocTableModule() {
.directive('docTable', createDocTableDirective)
.directive('kbnTableHeader', createTableHeaderDirective)
.directive('toolBarPagerText', createToolBarPagerTextDirective)
.directive('toolBarPagerText', createToolBarPagerTextDirective)
.directive('kbnTableRow', createTableRowDirective)
.directive('toolBarPagerButtons', createToolBarPagerButtonsDirective)
.directive('kbnInfiniteScroll', createInfiniteScrollDirective)
Expand Down
2 changes: 0 additions & 2 deletions src/legacy/core_plugins/kibana/public/discover/kibana_services.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,6 @@ export const [getUrlTracker, setUrlTracker] = createGetterSetter<{
setTrackedUrl: (url: string) => void;
}>('urlTracker');

// EXPORT legacy static dependencies, should be migrated when available in a new version;
export { wrapInI18nContext } from 'ui/i18n';
import { search } from '../../../../../plugins/data/public';
import { createGetterSetter } from '../../../../../plugins/kibana_utils/common';
export const { getRequestInspectorStats, getResponseInspectorStats, tabifyAggResponse } = search;
Expand Down
146 changes: 76 additions & 70 deletions ...gins/kibana/public/discover/np_ready/angular/context/components/action_bar/action_bar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
*/
import React, { useState } from 'react';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
import { FormattedMessage, I18nProvider } from '@kbn/i18n/react';
import {
EuiButtonEmpty,
EuiFieldNumber,
Expand Down Expand Up @@ -88,77 +88,83 @@ export function ActionBar({
};

return (
<form onSubmit={onSubmit}>
{isSuccessor && <EuiSpacer size="s" />}
{isSuccessor && showWarning && <ActionBarWarning docCount={docCountAvailable} type={type} />}
{isSuccessor && showWarning && <EuiSpacer size="s" />}
<EuiFlexGroup direction="row" gutterSize="s" responsive={false}>
<EuiFlexItem grow={false}>
<EuiButtonEmpty
data-test-subj={`${type}LoadMoreButton`}
iconType={isSuccessor ? 'arrowDown' : 'arrowUp'}
isDisabled={isDisabled}
isLoading={isLoading}
onClick={() => {
const value = newDocCount + defaultStepSize;
if (isValid(value)) {
setNewDocCount(value);
onChangeCount(value);
}
}}
flush="right"
>
<FormattedMessage id="kbn.context.loadButtonLabel" defaultMessage="Load" />
</EuiButtonEmpty>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiFormRow>
<EuiFieldNumber
aria-label={
isSuccessor
? i18n.translate('kbn.context.olderDocumentsAriaLabel', {
defaultMessage: 'Number of older documents',
})
: i18n.translate('kbn.context.newerDocumentsAriaLabel', {
defaultMessage: 'Number of newer documents',
})
}
className="cxtSizePicker"
data-test-subj={`${type}CountPicker`}
disabled={isDisabled}
min={MIN_CONTEXT_SIZE}
max={MAX_CONTEXT_SIZE}
onChange={ev => {
setNewDocCount(ev.target.valueAsNumber);
}}
onBlur={() => {
if (newDocCount !== docCount && isValid(newDocCount)) {
onChangeCount(newDocCount);
<I18nProvider>
<form onSubmit={onSubmit}>
{isSuccessor && <EuiSpacer size="s" />}
{isSuccessor && showWarning && (
<ActionBarWarning docCount={docCountAvailable} type={type} />
)}
{isSuccessor && showWarning && <EuiSpacer size="s" />}
<EuiFlexGroup direction="row" gutterSize="s" responsive={false}>
<EuiFlexItem grow={false}>
<EuiButtonEmpty
data-test-subj={`${type}LoadMoreButton`}
iconType={isSuccessor ? 'arrowDown' : 'arrowUp'}
isDisabled={isDisabled}
isLoading={isLoading}
onClick={() => {
const value = newDocCount + defaultStepSize;
if (isValid(value)) {
setNewDocCount(value);
onChangeCount(value);
}
}}
type="number"
value={newDocCount >= 0 ? newDocCount : ''}
/>
</EuiFormRow>
</EuiFlexItem>
<EuiFlexItem>
<EuiFormRow displayOnly>
{isSuccessor ? (
<FormattedMessage
id="kbn.context.olderDocumentsDescription"
defaultMessage="older documents"
/>
) : (
<FormattedMessage
id="kbn.context.newerDocumentsDescription"
defaultMessage="newer documents"
flush="right"
>
<FormattedMessage id="kbn.context.loadButtonLabel" defaultMessage="Load" />
</EuiButtonEmpty>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiFormRow>
<EuiFieldNumber
aria-label={
isSuccessor
? i18n.translate('kbn.context.olderDocumentsAriaLabel', {
defaultMessage: 'Number of older documents',
})
: i18n.translate('kbn.context.newerDocumentsAriaLabel', {
defaultMessage: 'Number of newer documents',
})
}
className="cxtSizePicker"
data-test-subj={`${type}CountPicker`}
disabled={isDisabled}
min={MIN_CONTEXT_SIZE}
max={MAX_CONTEXT_SIZE}
onChange={ev => {
setNewDocCount(ev.target.valueAsNumber);
}}
onBlur={() => {
if (newDocCount !== docCount && isValid(newDocCount)) {
onChangeCount(newDocCount);
}
}}
type="number"
value={newDocCount >= 0 ? newDocCount : ''}
/>
)}
</EuiFormRow>
</EuiFlexItem>
</EuiFlexGroup>
{!isSuccessor && showWarning && <ActionBarWarning docCount={docCountAvailable} type={type} />}
{!isSuccessor && <EuiSpacer size="s" />}
</form>
</EuiFormRow>
</EuiFlexItem>
<EuiFlexItem>
<EuiFormRow displayOnly>
{isSuccessor ? (
<FormattedMessage
id="kbn.context.olderDocumentsDescription"
defaultMessage="older documents"
/>
) : (
<FormattedMessage
id="kbn.context.newerDocumentsDescription"
defaultMessage="newer documents"
/>
)}
</EuiFormRow>
</EuiFlexItem>
</EuiFlexGroup>
{!isSuccessor && showWarning && (
<ActionBarWarning docCount={docCountAvailable} type={type} />
)}
{!isSuccessor && <EuiSpacer size="s" />}
</form>
</I18nProvider>
);
}
4 changes: 2 additions & 2 deletions ...na/public/discover/np_ready/angular/context/components/action_bar/action_bar_directive.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,9 @@
* specific language governing permissions and limitations
* under the License.
*/
import { getAngularModule, wrapInI18nContext } from '../../../../../kibana_services';
import { getAngularModule } from '../../../../../kibana_services';
import { ActionBar } from './action_bar';

getAngularModule().directive('contextActionBar', function(reactDirective: any) {
return reactDirective(wrapInI18nContext(ActionBar));
return reactDirective(ActionBar);
});
10 changes: 3 additions & 7 deletions src/legacy/core_plugins/kibana/public/discover/np_ready/angular/directives/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,16 +20,12 @@
import { DiscoverNoResults } from './no_results';
import { DiscoverUninitialized } from './uninitialized';
import { DiscoverHistogram } from './histogram';
import { getAngularModule, wrapInI18nContext } from '../../../kibana_services';
import { getAngularModule } from '../../../kibana_services';

const app = getAngularModule();

app.directive('discoverNoResults', reactDirective =>
reactDirective(wrapInI18nContext(DiscoverNoResults))
);
app.directive('discoverNoResults', reactDirective => reactDirective(DiscoverNoResults));

app.directive('discoverUninitialized', reactDirective =>
reactDirective(wrapInI18nContext(DiscoverUninitialized))
);
app.directive('discoverUninitialized', reactDirective => reactDirective(DiscoverUninitialized));

app.directive('discoverHistogram', reactDirective => reactDirective(DiscoverHistogram));
46 changes: 24 additions & 22 deletions src/legacy/core_plugins/kibana/public/discover/np_ready/angular/directives/no_results.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
*/

import React, { Component, Fragment } from 'react';
import { FormattedMessage } from '@kbn/i18n/react';
import { FormattedMessage, I18nProvider } from '@kbn/i18n/react';
import PropTypes from 'prop-types';

import {
Expand Down Expand Up @@ -247,29 +247,31 @@ export class DiscoverNoResults extends Component {
}

return (
<Fragment>
<EuiSpacer size="xl" />
<I18nProvider>
<Fragment>
<EuiSpacer size="xl" />

<EuiFlexGroup justifyContent="center">
<EuiFlexItem grow={false} className="dscNoResults">
<EuiCallOut
title={
<FormattedMessage
id="kbn.discover.noResults.searchExamples.noResultsMatchSearchCriteriaTitle"
defaultMessage="No results match your search criteria"
/>
}
color="warning"
iconType="help"
data-test-subj="discoverNoResults"
/>
<EuiFlexGroup justifyContent="center">
<EuiFlexItem grow={false} className="dscNoResults">
<EuiCallOut
title={
<FormattedMessage
id="kbn.discover.noResults.searchExamples.noResultsMatchSearchCriteriaTitle"
defaultMessage="No results match your search criteria"
/>
}
color="warning"
iconType="help"
data-test-subj="discoverNoResults"
/>

{shardFailuresMessage}
{timeFieldMessage}
{luceneQueryMessage}
</EuiFlexItem>
</EuiFlexGroup>
</Fragment>
{shardFailuresMessage}
{timeFieldMessage}
{luceneQueryMessage}
</EuiFlexItem>
</EuiFlexGroup>
</Fragment>
</I18nProvider>
);
}
}
70 changes: 36 additions & 34 deletions src/legacy/core_plugins/kibana/public/discover/np_ready/angular/directives/uninitialized.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
*/

import React from 'react';
import { FormattedMessage } from '@kbn/i18n/react';
import { FormattedMessage, I18nProvider } from '@kbn/i18n/react';

import { EuiButton, EuiEmptyPrompt, EuiPage, EuiPageBody, EuiPageContent } from '@elastic/eui';

Expand All @@ -28,38 +28,40 @@ interface Props {

export const DiscoverUninitialized = ({ onRefresh }: Props) => {
return (
<EuiPage>
<EuiPageBody>
<EuiPageContent horizontalPosition="center">
<EuiEmptyPrompt
iconType="discoverApp"
title={
<h2>
<FormattedMessage
id="kbn.discover.uninitializedTitle"
defaultMessage="Start searching"
/>
</h2>
}
body={
<p>
<FormattedMessage
id="kbn.discover.uninitializedText"
defaultMessage="Write a query, add some filters, or simply hit Refresh to retrieve results for the current query."
/>
</p>
}
actions={
<EuiButton color="primary" fill onClick={onRefresh}>
<FormattedMessage
id="kbn.discover.uninitializedRefreshButtonText"
defaultMessage="Refresh data"
/>
</EuiButton>
}
/>
</EuiPageContent>
</EuiPageBody>
</EuiPage>
<I18nProvider>
<EuiPage>
<EuiPageBody>
<EuiPageContent horizontalPosition="center">
<EuiEmptyPrompt
iconType="discoverApp"
title={
<h2>
<FormattedMessage
id="kbn.discover.uninitializedTitle"
defaultMessage="Start searching"
/>
</h2>
}
body={
<p>
<FormattedMessage
id="kbn.discover.uninitializedText"
defaultMessage="Write a query, add some filters, or simply hit Refresh to retrieve results for the current query."
/>
</p>
}
actions={
<EuiButton color="primary" fill onClick={onRefresh}>
<FormattedMessage
id="kbn.discover.uninitializedRefreshButtonText"
defaultMessage="Refresh data"
/>
</EuiButton>
}
/>
</EuiPageContent>
</EuiPageBody>
</EuiPage>
</I18nProvider>
);
};
4 changes: 2 additions & 2 deletions src/legacy/core_plugins/kibana/public/discover/np_ready/angular/doc.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
import { getAngularModule, wrapInI18nContext, getServices } from '../../kibana_services';
import { getAngularModule, getServices } from '../../kibana_services';
// @ts-ignore
import { getRootBreadcrumbs } from '../helpers/breadcrumbs';
import html from './doc.html';
Expand All @@ -30,7 +30,7 @@ const { timefilter } = getServices();
const app = getAngularModule();
app.directive('discoverDoc', function(reactDirective: any) {
return reactDirective(
wrapInI18nContext(Doc),
Doc,
[
['id', { watchDepth: 'value' }],
['index', { watchDepth: 'value' }],
Expand Down
5 changes: 2 additions & 3 deletions .../core_plugins/kibana/public/discover/np_ready/angular/doc_table/components/pager/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,14 +16,13 @@
* specific language governing permissions and limitations
* under the License.
*/
import { wrapInI18nContext } from '../../../../../kibana_services';
import { ToolBarPagerText } from './tool_bar_pager_text';
import { ToolBarPagerButtons } from './tool_bar_pager_buttons';

export function createToolBarPagerTextDirective(reactDirective: any) {
return reactDirective(wrapInI18nContext(ToolBarPagerText));
return reactDirective(ToolBarPagerText);
}

export function createToolBarPagerButtonsDirective(reactDirective: any) {
return reactDirective(wrapInI18nContext(ToolBarPagerButtons));
return reactDirective(ToolBarPagerButtons);
}
Loading

0 comments on commit 3d6fd68

Please sign in to comment.