|
|
@@ -11,6 +11,7 @@ import {
|
|
|
|
|
|
import path from 'path';
|
|
|
import validator from 'validator';
|
|
|
+import { withTranslation } from 'react-i18next';
|
|
|
import PreviewWithSuspense from './PreviewWithSuspense';
|
|
|
import PagePreviewIcon from '../Icons/PagePreviewIcon';
|
|
|
|
|
|
@@ -147,6 +148,7 @@ class LinkEditModal extends React.PureComponent {
|
|
|
}
|
|
|
|
|
|
async setMarkdown() {
|
|
|
+ const { t } = this.props;
|
|
|
const path = this.state.linkInputValue;
|
|
|
let markdown = '';
|
|
|
let previewError = '';
|
|
|
@@ -168,7 +170,7 @@ class LinkEditModal extends React.PureComponent {
|
|
|
}
|
|
|
}
|
|
|
else {
|
|
|
- previewError = `'${path}' is not a GROWI page.`;
|
|
|
+ previewError = t('link_edit.page_not_found_in_preview', { path });
|
|
|
}
|
|
|
this.setState({ markdown, previewError, permalink });
|
|
|
}
|
|
|
@@ -283,20 +285,21 @@ class LinkEditModal extends React.PureComponent {
|
|
|
}
|
|
|
|
|
|
renderLinkAndLabelForm() {
|
|
|
+ const { t } = this.props;
|
|
|
return (
|
|
|
<>
|
|
|
- <h3 className="grw-modal-head">Set link and label</h3>
|
|
|
+ <h3 className="grw-modal-head">{t('link_edit.set_link_and_label')}</h3>
|
|
|
<form className="form-group">
|
|
|
<div className="form-gorup my-3">
|
|
|
<div className="input-group flex-nowrap">
|
|
|
<div className="input-group-prepend">
|
|
|
- <span className="input-group-text">link</span>
|
|
|
+ <span className="input-group-text">{t('link_edit.link')}</span>
|
|
|
</div>
|
|
|
<SearchTypeahead
|
|
|
onChange={this.handleChangeTypeahead}
|
|
|
onInputChange={this.handleChangeLinkInput}
|
|
|
inputName="link"
|
|
|
- placeholder="Input page path or URL"
|
|
|
+ placeholder={t('link_edit.placeholder_of_link_input')}
|
|
|
keywordOnInit={this.state.linkInputValue}
|
|
|
behaviorOfResetBtn="clear"
|
|
|
autoFocus
|
|
|
@@ -316,7 +319,7 @@ class LinkEditModal extends React.PureComponent {
|
|
|
<div className="form-gorup my-3">
|
|
|
<div className="input-group flex-nowrap">
|
|
|
<div className="input-group-prepend">
|
|
|
- <span className="input-group-text">label</span>
|
|
|
+ <span className="input-group-text">{t('link_edit.label')}</span>
|
|
|
</div>
|
|
|
<input
|
|
|
type="text"
|
|
|
@@ -335,11 +338,12 @@ class LinkEditModal extends React.PureComponent {
|
|
|
}
|
|
|
|
|
|
renderPathFormatForm() {
|
|
|
+ const { t } = this.props;
|
|
|
return (
|
|
|
<div className="card well pt-3">
|
|
|
<form className="form-group mb-0">
|
|
|
<div className="form-group row">
|
|
|
- <label className="col-sm-3">Path format</label>
|
|
|
+ <label className="col-sm-3">{t('link_edit.path_format')}</label>
|
|
|
<div className="col-sm-9">
|
|
|
<div className="custom-control custom-checkbox custom-checkbox-info custom-control-inline">
|
|
|
<input
|
|
|
@@ -351,7 +355,7 @@ class LinkEditModal extends React.PureComponent {
|
|
|
disabled={!this.state.linkInputValue.startsWith('/') || this.state.linkerType === Linker.types.growiLink}
|
|
|
/>
|
|
|
<label className="custom-control-label" htmlFor="relativePath">
|
|
|
- Use relative path
|
|
|
+ {t('link_edit.use_relative_path')}
|
|
|
</label>
|
|
|
</div>
|
|
|
<div className="custom-control custom-checkbox custom-checkbox-info custom-control-inline">
|
|
|
@@ -364,13 +368,13 @@ class LinkEditModal extends React.PureComponent {
|
|
|
disabled={this.state.permalink === '' || this.state.linkerType === Linker.types.growiLink}
|
|
|
/>
|
|
|
<label className="custom-control-label" htmlFor="permanentLink">
|
|
|
- Use permanent link
|
|
|
+ {t('link_edit.use_permanent_link')}
|
|
|
</label>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div className="form-group row mb-0">
|
|
|
- <label className="col-sm-3">Notation</label>
|
|
|
+ <label className="col-sm-3">{t('link_edit.notation')}</label>
|
|
|
<div className="col-sm-9">
|
|
|
<div className="custom-control custom-radio custom-control-inline">
|
|
|
<input
|
|
|
@@ -382,7 +386,7 @@ class LinkEditModal extends React.PureComponent {
|
|
|
onChange={e => this.handleSelecteLinkerType(e.target.value)}
|
|
|
/>
|
|
|
<label className="custom-control-label" htmlFor="markdownType">
|
|
|
- Markdown
|
|
|
+ {t('link_edit.markdown')}
|
|
|
</label>
|
|
|
</div>
|
|
|
<div className="custom-control custom-radio custom-control-inline">
|
|
|
@@ -395,7 +399,7 @@ class LinkEditModal extends React.PureComponent {
|
|
|
onChange={e => this.handleSelecteLinkerType(e.target.value)}
|
|
|
/>
|
|
|
<label className="custom-control-label" htmlFor="growiType">
|
|
|
- Growi original
|
|
|
+ {t('link_edit.GROWI_original')}
|
|
|
</label>
|
|
|
</div>
|
|
|
{this.isApplyPukiwikiLikeLinkerPlugin && (
|
|
|
@@ -409,7 +413,7 @@ class LinkEditModal extends React.PureComponent {
|
|
|
onChange={e => this.handleSelecteLinkerType(e.target.value)}
|
|
|
/>
|
|
|
<label className="custom-control-label" htmlFor="pukiwikiType">
|
|
|
- Pukiwiki
|
|
|
+ {t('link_edit.pukiwiki')}
|
|
|
</label>
|
|
|
</div>
|
|
|
)}
|
|
|
@@ -421,10 +425,11 @@ class LinkEditModal extends React.PureComponent {
|
|
|
}
|
|
|
|
|
|
render() {
|
|
|
+ const { t } = this.props;
|
|
|
return (
|
|
|
<Modal className="link-edit-modal" isOpen={this.state.show} toggle={this.cancel} size="lg" autoFocus={false}>
|
|
|
<ModalHeader tag="h4" toggle={this.cancel} className="bg-primary text-light">
|
|
|
- Edit Links
|
|
|
+ {t('link_edit.edit_link')}
|
|
|
</ModalHeader>
|
|
|
|
|
|
<ModalBody className="container">
|
|
|
@@ -436,17 +441,17 @@ class LinkEditModal extends React.PureComponent {
|
|
|
</div>
|
|
|
<div className="row">
|
|
|
<div className="col-12">
|
|
|
- <h3 className="grw-modal-head">Preview</h3>
|
|
|
+ <h3 className="grw-modal-head">{t('link_edit.preview')}</h3>
|
|
|
{this.renderLinkPreview()}
|
|
|
</div>
|
|
|
</div>
|
|
|
<div className="row">
|
|
|
<div className="col-12 text-center">
|
|
|
<button type="button" className="btn btn-sm btn-outline-secondary mx-1" onClick={this.hide}>
|
|
|
- Cancel
|
|
|
+ {t('Cancel')}
|
|
|
</button>
|
|
|
<button type="submit" className="btn btn-sm btn-primary mx-1" onClick={this.save}>
|
|
|
- Done
|
|
|
+ {t('Done')}
|
|
|
</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -458,6 +463,7 @@ class LinkEditModal extends React.PureComponent {
|
|
|
}
|
|
|
|
|
|
LinkEditModal.propTypes = {
|
|
|
+ t: PropTypes.func.isRequired,
|
|
|
appContainer: PropTypes.instanceOf(AppContainer).isRequired,
|
|
|
pageContainer: PropTypes.instanceOf(PageContainer).isRequired,
|
|
|
onSave: PropTypes.func,
|
|
|
@@ -468,4 +474,4 @@ LinkEditModal.propTypes = {
|
|
|
*/
|
|
|
const LinkEditModalWrapper = withUnstatedContainers(LinkEditModal, [AppContainer, PageContainer]);
|
|
|
|
|
|
-export default LinkEditModalWrapper;
|
|
|
+export default withTranslation('translation', { withRef: true })(LinkEditModalWrapper);
|