feat: I18n (#1653)

* feat: i18n

* Changing language single source of truth from TEAM to USER

* Changes according to @tommoor comments on PR

* Changed package.json for build:i18n and translation label

* Finished 1st MVP of i18n for outline

* new translation labels & Portuguese from Portugal translation

* Fixes from PR request

* Described language dropdown as an experimental feature

* Set keySeparator to false in order to cowork with html keys

* Added useTranslation to Breadcrumb

* Repositioned <strong> element

* Removed extra space from TemplatesMenu

* Fortified the test suite for i18n

* Fixed trans component problematic

* Check if selected language is available

* Update yarn.lock

* Removed unused Trans

* Removing debug variable from i18n init

* Removed debug variable

* test: update snapshots

* flow: Remove decorator usage to get proper flow typing
It's a shame, but hopefully we'll move to Typescript in the next 6 months and we can forget this whole Flow mistake ever happened

* translate: Drafts

* More translatable strings

* Mo translation strings

* translation: Search

* async translations loading

* cache translations in client

* Revert "cache translations in client"

This reverts commit 08fb61ce36384ff90a704faffe4761eccfb76da1.

* Revert localStorage cache for cache headers

* Update Crowdin configuration file

* Moved translation files to locales folder and fixed english text

* Added CONTRIBUTING File for CrowdIn

* chore: Move translations again to please CrowdIn

* fix: loading paths
chore: Add strings for editor

* fix: Improve validation on documents.import endpoint

* test: mock bull

* fix: Unknown mimetype should fallback to Markdown parsing if markdown extension (#1678)

* closes #1675

* Update CONTRIBUTING

* chore: Add link to translation portal from app UI

* refactor: Centralize language config

* fix: Ensure creation of i18n directory in build

* feat: Add language prompt

* chore: Improve contributing guidelines, add link from README

* chore: Normalize tab header casing

* chore: More string externalization

* fix: Language prompt in dark mode

Co-authored-by: André Glatzl <andreglatzl@gmail.com>

app/components/DocumentPreview/DocumentPreview.js

@@ -3,6 +3,7 @@ import { observable } from "mobx";
 import { observer } from "mobx-react";
 import { StarredIcon, PlusIcon } from "outline-icons";
 import * as React from "react";
+import { withTranslation, type TFunction } from "react-i18next";
 import { Link, Redirect } from "react-router-dom";
 import styled, { withTheme } from "styled-components";
 import Document from "models/Document";
@@ -25,6 +26,7 @@ type Props = {
   showPin?: boolean,
   showDraft?: boolean,
   showTemplate?: boolean,
+  t: TFunction,
 };
 
 const SEARCH_RESULT_REGEX = /<b\b[^>]*>(.*?)<\/b>/gi;
@@ -72,6 +74,7 @@ class DocumentPreview extends React.Component<Props> {
       showTemplate,
       highlight,
       context,
+      t,
     } = this.props;
 
     if (this.redirectTo) {
@@ -91,7 +94,7 @@ class DocumentPreview extends React.Component<Props> {
       >
         <Heading>
           <Title text={document.titleWithDefault} highlight={highlight} />
-          {document.isNew && <Badge yellow>New</Badge>}
+          {document.isNew && <Badge yellow>{t("New")}</Badge>}
           {!document.isDraft &&
             !document.isArchived &&
             !document.isTemplate && (
@@ -104,12 +107,16 @@ class DocumentPreview extends React.Component<Props> {
               </Actions>
             )}
           {document.isDraft && showDraft && (
-            <Tooltip tooltip="Only visible to you" delay={500} placement="top">
-              <Badge>Draft</Badge>
+            <Tooltip
+              tooltip={t("Only visible to you")}
+              delay={500}
+              placement="top"
+            >
+              <Badge>{t("Draft")}</Badge>
             </Tooltip>
           )}
           {document.isTemplate && showTemplate && (
-            <Badge primary>Template</Badge>
+            <Badge primary>{t("Template")}</Badge>
           )}
           <SecondaryActions>
             {document.isTemplate &&
@@ -120,7 +127,7 @@ class DocumentPreview extends React.Component<Props> {
                   icon={<PlusIcon />}
                   neutral
                 >
-                  New doc
+                  {t("New doc")}
                 </Button>
               )}
             &nbsp;
@@ -237,4 +244,4 @@ const ResultContext = styled(Highlight)`
   margin-bottom: 0.25em;
 `;
 
-export default DocumentPreview;
+export default withTranslation()<DocumentPreview>(DocumentPreview);