Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[CCR] i18n feedback #30028

Merged
merged 8 commits into from
Feb 15, 2019
Merged

[CCR] i18n feedback #30028

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
d41c2a6
WIP
cjcenizal Feb 5, 2019
2667c53
Apply codemod to convert from intl.formatMessage to i18n.translate.
cjcenizal Feb 5, 2019
328773e
Remove use of injectI18n.
cjcenizal Feb 5, 2019
8e906a9
Address remaining feedback.
cjcenizal Feb 5, 2019
e9b7dd5
Remove double-quotes.
cjcenizal Feb 12, 2019
88fbdc6
Merge branch 'master' of github.com:elastic/kibana into ccr/i18n-feed…
cjcenizal Feb 14, 2019
120fabe
Merge branch 'master' of github.com:elastic/kibana into ccr/i18n-feed…
cjcenizal Feb 14, 2019
4d986b7
Remove unused Chinese translations.
cjcenizal Feb 14, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
313 changes: 157 additions & 156 deletions x-pack/plugins/cross_cluster_replication/public/app/app.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import { Route, Switch, Redirect } from 'react-router-dom';
import chrome from 'ui/chrome';
import { fatalError } from 'ui/notify';
import { i18n } from '@kbn/i18n';
import { injectI18n, FormattedMessage } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';

