diff --git a/app/models/Document.js b/app/models/Document.js index 601df02f..26c38499 100644 --- a/app/models/Document.js +++ b/app/models/Document.js @@ -149,12 +149,6 @@ export default class Document extends BaseModel { get isFromTemplate(): boolean { return !!this.templateId; } - - @computed - get placeholder(): ?string { - return this.isTemplate ? "Start your template…" : "Start with a title…"; - } - @action share = async () => { return this.store.rootStore.shares.create({ documentId: this.id }); diff --git a/app/scenes/Document/components/Document.js b/app/scenes/Document/components/Document.js index bb74863a..eea8d7b9 100644 --- a/app/scenes/Document/components/Document.js +++ b/app/scenes/Document/components/Document.js @@ -4,6 +4,7 @@ import { observable } from "mobx"; import { observer, inject } from "mobx-react"; import { InputIcon } from "outline-icons"; import * as React from "react"; +import { type TFunction, Trans, withTranslation } from "react-i18next"; import keydown from "react-keydown"; import { Prompt, Route, withRouter } from "react-router-dom"; import type { RouterHistory, Match } from "react-router-dom"; @@ -44,15 +45,6 @@ import { const AUTOSAVE_DELAY = 3000; const IS_DIRTY_DELAY = 500; -const DISCARD_CHANGES = ` -You have unsaved changes. -Are you sure you want to discard them? -`; -const UPLOADING_WARNING = ` -Images are still uploading. -Are you sure you want to discard them? -`; - type Props = { match: Match, history: RouterHistory, @@ -67,6 +59,7 @@ type Props = { theme: Theme, auth: AuthStore, ui: UiStore, + t: TFunction, }; @observer @@ -82,7 +75,7 @@ class DocumentScene extends React.Component { getEditorText: () => string = () => this.props.document.text; componentDidUpdate(prevProps) { - const { auth, document } = this.props; + const { auth, document, t } = this.props; if (prevProps.readOnly && !this.props.readOnly) { this.updateIsDirty(); @@ -97,7 +90,7 @@ class DocumentScene extends React.Component { } else if (prevProps.document.revision !== this.lastRevision) { if (auth.user && document.updatedBy.id !== auth.user.id) { this.props.ui.showToast( - `Document updated by ${document.updatedBy.name}`, + t(`Document updated by ${document.updatedBy.name}`), { timeout: 30 * 1000, type: "warning", @@ -302,6 +295,7 @@ class DocumentScene extends React.Component { auth, ui, match, + t, } = this.props; const team = auth.team; const { shareId } = match.params; @@ -351,11 +345,15 @@ class DocumentScene extends React.Component { <> )} @@ -384,28 +382,44 @@ class DocumentScene extends React.Component { > {document.isTemplate && !readOnly && ( - You’re editing a template. Highlight some text and use the{" "} - control to add - placeholders that can be filled out when creating new - documents from this template. + + You’re editing a template. Highlight some text and use the{" "} + control to add + placeholders that can be filled out when creating new + documents from this template. + )} {document.archivedAt && !document.deletedAt && ( - Archived by {document.updatedBy.name}{" "} - )} {document.deletedAt && ( - Deleted by {document.updatedBy.name}{" "} - @@ -508,5 +522,7 @@ const MaxWidth = styled(Flex)` `; export default withRouter( - inject("ui", "auth", "policies", "revisions")(DocumentScene) + withTranslation()( + inject("ui", "auth", "policies", "revisions")(DocumentScene) + ) ); diff --git a/app/scenes/Document/components/Editor.js b/app/scenes/Document/components/Editor.js index 213a8633..0dd943a8 100644 --- a/app/scenes/Document/components/Editor.js +++ b/app/scenes/Document/components/Editor.js @@ -3,6 +3,7 @@ import { observable } from "mobx"; import { observer } from "mobx-react"; import * as React from "react"; import Textarea from "react-autosize-textarea"; +import { type TFunction, withTranslation } from "react-i18next"; import styled from "styled-components"; import breakpoint from "styled-components-breakpoint"; import { MAX_TITLE_LENGTH } from "shared/constants"; @@ -28,6 +29,7 @@ type Props = {| onSave: ({ done?: boolean, autosave?: boolean, publish?: boolean }) => any, innerRef: { current: any }, children: React.Node, + t: TFunction, |}; @observer @@ -102,6 +104,7 @@ class DocumentEditor extends React.Component { readOnly, innerRef, children, + t, ...rest } = this.props; @@ -129,7 +132,11 @@ class DocumentEditor extends React.Component { ref={this.ref} onChange={onChangeTitle} onKeyDown={this.handleTitleKeyDown} - placeholder={document.placeholder} + placeholder={ + document.isTemplate + ? t("Start your template…") + : t("Start with a title…") + } value={normalizedTitle} $startsWithEmojiAndSpace={startsWithEmojiAndSpace} autoFocus={!title} @@ -152,7 +159,7 @@ class DocumentEditor extends React.Component { (DocumentEditor); diff --git a/shared/i18n/locales/en_US/translation.json b/shared/i18n/locales/en_US/translation.json index d9f98b2f..6d24eeb3 100644 --- a/shared/i18n/locales/en_US/translation.json +++ b/shared/i18n/locales/en_US/translation.json @@ -305,6 +305,16 @@ "Add specific access for individual groups and team members": "Add specific access for individual groups and team members", "Add groups to {{ collectionName }}": "Add groups to {{ collectionName }}", "Add people to {{ collectionName }}": "Add people to {{ collectionName }}", + "You have unsaved changes.\nAre you sure you want to discard them?": "You have unsaved changes.\nAre you sure you want to discard them?", + "Images are still uploading.\nAre you sure you want to discard them?": "Images are still uploading.\nAre you sure you want to discard them?", + "You’re editing a template. Highlight some text and use the <2> control to add placeholders that can be filled out when creating new documents from this template.": "You’re editing a template. Highlight some text and use the <2> control to add placeholders that can be filled out when creating new documents from this template.", + "Archived by {document.updatedBy.name} <3> ago": "Archived by {document.updatedBy.name} <3> ago", + "Deleted by {document.updatedBy.name} <3> ago": "Deleted by {document.updatedBy.name} <3> ago", + "This template will be permanently deleted in <2> unless restored.": "This template will be permanently deleted in <2> unless restored.", + "This document will be permanently deleted in <2> unless restored.": "This document will be permanently deleted in <2> unless restored.", + "Start your template…": "Start your template…", + "Start with a title…": "Start with a title…", + "…the rest is up to you": "…the rest is up to you", "Hide contents": "Hide contents", "Show contents": "Show contents", "Edit {{noun}}": "Edit {{noun}}",