Fix some issues caused by i18n addition (#2209)
* Fix some issues caused by i18n addition * Couple more small changes
This commit is contained in:
Devin Binnie
@@ -7,6 +7,8 @@ import {AuthenticationResponseDetails} from 'electron/renderer';
|
||||
|
||||
import {MODAL_CANCEL, MODAL_RESULT, RETRIEVE_MODAL_INFO} from 'common/communication';
|
||||
|
||||
import IntlProvider from 'renderer/intl_provider';
|
||||
|
||||
import 'bootstrap/dist/css/bootstrap.min.css';
|
||||
import 'renderer/css/modals.css';
|
||||
|
||||
@@ -30,11 +32,13 @@ const getAuthInfo = () => {
|
||||
|
||||
const start = async () => {
|
||||
ReactDOM.render(
|
||||
<LoginModal
|
||||
onLogin={handleLogin}
|
||||
onCancel={handleLoginCancel}
|
||||
getAuthInfo={getAuthInfo}
|
||||
/>,
|
||||
<IntlProvider>
|
||||
<LoginModal
|
||||
onLogin={handleLogin}
|
||||
onCancel={handleLoginCancel}
|
||||
getAuthInfo={getAuthInfo}
|
||||
/>
|
||||
</IntlProvider>,
|
||||
document.getElementById('app'),
|
||||
);
|
||||
};
|
||||
|
||||
@@ -13,8 +13,6 @@ import {AuthenticationResponseDetails, AuthInfo} from 'electron/renderer';
|
||||
import urlUtils from 'common/utils/url';
|
||||
import {MODAL_INFO} from 'common/communication';
|
||||
|
||||
import IntlProvider from 'renderer/intl_provider';
|
||||
|
||||
type Props = {
|
||||
onCancel: (request: AuthenticationResponseDetails) => void;
|
||||
onLogin: (request: AuthenticationResponseDetails, username: string, password: string) => void;
|
||||
@@ -116,98 +114,96 @@ class LoginModal extends React.PureComponent<Props, State> {
|
||||
const {intl} = this.props;
|
||||
|
||||
return (
|
||||
<IntlProvider>
|
||||
<Modal
|
||||
show={Boolean(this.state.request && this.state.authInfo)}
|
||||
>
|
||||
<Modal.Header>
|
||||
<Modal.Title>
|
||||
<FormattedMessage
|
||||
id='renderer.modals.login.loginModal.title'
|
||||
defaultMessage='Authentication Required'
|
||||
/>
|
||||
</Modal.Title>
|
||||
</Modal.Header>
|
||||
<Modal.Body>
|
||||
<p>
|
||||
{this.renderLoginModalMessage()}
|
||||
</p>
|
||||
<Form
|
||||
onSubmit={this.handleSubmit}
|
||||
>
|
||||
<FormGroup>
|
||||
<Col
|
||||
as={FormLabel}
|
||||
sm={2}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='renderer.modals.login.loginModal.username'
|
||||
defaultMessage='User Name'
|
||||
/>
|
||||
</Col>
|
||||
<Col sm={10}>
|
||||
<FormControl
|
||||
type='text'
|
||||
placeholder={intl.formatMessage({id: 'renderer.modals.login.loginModal.username', defaultMessage: 'User Name'})}
|
||||
onChange={this.setUsername}
|
||||
value={this.state.username}
|
||||
onClick={(e: React.MouseEvent<HTMLInputElement>) => {
|
||||
e.stopPropagation();
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
</FormGroup>
|
||||
<FormGroup>
|
||||
<Col
|
||||
as={FormLabel}
|
||||
sm={2}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='renderer.modals.login.loginModal.password'
|
||||
defaultMessage='Password'
|
||||
/>
|
||||
</Col>
|
||||
<Col sm={10}>
|
||||
<FormControl
|
||||
type='password'
|
||||
placeholder={intl.formatMessage({id: 'renderer.modals.login.loginModal.password', defaultMessage: 'Password'})}
|
||||
onChange={this.setPassword}
|
||||
value={this.state.password}
|
||||
onClick={(e: React.MouseEvent<HTMLInputElement>) => {
|
||||
e.stopPropagation();
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
</FormGroup>
|
||||
<FormGroup>
|
||||
<Col sm={12}>
|
||||
<div className='pull-right'>
|
||||
<Button
|
||||
type='submit'
|
||||
variant='primary'
|
||||
>
|
||||
<FormattedMessage
|
||||
id='label.login'
|
||||
defaultMessage='Login'
|
||||
/>
|
||||
</Button>
|
||||
{ ' ' }
|
||||
<Button
|
||||
variant='link'
|
||||
onClick={this.handleCancel}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='label.cancel'
|
||||
defaultMessage='Cancel'
|
||||
/>
|
||||
</Button>
|
||||
</div>
|
||||
</Col>
|
||||
</FormGroup>
|
||||
</Form>
|
||||
</Modal.Body>
|
||||
</Modal>
|
||||
</IntlProvider>
|
||||
<Modal
|
||||
show={Boolean(this.state.request && this.state.authInfo)}
|
||||
>
|
||||
<Modal.Header>
|
||||
<Modal.Title>
|
||||
<FormattedMessage
|
||||
id='renderer.modals.login.loginModal.title'
|
||||
defaultMessage='Authentication Required'
|
||||
/>
|
||||
</Modal.Title>
|
||||
</Modal.Header>
|
||||
<Modal.Body>
|
||||
<p>
|
||||
{this.renderLoginModalMessage()}
|
||||
</p>
|
||||
<Form
|
||||
onSubmit={this.handleSubmit}
|
||||
>
|
||||
<FormGroup>
|
||||
<Col
|
||||
as={FormLabel}
|
||||
sm={2}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='renderer.modals.login.loginModal.username'
|
||||
defaultMessage='User Name'
|
||||
/>
|
||||
</Col>
|
||||
<Col sm={10}>
|
||||
<FormControl
|
||||
type='text'
|
||||
placeholder={intl.formatMessage({id: 'renderer.modals.login.loginModal.username', defaultMessage: 'User Name'})}
|
||||
onChange={this.setUsername}
|
||||
value={this.state.username}
|
||||
onClick={(e: React.MouseEvent<HTMLInputElement>) => {
|
||||
e.stopPropagation();
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
</FormGroup>
|
||||
<FormGroup>
|
||||
<Col
|
||||
as={FormLabel}
|
||||
sm={2}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='renderer.modals.login.loginModal.password'
|
||||
defaultMessage='Password'
|
||||
/>
|
||||
</Col>
|
||||
<Col sm={10}>
|
||||
<FormControl
|
||||
type='password'
|
||||
placeholder={intl.formatMessage({id: 'renderer.modals.login.loginModal.password', defaultMessage: 'Password'})}
|
||||
onChange={this.setPassword}
|
||||
value={this.state.password}
|
||||
onClick={(e: React.MouseEvent<HTMLInputElement>) => {
|
||||
e.stopPropagation();
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
</FormGroup>
|
||||
<FormGroup>
|
||||
<Col sm={12}>
|
||||
<div className='pull-right'>
|
||||
<Button
|
||||
type='submit'
|
||||
variant='primary'
|
||||
>
|
||||
<FormattedMessage
|
||||
id='label.login'
|
||||
defaultMessage='Login'
|
||||
/>
|
||||
</Button>
|
||||
{ ' ' }
|
||||
<Button
|
||||
variant='link'
|
||||
onClick={this.handleCancel}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='label.cancel'
|
||||
defaultMessage='Cancel'
|
||||
/>
|
||||
</Button>
|
||||
</div>
|
||||
</Col>
|
||||
</FormGroup>
|
||||
</Form>
|
||||
</Modal.Body>
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -6,6 +6,8 @@ import ReactDOM from 'react-dom';
|
||||
|
||||
import {MODAL_CANCEL, MODAL_RESULT, RETRIEVE_MODAL_INFO, MODAL_SEND_IPC_MESSAGE} from 'common/communication';
|
||||
|
||||
import IntlProvider from 'renderer/intl_provider';
|
||||
|
||||
import 'bootstrap/dist/css/bootstrap.min.css';
|
||||
import 'renderer/css/modals.css';
|
||||
|
||||
@@ -33,12 +35,14 @@ const openExternalLink = (protocol: string, url: string) => {
|
||||
|
||||
const start = async () => {
|
||||
ReactDOM.render(
|
||||
<PermissionModal
|
||||
getPermissionInfo={getPermissionInfo}
|
||||
handleDeny={handleDeny}
|
||||
handleGrant={handleGrant}
|
||||
openExternalLink={openExternalLink}
|
||||
/>,
|
||||
<IntlProvider>
|
||||
<PermissionModal
|
||||
getPermissionInfo={getPermissionInfo}
|
||||
handleDeny={handleDeny}
|
||||
handleGrant={handleGrant}
|
||||
openExternalLink={openExternalLink}
|
||||
/>
|
||||
</IntlProvider>,
|
||||
document.getElementById('app'),
|
||||
);
|
||||
};
|
||||
|
||||
@@ -13,7 +13,6 @@ import urlUtil from 'common/utils/url';
|
||||
import {t} from 'common/utils/util';
|
||||
import {MODAL_INFO} from 'common/communication';
|
||||
import {PERMISSION_DESCRIPTION} from 'common/permissions';
|
||||
import IntlProvider from 'renderer/intl_provider';
|
||||
|
||||
type Props = {
|
||||
handleDeny: React.MouseEventHandler<HTMLButtonElement>;
|
||||
@@ -57,11 +56,19 @@ class PermissionModal extends React.PureComponent<Props, State> {
|
||||
}
|
||||
|
||||
getModalTitle() {
|
||||
const permission = this.props.intl.formatMessage({id: `common.permissions.${PERMISSION_DESCRIPTION[this.state.permission!]}`});
|
||||
if (!this.state.permission) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const permission = this.props.intl.formatMessage({id: PERMISSION_DESCRIPTION[this.state.permission!]});
|
||||
return this.props.intl.formatMessage({id: 'renderer.modals.permission.permissionModal.title', defaultMessage: '{permission} Required'}, {permission});
|
||||
}
|
||||
|
||||
getModalBody() {
|
||||
if (!this.state.permission) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const {url, permission} = this.state;
|
||||
const originDisplay = url ? urlUtil.getHost(url) : this.props.intl.formatMessage({id: 'renderer.modals.permission.permissionModal.unknownOrigin', defaultMessage: 'unknown origin'});
|
||||
const originLink = url ? originDisplay : '';
|
||||
@@ -84,7 +91,7 @@ class PermissionModal extends React.PureComponent<Props, State> {
|
||||
id='renderer.modals.permission.permissionModal.body'
|
||||
defaultMessage={'A site that\'s not included in your Mattermost server configuration requires access for {permission}.'}
|
||||
values={{
|
||||
permission: this.props.intl.formatMessage({id: `common.permissions.${PERMISSION_DESCRIPTION[permission!]}`}),
|
||||
permission: this.props.intl.formatMessage({id: PERMISSION_DESCRIPTION[permission!]}),
|
||||
}}
|
||||
/>
|
||||
{}
|
||||
@@ -113,42 +120,40 @@ class PermissionModal extends React.PureComponent<Props, State> {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<IntlProvider>
|
||||
<Modal
|
||||
bsClass='modal'
|
||||
className='permission-modal'
|
||||
show={Boolean(this.state.url && this.state.permission)}
|
||||
id='requestPermissionModal'
|
||||
enforceFocus={true}
|
||||
onHide={() => {}}
|
||||
>
|
||||
<Modal.Header>
|
||||
<Modal.Title>{this.getModalTitle()}</Modal.Title>
|
||||
</Modal.Header>
|
||||
<Modal.Body>
|
||||
{this.getModalBody()}
|
||||
</Modal.Body>
|
||||
<Modal.Footer className={'remove-border'}>
|
||||
<div>
|
||||
<Button onClick={this.props.handleDeny}>
|
||||
<FormattedMessage
|
||||
id='label.cancel'
|
||||
defaultMessage='Cancel'
|
||||
/>
|
||||
</Button>
|
||||
<Button
|
||||
variant='primary'
|
||||
onClick={this.props.handleGrant}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='label.accept'
|
||||
defaultMessage='Accept'
|
||||
/>
|
||||
</Button>
|
||||
</div>
|
||||
</Modal.Footer>
|
||||
</Modal>
|
||||
</IntlProvider>
|
||||
<Modal
|
||||
bsClass='modal'
|
||||
className='permission-modal'
|
||||
show={Boolean(this.state.url && this.state.permission)}
|
||||
id='requestPermissionModal'
|
||||
enforceFocus={true}
|
||||
onHide={() => {}}
|
||||
>
|
||||
<Modal.Header>
|
||||
<Modal.Title>{this.getModalTitle()}</Modal.Title>
|
||||
</Modal.Header>
|
||||
<Modal.Body>
|
||||
{this.getModalBody()}
|
||||
</Modal.Body>
|
||||
<Modal.Footer className={'remove-border'}>
|
||||
<div>
|
||||
<Button onClick={this.props.handleDeny}>
|
||||
<FormattedMessage
|
||||
id='label.cancel'
|
||||
defaultMessage='Cancel'
|
||||
/>
|
||||
</Button>
|
||||
<Button
|
||||
variant='primary'
|
||||
onClick={this.props.handleGrant}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='label.accept'
|
||||
defaultMessage='Accept'
|
||||
/>
|
||||
</Button>
|
||||
</div>
|
||||
</Modal.Footer>
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user