import {
EuiEmptyPrompt,
Expand All @@ -36,186 +36,187 @@ import {
FollowerIndexEdit,
} from './sections';

export const App = injectI18n(
class extends Component {
static contextTypes = {
router: PropTypes.shape({
history: PropTypes.shape({
push: PropTypes.func.isRequired,
createHref: PropTypes.func.isRequired
}).isRequired
export class App extends Component {
static contextTypes = {
router: PropTypes.shape({
history: PropTypes.shape({
push: PropTypes.func.isRequired,
createHref: PropTypes.func.isRequired
}).isRequired
}
}).isRequired
}

constructor(...args) {
super(...args);
this.registerRouter();
constructor(...args) {
super(...args);
this.registerRouter();

this.state = {
isFetchingPermissions: false,
fetchPermissionError: undefined,
hasPermission: false,
missingClusterPrivileges: [],
};
}
this.state = {
isFetchingPermissions: false,
fetchPermissionError: undefined,
hasPermission: false,
missingClusterPrivileges: [],
};
}

componentWillMount() {
routing.userHasLeftApp = false;
}
componentWillMount() {
routing.userHasLeftApp = false;
}

componentDidMount() {
this.checkPermissions();
}
componentDidMount() {
this.checkPermissions();
}

componentWillUnmount() {
routing.userHasLeftApp = true;
}
componentWillUnmount() {
routing.userHasLeftApp = true;
}

async checkPermissions() {
this.setState({
isFetchingPermissions: true,
});
async checkPermissions() {
this.setState({
isFetchingPermissions: true,
});

try {
const { hasPermission, missingClusterPrivileges } = await loadPermissions();
try {
const { hasPermission, missingClusterPrivileges } = await loadPermissions();

this.setState({
this.setState({
isFetchingPermissions: false,
hasPermission,
missingClusterPrivileges,
});
} catch (error) {
// Expect an error in the shape provided by Angular's $http service.
if (error && error.data) {
return this.setState({
isFetchingPermissions: false,
hasPermission,
missingClusterPrivileges,
fetchPermissionError: error,
});
} catch (error) {
// Expect an error in the shape provided by Angular's $http service.
if (error && error.data) {
return this.setState({
isFetchingPermissions: false,
fetchPermissionError: error,
});
}

// This error isn't an HTTP error, so let the fatal error screen tell the user something
// unexpected happened.
fatalError(error, i18n.translate('xpack.crossClusterReplication.app.checkPermissionsFatalErrorTitle', {
defaultMessage: 'Cross Cluster Replication app',
}));
}

// This error isn't an HTTP error, so let the fatal error screen tell the user something
// unexpected happened.
fatalError(error, i18n.translate('xpack.crossClusterReplication.app.checkPermissionsFatalErrorTitle', {
defaultMessage: 'Cross Cluster Replication app',
}));
}
}

registerRouter() {
const { router } = this.context;
routing.reactRouter = router;
}

render() {
const {
isFetchingPermissions,
fetchPermissionError,
hasPermission,
missingClusterPrivileges,
} = this.state;

registerRouter() {
const { router } = this.context;
routing.reactRouter = router;
if (!isAvailable() || !isActive()) {
return (
<SectionUnauthorized
title={(
<FormattedMessage
id="xpack.crossClusterReplication.app.licenseErrorTitle"
defaultMessage="License error"
/>
)}
>
{getReason()}
{' '}
<a href={chrome.addBasePath('/app/kibana#/management/elasticsearch/license_management/home')}>
<FormattedMessage
id="xpack.crossClusterReplication.app.licenseErrorLinkText"
defaultMessage="Manage your license."
/>
</a>
</SectionUnauthorized>
);
}

render() {
const {
isFetchingPermissions,
fetchPermissionError,
hasPermission,
missingClusterPrivileges,
} = this.state;
if (isFetchingPermissions) {
return (
<EuiPageContent horizontalPosition="center">
<EuiFlexGroup alignItems="center" gutterSize="m">
<EuiFlexItem grow={false}>
<EuiLoadingSpinner size="l" />
</EuiFlexItem>

<EuiFlexItem>
<EuiTitle size="s">
<h2>
<FormattedMessage
id="xpack.crossClusterReplication.app.permissionCheckTitle"
defaultMessage="Checking permissions…"
/>
</h2>
</EuiTitle>
</EuiFlexItem>
</EuiFlexGroup>
</EuiPageContent>
);
}

if (!isAvailable() || !isActive()) {
return (
<SectionUnauthorized
if (fetchPermissionError) {
return (
<Fragment>
<SectionError
title={(
<FormattedMessage
id="xpack.crossClusterReplication.app.licenseErrorTitle"
defaultMessage="License error"
id="xpack.crossClusterReplication.app.permissionCheckErrorTitle"
defaultMessage="Error checking permissions"
/>
)}
>
{getReason()}
{' '}
<a href={chrome.addBasePath('/app/kibana#/management/elasticsearch/license_management/home')}>
<FormattedMessage
id="xpack.crossClusterReplication.app.licenseErrorLinkText"
defaultMessage="Manage your license."
/>
</a>
</SectionUnauthorized>
);
}
error={fetchPermissionError}
/>

if (isFetchingPermissions) {
return (
<EuiPageContent horizontalPosition="center">
<EuiFlexGroup>
<EuiFlexItem>
<EuiLoadingSpinner size="xl"/>
</EuiFlexItem>

<EuiFlexItem>
<EuiTitle>
<h2>
<FormattedMessage
id="xpack.crossClusterReplication.app.permissionCheckTitle"
defaultMessage="Checking permissions..."
/>
</h2>
</EuiTitle>
</EuiFlexItem>
</EuiFlexGroup>
</EuiPageContent>
);
}
<EuiSpacer size="m" />
</Fragment>
);
}

if (fetchPermissionError) {
return (
<Fragment>
<SectionError
title={(
if (!hasPermission) {
return (
<EuiPageContent horizontalPosition="center">
<EuiEmptyPrompt
iconType="securityApp"
iconColor={null}
title={
<h2>
<FormattedMessage
id="xpack.crossClusterReplication.app.permissionCheckErrorTitle"
defaultMessage="Error checking permissions"
id="xpack.crossClusterReplication.app.deniedPermissionTitle"
defaultMessage="You're missing cluster privileges"
/>
)}
error={fetchPermissionError}
/>

<EuiSpacer size="m" />
</Fragment>
);
}

if (!hasPermission) {
return (
<EuiPageContent horizontalPosition="center">
<EuiEmptyPrompt
iconType="securityApp"
iconColor={null}
title={
<h2>
<FormattedMessage
id="xpack.crossClusterReplication.app.deniedPermissionTitle"
defaultMessage="You're missing cluster privileges"
/>
</h2>}
body={
<p>
<FormattedMessage
id="xpack.crossClusterReplication.app.deniedPermissionDescription"
defaultMessage="To use Cross Cluster Replication, you must have {clusterPrivileges,
plural, one {this cluster privilege} other {these cluster privileges}}: {clusterPrivileges}."
values={{ clusterPrivileges: missingClusterPrivileges.join(', ') }}
/>
</p>}
/>
</EuiPageContent>
);
}

return (
<div>
<Switch>
<Redirect exact from={`${BASE_PATH}`} to={`${BASE_PATH}/follower_indices`} />
<Route exact path={`${BASE_PATH}/auto_follow_patterns/add`} component={AutoFollowPatternAdd} />
<Route exact path={`${BASE_PATH}/auto_follow_patterns/edit/:id`} component={AutoFollowPatternEdit} />
<Route exact path={`${BASE_PATH}/follower_indices/add`} component={FollowerIndexAdd} />
<Route exact path={`${BASE_PATH}/follower_indices/edit/:id`} component={FollowerIndexEdit} />
<Route exact path={`${BASE_PATH}/:section`} component={CrossClusterReplicationHome} />
</Switch>
</div>
</h2>}
body={
<p>
<FormattedMessage
id="xpack.crossClusterReplication.app.deniedPermissionDescription"
defaultMessage="To use Cross Cluster Replication, you must have {clusterPrivilegesCount,
plural, one {this cluster privilege} other {these cluster privileges}}: {clusterPrivileges}."
values={{
clusterPrivileges: missingClusterPrivileges.join(', '),
clusterPrivilegesCount: missingClusterPrivileges.length,
}}
/>
</p>}
/>
</EuiPageContent>
);
}

return (
<div>
<Switch>
<Redirect exact from={`${BASE_PATH}`} to={`${BASE_PATH}/follower_indices`} />
<Route exact path={`${BASE_PATH}/auto_follow_patterns/add`} component={AutoFollowPatternAdd} />
<Route exact path={`${BASE_PATH}/auto_follow_patterns/edit/:id`} component={AutoFollowPatternEdit} />
<Route exact path={`${BASE_PATH}/follower_indices/add`} component={FollowerIndexAdd} />
<Route exact path={`${BASE_PATH}/follower_indices/edit/:id`} component={FollowerIndexEdit} />
<Route exact path={`${BASE_PATH}/:section`} component={CrossClusterReplicationHome} />
</Switch>
</div>
);
}
);
}
Loading