From 26059400a6910dca73264f791275ef1c272f960b Mon Sep 17 00:00:00 2001
From: chris <kokosias@yahoo.gr>
Date: Mon, 9 Oct 2023 12:25:54 +0300
Subject: [PATCH] use i18n translation feature
---
editors/demo/package.json | 4 +-
editors/demo/src/Editors.js | 25 +++++++++++-
wax-prosemirror-core/package.json | 5 ++-
wax-prosemirror-core/src/components/Button.js | 8 +++-
wax-prosemirror-services/package.json | 2 +
yarn.lock | 39 +++++++++++++++++++
6 files changed, 79 insertions(+), 4 deletions(-)
diff --git a/editors/demo/package.json b/editors/demo/package.json
index f2e92ae02..296d3d2c2 100644
--- a/editors/demo/package.json
+++ b/editors/demo/package.json
@@ -16,7 +16,9 @@
"wax-prosemirror-core": "^0.8.20",
"wax-prosemirror-services": "^0.8.20",
"wax-questions-service": "^0.8.20",
- "wax-table-service": "^0.8.20"
+ "wax-table-service": "^0.8.20",
+ "i18next": "^23.5.1",
+ "react-i18next": "^13.2.2"
},
"scripts": {
"start": "react-app-rewired start",
diff --git a/editors/demo/src/Editors.js b/editors/demo/src/Editors.js
index ab9ddbcc2..0ab017f06 100644
--- a/editors/demo/src/Editors.js
+++ b/editors/demo/src/Editors.js
@@ -1,7 +1,8 @@
import React, { useState } from 'react';
import styled, { css } from 'styled-components';
import { createGlobalStyle } from 'styled-components';
-
+import i18next from 'i18next';
+import { initReactI18next } from 'react-i18next';
import Editoria from './Editoria/Editoria';
import HHMI from './HHMI/HHMI';
import NCBI from './NCBI/NCBI';
@@ -11,6 +12,28 @@ import 'wax-prosemirror-core/dist/index.css';
import 'wax-prosemirror-services/dist/index.css';
import 'wax-questions-service/dist/index.css';
import 'wax-table-service/dist/index.css';
+i18next.use(initReactI18next).init({
+ resources: {
+ en: {
+ translation: {
+ annotations: {
+ 'Toggle code': 'Toggle code translation',
+ },
+ },
+ },
+ es: {
+ translation: {
+ annotations: {
+ 'Toggle code': 'Toggle code translation Spanish',
+ },
+ },
+ },
+ },
+ lng: 'en',
+ interpolation: {
+ escapeValue: false,
+ },
+});
const GlobalStyle = createGlobalStyle`
body {
diff --git a/wax-prosemirror-core/package.json b/wax-prosemirror-core/package.json
index c878c0b5b..1ef3d2960 100644
--- a/wax-prosemirror-core/package.json
+++ b/wax-prosemirror-core/package.json
@@ -33,7 +33,9 @@
"prosemirror-transform": "1.7.1",
"prosemirror-view": "1.30.2",
"reflect-metadata": "^0.1.13",
- "uuid": "^7.0.3"
+ "uuid": "^7.0.3",
+ "react-i18next": "^13.2.2"
+
},
"devDependencies": {
"mocha": "^3.4.2",
@@ -42,6 +44,7 @@
"peerDependencies": {
"react": "^17.0.2",
"react-dom": "^17.0.2",
+ "i18next": "^23.5.1",
"styled-components": "^5.3.1"
}
}
diff --git a/wax-prosemirror-core/src/components/Button.js b/wax-prosemirror-core/src/components/Button.js
index 1381f94d3..3cf55abd5 100644
--- a/wax-prosemirror-core/src/components/Button.js
+++ b/wax-prosemirror-core/src/components/Button.js
@@ -1,9 +1,11 @@
/* eslint react/prop-types: 0 */
import React, { useContext, useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
import { WaxContext } from '../WaxContext';
import MenuButton from './ui/MenuButton';
const Button = ({ view = {}, item }) => {
+ const { t, i18n } = useTranslation();
const { active, icon, label, run, select, title } = item;
const context = useContext(WaxContext);
const {
@@ -43,7 +45,11 @@ const Button = ({ view = {}, item }) => {
iconName={icon}
label={label}
onMouseDown={e => handleMouseDown(e)}
- title={title}
+ title={
+ i18n.exists(`annotations.${title}`)
+ ? t(`annotations.${title}`)
+ : title
+ }
/>
),
[isActive, isDisabled, activeViewId],
diff --git a/wax-prosemirror-services/package.json b/wax-prosemirror-services/package.json
index 4dd2511f6..466d01c6b 100644
--- a/wax-prosemirror-services/package.json
+++ b/wax-prosemirror-services/package.json
@@ -33,6 +33,7 @@
"prosemirror-view": "1.30.2",
"rc-switch": "^3.2.2",
"react-dropdown": "^1.6.2",
+ "react-i18next": "^13.2.2",
"use-deep-compare-effect": "^1.3.1",
"uuid": "^7.0.3",
"wax-prosemirror-core": "^0.8.20",
@@ -45,6 +46,7 @@
"peerDependencies": {
"react": "^17.0.2",
"react-dom": "^17.0.2",
+ "i18next": "^23.5.1",
"styled-components": "^5.3.1"
}
}
diff --git a/yarn.lock b/yarn.lock
index ccdfe4ba0..fc477dbb8 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1288,6 +1288,13 @@
dependencies:
regenerator-runtime "^0.13.4"
+"@babel/runtime@^7.22.5":
+ version "7.23.1"
+ resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.23.1.tgz#72741dc4d413338a91dcb044a86f3c0bc402646d"
+ integrity sha512-hC2v6p8ZSI/W0HUzh3V8C5g+NwSKzKPtJwSpTjwl0o297GP9+ZLQSkdvHz46CM3LqyoXxq+5G9komY+eSqSO0g==
+ dependencies:
+ regenerator-runtime "^0.14.0"
+
"@babel/template@^7.10.4", "@babel/template@^7.4.0", "@babel/template@^7.8.6":
version "7.10.4"
resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.10.4.tgz#3251996c4200ebc71d1a8fc405fba940f36ba278"
@@ -7294,6 +7301,13 @@ html-minifier-terser@^5.0.1:
relateurl "^0.2.7"
terser "^4.6.3"
+html-parse-stringify@^3.0.1:
+ version "3.0.1"
+ resolved "https://registry.yarnpkg.com/html-parse-stringify/-/html-parse-stringify-3.0.1.tgz#dfc1017347ce9f77c8141a507f233040c59c55d2"
+ integrity sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==
+ dependencies:
+ void-elements "3.1.0"
+
html-tags@^3.1.0:
version "3.1.0"
resolved "https://registry.yarnpkg.com/html-tags/-/html-tags-3.1.0.tgz#7b5e6f7e665e9fb41f30007ed9e0d41e97fb2140"
@@ -7419,6 +7433,13 @@ husky@^4.2.3:
slash "^3.0.0"
which-pm-runs "^1.0.0"
+i18next@^23.5.1:
+ version "23.5.1"
+ resolved "https://registry.yarnpkg.com/i18next/-/i18next-23.5.1.tgz#7f7c35ffaa907618d9489f106d5006b09fbca3d3"
+ integrity sha512-JelYzcaCoFDaa+Ysbfz2JsGAKkrHiMG6S61+HLBUEIPaF40WMwW9hCPymlQGrP+wWawKxKPuSuD71WZscCsWHg==
+ dependencies:
+ "@babel/runtime" "^7.22.5"
+
iconv-lite@0.4.24, iconv-lite@^0.4.17, iconv-lite@^0.4.24:
version "0.4.24"
resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
@@ -12396,6 +12417,14 @@ react-error-overlay@^6.0.7:
resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.7.tgz#1dcfb459ab671d53f660a991513cb2f0a0553108"
integrity sha512-TAv1KJFh3RhqxNvhzxj6LeT5NWklP6rDr2a0jaTfsZ5wSZWHOGeqQyejUp3xxLfPt2UpyJEcVQB/zyPcmonNFA==
+react-i18next@^13.2.2:
+ version "13.2.2"
+ resolved "https://registry.yarnpkg.com/react-i18next/-/react-i18next-13.2.2.tgz#b1e78ed66a54f4bc819616f68b98221e1b1a1936"
+ integrity sha512-+nFUkbRByFwnrfDcYqvzBuaeZb+nACHx+fAWN/pZMddWOCJH5hoc21+Sa/N/Lqi6ne6/9wC/qRGOoQhJa6IkEQ==
+ dependencies:
+ "@babel/runtime" "^7.22.5"
+ html-parse-stringify "^3.0.1"
+
react-is@^16.12.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.4:
version "16.13.1"
resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
@@ -12685,6 +12714,11 @@ regenerator-runtime@^0.13.3, regenerator-runtime@^0.13.4:
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.5.tgz#d878a1d094b4306d10b9096484b33ebd55e26697"
integrity sha512-ZS5w8CpKFinUzOwW3c83oPeVXoNsrLsaCoLtJvAClH135j/R77RuymhiSErhm2lKcwSCIpmvIWSbDkIfAqKQlA==
+regenerator-runtime@^0.14.0:
+ version "0.14.0"
+ resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz#5e19d68eb12d486f797e15a3c6a918f7cec5eb45"
+ integrity sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==
+
regenerator-transform@^0.14.2:
version "0.14.5"
resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.14.5.tgz#c98da154683671c9c4dcb16ece736517e1b7feb4"
@@ -14963,6 +14997,11 @@ vm-browserify@^1.0.1:
resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
+void-elements@3.1.0:
+ version "3.1.0"
+ resolved "https://registry.yarnpkg.com/void-elements/-/void-elements-3.1.0.tgz#614f7fbf8d801f0bb5f0661f5b2f5785750e4f09"
+ integrity sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==
+
w3c-hr-time@^1.0.1:
version "1.0.2"
resolved "https://registry.yarnpkg.com/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz#0a89cdf5cc15822df9c360543676963e0cc308cd"
--
GitLab