Patryk Osmaczko
osmaczko
parent
356f9c53db
commit
757a05900f
|
|
@ -0,0 +1,32 @@
|
|||
# Internationalization
|
||||
|
||||
App is translated to many different languages through lokalise.com platform.
|
||||
|
||||
## TLDR
|
||||
|
||||
#### Update base translations file
|
||||
1. Update qml_en.ts file: `cd scripts/translationScripts && python update-en-ts.py`
|
||||
2. Ensure updated qml_en.ts file lands on master
|
||||
|
||||
#### Update translation binaries
|
||||
1. Download translated *.ts files from lokalise.com
|
||||
2. Override ui/i18n/*.ts files with downloaded ones
|
||||
2. Create translation binaries `lrelease ui/i18n/*.ts`
|
||||
3. Commit updated *.ts and *.qm files
|
||||
|
||||
## Lokalise workflow
|
||||
|
||||
Lokalise is a continuous localization and translation management platform. It integrates into development workflow and automates localization process.
|
||||
|
||||
Lokalise workflow:
|
||||
1. Upload english strings (qml_en.ts) to Lokalise project. This is done automatically, Lokalise auto-pull changes done to master's qml_en.ts file.
|
||||
2. Translate strings to target languages. Target languages are driven by Lokalise configuration. Translations are done by community.
|
||||
3. Export *.ts files with translations (e.g. qml_de.ts, qml_en.ts)
|
||||
|
||||
## Updating translation files
|
||||
|
||||
Updating the QML translation files is very easy, as it comes with QT directly. It will scan all files in the projects (those listed in the `SOURCE` section of the `.pro` file) and then add or modify them in the XML-like `.ts` files.
|
||||
|
||||
## Generating binary translation files
|
||||
|
||||
To have the final translation files that will be used by the app, just run `lrelease i18n/*.ts` in the `ui/` directory
|
||||
|
|
@ -1,59 +0,0 @@
|
|||
# Translation scripts
|
||||
|
||||
These scripts are used to translate the app automatically by reusing the existing translation found in the Status-React repo: https://github.com/status-im/status-react/tree/develop/translations
|
||||
|
||||
## TLDR
|
||||
|
||||
1. Copy the translation files from https://github.com/status-im/status-react/tree/develop/translations to `/nim-status-client/scripts/translationScripts/status-react-translations`
|
||||
2. `cd scripts/translationScripts`
|
||||
3. Run `npm install`
|
||||
4. Run `node qstrConverter.js`
|
||||
5. Open another terminal and `cd ui`
|
||||
6. In that second terminal, run `lupdate nim-status-client.pro`
|
||||
7. Back in the first terminal, run `node xmlTranslator.js`
|
||||
7. [Optional] Manually translate the remaining strings in QT Linguist
|
||||
9. In the second terminal, run `lrelease -idbased i18n/*.ts` in the `ui/` directory
|
||||
|
||||
:tada: You're files are converted to use `qsTrId` and the translation files are updated.
|
||||
|
||||
## Changing strings to IDs
|
||||
|
||||
One major step is to change the literal strings we use in the code base to the IDs that are used in the translation JSON files.
|
||||
|
||||
For example, in our QML files, we would use `qsTr("Public chat")`, but in Status-React, that string in only represented as `public-chat`.
|
||||
|
||||
Thankfully, QML supports using string IDs instead of literral strings. The trick is to use `qsTrId` instead of `qsTr` and then use a comment to show the context/original string.
|
||||
|
||||
The script to do the change from `qsTr` to `qsTrId` is `qstrConverter.js`.
|
||||
|
||||
First, copy the translation files from https://github.com/status-im/status-react/tree/develop/translations to `/nim-status-client/scripts/translationScripts/status-react-translations`. Those are gitignored to show that we do not maintain those ourselves.
|
||||
|
||||
Then, run `node qstrConverter.js` in the `translationScripts/` directory.
|
||||
|
||||
## Updating translation files
|
||||
|
||||
Updating the QML translation files is then very easy, as it comes with QT directly. It will scan all files in the projects (those listed in the `SOURCE` section of the `.pro` file) and then add or modify them in the XML-like `.ts` files.
|
||||
|
||||
Just run `lupdate nim-status-client.pro` in the `ui/` directory.
|
||||
|
||||
## Run XML translator script
|
||||
|
||||
Most translations are already done in Status-React. To add those translations to the right `.ts` file, run `node xmlTranslator.js` in the `translationScripts/` directory.
|
||||
|
||||
It will check all the TS files and get the good translation from the JSON file and set the translation as done.
|
||||
|
||||
Some translations will not be done, check the next section to know how to translate.
|
||||
|
||||
## Manually translate remaining strings
|
||||
|
||||
Since not all strings used in the desktop app are also used in Status-React, the remaining will need to be translated manually.
|
||||
|
||||
If the strings are not translated, it is not the end of the world, the English strings will be shown instead.
|
||||
|
||||
To do so, you can use QT Linguist to help with the process. Check here to see the Linguist docs: https://doc.qt.io/qt-5/linguist-translators.html
|
||||
|
||||
To open a TS file in QT Linguist, either open the software and use the `Open` feature it has, or go in the `ui/i18n` directory and run `linguist nameOfFile.ts`
|
||||
|
||||
## Generating binary translation files
|
||||
|
||||
To have the final translation files that will be used by the app, just run `lrelease -idbased i18n/*.ts` in the `ui/` directory
|
||||
|
|
@ -1,128 +0,0 @@
|
|||
{
|
||||
"name": "translationscripts",
|
||||
"version": "1.0.0",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "translationscripts",
|
||||
"version": "1.0.0",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"fs-extra": "^9.0.1",
|
||||
"xml-js": "^1.6.11"
|
||||
},
|
||||
"devDependencies": {}
|
||||
},
|
||||
"node_modules/at-least-node": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/at-least-node/-/at-least-node-1.0.0.tgz",
|
||||
"integrity": "sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg==",
|
||||
"engines": {
|
||||
"node": ">= 4.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/fs-extra": {
|
||||
"version": "9.0.1",
|
||||
"resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.0.1.tgz",
|
||||
"integrity": "sha512-h2iAoN838FqAFJY2/qVpzFXy+EBxfVE220PalAqQLDVsFOHLJrZvut5puAbCdNv6WJk+B8ihI+k0c7JK5erwqQ==",
|
||||
"dependencies": {
|
||||
"at-least-node": "^1.0.0",
|
||||
"graceful-fs": "^4.2.0",
|
||||
"jsonfile": "^6.0.1",
|
||||
"universalify": "^1.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/graceful-fs": {
|
||||
"version": "4.2.4",
|
||||
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.4.tgz",
|
||||
"integrity": "sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw=="
|
||||
},
|
||||
"node_modules/jsonfile": {
|
||||
"version": "6.0.1",
|
||||
"resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.0.1.tgz",
|
||||
"integrity": "sha512-jR2b5v7d2vIOust+w3wtFKZIfpC2pnRmFAhAC/BuweZFQR8qZzxH1OyrQ10HmdVYiXWkYUqPVsz91cG7EL2FBg==",
|
||||
"dependencies": {
|
||||
"graceful-fs": "^4.1.6",
|
||||
"universalify": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/sax": {
|
||||
"version": "1.2.4",
|
||||
"resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
|
||||
"integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
|
||||
},
|
||||
"node_modules/universalify": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/universalify/-/universalify-1.0.0.tgz",
|
||||
"integrity": "sha512-rb6X1W158d7pRQBg5gkR8uPaSfiids68LTJQYOtEUhoJUWBdaQHsuT/EUduxXYxcrt4r5PJ4fuHW1MHT6p0qug==",
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/xml-js": {
|
||||
"version": "1.6.11",
|
||||
"resolved": "https://registry.npmjs.org/xml-js/-/xml-js-1.6.11.tgz",
|
||||
"integrity": "sha512-7rVi2KMfwfWFl+GpPg6m80IVMWXLRjO+PxTq7V2CDhoGak0wzYzFgUY2m4XJ47OGdXd8eLE8EmwfAmdjw7lC1g==",
|
||||
"dependencies": {
|
||||
"sax": "^1.2.4"
|
||||
},
|
||||
"bin": {
|
||||
"xml-js": "bin/cli.js"
|
||||
}
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"at-least-node": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/at-least-node/-/at-least-node-1.0.0.tgz",
|
||||
"integrity": "sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg=="
|
||||
},
|
||||
"fs-extra": {
|
||||
"version": "9.0.1",
|
||||
"resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.0.1.tgz",
|
||||
"integrity": "sha512-h2iAoN838FqAFJY2/qVpzFXy+EBxfVE220PalAqQLDVsFOHLJrZvut5puAbCdNv6WJk+B8ihI+k0c7JK5erwqQ==",
|
||||
"requires": {
|
||||
"at-least-node": "^1.0.0",
|
||||
"graceful-fs": "^4.2.0",
|
||||
"jsonfile": "^6.0.1",
|
||||
"universalify": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"graceful-fs": {
|
||||
"version": "4.2.4",
|
||||
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.4.tgz",
|
||||
"integrity": "sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw=="
|
||||
},
|
||||
"jsonfile": {
|
||||
"version": "6.0.1",
|
||||
"resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.0.1.tgz",
|
||||
"integrity": "sha512-jR2b5v7d2vIOust+w3wtFKZIfpC2pnRmFAhAC/BuweZFQR8qZzxH1OyrQ10HmdVYiXWkYUqPVsz91cG7EL2FBg==",
|
||||
"requires": {
|
||||
"graceful-fs": "^4.1.6",
|
||||
"universalify": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"sax": {
|
||||
"version": "1.2.4",
|
||||
"resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
|
||||
"integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw=="
|
||||
},
|
||||
"universalify": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/universalify/-/universalify-1.0.0.tgz",
|
||||
"integrity": "sha512-rb6X1W158d7pRQBg5gkR8uPaSfiids68LTJQYOtEUhoJUWBdaQHsuT/EUduxXYxcrt4r5PJ4fuHW1MHT6p0qug=="
|
||||
},
|
||||
"xml-js": {
|
||||
"version": "1.6.11",
|
||||
"resolved": "https://registry.npmjs.org/xml-js/-/xml-js-1.6.11.tgz",
|
||||
"integrity": "sha512-7rVi2KMfwfWFl+GpPg6m80IVMWXLRjO+PxTq7V2CDhoGak0wzYzFgUY2m4XJ47OGdXd8eLE8EmwfAmdjw7lC1g==",
|
||||
"requires": {
|
||||
"sax": "^1.2.4"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,17 +0,0 @@
|
|||
{
|
||||
"name": "translationscripts",
|
||||
"private": true,
|
||||
"version": "1.0.0",
|
||||
"description": "These scripts are used to translate the app automatically by reusing the existing translation found in the Status-React repo: https://github.com/status-im/status-react/tree/develop/translations",
|
||||
"main": "qstrConverter.js",
|
||||
"dependencies": {
|
||||
"fs-extra": "^9.0.1",
|
||||
"xml-js": "^1.6.11"
|
||||
},
|
||||
"devDependencies": {},
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1"
|
||||
},
|
||||
"author": "jrainville",
|
||||
"license": "ISC"
|
||||
}
|
||||
|
|
@ -1,61 +0,0 @@
|
|||
const fs = require('fs');
|
||||
const {getAllFiles} = require('./utils');
|
||||
|
||||
const enTranslations = require('./status-react-translations/en.json');
|
||||
|
||||
console.log('Scanning QML files...')
|
||||
const qmlFiles = getAllFiles('../../ui', 'qml');
|
||||
|
||||
const translationKeys = Object.keys(enTranslations)
|
||||
const translationValues = Object.values(enTranslations)
|
||||
|
||||
// Match all qsTr("...") functions and get the string inside
|
||||
const qstrRegex = /qsTr\(["'](.*?)["']\)/g
|
||||
const tabsRegex = /\n([\s]+)/
|
||||
let numberOfFilesDone = 0
|
||||
|
||||
console.log(`Modifying ${qmlFiles.length} files...`)
|
||||
qmlFiles.forEach(file => {
|
||||
let fileContent = fs.readFileSync(file).toString();
|
||||
|
||||
let match, replaceableText, enTranslationIndex, lastSpace, tabSubstring, spaces, replacementId, quote;
|
||||
let modified = false;
|
||||
|
||||
while ((match = qstrRegex.exec(fileContent)) !== null) {
|
||||
modified = true;
|
||||
replaceableText = match[1];
|
||||
|
||||
enTranslationIndex = translationValues.indexOf(replaceableText)
|
||||
if (enTranslationIndex > -1) {
|
||||
replacementId = translationKeys[enTranslationIndex]
|
||||
} else {
|
||||
// We need to replace all qsTr because we can't mix qsTrId and qsTr
|
||||
replacementId = replaceableText.replace(/[^a-zA-Z\d]/g, '-').toLowerCase();
|
||||
}
|
||||
|
||||
quote = match[0][5];
|
||||
// Replace the qsTr by a qsTrId and a comment
|
||||
fileContent = fileContent.replace(`qsTr(${quote}${replaceableText}${quote})`, `qsTrId("${replacementId}")`)
|
||||
|
||||
// Find the place where to put the comment
|
||||
lastSpace = fileContent.lastIndexOf('\n ', match.index);
|
||||
tabSubstring = fileContent.substring(lastSpace, match.index);
|
||||
|
||||
spaces = tabsRegex.exec(tabSubstring);
|
||||
fileContent = fileContent.substring(0, lastSpace + 1) +
|
||||
spaces[1] + `//% "${replaceableText}"` +
|
||||
fileContent.substring(lastSpace);
|
||||
|
||||
// Increase the last index of the regex as we increased the size of the file and so if the next qstr is on the same line,
|
||||
// the chances are high that the next match willl be the same word, creating an infinite loop
|
||||
qstrRegex.lastIndex += spaces[1].length + 6 + replaceableText.length
|
||||
}
|
||||
|
||||
|
||||
fs.writeFileSync(file, fileContent);
|
||||
numberOfFilesDone++;
|
||||
if (numberOfFilesDone % 10 === 0 || numberOfFilesDone === qmlFiles.length) {
|
||||
console.log(`\t${numberOfFilesDone}/${qmlFiles.length} completed...`)
|
||||
}
|
||||
});
|
||||
console.log('All done!')
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
const fs = require('fs');
|
||||
const path = require("path")
|
||||
|
||||
const getAllFiles = function(dirPath, ext, arrayOfFiles = []) {
|
||||
const files = fs.readdirSync(dirPath)
|
||||
|
||||
files.forEach(file => {
|
||||
if (fs.statSync(path.join(dirPath, file)).isDirectory()) {
|
||||
arrayOfFiles = getAllFiles(path.join(dirPath, file), ext, arrayOfFiles)
|
||||
} else if (!ext || file.endsWith(ext)) {
|
||||
arrayOfFiles.push(path.join(__dirname, dirPath, file))
|
||||
}
|
||||
})
|
||||
|
||||
return arrayOfFiles
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
getAllFiles
|
||||
};
|
||||
|
|
@ -1,72 +0,0 @@
|
|||
const convert = require('xml-js');
|
||||
const fs = require('fs');
|
||||
const {getAllFiles} = require('./utils');
|
||||
|
||||
console.log('Scanning TS files...');
|
||||
const tsFiles = getAllFiles('../../ui/i18n', 'ts');
|
||||
|
||||
const options = {compact: true, spaces: 4};
|
||||
|
||||
tsFiles.forEach(file => {
|
||||
if (file.endsWith('base.ts')) {
|
||||
// We skip the base file
|
||||
return;
|
||||
}
|
||||
const fileContent = fs.readFileSync(file).toString();
|
||||
const json = convert.xml2js(fileContent, options);
|
||||
|
||||
const doctype = json["_doctype"];
|
||||
let language = json[doctype]._attributes.language;
|
||||
const isEn = language === 'en_US'
|
||||
|
||||
let translations;
|
||||
try {
|
||||
translations = require(`./status-react-translations/${language}.json`)
|
||||
} catch (e) {
|
||||
// No translation file for the exact match, let's use the file name instead
|
||||
const match = /qml_([a-zA-Z0-9_]+)\.ts/.exec(file)
|
||||
language = language || match[1];
|
||||
try {
|
||||
translations = require(`./status-react-translations/${match[1]}.json`)
|
||||
} catch (e) {
|
||||
console.error(`No translation file found for ${language}`);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
let messages = []
|
||||
if (json[doctype].context.length) {
|
||||
messages = json[doctype].context.flatMap(c => c.message)
|
||||
} else {
|
||||
messages = json[doctype].context.message;
|
||||
}
|
||||
|
||||
console.log(`Modying ${language}...`)
|
||||
messages.forEach(message => {
|
||||
if (!message._attributes || !message._attributes.id) {
|
||||
return;
|
||||
}
|
||||
if (isEn) {
|
||||
// We just put the source string in the tranlsation
|
||||
message.translation = {
|
||||
"_text": message.source._text
|
||||
}
|
||||
return;
|
||||
}
|
||||
const messageId = message._attributes.id;
|
||||
if (!translations[messageId]) {
|
||||
// Skip this message, as we have no translation
|
||||
return;
|
||||
}
|
||||
|
||||
message.translation = {
|
||||
"_text": translations[messageId]
|
||||
}
|
||||
});
|
||||
|
||||
const xml = convert.js2xml(json, options);
|
||||
|
||||
fs.writeFileSync(file, xml);
|
||||
});
|
||||
|
||||
console.log('All done!')
|
||||
Loading…
Reference in New Issue