Merge pull request #854 from nextcloud/enhancement/l10n

Add gettext-based translations

.eslintrc.js

@@ -7,7 +7,8 @@ module.exports = {
 		jest: true
 	},
 	globals: {
-		SCOPE_VERSION: true
+		SCOPE_VERSION: true,
+		TRANSLATIONS: true
 	},
 	parserOptions: {
 		parser: 'babel-eslint',

.github/workflows/l10n.yml

@@ -0,0 +1,19 @@
+name: L10n
+on: pull_request
+
+jobs:
+  l10n-extract-check:
+    runs-on: ubuntu-latest
+    name: Pot check
+    steps:
+    - uses: actions/checkout@master
+    - name: Set up Node
+      uses: actions/setup-node@v1
+      with:
+        node-version: 12.x
+    - name: npm install
+      run: npm ci
+    - name: extract l10n files
+      run: npm run l10n:extract
+    - name: Check l10n file changes
+      run: bash -c "[[ ! \"`git status --porcelain l10n`\" ]] || ( echo 'Uncommited l10n changes. Run `npm l10n:extract`.' && git status && exit 1 )"

.github/workflows/transifex.yml

@@ -0,0 +1,21 @@
+name: Transifex
+on: pull_request
+
+jobs:
+  approve:
+    runs-on: ubuntu-latest
+    name: Approve
+    steps:
+      - uses: hmarr/[email protected]
+        if: github.actor == 'Transifex-localization-platform[bot]' || github.actor == 'transifex-integration[bot]'
+        with:
+          github-token: "${{ secrets.GITHUB_TOKEN }}"
+  automerge:
+    runs-on: ubuntu-latest
+    name: Auto-merge
+    steps:
+      - uses: "pascalgn/automerge-action@ecb16453ce68e85b1e23596c8caa7e7499698a84"
+        if: github.actor == 'Transifex-localization-platform[bot]' || github.actor == 'transifex-integration[bot]'
+        env:
+          GITHUB_TOKEN: "${{ secrets.GITHUB_TOKEN }}"
+          MERGE_LABELS: ""

.npmignore

@@ -1 +1,3 @@
-node_modules
+/build
+/l10n
+/node_modules

build/extract-l10n.js

@@ -0,0 +1,23 @@
+const { GettextExtractor, JsExtractors } = require('gettext-extractor');
+
+let extractor = new GettextExtractor();
+
+extractor
+    .createJsParser([
+        JsExtractors.callExpression('t', {
+            arguments: {
+                text: 0,
+            }
+        }),
+        JsExtractors.callExpression('n', {
+            arguments: {
+                text: 1,
+                textPlural: 2,
+            }
+        }),
+    ])
+    .parseFilesGlob('./src/**/*.@(ts|js|vue)');
+
+extractor.savePotFile('./l10n/messages.pot');
+
+extractor.printStats();

l10n/messages.pot

@@ -0,0 +1,48 @@
+msgid ""
+msgstr ""
+"Content-Type: text/plain; charset=UTF-8\n"
+
+#: src/components/MultiselectTags/MultiselectTags.vue:169
+msgid "{tag} (invisible)"
+msgstr ""
+
+#: src/components/MultiselectTags/MultiselectTags.vue:172
+msgid "{tag} (restricted)"
+msgstr ""
+
+#: src/components/ColorPicker/ColorPicker.vue:145
+msgid "Choose"
+msgstr ""
+
+#: src/components/Modal/Modal.vue:109
+msgid "Close"
+msgstr ""
+
+#: src/components/Modal/Modal.vue:154
+msgid "Next"
+msgstr ""
+
+#: src/components/Multiselect/Multiselect.vue:169
+#: src/components/MultiselectTags/MultiselectTags.vue:78
+msgid "No results"
+msgstr ""
+
+#: src/components/Modal/Modal.vue:290
+msgid "Pause slideshow"
+msgstr ""
+
+#: src/components/Modal/Modal.vue:134
+msgid "Previous"
+msgstr ""
+
+#: src/components/MultiselectTags/MultiselectTags.vue:100
+msgid "Select a tag"
+msgstr ""
+
+#: src/components/AppNavigationSettings/AppNavigationSettings.vue:53
+msgid "Settings"
+msgstr ""
+
+#: src/components/Modal/Modal.vue:290
+msgid "Start slideshow"
+msgstr ""

package.json

@@ -16,6 +16,7 @@
 		"dev": "webpack --config webpack.dev.js",
 		"watch": "webpack --progress --watch --config webpack.dev.js",
 		"build": "NODE_ENV=production webpack --progress --hide-modules --config webpack.prod.js",
+		"l10n:extract": "node build/extract-l10n.js",
 		"lint": "eslint --ext .js,.vue src",
 		"lint:fix": "eslint --ext .js,.vue src --fix",
 		"test": "jest --verbose",
@@ -33,6 +34,7 @@
 	],
 	"dependencies": {
 		"@nextcloud/axios": "^1.1.0",
+		"@nextcloud/l10n": "^1.1.0",
 		"@nextcloud/router": "^1.0.0",
 		"core-js": "^3.4.4",
 		"escape-html": "^1.0.3",
@@ -70,6 +72,8 @@
 		"eslint-plugin-standard": "^4.0.0",
 		"eslint-plugin-vue": "^6.0.1",
 		"file-loader": "^5.0.2",
+		"gettext-extractor": "^3.5.2",
+		"gettext-parser": "^4.0.2",
 		"iconfont-plugin-webpack": "^1.1.4",
 		"jest": "^25.1.0",
 		"jest-environment-jsdom-sixteen": "^1.0.0",

src/components/AppNavigationSettings/AppNavigationSettings.vue

@@ -40,6 +40,7 @@
 
 <script>
 import { directive as ClickOutside } from 'v-click-outside'
+import { t } from '../../l10n'
 
 export default {
 	directives: {
@@ -49,8 +50,7 @@ export default {
 		title: {
 			type: String,
 			required: false,
-			// TODO: translate
-			default: t('core', 'Settings')
+			default: t('Settings')
 		}
 	},
 	data() {

src/components/AppSidebar/AppSidebar.vue

@@ -93,7 +93,7 @@
 				'app-sidebar-header--compact': compact
 			}" class="app-sidebar-header">
 				<!-- close sidebar button -->
-				<a href="#" class="app-sidebar__close icon-close" :title="t('core', 'close')"
+				<a href="#" class="app-sidebar__close icon-close" :title="t('close')"
 					@click.prevent="closeSidebar" />
 
 				<!-- sidebar header illustration/figure -->
@@ -188,6 +188,7 @@
 import Vue from 'vue'
 import Actions from 'Components/Actions'
 import Focus from 'Directives/Focus'
+import l10n from '../../mixins/l10n'
 
 const IsValidString = function(value) {
 	return value && typeof value === 'string' && value.trim() !== '' && value.indexOf(' ') === -1
@@ -201,6 +202,7 @@ export default {
 	directives: {
 		focus: Focus
 	},
+	mixins: [l10n],
 	props: {
 		active: {
 			type: String,

src/components/ColorPicker/ColorPicker.vue

@@ -142,7 +142,7 @@ export default {
 					v-if="advanced"
 					class="color-picker-navigation-button confirm"
 					@click="handleConfirm">
-					{{ t('core', 'Choose') }}
+					{{ t('Choose') }}
 				</button>
 			</div>
 		</div>
@@ -152,6 +152,7 @@ export default {
 <script>
 import { Chrome } from 'vue-color'
 import GenColors from 'Utils/GenColors'
+import l10n from '../../mixins/l10n'
 import Popover from '../Popover'
 
 export default {
@@ -160,6 +161,7 @@ export default {
 		Chrome,
 		Popover
 	},
+	mixins: [l10n],
 
 	props: {
 		/**