fix(editor): Fix i18n issues (#3072)
* 🐛 Fix `defaultLocale` watcher * ⚡ Improve error handling for headers * ✏️ Improve naming * 🐛 Fix hiring banner check * ⚡ Flatten base text keys * ⚡ Fix miscorrected key * ⚡ Implement pluralization * ✏️ Update docs * 🚚 Move headers fetching to `App.vue` * fix hiring banner * ⚡ Fix missing import * ✏️ Alphabetize translations * ⚡ Switch to async check * feat(editor): Refactor Output Panel + fix i18n issues (#3097) * update main panel * finish up tabs * fix docs link * add icon * update node settings * clean up settings * add rename modal * fix component styles * fix spacing * truncate name * remove mixin * fix spacing * fix spacing * hide docs url * fix bug * fix renaming * refactor tabs out * refactor execute button * refactor header * add more views * fix error view * fix workflow rename bug * rename component * fix small screen bug * move items, fix positions * add hover state * show selector on empty state * add empty run state * fix binary view * 1 item * add vjs styles * show empty row for every item * refactor tabs * add branch names * fix spacing * fix up spacing * add run selector * fix positioning * clean up * increase width of selector * fix up spacing * fix copy button * fix branch naming; type issues * fix docs in custom nodes * add type * hide items when run selector is shown * increase selector size * add select prepend * clean up a bit * Add pagination * add stale icon * enable stale data in execution run * Revert "enable stale data in execution run" 8edb68dbffa0aa0d8189117e1a53381cb2c27608 * move metadata to its own state * fix smaller size * add scroll buttons * update tabs on resize * update stale data on rename * remove metadata on delete * hide x * change title colors * binary data classes * remove duplicate css * add colors * delete unused keys * use event bus * update styles of pagination * fix ts issues * fix ts issues * use chevron icons * fix design with download button * add back to canvas button * add trigger warning disabled * show trigger warning tooltip * update button labels for triggers * update node output message * fix add-option bug * add page selector * fix pagination selector bug * fix executions bug * remove hint * add json colors * add colors for json * add color json keys * fix select options bug * update keys * address comments * update name limit * align pencil * update icon size * update radio buttons height * address comments * fix pencil bug * change buttons alignment * fully center * change order of buttons * add no output message in branch * scroll to top * change active state * fix page size * all items * update expression background * update naming * align pencil * update modal background * add schedule group * update schedule nodes messages * use ellpises for last chars * fix spacing * fix tabs issue * fix too far data bug * fix executions bug * fix table wrapping * fix rename bug * add padding * handle unkown errors * add sticky header * ignore empty input, trim node name * nudge lightness of color * center buttons * update pagination * set colors of title * increase table font, fix alignment * fix pencil bug * fix spacing * use date now * address pagination issues * delete unused keys * update keys sort * fix prepend * fix radio button position * Revert "fix radio button position" ae42781786f2e6dcfb00d1be770b19a67f533bdf Co-authored-by: Mutasem <mutdmour@gmail.com> Co-authored-by: Mutasem Aldmour <4711238+mutdmour@users.noreply.github.com>
This commit is contained in:
Iván Ovejero
GitHub
@@ -2,16 +2,24 @@
|
||||
|
||||
## Base text
|
||||
|
||||
### Interpolation
|
||||
### Pluralization
|
||||
|
||||
Certain base text strings use [interpolation](https://kazupon.github.io/vue-i18n/guide/formatting.html#named-formatting) to allow for a variable to be passed in, signalled by curly braces:
|
||||
Certain base text strings accept [singular and plural versions](https://kazupon.github.io/vue-i18n/guide/pluralization.html) separated by a `|` character:
|
||||
|
||||
```json
|
||||
{
|
||||
"stopExecution": {
|
||||
"message": "The execution with the ID {activeExecutionId} got stopped!",
|
||||
"title": "Execution stopped"
|
||||
}
|
||||
"tagsView.inUse": "{count} workflow | {count} workflows",
|
||||
}
|
||||
```
|
||||
|
||||
### Interpolation
|
||||
|
||||
Certain base text strings use [interpolation](https://kazupon.github.io/vue-i18n/guide/formatting.html#named-formatting) to allow for a variable between curly braces:
|
||||
|
||||
```json
|
||||
{
|
||||
"stopExecution.message": "The execution with the ID {activeExecutionId} got stopped!",
|
||||
"stopExecution.title": "Execution stopped"
|
||||
}
|
||||
```
|
||||
|
||||
@@ -19,10 +27,8 @@ When translating a string containing an interpolated variable, leave the variabl
|
||||
|
||||
```json
|
||||
{
|
||||
"stopExecution": {
|
||||
"message": "Die Ausführung mit der ID {activeExecutionId} wurde gestoppt",
|
||||
"title": "Execution stopped"
|
||||
}
|
||||
"stopExecution.message": "Die Ausführung mit der ID {activeExecutionId} wurde gestoppt",
|
||||
"stopExecution.title": "Execution stopped"
|
||||
}
|
||||
```
|
||||
|
||||
@@ -32,18 +38,12 @@ As a convenience, the base text file may contain the special key `reusableBaseTe
|
||||
|
||||
```json
|
||||
{
|
||||
"reusableBaseText": {
|
||||
"save": "🇩🇪 Save",
|
||||
},
|
||||
"duplicateWorkflowDialog": {
|
||||
"enterWorkflowName": "🇩🇪 Enter workflow name",
|
||||
"save": "@:reusableBaseText.save",
|
||||
},
|
||||
"saveButton": {
|
||||
"save": "@:reusableBaseText.save",
|
||||
"saving": "🇩🇪 Saving",
|
||||
"saved": "🇩🇪 Saved",
|
||||
},
|
||||
"reusableBaseText.save": "🇩🇪 Save",
|
||||
"duplicateWorkflowDialog.enterWorkflowName": "🇩🇪 Enter workflow name",
|
||||
"duplicateWorkflowDialog.save": "@:reusableBaseText.save",
|
||||
"saveButton.save": "@:reusableBaseText.save",
|
||||
"saveButton.saving": "🇩🇪 Saving",
|
||||
"saveButton.saved": "🇩🇪 Saved",
|
||||
}
|
||||
```
|
||||
|
||||
@@ -92,23 +92,27 @@ Currently only the keys `oauth.clientId` and `oauth.clientSecret` are supported
|
||||
|
||||
```json
|
||||
{
|
||||
"reusableDynamicText": {
|
||||
"oauth2": {
|
||||
"clientId": "🇩🇪 Client ID",
|
||||
"clientSecret": "🇩🇪 Client Secret",
|
||||
}
|
||||
}
|
||||
"reusableDynamicText.oauth2.clientId": "🇩🇪 Client ID",
|
||||
"reusableDynamicText.oauth2.clientSecret": "🇩🇪 Client Secret",
|
||||
}
|
||||
```
|
||||
|
||||
### Special cases
|
||||
|
||||
`eventTriggerDescription` is a dynamic node property that is not part of node parameters. To translate it, set the `eventTriggerDescription` key at the root level of the `nodeView` property in the node translation file.
|
||||
`eventTriggerDescription` and `activationMessage` are dynamic node properties that are not part of node parameters. To translate them, set the key at the root level of the `nodeView` property in the node translation file.
|
||||
|
||||
Webhook node:
|
||||
|
||||
```json
|
||||
{
|
||||
"nodeView": {
|
||||
"eventTriggerDescription": "🇩🇪 Waiting for you to call the Test URL"
|
||||
}
|
||||
"nodeView.eventTriggerDescription": "🇩🇪 Waiting for you to call the Test URL",
|
||||
}
|
||||
```
|
||||
|
||||
Cron node:
|
||||
|
||||
```json
|
||||
{
|
||||
"nodeView.activationMessage": "🇩🇪 'Your cron trigger will now trigger executions on the schedule you have defined."
|
||||
}
|
||||
```
|
||||
|
||||
@@ -6,6 +6,7 @@ n8n allows for internalization of the majority of UI text:
|
||||
|
||||
- base text, e.g. menu display items in the left-hand sidebar menu,
|
||||
- node text, e.g. parameter display names and placeholders in the node view,
|
||||
- credential text, e.g. parameter display names and placeholders in the credential modal,
|
||||
- header text, e.g. node display names and descriptions at various spots.
|
||||
|
||||
Currently, n8n does _not_ allow for internalization of:
|
||||
@@ -55,12 +56,10 @@ Base text is rendered with no dependencies, i.e. base text is fixed and does not
|
||||
The base text file for each locale is located at `/packages/editor-ui/src/plugins/i18n/locales/` and is named `{localeIdentifier}.json`. Keys in the base text file can be Vue component dirs, Vue component names, and references to symbols in those Vue components. These keys are added by the team as the UI is modified or expanded.
|
||||
|
||||
```json
|
||||
"nodeCreator": {
|
||||
"categoryNames": {
|
||||
"analytics": "🇩🇪 Analytics",
|
||||
"communication": "🇩🇪 Communication",
|
||||
"coreNodes": "🇩🇪 Core Nodes"
|
||||
}
|
||||
{
|
||||
"nodeCreator.categoryNames.analytics": "🇩🇪 Analytics",
|
||||
"nodeCreator.categoryNames.communication": "🇩🇪 Communication",
|
||||
"nodeCreator.categoryNames.coreNodes": "🇩🇪 Core Nodes"
|
||||
}
|
||||
```
|
||||
|
||||
@@ -98,9 +97,9 @@ A credential translation file is placed at `/nodes-base/credentials/translations
|
||||
```
|
||||
credentials
|
||||
└── translations
|
||||
└── de
|
||||
├── githubApi.json
|
||||
└── githubOAuth2Api.json
|
||||
└── de
|
||||
├── githubApi.json
|
||||
└── githubOAuth2Api.json
|
||||
```
|
||||
Every credential must have its own credential translation file.
|
||||
|
||||
@@ -123,9 +122,9 @@ GitHub
|
||||
├── GitHub.node.ts
|
||||
├── GitHubTrigger.node.ts
|
||||
└── translations
|
||||
└── de
|
||||
├── github.json
|
||||
└── githubTrigger.json
|
||||
└── de
|
||||
├── github.json
|
||||
└── githubTrigger.json
|
||||
```
|
||||
|
||||
Every node must have its own node translation file.
|
||||
@@ -184,16 +183,10 @@ The object for each node credential parameter allows for the keys `displayName`,
|
||||
|
||||
```json
|
||||
{
|
||||
"server": {
|
||||
"displayName": "🇩🇪 Github Server",
|
||||
"description": "🇩🇪 The server to connect to. Only has to be set if Github Enterprise is used.",
|
||||
},
|
||||
"user": {
|
||||
"placeholder": "🇩🇪 Hans",
|
||||
},
|
||||
"accessToken": {
|
||||
"placeholder": "🇩🇪 123",
|
||||
},
|
||||
"server.displayName": "🇩🇪 Github Server",
|
||||
"server.description": "🇩🇪 The server to connect to. Only has to be set if Github Enterprise is used.",
|
||||
"user.placeholder": "🇩🇪 Hans",
|
||||
"accessToken.placeholder": "🇩🇪 123",
|
||||
}
|
||||
```
|
||||
|
||||
@@ -224,10 +217,8 @@ export class Github implements INodeType {
|
||||
|
||||
```json
|
||||
{
|
||||
"header": {
|
||||
"displayName": "🇩🇪 GitHub",
|
||||
"description": "🇩🇪 Consume GitHub API",
|
||||
},
|
||||
"header.displayName": "🇩🇪 GitHub",
|
||||
"header.description": "🇩🇪 Consume GitHub API",
|
||||
}
|
||||
```
|
||||
|
||||
@@ -264,11 +255,7 @@ export class Github implements INodeType {
|
||||
|
||||
```json
|
||||
{
|
||||
"nodeView": {
|
||||
"resource": {
|
||||
"displayName": "🇩🇪 Resource",
|
||||
},
|
||||
},
|
||||
"nodeView.resource.displayName": "🇩🇪 Resource",
|
||||
}
|
||||
```
|
||||
|
||||
@@ -291,13 +278,9 @@ Allowed keys: `displayName`, `description`, `placeholder`
|
||||
|
||||
```json
|
||||
{
|
||||
"nodeView": {
|
||||
"owner": {
|
||||
"displayName": "🇩🇪 Repository Owner",
|
||||
"placeholder": "🇩🇪 n8n-io",
|
||||
"description": "🇩🇪 Owner of the repository",
|
||||
},
|
||||
},
|
||||
"nodeView.owner.displayName": "🇩🇪 Repository Owner",
|
||||
"nodeView.owner.placeholder": "🇩🇪 n8n-io",
|
||||
"nodeView.owner.description": "🇩🇪 Owner of the repository",
|
||||
}
|
||||
```
|
||||
|
||||
@@ -333,20 +316,10 @@ Allowed subkeys: `options.{optionName}.displayName` and `options.{optionName}.de
|
||||
|
||||
```json
|
||||
{
|
||||
"nodeView": {
|
||||
"resource": {
|
||||
"displayName": "🇩🇪 Resource",
|
||||
"description": "🇩🇪 Resource to operate on",
|
||||
"options": {
|
||||
"file": {
|
||||
"displayName": "🇩🇪 File",
|
||||
},
|
||||
"issue": {
|
||||
"displayName": "🇩🇪 Issue",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
"nodeView.resource.displayName": "🇩🇪 Resource",
|
||||
"nodeView.resource.description": "🇩🇪 Resource to operate on",
|
||||
"nodeView.resource.options.file.displayName": "🇩🇪 File",
|
||||
"nodeView.resource.options.issue.displayName": "🇩🇪 Issue",
|
||||
}
|
||||
```
|
||||
|
||||
@@ -394,19 +367,11 @@ Example of `collection` parameter:
|
||||
|
||||
```json
|
||||
{
|
||||
"nodeView": {
|
||||
"labels": {
|
||||
"displayName": "🇩🇪 Labels",
|
||||
"multipleValueButtonText": "🇩🇪 Add Label",
|
||||
"options": {
|
||||
"label": {
|
||||
"displayName": "🇩🇪 Label",
|
||||
"description": "🇩🇪 Label to add to issue",
|
||||
"placeholder": "🇩🇪 Some placeholder"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
"nodeView.labels.displayName": "🇩🇪 Labels",
|
||||
"nodeView.labels.multipleValueButtonText": "🇩🇪 Add Label",
|
||||
"nodeView.labels.options.label.displayName": "🇩🇪 Label",
|
||||
"nodeView.labels.options.label.description": "🇩🇪 Label to add to issue",
|
||||
"nodeView.labels.options.label.placeholder": "🇩🇪 Some placeholder"
|
||||
}
|
||||
```
|
||||
|
||||
@@ -461,29 +426,15 @@ Example of `fixedCollection` parameter:
|
||||
|
||||
```json
|
||||
{
|
||||
"nodeView": {
|
||||
"additionalParameters": {
|
||||
"displayName": "🇩🇪 Additional Parameters",
|
||||
"placeholder": "🇩🇪 Add Field",
|
||||
"options": {
|
||||
"author": {
|
||||
"displayName": "🇩🇪 Author",
|
||||
"values": {
|
||||
"name": {
|
||||
"displayName": "🇩🇪 Name",
|
||||
"description": "🇩🇪 Name of the author of the commit",
|
||||
"placeholder": "🇩🇪 Jan"
|
||||
},
|
||||
"email": {
|
||||
"displayName": "🇩🇪 Email",
|
||||
"description": "🇩🇪 Email of the author of the commit",
|
||||
"placeholder": "🇩🇪 jan@n8n.io"
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
"nodeView.additionalParameters.displayName": "🇩🇪 Additional Parameters",
|
||||
"nodeView.additionalParameters.placeholder": "🇩🇪 Add Field",
|
||||
"nodeView.additionalParameters.options.author.displayName": "🇩🇪 Author",
|
||||
"nodeView.additionalParameters.options.author.values.name.displayName": "🇩🇪 Name",
|
||||
"nodeView.additionalParameters.options.author.values.name.description": "🇩🇪 Name of the author of the commit",
|
||||
"nodeView.additionalParameters.options.author.values.name.placeholder": "🇩🇪 Jan",
|
||||
"nodeView.additionalParameters.options.author.values.email.displayName": "🇩🇪 Email",
|
||||
"nodeView.additionalParameters.options.author.values.email.description": "🇩🇪 Email of the author of the commit",
|
||||
"nodeView.additionalParameters.options.author.values.email.placeholder": "🇩🇪 jan@n8n.io",
|
||||
}
|
||||
```
|
||||
|
||||
|
||||
Reference in New Issue
Block a user