⚡ Adjust all calls

packages/editor-ui/src/components/About.vue

@@ -1,6 +1,6 @@
 <template>
 	<span>
-		<el-dialog class="n8n-about" :visible="dialogVisible" append-to-body width="50%" :title="$baseText('about.aboutN8n')" :before-close="closeDialog">
+		<el-dialog class="n8n-about" :visible="dialogVisible" append-to-body width="50%" :title="$i18n2.baseText('about.aboutN8n')" :before-close="closeDialog">
 			<div>
 				<el-row>
 					<el-col :span="8" class="info-name">
@@ -30,7 +30,7 @@
 				</el-row>
 
 				<div class="action-buttons">
-					<n8n-button @click="closeDialog" :label="$baseText('about.close')" />
+					<n8n-button @click="closeDialog" :label="$i18n2.baseText('about.close')" />
 				</div>
 			</div>
 		</el-dialog>

packages/editor-ui/src/components/BinaryDataDisplay.vue

@@ -4,18 +4,18 @@
 			@click.stop="closeWindow"
 			size="small"
 			class="binary-data-window-back"
-			:title="$baseText('binaryDataDisplay.backToOverviewPage')"
+			:title="$i18n2.baseText('binaryDataDisplay.backToOverviewPage')"
 			icon="arrow-left"
-			:label="$baseText('binaryDataDisplay.backToList')"
+			:label="$i18n2.baseText('binaryDataDisplay.backToList')"
 		/>
 
 		<div class="binary-data-window-wrapper">
 			<div v-if="!binaryData">
-				{{ $baseText('binaryDataDisplay.noDataFoundToDisplay') }}
+				{{ $i18n2.baseText('binaryDataDisplay.noDataFoundToDisplay') }}
 			</div>
 			<video v-else-if="binaryData.mimeType && binaryData.mimeType.startsWith('video/')" controls autoplay>
 				<source :src="'data:' + binaryData.mimeType + ';base64,' + binaryData.data" :type="binaryData.mimeType">
-				{{ $baseText('binaryDataDisplay.yourBrowserDoesNotSupport') }}
+				{{ $i18n2.baseText('binaryDataDisplay.yourBrowserDoesNotSupport') }}
 			</video>
 			<embed v-else :src="'data:' + binaryData.mimeType + ';base64,' + binaryData.data" class="binary-data" :class="embedClass"/>
 		</div>

packages/editor-ui/src/components/CodeEdit.vue

@@ -1,8 +1,8 @@
 <template>
 	<div v-if="dialogVisible">
-		<el-dialog :visible="dialogVisible" append-to-body :close-on-click-modal="false" width="80%" :title="`${$baseText('codeEdit.edit')} ${$nodeText.topParameterDisplayName(parameter)}`" :before-close="closeDialog">
+		<el-dialog :visible="dialogVisible" append-to-body :close-on-click-modal="false" width="80%" :title="`${$i18n2.baseText('codeEdit.edit')} ${$i18n2.nodeText().topParameterDisplayName(parameter)}`" :before-close="closeDialog">
 			<div class="ignore-key-press">
-				<n8n-input-label :label="$nodeText.topParameterDisplayName(parameter)">
+				<n8n-input-label :label="$i18n2.nodeText().topParameterDisplayName(parameter)">
 					<div :class="$style.editor" @keydown.stop>
 						<prism-editor :lineNumbers="true" :code="value" :readonly="isReadOnly" @change="valueChanged" language="js"></prism-editor>
 					</div>

packages/editor-ui/src/components/CollectionParameter.vue

@@ -2,7 +2,7 @@
 	<div @keydown.stop class="collection-parameter">
 		<div class="collection-parameter-wrapper">
 			<div v-if="getProperties.length === 0" class="no-items-exist">
-				<n8n-text size="small">{{ $baseText('collectionParameter.noProperties') }}</n8n-text>
+				<n8n-text size="small">{{ $i18n2.baseText('collectionParameter.noProperties') }}</n8n-text>
 			</div>
 
 			<parameter-input-list :parameters="getProperties" :nodeValues="nodeValues" :path="path" :hideDelete="hideDelete" :indent="true" @valueChanged="valueChanged" />
@@ -19,7 +19,7 @@
 						<n8n-option
 							v-for="item in parameterOptions"
 							:key="item.name"
-							:label="$nodeText.collectionOptionDisplayName(parameter, item)"
+							:label="$i18n2.nodeText().collectionOptionDisplayName(parameter, item)"
 							:value="item.name">
 						</n8n-option>
 					</n8n-select>
@@ -67,8 +67,8 @@ export default mixins(
 		},
 		computed: {
 			getPlaceholderText (): string {
-				const placeholder = this.$nodeText.placeholder(this.parameter);
+				const placeholder = this.$i18n2.nodeText().placeholder(this.parameter);
-				return placeholder ? placeholder : this.$baseText('collectionParameter.choose');
+				return placeholder ? placeholder : this.$i18n2.baseText('collectionParameter.choose');
 			},
 			getProperties (): INodeProperties[] {
 				const returnProperties = [];

packages/editor-ui/src/components/CopyInput.vue

@@ -39,7 +39,7 @@ export default mixins(copyPaste, showMessage, renderText).extend({
 			this.copyToClipboard(this.$props.copyContent);
 
 			this.$showMessage({
-				title: this.$baseText('credentialsEdit.showMessage.title'),
+				title: this.$i18n2.baseText('credentialsEdit.showMessage.title'),
 				message: this.$props.successMessage,
 				type: 'success',
 			});

packages/editor-ui/src/components/CredentialEdit/CredentialConfig.vue

@@ -3,17 +3,17 @@
 		<banner
 			v-show="showValidationWarning"
 			theme="danger"
-			:message="$baseText('credentialEdit.credentialConfig.pleaseCheckTheErrorsBelow')"
+			:message="$i18n2.baseText('credentialEdit.credentialConfig.pleaseCheckTheErrorsBelow')"
 		/>
 
 		<banner
 			v-if="authError && !showValidationWarning"
 			theme="danger"
-			:message="$baseText('credentialEdit.credentialConfig.couldntConnectWithTheseSettings')"
+			:message="$i18n2.baseText('credentialEdit.credentialConfig.couldntConnectWithTheseSettings')"
 			:details="authError"
-			:buttonLabel="$baseText('credentialEdit.credentialConfig.retry')"
+			:buttonLabel="$i18n2.baseText('credentialEdit.credentialConfig.retry')"
 			buttonLoadingLabel="Retrying"
-			:buttonTitle="$baseText('credentialEdit.credentialConfig.retryCredentialTest')"
+			:buttonTitle="$i18n2.baseText('credentialEdit.credentialConfig.retryCredentialTest')"
 			:buttonLoading="isRetesting"
 			@click="$emit('retest')"
 		/>
@@ -21,37 +21,37 @@
 		<banner
 			v-show="showOAuthSuccessBanner && !showValidationWarning"
 			theme="success"
-			:message="$baseText('credentialEdit.credentialConfig.accountConnected')"
+			:message="$i18n2.baseText('credentialEdit.credentialConfig.accountConnected')"
-			:buttonLabel="$baseText('credentialEdit.credentialConfig.reconnect')"
+			:buttonLabel="$i18n2.baseText('credentialEdit.credentialConfig.reconnect')"
-			:buttonTitle="$baseText('credentialEdit.credentialConfig.reconnectOAuth2Credential')"
+			:buttonTitle="$i18n2.baseText('credentialEdit.credentialConfig.reconnectOAuth2Credential')"
 			@click="$emit('oauth')"
 		/>
 
 		<banner
 			v-show="testedSuccessfully && !showValidationWarning"
 			theme="success"
-			:message="$baseText('credentialEdit.credentialConfig.connectionTestedSuccessfully')"
+			:message="$i18n2.baseText('credentialEdit.credentialConfig.connectionTestedSuccessfully')"
-			:buttonLabel="$baseText('credentialEdit.credentialConfig.retry')"
+			:buttonLabel="$i18n2.baseText('credentialEdit.credentialConfig.retry')"
-			:buttonLoadingLabel="$baseText('credentialEdit.credentialConfig.retrying')"
+			:buttonLoadingLabel="$i18n2.baseText('credentialEdit.credentialConfig.retrying')"
-			:buttonTitle="$baseText('credentialEdit.credentialConfig.retryCredentialTest')"
+			:buttonTitle="$i18n2.baseText('credentialEdit.credentialConfig.retryCredentialTest')"
 			:buttonLoading="isRetesting"
 			@click="$emit('retest')"
 		/>
 
 		<n8n-info-tip v-if="documentationUrl && credentialProperties.length">
-			{{ $baseText('credentialEdit.credentialConfig.needHelpFillingOutTheseFields') }}
+			{{ $i18n2.baseText('credentialEdit.credentialConfig.needHelpFillingOutTheseFields') }}
 			<a :href="documentationUrl" target="_blank" @click="onDocumentationUrlClick">
-				{{ $baseText('credentialEdit.credentialConfig.openDocs') }}
+				{{ $i18n2.baseText('credentialEdit.credentialConfig.openDocs') }}
 			</a>
 		</n8n-info-tip>
 
 		<CopyInput
 			v-if="isOAuthType && credentialProperties.length"
-			:label="$baseText('credentialEdit.credentialConfig.oAuthRedirectUrl')"
+			:label="$i18n2.baseText('credentialEdit.credentialConfig.oAuthRedirectUrl')"
 			:copyContent="oAuthCallbackUrl"
-			:copyButtonText="$baseText('credentialEdit.credentialConfig.clickToCopy')"
+			:copyButtonText="$i18n2.baseText('credentialEdit.credentialConfig.clickToCopy')"
-			:subtitle="$baseText('credentialEdit.credentialConfig.subtitle', { interpolate: { appName } })"
+			:subtitle="$i18n2.baseText('credentialEdit.credentialConfig.subtitle', { interpolate: { appName } })"
-			:successMessage="$baseText('credentialEdit.credentialConfig.redirectUrlCopiedToClipboard')"
+			:successMessage="$i18n2.baseText('credentialEdit.credentialConfig.redirectUrlCopiedToClipboard')"
 		/>
 
 		<CredentialInputs
@@ -144,7 +144,7 @@ export default mixins(renderText, restApi).extend({
 				(this.credentialType as ICredentialType).displayName,
 			);
 
-			return appName || this.$baseText('credentialEdit.credentialConfig.theServiceYouReConnectingTo');
+			return appName || this.$i18n2.baseText('credentialEdit.credentialConfig.theServiceYouReConnectingTo');
 		},
 		credentialTypeName(): string {
 			return (this.credentialType as ICredentialType).name;

packages/editor-ui/src/components/CredentialEdit/CredentialEdit.vue

@@ -25,7 +25,7 @@
 					<n8n-icon-button
 						v-if="currentCredential"
 						size="small"
-						title="Delete"
+						:title="$i18n2.baseText('credentialEdit.credentialEdit.delete')"
 						icon="trash"
 						type="text"
 						:disabled="isSaving"
@@ -36,7 +36,9 @@
 						v-if="hasUnsavedChanges || credentialId"
 						:saved="!hasUnsavedChanges && !isTesting"
 						:isSaving="isSaving || isTesting"
-						:savingLabel="isTesting ? 'Testing' : 'Saving'"
+						:savingLabel="isTesting
+							? $i18n2.baseText('credentialEdit.credentialEdit.testing')
+							: $i18n2.baseText('credentialEdit.credentialEdit.saving')"
 						@click="saveCredential"
 					/>
 				</div>
@@ -53,10 +55,10 @@
 						:light="true"
 					>
 						<n8n-menu-item index="connection" :class="$style.credTab"
-							><span slot="title">{{ $baseText('credentialEdit.credentialEdit.connection') }}</span></n8n-menu-item
+							><span slot="title">{{ $i18n2.baseText('credentialEdit.credentialEdit.connection') }}</span></n8n-menu-item
 						>
 						<n8n-menu-item index="details" :class="$style.credTab"
-							><span slot="title">{{ $baseText('credentialEdit.credentialEdit.details') }}</span></n8n-menu-item
+							><span slot="title">{{ $i18n2.baseText('credentialEdit.credentialEdit.details') }}</span></n8n-menu-item
 						>
 					</n8n-menu>
 				</div>
@@ -350,20 +352,20 @@ export default mixins(renderText, showMessage, nodeHelpers).extend({
 			if (this.hasUnsavedChanges) {
 				const displayName = this.credentialType ? this.credentialType.displayName : '';
 				keepEditing = await this.confirmMessage(
-					this.$baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose1.message', { interpolate: { credentialDisplayName: displayName } }),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose1.message', { interpolate: { credentialDisplayName: displayName } }),
-					this.$baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose1.headline'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose1.headline'),
 					null,
-					this.$baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose1.cancelButtonText'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose1.cancelButtonText'),
-					this.$baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose1.confirmButtonText'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose1.confirmButtonText'),
 				);
 			}
 			else if (this.isOAuthType && !this.isOAuthConnected) {
 				keepEditing = await this.confirmMessage(
-					this.$baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose2.message'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose2.message'),
-					this.$baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose2.headline'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose2.headline'),
 					null,
-					this.$baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose2.cancelButtonText'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose2.cancelButtonText'),
-					this.$baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose2.confirmButtonText'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.beforeClose2.confirmButtonText'),
 				);
 			}
 
@@ -402,7 +404,7 @@ export default mixins(renderText, showMessage, nodeHelpers).extend({
 
 			if (!credentialsData) {
 				throw new Error(
-					this.$baseText('credentialEdit.credentialEdit.couldNotFindCredentialOfType') + ':' + name,
+					this.$i18n2.baseText('credentialEdit.credentialEdit.couldNotFindCredentialOfType') + ':' + name,
 				);
 			}
 
@@ -439,7 +441,7 @@ export default mixins(renderText, showMessage, nodeHelpers).extend({
 					});
 				if (!currentCredentials) {
 					throw new Error(
-						this.$baseText('credentialEdit.credentialEdit.couldNotFindCredentialWithId') + ':' + this.credentialId,
+						this.$i18n2.baseText('credentialEdit.credentialEdit.couldNotFindCredentialWithId') + ':' + this.credentialId,
 					);
 				}
 
@@ -454,8 +456,8 @@ export default mixins(renderText, showMessage, nodeHelpers).extend({
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('credentialEdit.credentialEdit.showError.loadCredential.title'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.showError.loadCredential.title'),
-					this.$baseText('credentialEdit.credentialEdit.showError.loadCredential.message'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.showError.loadCredential.message'),
 				);
 				this.closeDialog();
 
@@ -660,8 +662,8 @@ export default mixins(renderText, showMessage, nodeHelpers).extend({
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('credentialEdit.credentialEdit.showError.createCredential.title'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.showError.createCredential.title'),
-					this.$baseText('credentialEdit.credentialEdit.showError.createCredential.message'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.showError.createCredential.message'),
 				);
 
 				return null;
@@ -689,8 +691,8 @@ export default mixins(renderText, showMessage, nodeHelpers).extend({
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('credentialEdit.credentialEdit.showError.updateCredential.title'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.showError.updateCredential.title'),
-					this.$baseText('credentialEdit.credentialEdit.showError.updateCredential.message'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.showError.updateCredential.message'),
 				);
 
 				return null;
@@ -711,10 +713,10 @@ export default mixins(renderText, showMessage, nodeHelpers).extend({
 			const savedCredentialName = this.currentCredential.name;
 
 			const deleteConfirmed = await this.confirmMessage(
-				this.$baseText('credentialEdit.credentialEdit.confirmMessage.deleteCredential.message', { interpolate: { savedCredentialName } }),
+				this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.deleteCredential.message', { interpolate: { savedCredentialName } }),
-				this.$baseText('credentialEdit.credentialEdit.confirmMessage.deleteCredential.headline'),
+				this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.deleteCredential.headline'),
 				null,
-				this.$baseText('credentialEdit.credentialEdit.confirmMessage.deleteCredential.confirmButtonText'),
+				this.$i18n2.baseText('credentialEdit.credentialEdit.confirmMessage.deleteCredential.confirmButtonText'),
 			);
 
 			if (deleteConfirmed === false) {
@@ -730,8 +732,8 @@ export default mixins(renderText, showMessage, nodeHelpers).extend({
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('credentialEdit.credentialEdit.showError.deleteCredential.title'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.showError.deleteCredential.title'),
-					this.$baseText('credentialEdit.credentialEdit.showError.deleteCredential.message'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.showError.deleteCredential.message'),
 				);
 				this.isDeleting = false;
 
@@ -743,8 +745,8 @@ export default mixins(renderText, showMessage, nodeHelpers).extend({
 			this.updateNodesCredentialsIssues();
 
 			this.$showMessage({
-				title: this.$baseText('credentialEdit.credentialEdit.showMessage.title'),
+				title: this.$i18n2.baseText('credentialEdit.credentialEdit.showMessage.title'),
-				message: this.$baseText(
+				message: this.$i18n2.baseText(
 					'credentialEdit.credentialEdit.showMessage.message',
 					{ interpolate: { savedCredentialName } },
 				),
@@ -784,8 +786,8 @@ export default mixins(renderText, showMessage, nodeHelpers).extend({
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('credentialEdit.credentialEdit.showError.generateAuthorizationUrl.title'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.showError.generateAuthorizationUrl.title'),
-					this.$baseText('credentialEdit.credentialEdit.showError.generateAuthorizationUrl.message'),
+					this.$i18n2.baseText('credentialEdit.credentialEdit.showError.generateAuthorizationUrl.message'),
 				);
 
 				return;

packages/editor-ui/src/components/CredentialEdit/CredentialInfo.vue

@@ -3,7 +3,7 @@
 		<el-row>
 			<el-col :span="8" :class="$style.accessLabel">
 				<n8n-text :compact="true" :bold="true">
-					{{ $baseText('credentialEdit.credentialInfo.allowUseBy') }}
+					{{ $i18n2.baseText('credentialEdit.credentialInfo.allowUseBy') }}
 				</n8n-text>
 			</el-col>
 			<el-col :span="16">
@@ -13,7 +13,7 @@
 					:class="$style.valueLabel"
 				>
 					<el-checkbox
-						:label="$headerText({
+						:label="$i18n2.headerText({
 							key: `headers.${shortNodeType(node)}.displayName`,
 							fallback: node.displayName,
 						})"
@@ -26,7 +26,7 @@
 		<el-row v-if="currentCredential">
 			<el-col :span="8" :class="$style.label">
 				<n8n-text :compact="true" :bold="true">
-					{{ $baseText('credentialEdit.credentialInfo.created') }}
+					{{ $i18n2.baseText('credentialEdit.credentialInfo.created') }}
 				</n8n-text>
 			</el-col>
 			<el-col :span="16" :class="$style.valueLabel">
@@ -36,7 +36,7 @@
 		<el-row v-if="currentCredential">
 			<el-col :span="8" :class="$style.label">
 				<n8n-text :compact="true" :bold="true">
-					{{ $baseText('credentialEdit.credentialInfo.lastModified') }}
+					{{ $i18n2.baseText('credentialEdit.credentialInfo.lastModified') }}
 				</n8n-text>
 			</el-col>
 			<el-col :span="16" :class="$style.valueLabel">
@@ -46,7 +46,7 @@
 		<el-row v-if="currentCredential">
 			<el-col :span="8" :class="$style.label">
 				<n8n-text :compact="true" :bold="true">
-					{{ $baseText('credentialEdit.credentialInfo.id') }}
+					{{ $i18n2.baseText('credentialEdit.credentialInfo.id') }}
 				</n8n-text>
 			</el-col>
 			<el-col :span="16" :class="$style.valueLabel">
@@ -78,7 +78,7 @@ export default mixins(renderText).extend({
 			});
 		},
 		shortNodeType(nodeType: INodeTypeDescription) {
-			return this.$shortNodeType(nodeType.name);
+			return this.$i18n2.shortNodeType(nodeType.name);
 		},
 	},
 });

packages/editor-ui/src/components/CredentialEdit/OauthButton.vue

@@ -4,12 +4,12 @@
 			v-if="isGoogleOAuthType"
 			:src="basePath + 'google-signin-light.png'"
 			:class="$style.googleIcon"
-			:alt="$baseText('credentialEdit.oAuthButton.signInWithGoogle')"
+			:alt="$i18n2.baseText('credentialEdit.oAuthButton.signInWithGoogle')"
 			@click.stop="$emit('click')"
 		/>
 		<n8n-button
 			v-else
-			:label="$baseText('credentialEdit.oAuthButton.connectMyAccount')"
+			:label="$i18n2.baseText('credentialEdit.oAuthButton.connectMyAccount')"
 			size="large"
 			@click.stop="$emit('click')"
 		/>

packages/editor-ui/src/components/CredentialsList.vue

@@ -2,32 +2,32 @@
 	<Modal
 		:name="CREDENTIAL_LIST_MODAL_KEY"
 		width="80%"
-		:title="$baseText('credentialsList.credentials')"
+		:title="$i18n2.baseText('credentialsList.credentials')"
 	>
 		<template v-slot:content>
-			<n8n-heading tag="h3" size="small" color="text-light">{{ $baseText('credentialsList.yourSavedCredentials') + ':' }}</n8n-heading>
+			<n8n-heading tag="h3" size="small" color="text-light">{{ $i18n2.baseText('credentialsList.yourSavedCredentials') + ':' }}</n8n-heading>
 			<div class="new-credentials-button">
 				<n8n-button
-					:title="$baseText('credentialsList.createNewCredential')"
+					:title="$i18n2.baseText('credentialsList.createNewCredential')"
 					icon="plus"
-					:label="$baseText('credentialsList.addNew')"
+					:label="$i18n2.baseText('credentialsList.addNew')"
 					size="large"
 					@click="createCredential()"
 				/>
 			</div>
 
 			<el-table :data="credentialsToDisplay" :default-sort = "{prop: 'name', order: 'ascending'}" stripe max-height="450" @row-click="editCredential">
-				<el-table-column property="name" :label="$baseText('credentialsList.name')" class-name="clickable" sortable></el-table-column>
+				<el-table-column property="name" :label="$i18n2.baseText('credentialsList.name')" class-name="clickable" sortable></el-table-column>
-				<el-table-column property="type" :label="$baseText('credentialsList.type')" class-name="clickable" sortable></el-table-column>
+				<el-table-column property="type" :label="$i18n2.baseText('credentialsList.type')" class-name="clickable" sortable></el-table-column>
-				<el-table-column property="createdAt" :label="$baseText('credentialsList.created')" class-name="clickable" sortable></el-table-column>
+				<el-table-column property="createdAt" :label="$i18n2.baseText('credentialsList.created')" class-name="clickable" sortable></el-table-column>
-				<el-table-column property="updatedAt" :label="$baseText('credentialsList.updated')" class-name="clickable" sortable></el-table-column>
+				<el-table-column property="updatedAt" :label="$i18n2.baseText('credentialsList.updated')" class-name="clickable" sortable></el-table-column>
 				<el-table-column
-					:label="$baseText('credentialsList.operations')"
+					:label="$i18n2.baseText('credentialsList.operations')"
 					width="120">
 					<template slot-scope="scope">
 						<div class="cred-operations">
-							<n8n-icon-button :title="$baseText('credentialsList.editCredential')" @click.stop="editCredential(scope.row)" size="small" icon="pen" />
+							<n8n-icon-button :title="$i18n2.baseText('credentialsList.editCredential')" @click.stop="editCredential(scope.row)" size="small" icon="pen" />
-							<n8n-icon-button :title="$baseText('credentialsList.deleteCredential')" @click.stop="deleteCredential(scope.row)" size="small" icon="trash" />
+							<n8n-icon-button :title="$i18n2.baseText('credentialsList.deleteCredential')" @click.stop="deleteCredential(scope.row)" size="small" icon="trash" />
 						</div>
 					</template>
 				</el-table-column>
@@ -104,14 +104,14 @@ export default mixins(
 
 		async deleteCredential (credential: ICredentialsResponse) {
 			const deleteConfirmed = await this.confirmMessage(
-				this.$baseText(
+				this.$i18n2.baseText(
 					'credentialsList.confirmMessage.message',
 					{ interpolate: { credentialName: credential.name }},
 				),
-				this.$baseText('credentialsList.confirmMessage.headline'),
+				this.$i18n2.baseText('credentialsList.confirmMessage.headline'),
 				null,
-				this.$baseText('credentialsList.confirmMessage.confirmButtonText'),
+				this.$i18n2.baseText('credentialsList.confirmMessage.confirmButtonText'),
-				this.$baseText('credentialsList.confirmMessage.cancelButtonText'),
+				this.$i18n2.baseText('credentialsList.confirmMessage.cancelButtonText'),
 			);
 
 			if (deleteConfirmed === false) {
@@ -123,8 +123,8 @@ export default mixins(
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('credentialsList.showError.deleteCredential.title'),
+					this.$i18n2.baseText('credentialsList.showError.deleteCredential.title'),
-					this.$baseText('credentialsList.showError.deleteCredential.message'),
+					this.$i18n2.baseText('credentialsList.showError.deleteCredential.message'),
 				);
 
 				return;
@@ -134,8 +134,8 @@ export default mixins(
 			this.updateNodesCredentialsIssues();
 
 			this.$showMessage({
-				title: this.$baseText('credentialsList.showMessage.title'),
+				title: this.$i18n2.baseText('credentialsList.showMessage.title'),
-				message: this.$baseText(
+				message: this.$i18n2.baseText(
 					'credentialsList.showMessage.message',
 					{ interpolate: { credentialName: credential.name }},
 				),

packages/editor-ui/src/components/CredentialsSelectModal.vue

@@ -7,15 +7,15 @@
 		maxWidth="460px"
 	>
 		<template slot="header">
-			<h2 :class="$style.title">{{ $baseText('credentialSelectModal.addNewCredential') }}</h2>
+			<h2 :class="$style.title">{{ $i18n2.baseText('credentialSelectModal.addNewCredential') }}</h2>
 		</template>
 		<template slot="content">
 			<div>
-				<div :class="$style.subtitle">{{ $baseText('credentialSelectModal.selectAnAppOrServiceToConnectTo') }}</div>
+				<div :class="$style.subtitle">{{ $i18n2.baseText('credentialSelectModal.selectAnAppOrServiceToConnectTo') }}</div>
 				<n8n-select
 					filterable
 					defaultFirstOption
-					:placeholder="$baseText('credentialSelectModal.searchForApp')"
+					:placeholder="$i18n2.baseText('credentialSelectModal.searchForApp')"
 					size="xlarge"
 					ref="select"
 					:value="selected"
@@ -35,7 +35,7 @@
 		<template slot="footer">
 			<div :class="$style.footer">
 				<n8n-button
-					:label="$baseText('credentialSelectModal.continue')"
+					:label="$i18n2.baseText('credentialSelectModal.continue')"
 					float="right"
 					size="large"
 					:disabled="!selected"

packages/editor-ui/src/components/DataDisplay.vue

@@ -15,7 +15,7 @@
 		<transition name="fade">
 			<div v-if="nodeType && showDocumentHelp" class="doc-help-wrapper">
 						<svg id="help-logo" :href="documentationUrl" target="_blank" width="18px" height="18px" viewBox="0 0 18 18" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-							<title>{{ $baseText('dataDisplay.nodeDocumentation') }}</title>
+							<title>{{ $i18n2.baseText('dataDisplay.nodeDocumentation') }}</title>
 							<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
 								<g transform="translate(-1127.000000, -836.000000)" fill-rule="nonzero">
 									<g transform="translate(1117.000000, 825.000000)">
@@ -31,7 +31,7 @@
 						</svg>
 
 					<div class="text">
-						{{ $baseText('dataDisplay.needHelp') }} <a id="doc-hyperlink" :href="documentationUrl" target="_blank" @click="onDocumentationUrlClick">{{ $baseText('dataDisplay.openDocumentationFor', { interpolate: { nodeTypeDisplayName: nodeType.displayName } }) }}</a>
+						{{ $i18n2.baseText('dataDisplay.needHelp') }} <a id="doc-hyperlink" :href="documentationUrl" target="_blank" @click="onDocumentationUrlClick">{{ $i18n2.baseText('dataDisplay.openDocumentationFor', { interpolate: { nodeTypeDisplayName: nodeType.displayName } }) }}</a>
 					</div>
 			</div>
 		</transition>

packages/editor-ui/src/components/DisplayWithChange.vue

@@ -1,12 +1,12 @@
 <template>
 	<span class="static-text-wrapper">
-		<span v-show="!editActive" :title="$baseText('displayWithChange.clickToChange')">
+		<span v-show="!editActive" :title="$i18n2.baseText('displayWithChange.clickToChange')">
 			<span class="static-text" @mousedown="startEdit">{{currentValue}}</span>
 		</span>
 		<span v-show="editActive">
 			<input class="edit-field" ref="inputField" type="text" v-model="newValue" @keydown.enter.stop.prevent="setValue" @keydown.escape.stop.prevent="cancelEdit" @keydown.stop="noOp" @blur="cancelEdit" />
-			<font-awesome-icon icon="times" @mousedown="cancelEdit" class="icons clickable" :title="$baseText('displayWithChange.cancelEdit')" />
+			<font-awesome-icon icon="times" @mousedown="cancelEdit" class="icons clickable" :title="$i18n2.baseText('displayWithChange.cancelEdit')" />
-			<font-awesome-icon icon="check" @mousedown="setValue" class="icons clickable" :title="$baseText('displayWithChange.setValue')" />
+			<font-awesome-icon icon="check" @mousedown="setValue" class="icons clickable" :title="$i18n2.baseText('displayWithChange.setValue')" />
 		</span>
 	</span>
 </template>
@@ -34,9 +34,9 @@ export default mixins(genericHelpers).extend({
 			};
 
 			if (this.keyName === 'name' && this.node.type.startsWith('n8n-nodes-base.')) {
-				const shortNodeType = this.$shortNodeType(this.node.type);
+				const shortNodeType = this.$i18n2.shortNodeType(this.node.type);
 
-				return this.$headerText({
+				return this.$i18n2.headerText({
 					key: `headers.${shortNodeType}.displayName`,
 					fallback: getDescendantProp(this.node, this.keyName),
 				});

packages/editor-ui/src/components/DuplicateWorkflowDialog.vue

@@ -3,7 +3,7 @@
 		:name="modalName"
 		:eventBus="modalBus"
 		@enter="save"
-		:title="$baseText('duplicateWorkflowDialog.duplicateWorkflow')"
+		:title="$i18n2.baseText('duplicateWorkflowDialog.duplicateWorkflow')"
 		:center="true"
 		minWidth="420px"
 		maxWidth="420px"
@@ -13,7 +13,7 @@
 				<n8n-input
 					v-model="name"
 					ref="nameInput"
-					:placeholder="$baseText('duplicateWorkflowDialog.enterWorkflowName')"
+					:placeholder="$i18n2.baseText('duplicateWorkflowDialog.enterWorkflowName')"
 					:maxlength="MAX_WORKFLOW_NAME_LENGTH"
 				/>
 				<TagsDropdown
@@ -23,15 +23,15 @@
 					@blur="onTagsBlur"
 					@esc="onTagsEsc"
 					@update="onTagsUpdate"
-					:placeholder="$baseText('duplicateWorkflowDialog.chooseOrCreateATag')"
+					:placeholder="$i18n2.baseText('duplicateWorkflowDialog.chooseOrCreateATag')"
 					ref="dropdown"
 				/>
 			</div>
 		</template>
 		<template v-slot:footer="{ close }">
 			<div :class="$style.footer">
-				<n8n-button @click="save" :loading="isSaving" :label="$baseText('duplicateWorkflowDialog.save')" float="right" />
+				<n8n-button @click="save" :loading="isSaving" :label="$i18n2.baseText('duplicateWorkflowDialog.save')" float="right" />
-				<n8n-button type="outline" @click="close" :disabled="isSaving" :label="$baseText('duplicateWorkflowDialog.cancel')" float="right" />
+				<n8n-button type="outline" @click="close" :disabled="isSaving" :label="$i18n2.baseText('duplicateWorkflowDialog.cancel')" float="right" />
 			</div>
 		</template>
 	</Modal>
@@ -102,8 +102,8 @@ export default mixins(showMessage, renderText, workflowHelpers).extend({
 			const name = this.name.trim();
 			if (!name) {
 				this.$showMessage({
-					title: this.$baseText('duplicateWorkflowDialog.showMessage.title'),
+					title: this.$i18n2.baseText('duplicateWorkflowDialog.showMessage.title'),
-					message: this.$baseText('duplicateWorkflowDialog.showMessage.message'),
+					message: this.$i18n2.baseText('duplicateWorkflowDialog.showMessage.message'),
 					type: "error",
 				});
 

packages/editor-ui/src/components/Error/NodeErrorView.vue

@@ -1,18 +1,18 @@
 <template>
 	<div>
 		<div class="error-header">
-			<div class="error-message">{{ $baseText('nodeErrorView.error') + ':' + error.message }}</div>
+			<div class="error-message">{{ $i18n2.baseText('nodeErrorView.error') + ':' + error.message }}</div>
 			<div class="error-description" v-if="error.description">{{error.description}}</div>
 		</div>
 		<details>
 			<summary class="error-details__summary">
-				<font-awesome-icon class="error-details__icon" icon="angle-right" /> {{ $baseText('nodeErrorView.details') }}
+				<font-awesome-icon class="error-details__icon" icon="angle-right" /> {{ $i18n2.baseText('nodeErrorView.details') }}
 			</summary>
 			<div class="error-details__content">
 				<div v-if="error.timestamp">
 					<el-card class="box-card" shadow="never">
 						<div slot="header" class="clearfix box-card__title">
-							<span>{{ $baseText('nodeErrorView.time') }}</span>
+							<span>{{ $i18n2.baseText('nodeErrorView.time') }}</span>
 						</div>
 						<div>
 							{{new Date(error.timestamp).toLocaleString()}}
@@ -22,7 +22,7 @@
 				<div v-if="error.httpCode">
 					<el-card class="box-card" shadow="never">
 						<div slot="header" class="clearfix box-card__title">
-							<span>{{ $baseText('nodeErrorView.httpCode') }}</span>
+							<span>{{ $i18n2.baseText('nodeErrorView.httpCode') }}</span>
 						</div>
 						<div>
 							{{error.httpCode}}
@@ -32,13 +32,13 @@
 				<div v-if="error.cause">
 					<el-card class="box-card" shadow="never">
 						<div slot="header" class="clearfix box-card__title">
-							<span>{{ $baseText('nodeErrorView.cause') }}</span>
+							<span>{{ $i18n2.baseText('nodeErrorView.cause') }}</span>
 							<br>
-							<span class="box-card__subtitle">{{ $baseText('nodeErrorView.dataBelowMayContain') }}</span>
+							<span class="box-card__subtitle">{{ $i18n2.baseText('nodeErrorView.dataBelowMayContain') }}</span>
 						</div>
 						<div>
 							<div class="copy-button" v-if="displayCause">
-								<n8n-icon-button @click="copyCause" :title="$baseText('nodeErrorView.copyToClipboard')" icon="copy" />
+								<n8n-icon-button @click="copyCause" :title="$i18n2.baseText('nodeErrorView.copyToClipboard')" icon="copy" />
 							</div>
 							<vue-json-pretty
 								v-if="displayCause"
@@ -50,7 +50,7 @@
 								class="json-data"
 							/>
 							<span v-else>
-								<font-awesome-icon icon="info-circle" />{{ $baseText('nodeErrorView.theErrorCauseIsTooLargeToBeDisplayed') }}
+								<font-awesome-icon icon="info-circle" />{{ $i18n2.baseText('nodeErrorView.theErrorCauseIsTooLargeToBeDisplayed') }}
 							</span>
 						</div>
 					</el-card>
@@ -58,7 +58,7 @@
 				<div v-if="error.stack">
 					<el-card class="box-card" shadow="never">
 						<div slot="header" class="clearfix box-card__title">
-							<span>{{ $baseText('nodeErrorView.stack') }}</span>
+							<span>{{ $i18n2.baseText('nodeErrorView.stack') }}</span>
 						</div>
 						<div>
 							<pre><code>{{error.stack}}</code></pre>
@@ -105,8 +105,8 @@ export default mixins(
 		},
 		copySuccess() {
 			this.$showMessage({
-				title: this.$baseText('nodeErrorView.showMessage.title'),
+				title: this.$i18n2.baseText('nodeErrorView.showMessage.title'),
-				message: this.$baseText('nodeErrorView.showMessage.message'),
+				message: this.$i18n2.baseText('nodeErrorView.showMessage.message'),
 				type: 'info',
 			});
 		},

packages/editor-ui/src/components/ExecutionsList.vue

@@ -1,13 +1,13 @@
 <template>
 	<span>
-		<el-dialog :visible="dialogVisible" append-to-body width="80%" :title="`${$baseText('executionsList.workflowExecutions')} ${combinedExecutions.length}/${finishedExecutionsCountEstimated === true ? '~' : ''}${combinedExecutionsCount}`" :before-close="closeDialog">
+		<el-dialog :visible="dialogVisible" append-to-body width="80%" :title="`${$i18n2.baseText('executionsList.workflowExecutions')} ${combinedExecutions.length}/${finishedExecutionsCountEstimated === true ? '~' : ''}${combinedExecutionsCount}`" :before-close="closeDialog">
 			<div class="filters">
 				<el-row>
 					<el-col :span="2" class="filter-headline">
-						{{ $baseText('executionsList.filters') }}:
+						{{ $i18n2.baseText('executionsList.filters') }}:
 					</el-col>
 					<el-col :span="7">
-						<n8n-select v-model="filter.workflowId" :placeholder="$baseText('executionsList.selectWorkflow')" size="medium" filterable @change="handleFilterChanged">
+						<n8n-select v-model="filter.workflowId" :placeholder="$i18n2.baseText('executionsList.selectWorkflow')" size="medium" filterable @change="handleFilterChanged">
 							<n8n-option
 								v-for="item in workflows"
 								:key="item.id"
@@ -17,7 +17,7 @@
 						</n8n-select>
 					</el-col>
 					<el-col :span="5" :offset="1">
-						<n8n-select v-model="filter.status" :placeholder="$baseText('executionsList.selectStatus')" size="medium" filterable @change="handleFilterChanged">
+						<n8n-select v-model="filter.status" :placeholder="$i18n2.baseText('executionsList.selectStatus')" size="medium" filterable @change="handleFilterChanged">
 							<n8n-option
 								v-for="item in statuses"
 								:key="item.id"
@@ -27,15 +27,15 @@
 						</n8n-select>
 					</el-col>
 					<el-col :span="4" :offset="5" class="autorefresh">
-						<el-checkbox v-model="autoRefresh" @change="handleAutoRefreshToggle">{{ $baseText('executionsList.autoRefresh') }}</el-checkbox>
+						<el-checkbox v-model="autoRefresh" @change="handleAutoRefreshToggle">{{ $i18n2.baseText('executionsList.autoRefresh') }}</el-checkbox>
 					</el-col>
 				</el-row>
 			</div>
 
 			<div class="selection-options">
 				<span v-if="checkAll === true || isIndeterminate === true">
-					{{ $baseText('executionsList.selected') }}: {{numSelected}} / <span v-if="finishedExecutionsCountEstimated === true">~</span>{{finishedExecutionsCount}}
+					{{ $i18n2.baseText('executionsList.selected') }}: {{numSelected}} / <span v-if="finishedExecutionsCountEstimated === true">~</span>{{finishedExecutionsCount}}
-					<n8n-icon-button :title="$baseText('executionsList.deleteSelected')" icon="trash" size="mini" @click="handleDeleteSelected" />
+					<n8n-icon-button :title="$i18n2.baseText('executionsList.deleteSelected')" icon="trash" size="mini" @click="handleDeleteSelected" />
 				</span>
 			</div>
 
@@ -49,45 +49,45 @@
 						<el-checkbox v-if="scope.row.stoppedAt !== undefined && scope.row.id" :value="selectedItems[scope.row.id.toString()] || checkAll" @change="handleCheckboxChanged(scope.row.id)" label=" "></el-checkbox>
 					</template>
 				</el-table-column>
-				<el-table-column property="startedAt" :label="$baseText('executionsList.startedAtId')" width="205">
+				<el-table-column property="startedAt" :label="$i18n2.baseText('executionsList.startedAtId')" width="205">
 					<template slot-scope="scope">
 						{{convertToDisplayDate(scope.row.startedAt)}}<br />
 						<small v-if="scope.row.id">ID: {{scope.row.id}}</small>
 					</template>
 				</el-table-column>
-				<el-table-column property="workflowName" :label="$baseText('executionsList.name')">
+				<el-table-column property="workflowName" :label="$i18n2.baseText('executionsList.name')">
 					<template slot-scope="scope">
 						<span class="workflow-name">
-							{{ scope.row.workflowName || $baseText('executionsList.unsavedWorkflow') }}
+							{{ scope.row.workflowName || $i18n2.baseText('executionsList.unsavedWorkflow') }}
 						</span>
 
 						<span v-if="scope.row.stoppedAt === undefined">
-							({{ $baseText('executionsList.running') }})
+							({{ $i18n2.baseText('executionsList.running') }})
 						</span>
 						<span v-if="scope.row.retryOf !== undefined">
-							<br /><small>{{ $baseText('executionsList.retryOf') }} "{{scope.row.retryOf}}"</small>
+							<br /><small>{{ $i18n2.baseText('executionsList.retryOf') }} "{{scope.row.retryOf}}"</small>
 						</span>
 						<span v-else-if="scope.row.retrySuccessId !== undefined">
-							<br /><small>{{ $baseText('executionsList.successRetry') }} "{{scope.row.retrySuccessId}}"</small>
+							<br /><small>{{ $i18n2.baseText('executionsList.successRetry') }} "{{scope.row.retrySuccessId}}"</small>
 						</span>
 					</template>
 				</el-table-column>
-				<el-table-column :label="$baseText('executionsList.status')" width="122" align="center">
+				<el-table-column :label="$i18n2.baseText('executionsList.status')" width="122" align="center">
 					<template slot-scope="scope" align="center">
 
 						<n8n-tooltip placement="top" >
 							<div slot="content" v-html="statusTooltipText(scope.row)"></div>
 							<span class="status-badge running" v-if="scope.row.stoppedAt === undefined">
-								{{ $baseText('executionsList.running') }}
+								{{ $i18n2.baseText('executionsList.running') }}
 							</span>
 							<span class="status-badge success" v-else-if="scope.row.finished">
-								{{ $baseText('executionsList.success') }}
+								{{ $i18n2.baseText('executionsList.success') }}
 							</span>
 							<span class="status-badge error" v-else-if="scope.row.stoppedAt !== null">
-								{{ $baseText('executionsList.error') }}
+								{{ $i18n2.baseText('executionsList.error') }}
 							</span>
 							<span class="status-badge warning" v-else>
-								{{ $baseText('executionsList.unknown') }}
+								{{ $i18n2.baseText('executionsList.unknown') }}
 							</span>
 						</n8n-tooltip>
 
@@ -98,28 +98,28 @@
 									 type="light"
 									 :theme="scope.row.stoppedAt === null ? 'warning': 'danger'"
 									 size="mini"
-									 :title="$baseText('executionsList.retryExecution')"
+									 :title="$i18n2.baseText('executionsList.retryExecution')"
 									 icon="redo"
 								/>
 							</span>
 							<el-dropdown-menu slot="dropdown">
 								<el-dropdown-item :command="{command: 'currentlySaved', row: scope.row}">
-									{{ $baseText('executionsList.retryWithCurrentlySavedWorkflow') }}
+									{{ $i18n2.baseText('executionsList.retryWithCurrentlySavedWorkflow') }}
 								</el-dropdown-item>
 								<el-dropdown-item :command="{command: 'original', row: scope.row}">
-									{{ $baseText('executionsList.retryWithOriginalworkflow') }}
+									{{ $i18n2.baseText('executionsList.retryWithOriginalworkflow') }}
 								</el-dropdown-item>
 							</el-dropdown-menu>
 						</el-dropdown>
 
 					</template>
 				</el-table-column>
-				<el-table-column property="mode" :label="$baseText('executionsList.mode')" width="100" align="center">
+				<el-table-column property="mode" :label="$i18n2.baseText('executionsList.mode')" width="100" align="center">
 					<template slot-scope="scope">
-						{{ $baseText(`executionsList.modes.${scope.row.mode}`) }}
+						{{ $i18n2.baseText(`executionsList.modes.${scope.row.mode}`) }}
 					</template>
 				</el-table-column>
-				<el-table-column :label="$baseText('executionsList.runningTime')" width="150" align="center">
+				<el-table-column :label="$i18n2.baseText('executionsList.runningTime')" width="150" align="center">
 					<template slot-scope="scope">
 						<span v-if="scope.row.stoppedAt === undefined">
 							<font-awesome-icon icon="spinner" spin />
@@ -138,10 +138,10 @@
 					<template slot-scope="scope">
 						<div class="actions-container">
 							<span v-if="scope.row.stoppedAt === undefined || scope.row.waitTill">
-								<n8n-icon-button icon="stop" size="small" :title="$baseText('executionsList.stopExecution')" @click.stop="stopExecution(scope.row.id)" :loading="stoppingExecutions.includes(scope.row.id)" />
+								<n8n-icon-button icon="stop" size="small" :title="$i18n2.baseText('executionsList.stopExecution')" @click.stop="stopExecution(scope.row.id)" :loading="stoppingExecutions.includes(scope.row.id)" />
 							</span>
 							<span v-if="scope.row.stoppedAt !== undefined && scope.row.id" >
-								<n8n-icon-button icon="folder-open" size="small" :title="$baseText('executionsList.openPastExecution')" @click.stop="(e) => displayExecution(scope.row, e)" />
+								<n8n-icon-button icon="folder-open" size="small" :title="$i18n2.baseText('executionsList.openPastExecution')" @click.stop="(e) => displayExecution(scope.row, e)" />
 							</span>
 						</div>
 					</template>
@@ -149,7 +149,7 @@
 			</el-table>
 
 			<div class="load-more" v-if="finishedExecutionsCount > finishedExecutions.length || finishedExecutionsCountEstimated === true">
-				<n8n-button icon="sync" :title="$baseText('executionsList.loadMore')" :label="$baseText('executionsList.loadMore')" @click="loadMore()" :loading="isDataLoading" />
+				<n8n-button icon="sync" :title="$i18n2.baseText('executionsList.loadMore')" :label="$i18n2.baseText('executionsList.loadMore')" @click="loadMore()" :loading="isDataLoading" />
 			</div>
 
 		</el-dialog>
@@ -235,23 +235,23 @@ export default mixins(
 			return [
 				{
 					id: 'ALL',
-					name: this.$baseText('executionsList.anyStatus'),
+					name: this.$i18n2.baseText('executionsList.anyStatus'),
 				},
 				{
 					id: 'error',
-					name: this.$baseText('executionsList.error'),
+					name: this.$i18n2.baseText('executionsList.error'),
 				},
 				{
 					id: 'running',
-					name: this.$baseText('executionsList.running'),
+					name: this.$i18n2.baseText('executionsList.running'),
 				},
 				{
 					id: 'success',
-					name: this.$baseText('executionsList.success'),
+					name: this.$i18n2.baseText('executionsList.success'),
 				},
 				{
 					id: 'waiting',
-					name: this.$baseText('executionsList.waiting'),
+					name: this.$i18n2.baseText('executionsList.waiting'),
 				},
 			];
 		},
@@ -369,14 +369,14 @@ export default mixins(
 		},
 		async handleDeleteSelected () {
 			const deleteExecutions = await this.confirmMessage(
-				this.$baseText(
+				this.$i18n2.baseText(
 					'executionsList.confirmMessage.message',
 					{ interpolate: { numSelected: this.numSelected.toString() }},
 				),
-				this.$baseText('executionsList.confirmMessage.headline'),
+				this.$i18n2.baseText('executionsList.confirmMessage.headline'),
 				'warning',
-				this.$baseText('executionsList.confirmMessage.confirmButtonText'),
+				this.$i18n2.baseText('executionsList.confirmMessage.confirmButtonText'),
-				this.$baseText('executionsList.confirmMessage.cancelButtonText'),
+				this.$i18n2.baseText('executionsList.confirmMessage.cancelButtonText'),
 			);
 
 			if (deleteExecutions === false) {
@@ -400,8 +400,8 @@ export default mixins(
 				this.isDataLoading = false;
 				this.$showError(
 					error,
-					this.$baseText('executionsList.showError.handleDeleteSelected.title'),
+					this.$i18n2.baseText('executionsList.showError.handleDeleteSelected.title'),
-					this.$baseText('executionsList.showError.handleDeleteSelected.message'),
+					this.$i18n2.baseText('executionsList.showError.handleDeleteSelected.message'),
 				);
 
 				return;
@@ -409,8 +409,8 @@ export default mixins(
 			this.isDataLoading = false;
 
 			this.$showMessage({
-				title: this.$baseText('executionsList.showMessage.handleDeleteSelected.title'),
+				title: this.$i18n2.baseText('executionsList.showMessage.handleDeleteSelected.title'),
-				message: this.$baseText('executionsList.showMessage.handleDeleteSelected.message'),
+				message: this.$i18n2.baseText('executionsList.showMessage.handleDeleteSelected.message'),
 				type: 'success',
 			});
 
@@ -563,8 +563,8 @@ export default mixins(
 				this.isDataLoading = false;
 				this.$showError(
 					error,
-					this.$baseText('executionsList.showError.loadMore.title'),
+					this.$i18n2.baseText('executionsList.showError.loadMore.title'),
-					this.$baseText('executionsList.showError.loadMore.message') + ':',
+					this.$i18n2.baseText('executionsList.showError.loadMore.message') + ':',
 				);
 				return;
 			}
@@ -596,15 +596,15 @@ export default mixins(
 				// @ts-ignore
 				workflows.unshift({
 					id: 'ALL',
-					name: this.$baseText('executionsList.allWorkflows'),
+					name: this.$i18n2.baseText('executionsList.allWorkflows'),
 				});
 
 				Vue.set(this, 'workflows', workflows);
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('executionsList.showError.loadWorkflows.title'),
+					this.$i18n2.baseText('executionsList.showError.loadWorkflows.title'),
-					this.$baseText('executionsList.showError.loadWorkflows.message') + ':',
+					this.$i18n2.baseText('executionsList.showError.loadWorkflows.message') + ':',
 				);
 			}
 		},
@@ -628,14 +628,14 @@ export default mixins(
 
 				if (retrySuccessful === true) {
 					this.$showMessage({
-						title: this.$baseText('executionsList.showMessage.retrySuccessfulTrue.title'),
+						title: this.$i18n2.baseText('executionsList.showMessage.retrySuccessfulTrue.title'),
-						message: this.$baseText('executionsList.showMessage.retrySuccessfulTrue.message'),
+						message: this.$i18n2.baseText('executionsList.showMessage.retrySuccessfulTrue.message'),
 						type: 'success',
 					});
 				} else {
 					this.$showMessage({
-						title: this.$baseText('executionsList.showMessage.retrySuccessfulFalse.title'),
+						title: this.$i18n2.baseText('executionsList.showMessage.retrySuccessfulFalse.title'),
-						message: this.$baseText('executionsList.showMessage.retrySuccessfulFalse.message'),
+						message: this.$i18n2.baseText('executionsList.showMessage.retrySuccessfulFalse.message'),
 						type: 'error',
 					});
 				}
@@ -644,8 +644,8 @@ export default mixins(
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('executionsList.showError.retryExecution.title'),
+					this.$i18n2.baseText('executionsList.showError.retryExecution.title'),
-					this.$baseText('executionsList.showError.retryExecution.message') + ':',
+					this.$i18n2.baseText('executionsList.showError.retryExecution.message') + ':',
 				);
 
 				this.isDataLoading = false;
@@ -661,8 +661,8 @@ export default mixins(
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('executionsList.showError.refreshData.title'),
+					this.$i18n2.baseText('executionsList.showError.refreshData.title'),
-					this.$baseText('executionsList.showError.refreshData.message') + ':',
+					this.$i18n2.baseText('executionsList.showError.refreshData.message') + ':',
 				);
 			}
 
@@ -672,10 +672,10 @@ export default mixins(
 			if (entry.waitTill) {
 				const waitDate = new Date(entry.waitTill);
 				if (waitDate.toISOString() === WAIT_TIME_UNLIMITED) {
-					return this.$baseText('executionsList.statusTooltipText.theWorkflowIsWaitingIndefinitely');
+					return this.$i18n2.baseText('executionsList.statusTooltipText.theWorkflowIsWaitingIndefinitely');
 				}
 
-				return this.$baseText(
+				return this.$i18n2.baseText(
 					'executionsList.statusTooltipText.theWorkflowIsWaitingTill',
 					{
 						interpolate: {
@@ -685,28 +685,28 @@ export default mixins(
 					},
 				);
 			} else if (entry.stoppedAt === undefined) {
-				return this.$baseText('executionsList.statusTooltipText.theWorkflowIsCurrentlyExecuting');
+				return this.$i18n2.baseText('executionsList.statusTooltipText.theWorkflowIsCurrentlyExecuting');
 			} else if (entry.finished === true && entry.retryOf !== undefined) {
-				return this.$baseText(
+				return this.$i18n2.baseText(
 					'executionsList.statusTooltipText.theWorkflowExecutionWasARetryOfAndItWasSuccessful',
 					{ interpolate: { entryRetryOf: entry.retryOf }},
 				);
 			} else if (entry.finished === true) {
-				return this.$baseText('executionsList.statusTooltipText.theWorkflowExecutionWasSuccessful');
+				return this.$i18n2.baseText('executionsList.statusTooltipText.theWorkflowExecutionWasSuccessful');
 			} else if (entry.retryOf !== undefined) {
-				return this.$baseText(
+				return this.$i18n2.baseText(
 					'executionsList.statusTooltipText.theWorkflowExecutionWasARetryOfAndFailed',
 					{ interpolate: { entryRetryOf: entry.retryOf }},
 				);
 			} else if (entry.retrySuccessId !== undefined) {
-				return this.$baseText(
+				return this.$i18n2.baseText(
 					'executionsList.statusTooltipText.theWorkflowExecutionFailedButTheRetryWasSuccessful',
 					{ interpolate: { entryRetrySuccessId: entry.retrySuccessId }},
 				);
 			} else if (entry.stoppedAt === null) {
-				return this.$baseText('executionsList.statusTooltipText.theWorkflowExecutionIsProbablyStillRunning');
+				return this.$i18n2.baseText('executionsList.statusTooltipText.theWorkflowExecutionIsProbablyStillRunning');
 			} else {
-				return this.$baseText('executionsList.statusTooltipText.theWorkflowExecutionFailed');
+				return this.$i18n2.baseText('executionsList.statusTooltipText.theWorkflowExecutionFailed');
 			}
 		},
 		async stopExecution (activeExecutionId: string) {
@@ -722,8 +722,8 @@ export default mixins(
 				this.stoppingExecutions.splice(index, 1);
 
 				this.$showMessage({
-					title: this.$baseText('executionsList.showMessage.stopExecution.title'),
+					title: this.$i18n2.baseText('executionsList.showMessage.stopExecution.title'),
-					message: this.$baseText(
+					message: this.$i18n2.baseText(
 						'executionsList.showMessage.stopExecution.message',
 						{ interpolate: { activeExecutionId } },
 					),
@@ -734,8 +734,8 @@ export default mixins(
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('executionsList.showError.stopExecution.title'),
+					this.$i18n2.baseText('executionsList.showError.stopExecution.title'),
-					this.$baseText('executionsList.showError.stopExecution.message'),
+					this.$i18n2.baseText('executionsList.showError.stopExecution.message'),
 				);
 			}
 		},

packages/editor-ui/src/components/ExpressionEdit.vue

@@ -1,14 +1,14 @@
 <template>
 	<div v-if="dialogVisible" @keydown.stop>
-		<el-dialog :visible="dialogVisible" custom-class="expression-dialog classic" append-to-body width="80%" :title="$baseText('expressionEdit.editExpression')" :before-close="closeDialog">
+		<el-dialog :visible="dialogVisible" custom-class="expression-dialog classic" append-to-body width="80%" :title="$i18n2.baseText('expressionEdit.editExpression')" :before-close="closeDialog">
 			<el-row>
 				<el-col :span="8">
 					<div class="header-side-menu">
 						<div class="headline">
-							{{ $baseText('expressionEdit.editExpression') }}
+							{{ $i18n2.baseText('expressionEdit.editExpression') }}
 						</div>
 						<div class="sub-headline">
-							{{ $baseText('expressionEdit.variableSelector') }}
+							{{ $i18n2.baseText('expressionEdit.variableSelector') }}
 						</div>
 					</div>
 
@@ -19,7 +19,7 @@
 				<el-col :span="16" class="right-side">
 					<div class="expression-editor-wrapper">
 						<div class="editor-description">
-							{{ $baseText('expressionEdit.expression') }}
+							{{ $i18n2.baseText('expressionEdit.expression') }}
 						</div>
 						<div class="expression-editor">
 							<expression-input :parameter="parameter" ref="inputFieldExpression" rows="8" :value="value" :path="path" @change="valueChanged" @keydown.stop="noOp"></expression-input>
@@ -28,7 +28,7 @@
 
 					<div class="expression-result-wrapper">
 						<div class="editor-description">
-							{{ $baseText('expressionEdit.result') }}
+							{{ $i18n2.baseText('expressionEdit.result') }}
 						</div>
 						<expression-input :parameter="parameter" resolvedValue="true" ref="expressionResult" rows="8" :value="displayValue" :path="path"></expression-input>
 					</div>

packages/editor-ui/src/components/FixedCollectionParameter.vue

@@ -1,12 +1,12 @@
 <template>
 	<div @keydown.stop class="fixed-collection-parameter">
 		<div v-if="getProperties.length === 0" class="no-items-exist">
-			<n8n-text size="small">{{ $baseText('fixedCollectionParameter.currentlyNoItemsExist') }}</n8n-text>
+			<n8n-text size="small">{{ $i18n2.baseText('fixedCollectionParameter.currentlyNoItemsExist') }}</n8n-text>
 		</div>
 
 		<div v-for="property in getProperties" :key="property.name" class="fixed-collection-parameter-property">
 			<n8n-input-label
-				:label="property.displayName === '' || parameter.options.length === 1 ? '' : $nodeText.topParameterDisplayName(property)"
+				:label="property.displayName === '' || parameter.options.length === 1 ? '' : $i18n2.nodeText().topParameterDisplayName(property)"
 				:underline="true"
 				:labelHoverableOnly="true"
 				size="small"
@@ -15,10 +15,10 @@
 					<div v-for="(value, index) in values[property.name]" :key="property.name + index" class="parameter-item">
 						<div class="parameter-item-wrapper">
 							<div class="delete-option" v-if="!isReadOnly">
-								<font-awesome-icon icon="trash" class="reset-icon clickable" :title="$baseText('fixedCollectionParameter.deleteItem')" @click="deleteOption(property.name, index)" />
+								<font-awesome-icon icon="trash" class="reset-icon clickable" :title="$i18n2.baseText('fixedCollectionParameter.deleteItem')" @click="deleteOption(property.name, index)" />
 								<div v-if="sortable" class="sort-icon">
-									<font-awesome-icon v-if="index !== 0" icon="angle-up" class="clickable" :title="$baseText('fixedCollectionParameter.moveUp')" @click="moveOptionUp(property.name, index)" />
+									<font-awesome-icon v-if="index !== 0" icon="angle-up" class="clickable" :title="$i18n2.baseText('fixedCollectionParameter.moveUp')" @click="moveOptionUp(property.name, index)" />
-									<font-awesome-icon v-if="index !== (values[property.name].length -1)" icon="angle-down" class="clickable" :title="$baseText('fixedCollectionParameter.moveDown')" @click="moveOptionDown(property.name, index)" />
+									<font-awesome-icon v-if="index !== (values[property.name].length -1)" icon="angle-down" class="clickable" :title="$i18n2.baseText('fixedCollectionParameter.moveDown')" @click="moveOptionDown(property.name, index)" />
 								</div>
 							</div>
 							<parameter-input-list :parameters="property.values" :nodeValues="nodeValues" :path="getPropertyPath(property.name, index)" :hideDelete="true" @valueChanged="valueChanged" />
@@ -28,7 +28,7 @@
 				<div v-else class="parameter-item">
 					<div class="parameter-item-wrapper">
 						<div class="delete-option" v-if="!isReadOnly">
-							<font-awesome-icon icon="trash" class="reset-icon clickable" :title="$baseText('fixedCollectionParameter.deleteItem')" @click="deleteOption(property.name)" />
+							<font-awesome-icon icon="trash" class="reset-icon clickable" :title="$i18n2.baseText('fixedCollectionParameter.deleteItem')" @click="deleteOption(property.name)" />
 						</div>
 						<parameter-input-list :parameters="property.values" :nodeValues="nodeValues" :path="getPropertyPath(property.name)" class="parameter-item" @valueChanged="valueChanged" :hideDelete="true" />
 					</div>
@@ -43,7 +43,7 @@
 					<n8n-option
 						v-for="item in parameterOptions"
 						:key="item.name"
-						:label="$nodeText.collectionOptionDisplayName(parameter, item)"
+						:label="$i18n2.nodeText().collectionOptionDisplayName(parameter, item)"
 						:value="item.name">
 					</n8n-option>
 				</n8n-select>
@@ -85,8 +85,8 @@ export default mixins(genericHelpers)
 		},
 		computed: {
 			getPlaceholderText (): string {
-				const placeholder = this.$nodeText.placeholder(this.parameter);
+				const placeholder = this.$i18n2.nodeText().placeholder(this.parameter);
-				return placeholder ? placeholder : this.$baseText('fixedCollectionParameter.choose');
+				return placeholder ? placeholder : this.$i18n2.baseText('fixedCollectionParameter.choose');
 			},
 			getProperties (): INodePropertyCollection[] {
 				const returnProperties = [];

packages/editor-ui/src/components/MainHeader/ExecutionDetails/ExecutionDetails.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="container">
 		<span class="title">
-			{{ $baseText('executionDetails.executionId') + ':' }}
+			{{ $i18n2.baseText('executionDetails.executionId') + ':' }}
 			<span>
 				<strong>{{ executionId }}</strong
 				>&nbsp;
@@ -9,23 +9,23 @@
 					icon="check"
 					class="execution-icon success"
 					v-if="executionFinished"
-					:title="$baseText('executionDetails.executionWasSuccessful')"
+					:title="$i18n2.baseText('executionDetails.executionWasSuccessful')"
 				/>
 				<font-awesome-icon
 					icon="clock"
 					class="execution-icon warning"
 					v-else-if="executionWaiting"
-					:title="$baseText('executionDetails.executionWaiting')"
+					:title="$i18n2.baseText('executionDetails.executionWaiting')"
 				/>
 				<font-awesome-icon
 					icon="times"
 					class="execution-icon error"
 					v-else
-					:title="$baseText('executionDetails.executionFailed')"
+					:title="$i18n2.baseText('executionDetails.executionFailed')"
 				/>
 			</span>
-			{{ $baseText('executionDetails.of') }}
+			{{ $i18n2.baseText('executionDetails.of') }}
-			<span class="primary-color clickable" :title="$baseText('executionDetails.openWorkflow')">
+			<span class="primary-color clickable" :title="$i18n2.baseText('executionDetails.openWorkflow')">
 				<WorkflowNameShort :name="workflowName">
 					<template v-slot="{ shortenedName }">
 						<span @click="openWorkflow(workflowExecution.workflowId)">
@@ -34,7 +34,7 @@
 					</template>
 				</WorkflowNameShort>
 			</span>
-			{{ $baseText('executionDetails.workflow') }}
+			{{ $i18n2.baseText('executionDetails.workflow') }}
 		</span>
 		<ReadOnly class="read-only" />
 	</div>

packages/editor-ui/src/components/MainHeader/ExecutionDetails/ReadOnly.vue

@@ -1,11 +1,11 @@
 <template>
 	<n8n-tooltip class="primary-color" placement="bottom-end" >
 		<div slot="content">
-			<span v-html="$baseText('executionDetails.readOnly.youreViewingTheLogOf')"></span>
+			<span v-html="$i18n2.baseText('executionDetails.readOnly.youreViewingTheLogOf')"></span>
 		</div>
 		<div>
 			<font-awesome-icon icon="exclamation-triangle" />
-			<span v-html="$baseText('executionDetails.readOnly.readOnly')"></span>
+			<span v-html="$i18n2.baseText('executionDetails.readOnly.readOnly')"></span>
 		</div>
 	</n8n-tooltip>
 </template>

packages/editor-ui/src/components/MainHeader/WorkflowDetails.vue

@@ -33,7 +33,7 @@
 				@blur="onTagsBlur"
 				@update="onTagsUpdate"
 				@esc="onTagsEditEsc"
-				:placeholder="$baseText('workflowDetails.chooseOrCreateATag')"
+				:placeholder="$i18n2.baseText('workflowDetails.chooseOrCreateATag')"
 				ref="dropdown"
 				class="tags-edit"
 			/>
@@ -46,7 +46,7 @@
 				class="add-tag clickable"
 				@click="onTagsEditEnable"
 			>
-				+ {{ $baseText('workflowDetails.addTag') }}
+				+ {{ $i18n2.baseText('workflowDetails.addTag') }}
 			</span>
 		</div>
 		<TagsContainer
@@ -62,7 +62,7 @@
 		<PushConnectionTracker class="actions">
 			<template>
 				<span class="activator">
-					<span>{{ $baseText('workflowDetails.active') + ':' }}</span>
+					<span>{{ $i18n2.baseText('workflowDetails.active') + ':' }}</span>
 					<WorkflowActivator :workflow-active="isWorkflowActive" :workflow-id="currentWorkflowId" :disabled="!currentWorkflowId"/>
 				</span>
 				<SaveButton
@@ -197,8 +197,8 @@ export default mixins(renderText, workflowHelpers).extend({
 			const newName = name.trim();
 			if (!newName) {
 				this.$showMessage({
-					title: this.$baseText('workflowDetails.showMessage.title'),
+					title: this.$i18n2.baseText('workflowDetails.showMessage.title'),
-					message: this.$baseText('workflowDetails.showMessage.message'),
+					message: this.$i18n2.baseText('workflowDetails.showMessage.message'),
 					type: "error",
 				});
 

packages/editor-ui/src/components/MainSidebar.vue

@@ -22,94 +22,94 @@
 				<el-submenu index="workflow" title="Workflow" popperClass="sidebar-popper">
 					<template slot="title">
 						<font-awesome-icon icon="network-wired"/>&nbsp;
-						<span slot="title" class="item-title-root">{{ $baseText('mainSidebar.workflows') }}</span>
+						<span slot="title" class="item-title-root">{{ $i18n2.baseText('mainSidebar.workflows') }}</span>
 					</template>
 
 					<n8n-menu-item index="workflow-new">
 						<template slot="title">
 							<font-awesome-icon icon="file"/>&nbsp;
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.new') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.new') }}</span>
 						</template>
 					</n8n-menu-item>
 					<n8n-menu-item index="workflow-open">
 						<template slot="title">
 							<font-awesome-icon icon="folder-open"/>&nbsp;
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.open') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.open') }}</span>
 						</template>
 					</n8n-menu-item>
 					<n8n-menu-item index="workflow-save">
 						<template slot="title">
 							<font-awesome-icon icon="save"/>
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.save') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.save') }}</span>
 						</template>
 					</n8n-menu-item>
 					<n8n-menu-item index="workflow-duplicate" :disabled="!currentWorkflow">
 						<template slot="title">
 							<font-awesome-icon icon="copy"/>
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.duplicate') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.duplicate') }}</span>
 						</template>
 					</n8n-menu-item>
 					<n8n-menu-item index="workflow-delete" :disabled="!currentWorkflow">
 						<template slot="title">
 							<font-awesome-icon icon="trash"/>
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.delete') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.delete') }}</span>
 						</template>
 					</n8n-menu-item>
 					<n8n-menu-item index="workflow-download">
 						<template slot="title">
 							<font-awesome-icon icon="file-download"/>
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.download') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.download') }}</span>
 						</template>
 					</n8n-menu-item>
 					<n8n-menu-item index="workflow-import-url">
 						<template slot="title">
 							<font-awesome-icon icon="cloud"/>
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.importFromUrl') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.importFromUrl') }}</span>
 						</template>
 					</n8n-menu-item>
 					<n8n-menu-item index="workflow-import-file">
 						<template slot="title">
 							<font-awesome-icon icon="hdd"/>
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.importFromFile') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.importFromFile') }}</span>
 						</template>
 					</n8n-menu-item>
 					<n8n-menu-item index="workflow-settings" :disabled="!currentWorkflow">
 						<template slot="title">
 							<font-awesome-icon icon="cog"/>
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.settings') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.settings') }}</span>
 						</template>
 					</n8n-menu-item>
 				</el-submenu>
 
-				<el-submenu index="credentials" :title="$baseText('mainSidebar.credentials')" popperClass="sidebar-popper">
+				<el-submenu index="credentials" :title="$i18n2.baseText('mainSidebar.credentials')" popperClass="sidebar-popper">
 					<template slot="title">
 						<font-awesome-icon icon="key"/>&nbsp;
-						<span slot="title" class="item-title-root">{{ $baseText('mainSidebar.credentials') }}</span>
+						<span slot="title" class="item-title-root">{{ $i18n2.baseText('mainSidebar.credentials') }}</span>
 					</template>
 
 					<n8n-menu-item index="credentials-new">
 						<template slot="title">
 							<font-awesome-icon icon="file"/>
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.new') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.new') }}</span>
 						</template>
 					</n8n-menu-item>
 					<n8n-menu-item index="credentials-open">
 						<template slot="title">
 							<font-awesome-icon icon="folder-open"/>
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.open') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.open') }}</span>
 						</template>
 					</n8n-menu-item>
 				</el-submenu>
 
 				<n8n-menu-item index="executions">
 					<font-awesome-icon icon="tasks"/>&nbsp;
-					<span slot="title" class="item-title-root">{{ $baseText('mainSidebar.executions') }}</span>
+					<span slot="title" class="item-title-root">{{ $i18n2.baseText('mainSidebar.executions') }}</span>
 				</n8n-menu-item>
 
 				<el-submenu index="help" class="help-menu" title="Help" popperClass="sidebar-popper">
 					<template slot="title">
 						<font-awesome-icon icon="question"/>&nbsp;
-						<span slot="title" class="item-title-root">{{ $baseText('mainSidebar.help') }}</span>
+						<span slot="title" class="item-title-root">{{ $i18n2.baseText('mainSidebar.help') }}</span>
 					</template>
 
 					<MenuItemsIterator :items="helpMenuItems" :afterItemClick="trackHelpItemClick" />
@@ -117,7 +117,7 @@
 					<n8n-menu-item index="help-about">
 						<template slot="title">
 							<font-awesome-icon class="about-icon" icon="info"/>
-							<span slot="title" class="item-title">{{ $baseText('mainSidebar.aboutN8n') }}</span>
+							<span slot="title" class="item-title">{{ $i18n2.baseText('mainSidebar.aboutN8n') }}</span>
 						</template>
 					</n8n-menu-item>
 				</el-submenu>
@@ -211,7 +211,7 @@ export default mixins(
 						type: 'link',
 						properties: {
 							href: 'https://docs.n8n.io',
-							title: this.$baseText('mainSidebar.helpMenuItems.documentation'),
+							title: this.$i18n2.baseText('mainSidebar.helpMenuItems.documentation'),
 							icon: 'book',
 							newWindow: true,
 						},
@@ -221,7 +221,7 @@ export default mixins(
 						type: 'link',
 						properties: {
 							href: 'https://community.n8n.io',
-							title: this.$baseText('mainSidebar.helpMenuItems.forum'),
+							title: this.$i18n2.baseText('mainSidebar.helpMenuItems.forum'),
 							icon: 'users',
 							newWindow: true,
 						},
@@ -231,7 +231,7 @@ export default mixins(
 						type: 'link',
 						properties: {
 							href: 'https://n8n.io/workflows',
-							title: this.$baseText('mainSidebar.helpMenuItems.workflows'),
+							title: this.$i18n2.baseText('mainSidebar.helpMenuItems.workflows'),
 							icon: 'network-wired',
 							newWindow: true,
 						},
@@ -324,8 +324,8 @@ export default mixins(
 					this.stopExecutionInProgress = true;
 					await this.restApi().stopCurrentExecution(executionId);
 					this.$showMessage({
-						title: this.$baseText('mainSidebar.showMessage.stopExecution.title'),
+						title: this.$i18n2.baseText('mainSidebar.showMessage.stopExecution.title'),
-						message: this.$baseText(
+						message: this.$i18n2.baseText(
 							'mainSidebar.showMessage.stopExecution.message',
 							{ interpolate: { executionId }},
 						),
@@ -334,8 +334,8 @@ export default mixins(
 				} catch (error) {
 					this.$showError(
 						error,
-						this.$baseText('mainSidebar.showError.stopExecution.title'),
+						this.$i18n2.baseText('mainSidebar.showError.stopExecution.title'),
-						this.$baseText('mainSidebar.showError.stopExecution.message') + ':',
+						this.$i18n2.baseText('mainSidebar.showError.stopExecution.message') + ':',
 					);
 				}
 				this.stopExecutionInProgress = false;
@@ -360,8 +360,8 @@ export default mixins(
 						worflowData = JSON.parse(data as string);
 					} catch (error) {
 						this.$showMessage({
-							title: this.$baseText('mainSidebar.showMessage.handleFileImport.title'),
+							title: this.$i18n2.baseText('mainSidebar.showMessage.handleFileImport.title'),
-							message: this.$baseText('mainSidebar.showMessage.handleFileImport.message'),
+							message: this.$i18n2.baseText('mainSidebar.showMessage.handleFileImport.message'),
 							type: 'error',
 						});
 						return;
@@ -384,12 +384,12 @@ export default mixins(
 				} else if (key === 'workflow-import-url') {
 					try {
 						const promptResponse = await this.$prompt(
-							this.$baseText('mainSidebar.prompt.workflowUrl') + ':',
+							this.$i18n2.baseText('mainSidebar.prompt.workflowUrl') + ':',
-							this.$baseText('mainSidebar.prompt.importWorkflowFromUrl') + ':',
+							this.$i18n2.baseText('mainSidebar.prompt.importWorkflowFromUrl') + ':',
 							{
-								confirmButtonText: this.$baseText('mainSidebar.prompt.import'),
+								confirmButtonText: this.$i18n2.baseText('mainSidebar.prompt.import'),
-								cancelButtonText: this.$baseText('mainSidebar.prompt.cancel'),
+								cancelButtonText: this.$i18n2.baseText('mainSidebar.prompt.cancel'),
-								inputErrorMessage: this.$baseText('mainSidebar.prompt.invalidUrl'),
+								inputErrorMessage: this.$i18n2.baseText('mainSidebar.prompt.invalidUrl'),
 								inputPattern: /^http[s]?:\/\/.*\.json$/i,
 							},
 						) as MessageBoxInputData;
@@ -398,14 +398,14 @@ export default mixins(
 					} catch (e) {}
 				} else if (key === 'workflow-delete') {
 					const deleteConfirmed = await this.confirmMessage(
-						this.$baseText(
+						this.$i18n2.baseText(
 							'mainSidebar.confirmMessage.workflowDelete.message',
 							{ interpolate: { workflowName: this.workflowName } },
 						),
-						this.$baseText('mainSidebar.confirmMessage.workflowDelete.headline'),
+						this.$i18n2.baseText('mainSidebar.confirmMessage.workflowDelete.headline'),
 						'warning',
-						this.$baseText('mainSidebar.confirmMessage.workflowDelete.confirmButtonText'),
+						this.$i18n2.baseText('mainSidebar.confirmMessage.workflowDelete.confirmButtonText'),
-						this.$baseText('mainSidebar.confirmMessage.workflowDelete.cancelButtonText'),
+						this.$i18n2.baseText('mainSidebar.confirmMessage.workflowDelete.cancelButtonText'),
 					);
 
 					if (deleteConfirmed === false) {
@@ -417,8 +417,8 @@ export default mixins(
 					} catch (error) {
 						this.$showError(
 							error,
-							this.$baseText('mainSidebar.showError.stopExecution.title'),
+							this.$i18n2.baseText('mainSidebar.showError.stopExecution.title'),
-							this.$baseText('mainSidebar.showError.stopExecution.message') + ':',
+							this.$i18n2.baseText('mainSidebar.showError.stopExecution.message') + ':',
 						);
 						return;
 					}
@@ -426,8 +426,8 @@ export default mixins(
 					// Reset tab title since workflow is deleted.
 					this.$titleReset();
 					this.$showMessage({
-						title: this.$baseText('mainSidebar.showMessage.handleSelect1.title'),
+						title: this.$i18n2.baseText('mainSidebar.showMessage.handleSelect1.title'),
-						message: this.$baseText(
+						message: this.$i18n2.baseText(
 							'mainSidebar.showMessage.handleSelect1.message',
 							{ interpolate: { workflowName: this.workflowName }},
 						),
@@ -466,11 +466,11 @@ export default mixins(
 					const result = this.$store.getters.getStateIsDirty;
 					if(result) {
 						const importConfirm = await this.confirmMessage(
-							this.$baseText('mainSidebar.confirmMessage.workflowNew.message'),
+							this.$i18n2.baseText('mainSidebar.confirmMessage.workflowNew.message'),
-							this.$baseText('mainSidebar.confirmMessage.workflowNew.headline'),
+							this.$i18n2.baseText('mainSidebar.confirmMessage.workflowNew.headline'),
 							'warning',
-							this.$baseText('mainSidebar.confirmMessage.workflowNew.confirmButtonText'),
+							this.$i18n2.baseText('mainSidebar.confirmMessage.workflowNew.confirmButtonText'),
-							this.$baseText('mainSidebar.confirmMessage.workflowNew.cancelButtonText'),
+							this.$i18n2.baseText('mainSidebar.confirmMessage.workflowNew.cancelButtonText'),
 						);
 						if (importConfirm === true) {
 							this.$store.commit('setStateDirty', false);
@@ -481,8 +481,8 @@ export default mixins(
 							}
 
 							this.$showMessage({
-								title: this.$baseText('mainSidebar.showMessage.handleSelect2.title'),
+								title: this.$i18n2.baseText('mainSidebar.showMessage.handleSelect2.title'),
-								message: this.$baseText('mainSidebar.showMessage.handleSelect2.message'),
+								message: this.$i18n2.baseText('mainSidebar.showMessage.handleSelect2.message'),
 								type: 'success',
 							});
 						}
@@ -492,8 +492,8 @@ export default mixins(
 						}
 
 						this.$showMessage({
-							title: this.$baseText('mainSidebar.showMessage.handleSelect3.title'),
+							title: this.$i18n2.baseText('mainSidebar.showMessage.handleSelect3.title'),
-							message: this.$baseText('mainSidebar.showMessage.handleSelect3.message'),
+							message: this.$i18n2.baseText('mainSidebar.showMessage.handleSelect3.message'),
 							type: 'success',
 						});
 					}

packages/editor-ui/src/components/MultipleParameter.vue

@@ -1,8 +1,8 @@
 <template>
 	<div @keydown.stop class="duplicate-parameter">
 		<n8n-input-label
-			:label="$nodeText.topParameterDisplayName(parameter)"
+			:label="$i18n2.nodeText().topParameterDisplayName(parameter)"
-			:tooltipText="$nodeText.topParameterDescription(parameter)"
+			:tooltipText="$i18n2.nodeText().topParameterDescription(parameter)"
 			:underline="true"
 			:labelHoverableOnly="true"
 			size="small"
@@ -10,10 +10,10 @@
 
 			<div v-for="(value, index) in values" :key="index" class="duplicate-parameter-item" :class="parameter.type">
 				<div class="delete-item clickable" v-if="!isReadOnly">
-					<font-awesome-icon icon="trash" :title="$baseText('multipleParameter.deleteItem')" @click="deleteItem(index)" />
+					<font-awesome-icon icon="trash" :title="$i18n2.baseText('multipleParameter.deleteItem')" @click="deleteItem(index)" />
 					<div v-if="sortable">
-						<font-awesome-icon v-if="index !== 0" icon="angle-up" class="clickable" :title="$baseText('multipleParameter.moveUp')" @click="moveOptionUp(index)" />
+						<font-awesome-icon v-if="index !== 0" icon="angle-up" class="clickable" :title="$i18n2.baseText('multipleParameter.moveUp')" @click="moveOptionUp(index)" />
-						<font-awesome-icon v-if="index !== (values.length -1)" icon="angle-down" class="clickable" :title="$baseText('multipleParameter.moveDown')" @click="moveOptionDown(index)" />
+						<font-awesome-icon v-if="index !== (values.length -1)" icon="angle-down" class="clickable" :title="$i18n2.baseText('multipleParameter.moveDown')" @click="moveOptionDown(index)" />
 					</div>
 				</div>
 				<div v-if="parameter.type === 'collection'">
@@ -26,7 +26,7 @@
 
 			<div class="add-item-wrapper">
 				<div v-if="values && Object.keys(values).length === 0 || isReadOnly" class="no-items-exist">
-					<n8n-text size="small">{{ $baseText('multipleParameter.currentlyNoItemsExist') }}</n8n-text>
+					<n8n-text size="small">{{ $i18n2.baseText('multipleParameter.currentlyNoItemsExist') }}</n8n-text>
 				</div>
 				<n8n-button v-if="!isReadOnly" fullWidth @click="addItem()" :label="addButtonText" />
 			</div>
@@ -68,10 +68,10 @@ export default mixins(genericHelpers)
 					!this.parameter.typeOptions &&
 					!this.parameter.typeOptions.multipleValueButtonText
 				) {
-					return this.$baseText('multipleParameter.addItem');
+					return this.$i18n2.baseText('multipleParameter.addItem');
 				}
 
-				return this.$nodeText.multipleValueButtonText(this.parameter);
+				return this.$i18n2.nodeText().multipleValueButtonText(this.parameter);
 			},
 			hideDelete (): boolean {
 				return this.parameter.options.length === 1;

packages/editor-ui/src/components/Node.vue

@@ -22,7 +22,7 @@
 					</span>
 				</div>
 
-				<div class="node-executing-info" :title="$baseText('node.nodeIsExecuting')">
+				<div class="node-executing-info" :title="$i18n2.baseText('node.nodeIsExecuting')">
 					<font-awesome-icon icon="sync-alt" spin />
 				</div>
 
@@ -37,20 +37,20 @@
 			</div>
 
 			<div class="node-options no-select-on-click" v-if="!isReadOnly" v-show="!hideActions">
-				<div v-touch:tap="deleteNode" class="option" :title="$baseText('node.deleteNode')" >
+				<div v-touch:tap="deleteNode" class="option" :title="$i18n2.baseText('node.deleteNode')" >
 
 					<font-awesome-icon icon="trash" />
 				</div>
-				<div v-touch:tap="disableNode" class="option" :title="$baseText('node.activateDeactivateNode')">
+				<div v-touch:tap="disableNode" class="option" :title="$i18n2.baseText('node.activateDeactivateNode')">
 					<font-awesome-icon :icon="nodeDisabledIcon" />
 				</div>
-				<div v-touch:tap="duplicateNode" class="option" :title="$baseText('node.duplicateNode')">
+				<div v-touch:tap="duplicateNode" class="option" :title="$i18n2.baseText('node.duplicateNode')">
 					<font-awesome-icon icon="clone" />
 				</div>
-				<div v-touch:tap="setNodeActive" class="option touch" :title="$baseText('node.editNode')" v-if="!isReadOnly">
+				<div v-touch:tap="setNodeActive" class="option touch" :title="$i18n2.baseText('node.editNode')" v-if="!isReadOnly">
 					<font-awesome-icon class="execute-icon" icon="cog" />
 				</div>
-				<div v-touch:tap="executeNode" class="option" :title="$baseText('node.executeNode')" v-if="!isReadOnly && !workflowRunning">
+				<div v-touch:tap="executeNode" class="option" :title="$i18n2.baseText('node.executeNode')" v-if="!isReadOnly && !workflowRunning">
 					<font-awesome-icon class="execute-icon" icon="play-circle" />
 				</div>
 			</div>
@@ -62,7 +62,7 @@
 					{{ nodeTitle }}
 				</p>
 				<p v-if="data.disabled">
-					({{ $baseText('node.disabled') }})
+					({{ $i18n2.baseText('node.disabled') }})
 				</p>
 			</div>
 			<div v-if="nodeSubtitle !== undefined" class="node-subtitle" :title="nodeSubtitle">
@@ -169,7 +169,7 @@ export default mixins(externalHooks, nodeBase, nodeHelpers, renderText, workflow
 
 			const nodeIssues = NodeHelpers.nodeIssuesToString(this.data.issues, this.data);
 
-			return `${this.$baseText('node.issues')}:<br />&nbsp;&nbsp;- ` + nodeIssues.join('<br />&nbsp;&nbsp;- ');
+			return `${this.$i18n2.baseText('node.issues')}:<br />&nbsp;&nbsp;- ` + nodeIssues.join('<br />&nbsp;&nbsp;- ');
 		},
 		nodeDisabledIcon (): string {
 			if (this.data.disabled === false) {
@@ -195,11 +195,11 @@ export default mixins(externalHooks, nodeBase, nodeHelpers, renderText, workflow
 			return returnStyles;
 		},
 		shortNodeType (): string {
-			return this.$shortNodeType(this.data.type);
+			return this.$i18n2.shortNodeType(this.data.type);
 		},
 		nodeTitle (): string {
 			if (this.data.name === 'Start') {
-				return this.$headerText({
+				return this.$i18n2.headerText({
 					key: `headers.start.displayName`,
 					fallback: 'Start',
 				});
@@ -215,9 +215,9 @@ export default mixins(externalHooks, nodeBase, nodeHelpers, renderText, workflow
 				if (this.name === lastNodeExecuted) {
 					const waitDate = new Date(workflowExecution.waitTill);
 					if (waitDate.toISOString() === WAIT_TIME_UNLIMITED) {
-						return this.$baseText('node.theNodeIsWaitingIndefinitelyForAnIncomingWebhookCall');
+						return this.$i18n2.baseText('node.theNodeIsWaitingIndefinitelyForAnIncomingWebhookCall');
 					}
-					return this.$baseText(
+					return this.$i18n2.baseText(
 						'node.nodeIsWaitingTill',
 						{
 							interpolate: {

packages/editor-ui/src/components/NodeCreator/CategoryItem.vue

@@ -29,7 +29,7 @@ export default mixins(renderText).extend({
 		renderCategoryName(categoryName: string) {
 			const key = `nodeCreator.categoryNames.${categoryName}`;
 
-			return this.$te(key) ? this.$baseText(key) : categoryName;
+			return this.$i18n2.exists(key) ? this.$i18n2.baseText(key) : categoryName;
 		},
 	},
 });

packages/editor-ui/src/components/NodeCreator/MainPanel.vue

@@ -11,9 +11,9 @@
 			/>
 			<div class="type-selector">
 				<el-tabs v-model="selectedType" stretch>
-					<el-tab-pane :label="$baseText('nodeCreator.mainPanel.all')" :name="ALL_NODE_FILTER"></el-tab-pane>
+					<el-tab-pane :label="$i18n2.baseText('nodeCreator.mainPanel.all')" :name="ALL_NODE_FILTER"></el-tab-pane>
-					<el-tab-pane :label="$baseText('nodeCreator.mainPanel.regular')" :name="REGULAR_NODE_FILTER"></el-tab-pane>
+					<el-tab-pane :label="$i18n2.baseText('nodeCreator.mainPanel.regular')" :name="REGULAR_NODE_FILTER"></el-tab-pane>
-					<el-tab-pane :label="$baseText('nodeCreator.mainPanel.trigger')" :name="TRIGGER_NODE_FILTER"></el-tab-pane>
+					<el-tab-pane :label="$i18n2.baseText('nodeCreator.mainPanel.trigger')" :name="TRIGGER_NODE_FILTER"></el-tab-pane>
 				</el-tabs>
 			</div>
 			<div v-if="searchFilter.length === 0" class="scrollable">

packages/editor-ui/src/components/NodeCreator/NoResults.vue

@@ -5,30 +5,30 @@
 		</div>
 		<div class="title">
 			<div>
-				{{ $baseText('nodeCreator.noResults.weDidntMakeThatYet') }}
+				{{ $i18n2.baseText('nodeCreator.noResults.weDidntMakeThatYet') }}
 			</div>
 			<div class="action">
-				{{ $baseText('nodeCreator.noResults.dontWorryYouCanProbablyDoItWithThe') }}
+				{{ $i18n2.baseText('nodeCreator.noResults.dontWorryYouCanProbablyDoItWithThe') }}
-				<a @click="selectHttpRequest">{{ $baseText('nodeCreator.noResults.httpRequest') }}</a> or
+				<a @click="selectHttpRequest">{{ $i18n2.baseText('nodeCreator.noResults.httpRequest') }}</a> or
-				<a @click="selectWebhook">{{ $baseText('nodeCreator.noResults.webhook') }}</a> {{ $baseText('nodeCreator.noResults.node') }}
+				<a @click="selectWebhook">{{ $i18n2.baseText('nodeCreator.noResults.webhook') }}</a> {{ $i18n2.baseText('nodeCreator.noResults.node') }}
 			</div>
 		</div>
 
 		<div class="request">
 			<div>
-				{{ $baseText('nodeCreator.noResults.wantUsToMakeItFaster') }}
+				{{ $i18n2.baseText('nodeCreator.noResults.wantUsToMakeItFaster') }}
 			</div>
 			<div>
 				<a
 					:href="REQUEST_NODE_FORM_URL"
 					target="_blank"
 				>
-					<span>{{ $baseText('nodeCreator.noResults.requestTheNode') }}</span>&nbsp;
+					<span>{{ $i18n2.baseText('nodeCreator.noResults.requestTheNode') }}</span>&nbsp;
 					<span>
 						<font-awesome-icon
 							class="external"
 							icon="external-link-alt"
-							:title="$baseText('nodeCreator.noResults.requestTheNode')"
+							:title="$i18n2.baseText('nodeCreator.noResults.requestTheNode')"
 						/>
 					</span>
 				</a>

packages/editor-ui/src/components/NodeCreator/NodeItem.vue

@@ -4,7 +4,7 @@
 		<div>
 			<div :class="$style.details">
 				<span :class="$style.name">
-					{{ $headerText({
+					{{ $i18n2.headerText({
 							key: `headers.${shortNodeType}.displayName`,
 							fallback: nodeType.displayName,
 						})
@@ -15,7 +15,7 @@
 				</span>
 			</div>
 			<div :class="$style.description">
-				{{ $headerText({
+				{{ $i18n2.headerText({
 						key: `headers.${shortNodeType}.description`,
 						fallback: nodeType.description,
 					})
@@ -49,7 +49,7 @@ export default mixins(renderText).extend({
 	],
 	computed: {
 		shortNodeType() {
-			return this.$shortNodeType(this.nodeType.name);
+			return this.$i18n2.shortNodeType(this.nodeType.name);
 		},
 	},
 	// @ts-ignore

packages/editor-ui/src/components/NodeCreator/SearchBar.vue

@@ -5,7 +5,7 @@
 		</div>
 		<div class="text">
 			<input
-				:placeholder="$baseText('nodeCreator.searchBar.searchNodes')"
+				:placeholder="$i18n2.baseText('nodeCreator.searchBar.searchNodes')"
 				ref="input"
 				:value="value"
 				@input="onInput"

packages/editor-ui/src/components/NodeCreator/SubcategoryItem.vue

@@ -2,10 +2,10 @@
 	<div :class="$style.subcategory">
 		<div :class="$style.details">
 			<div :class="$style.title">
-				{{ $baseText(`nodeCreator.subcategoryNames.${subcategoryName}`) }}
+				{{ $i18n2.baseText(`nodeCreator.subcategoryNames.${subcategoryName}`) }}
 			</div>
 			<div v-if="item.properties.description" :class="$style.description">
-				{{ $baseText(`nodeCreator.subcategoryDescriptions.${subcategoryDescription}`) }}
+				{{ $i18n2.baseText(`nodeCreator.subcategoryDescriptions.${subcategoryDescription}`) }}
 			</div>
 		</div>
 		<div :class="$style.action">

packages/editor-ui/src/components/NodeCreator/SubcategoryPanel.vue

@@ -5,7 +5,7 @@
 				<font-awesome-icon class="back-arrow" icon="arrow-left" />
 			</div>
 			<span>
-				{{ $baseText(`nodeCreator.subcategoryNames.${subcategoryName}`) }}
+				{{ $i18n2.baseText(`nodeCreator.subcategoryNames.${subcategoryName}`) }}
 			</span>
 		</div>
 

packages/editor-ui/src/components/NodeCredentials.vue

@@ -2,7 +2,7 @@
 	<div v-if="credentialTypesNodeDescriptionDisplayed.length" :class="$style.container">
 		<div v-for="credentialTypeDescription in credentialTypesNodeDescriptionDisplayed" :key="credentialTypeDescription.name">
 			<n8n-input-label
-				:label="$baseText(
+				:label="$i18n2.baseText(
 					'nodeCredentials.credentialFor',
 					{
 						interpolate: {
@@ -20,7 +20,7 @@
 				</div>
 
 				<div :class="issues.length ? $style.hasIssues : $style.input" v-else >
-					<n8n-select :value="getSelectedId(credentialTypeDescription.name)" @change="(value) => onCredentialSelected(credentialTypeDescription.name, value)" :placeholder="$baseText('nodeCredentials.selectCredential')" size="small">
+					<n8n-select :value="getSelectedId(credentialTypeDescription.name)" @change="(value) => onCredentialSelected(credentialTypeDescription.name, value)" :placeholder="$i18n2.baseText('nodeCredentials.selectCredential')" size="small">
 						<n8n-option
 							v-for="(item) in credentialOptions[credentialTypeDescription.name]"
 							:key="item.id"
@@ -37,13 +37,13 @@
 
 					<div :class="$style.warning" v-if="issues.length">
 						<n8n-tooltip placement="top" >
-							<div slot="content" v-html="`${$baseText('nodeCredentials.issues')}:<br />&nbsp;&nbsp;- ` + issues.join('<br />&nbsp;&nbsp;- ')"></div>
+							<div slot="content" v-html="`${$i18n2.baseText('nodeCredentials.issues')}:<br />&nbsp;&nbsp;- ` + issues.join('<br />&nbsp;&nbsp;- ')"></div>
 							<font-awesome-icon icon="exclamation-triangle" />
 						</n8n-tooltip>
 					</div>
 
 					<div :class="$style.edit" v-if="selected[credentialTypeDescription.name] && isCredentialExisting(credentialTypeDescription.name)">
-						<font-awesome-icon icon="pen" @click="editCredential(credentialTypeDescription.name)" class="clickable" :title="$baseText('nodeCredentials.updateCredential')" />
+						<font-awesome-icon icon="pen" @click="editCredential(credentialTypeDescription.name)" class="clickable" :title="$i18n2.baseText('nodeCredentials.updateCredential')" />
 					</div>
 				</div>
 			</n8n-input-label>
@@ -85,7 +85,7 @@ export default mixins(
 	],
 	data () {
 		return {
-			NEW_CREDENTIALS_TEXT: `- ${this.$baseText('nodeCredentials.createNew')} -`,
+			NEW_CREDENTIALS_TEXT: `- ${this.$i18n2.baseText('nodeCredentials.createNew')} -`,
 			newCredentialUnsubscribe: null as null | (() => void),
 		};
 	},
@@ -215,8 +215,8 @@ export default mixins(
 				});
 				this.updateNodesCredentialsIssues();
 				this.$showMessage({
-					title: this.$baseText('nodeCredentials.showMessage.title'),
+					title: this.$i18n2.baseText('nodeCredentials.showMessage.title'),
-					message: this.$baseText(
+					message: this.$i18n2.baseText(
 						'nodeCredentials.showMessage.message',
 						{
 							interpolate: {

packages/editor-ui/src/components/NodeSettings.vue

@@ -5,7 +5,7 @@
 				<display-with-change :key-name="'name'" @valueChanged="valueChanged"></display-with-change>
 				<a v-if="nodeType" :href="'http://n8n.io/nodes/' + nodeType.name" target="_blank" class="node-info">
 					<n8n-tooltip class="clickable" placement="top" >
-						<div slot="content" v-html="`<strong>${$baseText('nodeSettings.nodeDescription')}:</strong><br />` + nodeTypeDescription + `<br /><br /><strong>${$baseText('nodeSettings.clickOnTheQuestionMarkIcon')}</strong>`"></div>
+						<div slot="content" v-html="`<strong>${$i18n2.baseText('nodeSettings.nodeDescription')}:</strong><br />` + nodeTypeDescription + `<br /><br /><strong>${$i18n2.baseText('nodeSettings.clickOnTheQuestionMarkIcon')}</strong>`"></div>
 						<font-awesome-icon icon="question-circle" />
 					</n8n-tooltip>
 				</a>
@@ -14,7 +14,7 @@
 		<div class="node-is-not-valid" v-if="node && !nodeValid">
 			<n8n-text>
 				{{
-					$baseText(
+					$i18n2.baseText(
 						'nodeSettings.theNodeIsNotValidAsItsTypeIsUnknown',
 						{ interpolate: { nodeType: node.type } },
 					)
@@ -23,17 +23,17 @@
 		</div>
 		<div class="node-parameters-wrapper" v-if="node && nodeValid">
 			<el-tabs stretch @tab-click="handleTabClick">
-				<el-tab-pane :label="$baseText('nodeSettings.parameters')">
+				<el-tab-pane :label="$i18n2.baseText('nodeSettings.parameters')">
 					<node-credentials :node="node" @credentialSelected="credentialSelected"></node-credentials>
 					<node-webhooks :node="node" :nodeType="nodeType" />
 					<parameter-input-list :parameters="parametersNoneSetting" :hideDelete="true" :nodeValues="nodeValues" path="parameters" @valueChanged="valueChanged" />
 					<div v-if="parametersNoneSetting.length === 0" class="no-parameters">
 						<n8n-text>
-						{{ $baseText('nodeSettings.thisNodeDoesNotHaveAnyParameters') }}
+						{{ $i18n2.baseText('nodeSettings.thisNodeDoesNotHaveAnyParameters') }}
 						</n8n-text>
 					</div>
 				</el-tab-pane>
-				<el-tab-pane :label="$baseText('nodeSettings.settings')">
+				<el-tab-pane :label="$i18n2.baseText('nodeSettings.settings')">
 					<parameter-input-list :parameters="nodeSettings" :hideDelete="true" :nodeValues="nodeValues" path="" @valueChanged="valueChanged" />
 					<parameter-input-list :parameters="parametersSetting" :nodeValues="nodeValues" path="parameters" @valueChanged="valueChanged" />
 				</el-tab-pane>
@@ -97,9 +97,9 @@ export default mixins(
 			},
 			nodeTypeName(): string {
 				if (this.nodeType) {
-					const shortNodeType = this.$shortNodeType(this.nodeType.name);
+					const shortNodeType = this.$i18n2.shortNodeType(this.nodeType.name);
 
-					return this.$headerText({
+					return this.$i18n2.headerText({
 						key: `headers.${shortNodeType}.displayName`,
 						fallback: this.nodeType.name,
 					});
@@ -109,14 +109,14 @@ export default mixins(
 			},
 			nodeTypeDescription (): string {
 				if (this.nodeType && this.nodeType.description) {
-					const shortNodeType = this.$shortNodeType(this.nodeType.name);
+					const shortNodeType = this.$i18n2.shortNodeType(this.nodeType.name);
 
-					return this.$headerText({
+					return this.$i18n2.headerText({
 						key: `headers.${shortNodeType}.description`,
 						fallback: this.nodeType.description,
 					});
 				} else {
-					return this.$baseText('nodeSettings.noDescriptionFound');
+					return this.$i18n2.baseText('nodeSettings.noDescriptionFound');
 				}
 			},
 			headerStyle (): object {
@@ -171,7 +171,7 @@ export default mixins(
 
 				nodeSettings: [
 					{
-						displayName: this.$baseText('nodeSettings.notes.displayName'),
+						displayName: this.$i18n2.baseText('nodeSettings.notes.displayName'),
 						name: 'notes',
 						type: 'string',
 						typeOptions: {
@@ -179,50 +179,50 @@ export default mixins(
 						},
 						default: '',
 						noDataExpression: true,
-						description: this.$baseText('nodeSettings.notes.description'),
+						description: this.$i18n2.baseText('nodeSettings.notes.description'),
 					},
 					{
-						displayName: this.$baseText('nodeSettings.notesInFlow.displayName'),
+						displayName: this.$i18n2.baseText('nodeSettings.notesInFlow.displayName'),
 						name: 'notesInFlow',
 						type: 'boolean',
 						default: false,
 						noDataExpression: true,
-						description: this.$baseText('nodeSettings.notesInFlow.description'),
+						description: this.$i18n2.baseText('nodeSettings.notesInFlow.description'),
 					},
 					{
-						displayName: this.$baseText('nodeSettings.color.displayName'),
+						displayName: this.$i18n2.baseText('nodeSettings.color.displayName'),
 						name: 'color',
 						type: 'color',
 						default: '#ff0000',
 						noDataExpression: true,
-						description: this.$baseText('nodeSettings.color.description'),
+						description: this.$i18n2.baseText('nodeSettings.color.description'),
 					},
 					{
-						displayName: this.$baseText('nodeSettings.alwaysOutputData.displayName'),
+						displayName: this.$i18n2.baseText('nodeSettings.alwaysOutputData.displayName'),
 						name: 'alwaysOutputData',
 						type: 'boolean',
 						default: false,
 						noDataExpression: true,
-						description: this.$baseText('nodeSettings.alwaysOutputData.description'),
+						description: this.$i18n2.baseText('nodeSettings.alwaysOutputData.description'),
 					},
 					{
-						displayName: this.$baseText('nodeSettings.executeOnce.displayName'),
+						displayName: this.$i18n2.baseText('nodeSettings.executeOnce.displayName'),
 						name: 'executeOnce',
 						type: 'boolean',
 						default: false,
 						noDataExpression: true,
-						description: this.$baseText('nodeSettings.executeOnce.description'),
+						description: this.$i18n2.baseText('nodeSettings.executeOnce.description'),
 					},
 					{
-						displayName: this.$baseText('nodeSettings.retryOnFail.displayName'),
+						displayName: this.$i18n2.baseText('nodeSettings.retryOnFail.displayName'),
 						name: 'retryOnFail',
 						type: 'boolean',
 						default: false,
 						noDataExpression: true,
-						description: this.$baseText('nodeSettings.retryOnFail.description'),
+						description: this.$i18n2.baseText('nodeSettings.retryOnFail.description'),
 					},
 					{
-						displayName: this.$baseText('nodeSettings.maxTries.displayName'),
+						displayName: this.$i18n2.baseText('nodeSettings.maxTries.displayName'),
 						name: 'maxTries',
 						type: 'number',
 						typeOptions: {
@@ -238,10 +238,10 @@ export default mixins(
 							},
 						},
 						noDataExpression: true,
-						description: this.$baseText('nodeSettings.maxTries.description'),
+						description: this.$i18n2.baseText('nodeSettings.maxTries.description'),
 					},
 					{
-						displayName: this.$baseText('nodeSettings.waitBetweenTries.displayName'),
+						displayName: this.$i18n2.baseText('nodeSettings.waitBetweenTries.displayName'),
 						name: 'waitBetweenTries',
 						type: 'number',
 						typeOptions: {
@@ -257,15 +257,15 @@ export default mixins(
 							},
 						},
 						noDataExpression: true,
-						description: this.$baseText('nodeSettings.waitBetweenTries.description'),
+						description: this.$i18n2.baseText('nodeSettings.waitBetweenTries.description'),
 					},
 					{
-						displayName: this.$baseText('nodeSettings.continueOnFail.displayName'),
+						displayName: this.$i18n2.baseText('nodeSettings.continueOnFail.displayName'),
 						name: 'continueOnFail',
 						type: 'boolean',
 						default: false,
 						noDataExpression: true,
-						description: this.$baseText('nodeSettings.continueOnFail.description'),
+						description: this.$i18n2.baseText('nodeSettings.continueOnFail.description'),
 					},
 				] as INodeProperties[],
 

packages/editor-ui/src/components/NodeWebhooks.vue

@@ -1,8 +1,8 @@
 <template>
 	<div v-if="webhooksNode.length" class="webhoooks">
-		<div class="clickable headline" :class="{expanded: !isMinimized}" @click="isMinimized=!isMinimized" :title="isMinimized ? $baseText('nodeWebhooks.clickToDisplayWebhookUrls') : $baseText('nodeWebhooks.clickToHideWebhookUrls')">
+		<div class="clickable headline" :class="{expanded: !isMinimized}" @click="isMinimized=!isMinimized" :title="isMinimized ? $i18n2.baseText('nodeWebhooks.clickToDisplayWebhookUrls') : $i18n2.baseText('nodeWebhooks.clickToHideWebhookUrls')">
 			<font-awesome-icon icon="angle-down" class="minimize-button minimize-icon" />
-			{{ $baseText('nodeWebhooks.webhookUrls') }}
+			{{ $i18n2.baseText('nodeWebhooks.webhookUrls') }}
 		</div>
 		<el-collapse-transition>
 			<div class="node-webhooks" v-if="!isMinimized">
@@ -10,14 +10,14 @@
 					<el-row>
 						<el-col :span="24">
 							<el-radio-group v-model="showUrlFor" size="mini">
-								<el-radio-button label="test">{{ $baseText('nodeWebhooks.testUrl') }}</el-radio-button>
+								<el-radio-button label="test">{{ $i18n2.baseText('nodeWebhooks.testUrl') }}</el-radio-button>
-								<el-radio-button label="production">{{ $baseText('nodeWebhooks.productionUrl') }}</el-radio-button>
+								<el-radio-button label="production">{{ $i18n2.baseText('nodeWebhooks.productionUrl') }}</el-radio-button>
 							</el-radio-group>
 						</el-col>
 					</el-row>
 				</div>
 
-				<n8n-tooltip v-for="(webhook, index) in webhooksNode" :key="index" class="item"  :content="$baseText('nodeWebhooks.clickToCopyWebhookUrls')" placement="left">
+				<n8n-tooltip v-for="(webhook, index) in webhooksNode" :key="index" class="item"  :content="$i18n2.baseText('nodeWebhooks.clickToCopyWebhookUrls')" placement="left">
 					<div class="webhook-wrapper">
 							<div class="http-field">
 								<div class="http-method">
@@ -85,8 +85,8 @@ export default mixins(
 				this.copyToClipboard(webhookUrl);
 
 				this.$showMessage({
-					title: this.$baseText('nodeWebhooks.showMessage.title'),
+					title: this.$i18n2.baseText('nodeWebhooks.showMessage.title'),
-					message: this.$baseText('nodeWebhooks.showMessage.message'),
+					message: this.$i18n2.baseText('nodeWebhooks.showMessage.message'),
 					type: 'success',
 				});
 			},
@@ -97,7 +97,7 @@ export default mixins(
 				try {
 					return this.resolveExpression(webhookData[key] as string) as string;
 				} catch (e) {
-					return this.$baseText('nodeWebhooks.invalidExpression');
+					return this.$i18n2.baseText('nodeWebhooks.invalidExpression');
 				}
 			},
 			getWebhookUrl (webhookData: IWebhookDescription): string {

packages/editor-ui/src/components/ParameterInput.vue

@@ -38,7 +38,7 @@
 				:placeholder="isValueExpression ? '' : getPlaceholder()"
 			>
 				<div slot="suffix" class="expand-input-icon-container">
-					<font-awesome-icon v-if="!isValueExpression && !isReadOnly" icon="external-link-alt" class="edit-window-button clickable" :title="$baseText('parameterInput.openEditWindow')" @click="displayEditDialog()" />
+					<font-awesome-icon v-if="!isValueExpression && !isReadOnly" icon="external-link-alt" class="edit-window-button clickable" :title="$i18n2.baseText('parameterInput.openEditWindow')" @click="displayEditDialog()" />
 				</div>
 			</n8n-input>
 		</div>
@@ -78,7 +78,7 @@
 			:value="displayValue"
 			:title="displayTitle"
 			:disabled="isReadOnly"
-			:placeholder="parameter.placeholder ? getPlaceholder() : $baseText('parameterInput.selectDateAndTime')"
+			:placeholder="parameter.placeholder ? getPlaceholder() : $i18n2.baseText('parameterInput.selectDateAndTime')"
 			:picker-options="dateTimePickerOptions"
 			@change="valueChanged"
 			@focus="setFocus"
@@ -171,7 +171,7 @@
 
 	<div class="parameter-issues" v-if="getIssues.length">
 		<n8n-tooltip placement="top" >
-			<div slot="content" v-html="`${$baseText('parameterInput.issues')}:<br />&nbsp;&nbsp;- ` + getIssues.join('<br />&nbsp;&nbsp;- ')"></div>
+			<div slot="content" v-html="`${$i18n2.baseText('parameterInput.issues')}:<br />&nbsp;&nbsp;- ` + getIssues.join('<br />&nbsp;&nbsp;- ')"></div>
 			<font-awesome-icon icon="exclamation-triangle" />
 		</n8n-tooltip>
 	</div>
@@ -179,13 +179,13 @@
 	<div class="parameter-options" v-if="displayOptionsComputed">
 			<el-dropdown trigger="click" @command="optionSelected" size="mini">
 				<span class="el-dropdown-link">
-					<font-awesome-icon icon="cogs" class="reset-icon clickable" :title="$baseText('parameterInput.parameterOptions')"/>
+					<font-awesome-icon icon="cogs" class="reset-icon clickable" :title="$i18n2.baseText('parameterInput.parameterOptions')"/>
 				</span>
 				<el-dropdown-menu slot="dropdown">
-					<el-dropdown-item command="addExpression" v-if="parameter.noDataExpression !== true && !isValueExpression">{{ $baseText('parameterInput.addExpression') }}</el-dropdown-item>
+					<el-dropdown-item command="addExpression" v-if="parameter.noDataExpression !== true && !isValueExpression">{{ $i18n2.baseText('parameterInput.addExpression') }}</el-dropdown-item>
-					<el-dropdown-item command="removeExpression" v-if="parameter.noDataExpression !== true && isValueExpression">{{ $baseText('parameterInput.removeExpression') }}</el-dropdown-item>
+					<el-dropdown-item command="removeExpression" v-if="parameter.noDataExpression !== true && isValueExpression">{{ $i18n2.baseText('parameterInput.removeExpression') }}</el-dropdown-item>
-					<el-dropdown-item command="refreshOptions" v-if="Boolean(remoteMethod)">{{ $baseText('parameterInput.refreshList') }}</el-dropdown-item>
+					<el-dropdown-item command="refreshOptions" v-if="Boolean(remoteMethod)">{{ $i18n2.baseText('parameterInput.refreshList') }}</el-dropdown-item>
-					<el-dropdown-item command="resetValue" :disabled="isDefault" divided>{{ $baseText('parameterInput.resetValue') }}</el-dropdown-item>
+					<el-dropdown-item command="resetValue" :disabled="isDefault" divided>{{ $i18n2.baseText('parameterInput.resetValue') }}</el-dropdown-item>
 				</el-dropdown-menu>
 			</el-dropdown>
 	</div>
@@ -331,23 +331,23 @@ export default mixins(
 				const interpolation = { interpolate: { shortPath: this.shortPath } };
 
 				if (this.getIssues.length && this.isValueExpression) {
-					return this.$baseText(
+					return this.$i18n2.baseText(
 						'parameterInput.parameterHasIssuesAndExpression',
 						interpolation,
 					);
 				} else if (this.getIssues.length && !this.isValueExpression) {
-					return this.$baseText(
+					return this.$i18n2.baseText(
 						'parameterInput.parameterHasIssues',
 						interpolation,
 					);
 				} else if (!this.getIssues.length && this.isValueExpression) {
-					return this.$baseText(
+					return this.$i18n2.baseText(
 						'parameterInput.parameterHasExpression',
 						interpolation,
 					);
 				}
 
-				return this.$baseText('parameterInput.parameter', interpolation);
+				return this.$i18n2.baseText('parameterInput.parameter', interpolation);
 			},
 			displayValue (): string | number | boolean | null {
 				if (this.remoteParameterOptionsLoading === true) {
@@ -355,7 +355,7 @@ export default mixins(
 					// to user that the data is loading. If not it would
 					// display the user the key instead of the value it
 					// represents
-					return this.$baseText('parameterInput.loadingOptions');
+					return this.$i18n2.baseText('parameterInput.loadingOptions');
 				}
 
 				let returnValue;
@@ -424,7 +424,7 @@ export default mixins(
 				try {
 					computedValue = this.resolveExpression(this.value) as NodeParameterValue;
 				} catch (error) {
-					computedValue = `[${this.$baseText('parameterInput.error')}}: ${error.message}]`;
+					computedValue = `[${this.$i18n2.baseText('parameterInput.error')}}: ${error.message}]`;
 				}
 
 				// Try to convert it into the corret type
@@ -570,18 +570,18 @@ export default mixins(
 		methods: {
 			getPlaceholder(): string {
 				return this.isForCredential
-					? this.$credText.placeholder(this.parameter)
+					? this.$i18n2.credText().placeholder(this.parameter)
-					: this.$nodeText.placeholder(this.parameter);
+					: this.$i18n2.nodeText().placeholder(this.parameter);
 			},
 			getOptionsOptionDisplayName(option: { value: string; name: string }): string {
 				return this.isForCredential
-					? this.$credText.optionsOptionDisplayName(this.parameter, option)
+					? this.$i18n2.credText().optionsOptionDisplayName(this.parameter, option)
-					: this.$nodeText.optionsOptionDisplayName(this.parameter, option);
+					: this.$i18n2.nodeText().optionsOptionDisplayName(this.parameter, option);
 			},
 			getOptionsOptionDescription(option: { value: string; description: string }): string {
 				return this.isForCredential
-					? this.$credText.optionsOptionDescription(this.parameter, option)
+					? this.$i18n2.credText().optionsOptionDescription(this.parameter, option)
-					: this.$nodeText.optionsOptionDescription(this.parameter, option);
+					: this.$i18n2.nodeText().optionsOptionDescription(this.parameter, option);
 			},
 
 			async loadRemoteParameterOptions () {

packages/editor-ui/src/components/ParameterInputExpanded.vue

@@ -1,7 +1,7 @@
 <template>
 	<n8n-input-label
-		:label="$credText.topParameterDisplayName(parameter)"
+		:label="$i18n2.credText().topParameterDisplayName(parameter)"
-		:tooltipText="$credText.topParameterDescription(parameter)"
+		:tooltipText="$i18n2.credText().topParameterDescription(parameter)"
 		:required="parameter.required"
 		:showTooltip="focused"
 	>
@@ -21,7 +21,7 @@
 			inputSize="large"
 		/>
 		<div class="errors" v-if="showRequiredErrors">
-			{{ $baseText('parameterInputExpanded.thisFieldIsRequired') }} <a v-if="documentationUrl" :href="documentationUrl" target="_blank" @click="onDocumentationUrlClick">{{ $baseText('parameterInputExpanded.openDocs') }}</a>
+			{{ $i18n2.baseText('parameterInputExpanded.thisFieldIsRequired') }} <a v-if="documentationUrl" :href="documentationUrl" target="_blank" @click="onDocumentationUrlClick">{{ $i18n2.baseText('parameterInputExpanded.openDocs') }}</a>
 		</div>
 	</n8n-input-label>
 </template>

packages/editor-ui/src/components/ParameterInputFull.vue

@@ -1,7 +1,7 @@
 <template>
 	<n8n-input-label
-		:label="$nodeText.topParameterDisplayName(parameter)"
+		:label="$i18n2.nodeText().topParameterDisplayName(parameter)"
-		:tooltipText="$nodeText.topParameterDescription(parameter)"
+		:tooltipText="$i18n2.nodeText().topParameterDescription(parameter)"
 		:showTooltip="focused"
 		:bold="false"
 		size="small"

packages/editor-ui/src/components/ParameterInputList.vue

@@ -16,7 +16,7 @@
 
 			<div v-else-if="parameter.type === 'notice'" class="parameter-item parameter-notice">
 				<n8n-text size="small">
-					<span v-html="$nodeText.topParameterDisplayName(parameter)"></span>
+					<span v-html="$i18n2.nodeText().topParameterDisplayName(parameter)"></span>
 				</n8n-text>
 			</div>
 
@@ -24,17 +24,17 @@
 				v-else-if="['collection', 'fixedCollection'].includes(parameter.type)"
 				class="multi-parameter"
 			>
-				<div class="delete-option clickable" :title="$baseText('parameterInputList.delete')" v-if="hideDelete !== true && !isReadOnly">
+				<div class="delete-option clickable" :title="$i18n2.baseText('parameterInputList.delete')" v-if="hideDelete !== true && !isReadOnly">
 					<font-awesome-icon
 						icon="trash"
 						class="reset-icon clickable"
-						:title="$baseText('parameterInputList.parameterOptions')"
+						:title="$i18n2.baseText('parameterInputList.parameterOptions')"
 						@click="deleteOption(parameter.name)"
 					/>
 				</div>
 				<n8n-input-label
-					:label="$nodeText.topParameterDisplayName(parameter)"
+					:label="$i18n2.nodeText().topParameterDisplayName(parameter)"
-					:tooltipText="$nodeText.topParameterDescription(parameter)"
+					:tooltipText="$i18n2.nodeText().topParameterDescription(parameter)"
 					size="small"
 					:underline="true"
 					:labelHoverableOnly="true"
@@ -59,11 +59,11 @@
 			</div>
 
 			<div v-else-if="displayNodeParameter(parameter)" class="parameter-item">
-				<div class="delete-option clickable" :title="$baseText('parameterInputList.delete')" v-if="hideDelete !== true && !isReadOnly">
+				<div class="delete-option clickable" :title="$i18n2.baseText('parameterInputList.delete')" v-if="hideDelete !== true && !isReadOnly">
 					<font-awesome-icon
 						icon="trash"
 						class="reset-icon clickable"
-						:title="$baseText('parameterInputList.deleteParameter')"
+						:title="$i18n2.baseText('parameterInputList.deleteParameter')"
 						@click="deleteOption(parameter.name)"
 					/>
 				</div>

packages/editor-ui/src/components/PersonalizationModal.vue

@@ -1,8 +1,8 @@
 <template>
 	<Modal
 		:name="PERSONALIZATION_MODAL_KEY"
-		:title="!submitted? $baseText('personalizationModal.getStarted') : $baseText('personalizationModal.thanks')"
+		:title="!submitted? $i18n2.baseText('personalizationModal.getStarted') : $i18n2.baseText('personalizationModal.thanks')"
-		:subtitle="!submitted? $baseText('personalizationModal.theseQuestionsHelpUs') : ''"
+		:subtitle="!submitted? $i18n2.baseText('personalizationModal.theseQuestionsHelpUs') : ''"
 		:centerTitle="true"
 		:showClose="false"
 		:eventBus="modalBus"
@@ -15,11 +15,11 @@
 		<template v-slot:content>
 			<div v-if="submitted" :class="$style.submittedContainer">
 				<img :class="$style.demoImage" :src="baseUrl + 'suggestednodes.png'" />
-				<n8n-text>{{ $baseText('personalizationModal.lookOutForThingsMarked') }}</n8n-text>
+				<n8n-text>{{ $i18n2.baseText('personalizationModal.lookOutForThingsMarked') }}</n8n-text>
 			</div>
 			<div :class="$style.container" v-else>
-				<n8n-input-label :label="$baseText('personalizationModal.howAreYourCodingSkills')">
+				<n8n-input-label :label="$i18n2.baseText('personalizationModal.howAreYourCodingSkills')">
-					<n8n-select :value="values[CODING_SKILL_KEY]" :placeholder="$baseText('personalizationModal.select')" @change="(value) => onInput(CODING_SKILL_KEY, value)">
+					<n8n-select :value="values[CODING_SKILL_KEY]" :placeholder="$i18n2.baseText('personalizationModal.select')" @change="(value) => onInput(CODING_SKILL_KEY, value)">
 						<n8n-option
 							:label="baseText('personalizationModal.neverCoded')"
 							value="0"
@@ -47,59 +47,59 @@
 					</n8n-select>
 				</n8n-input-label>
 
-				<n8n-input-label :label="$baseText('personalizationModal.whichOfTheseAreasDoYouMainlyWorkIn')">
+				<n8n-input-label :label="$i18n2.baseText('personalizationModal.whichOfTheseAreasDoYouMainlyWorkIn')">
-					<n8n-select :value="values[WORK_AREA_KEY]" :placeholder="$baseText('personalizationModal.select')" @change="(value) => onInput(WORK_AREA_KEY, value)">
+					<n8n-select :value="values[WORK_AREA_KEY]" :placeholder="$i18n2.baseText('personalizationModal.select')" @change="(value) => onInput(WORK_AREA_KEY, value)">
 						<n8n-option
 							:value="FINANCE_WORK_AREA"
-							:label="$baseText('personalizationModal.finance')"
+							:label="$i18n2.baseText('personalizationModal.finance')"
 						/>
 						<n8n-option
 							:value="HR_WORK_AREA"
-							:label="$baseText('personalizationModal.hr')"
+							:label="$i18n2.baseText('personalizationModal.hr')"
 						/>
 						<n8n-option
 							:value="IT_ENGINEERING_WORK_AREA"
-							:label="$baseText('personalizationModal.itEngineering')"
+							:label="$i18n2.baseText('personalizationModal.itEngineering')"
 						/>
 						<n8n-option
 							:value="LEGAL_WORK_AREA"
-							:label="$baseText('personalizationModal.legal')"
+							:label="$i18n2.baseText('personalizationModal.legal')"
 						/>
 						<n8n-option
 							:value="MARKETING_WORK_AREA"
-							:label="$baseText('personalizationModal.marketing')"
+							:label="$i18n2.baseText('personalizationModal.marketing')"
 						/>
 						<n8n-option
 							:value="OPS_WORK_AREA"
-							:label="$baseText('personalizationModal.operations')"
+							:label="$i18n2.baseText('personalizationModal.operations')"
 						/>
 						<n8n-option
 							:value="PRODUCT_WORK_AREA"
-							:label="$baseText('personalizationModal.product')"
+							:label="$i18n2.baseText('personalizationModal.product')"
 						/>
 						<n8n-option
 							:value="SALES_BUSINESSDEV_WORK_AREA"
-							:label="$baseText('personalizationModal.salesBizDev')"
+							:label="$i18n2.baseText('personalizationModal.salesBizDev')"
 						/>
 						<n8n-option
 							:value="SECURITY_WORK_AREA"
-							:label="$baseText('personalizationModal.security')"
+							:label="$i18n2.baseText('personalizationModal.security')"
 						/>
 						<n8n-option
 							:value="SUPPORT_WORK_AREA"
-							:label="$baseText('personalizationModal.support')"
+							:label="$i18n2.baseText('personalizationModal.support')"
 						/>
 						<n8n-option
 							:value="EXECUTIVE_WORK_AREA"
-							:label="$baseText('personalizationModal.executiveTeam')"
+							:label="$i18n2.baseText('personalizationModal.executiveTeam')"
 						/>
 						<n8n-option
 							:value="OTHER_WORK_AREA_OPTION"
-							:label="$baseText('personalizationModal.otherPleaseSpecify')"
+							:label="$i18n2.baseText('personalizationModal.otherPleaseSpecify')"
 						/>
 						<n8n-option
 							:value="NOT_APPLICABLE_WORK_AREA"
-							:label="$baseText('personalizationModal.imNotUsingN8nForWork')"
+							:label="$i18n2.baseText('personalizationModal.imNotUsingN8nForWork')"
 						/>
 					</n8n-select>
 				</n8n-input-label>
@@ -107,86 +107,86 @@
 				<n8n-input
 					v-if="otherWorkAreaFieldVisible"
 					:value="values[OTHER_WORK_AREA_KEY]"
-					:placeholder="$baseText('personalizationModal.specifyYourWorkArea')"
+					:placeholder="$i18n2.baseText('personalizationModal.specifyYourWorkArea')"
 					@input="(value) => onInput(OTHER_WORK_AREA_KEY, value)"
 				/>
 
 				<section v-if="showAllIndustryQuestions">
-					<n8n-input-label :label="$baseText('personalizationModal.whichIndustriesIsYourCompanyIn')">
+					<n8n-input-label :label="$i18n2.baseText('personalizationModal.whichIndustriesIsYourCompanyIn')">
-					<n8n-select :value="values[COMPANY_INDUSTRY_KEY]" multiple :placeholder="$baseText('personalizationModal.select')" @change="(value) => onInput(COMPANY_INDUSTRY_KEY, value)">
+					<n8n-select :value="values[COMPANY_INDUSTRY_KEY]" multiple :placeholder="$i18n2.baseText('personalizationModal.select')" @change="(value) => onInput(COMPANY_INDUSTRY_KEY, value)">
 						<n8n-option
 							:value="E_COMMERCE_INDUSTRY"
-							:label="$baseText('personalizationModal.eCommerce')"
+							:label="$i18n2.baseText('personalizationModal.eCommerce')"
 						/>
 						<n8n-option
 							:value="AUTOMATION_CONSULTING_INDUSTRY"
-							:label="$baseText('personalizationModal.automationConsulting')"
+							:label="$i18n2.baseText('personalizationModal.automationConsulting')"
 							/>
 						<n8n-option
 							:value="SYSTEM_INTEGRATION_INDUSTRY"
-							:label="$baseText('personalizationModal.systemsIntegration')"
+							:label="$i18n2.baseText('personalizationModal.systemsIntegration')"
 							/>
 						<n8n-option
 							:value="GOVERNMENT_INDUSTRY"
-							:label="$baseText('personalizationModal.government')"
+							:label="$i18n2.baseText('personalizationModal.government')"
 						/>
 						<n8n-option
 							:value="LEGAL_INDUSTRY"
-							:label="$baseText('personalizationModal.legal')"
+							:label="$i18n2.baseText('personalizationModal.legal')"
 						/>
 						<n8n-option
 							:value="HEALTHCARE_INDUSTRY"
-							:label="$baseText('personalizationModal.healthcare')"
+							:label="$i18n2.baseText('personalizationModal.healthcare')"
 						/>
 						<n8n-option
 							:value="FINANCE_INDUSTRY"
-							:label="$baseText('personalizationModal.finance')"
+							:label="$i18n2.baseText('personalizationModal.finance')"
 						/>
 						<n8n-option
 							:value="SECURITY_INDUSTRY"
-							:label="$baseText('personalizationModal.security')"
+							:label="$i18n2.baseText('personalizationModal.security')"
 						/>
 						<n8n-option
 							:value="SAAS_INDUSTRY"
-							:label="$baseText('personalizationModal.saas')"
+							:label="$i18n2.baseText('personalizationModal.saas')"
 						/>
 						<n8n-option
 							:value="OTHER_INDUSTRY_OPTION"
-							:label="$baseText('personalizationModal.otherPleaseSpecify')"
+							:label="$i18n2.baseText('personalizationModal.otherPleaseSpecify')"
 						/>
 					</n8n-select>
 				</n8n-input-label>
 				<n8n-input
 					v-if="otherCompanyIndustryFieldVisible"
 					:value="values[OTHER_COMPANY_INDUSTRY_KEY]"
-					:placeholder="$baseText('personalizationModal.specifyYourCompanysIndustry')"
+					:placeholder="$i18n2.baseText('personalizationModal.specifyYourCompanysIndustry')"
 					@input="(value) => onInput(OTHER_COMPANY_INDUSTRY_KEY, value)"
 				/>
 
-				<n8n-input-label :label="$baseText('personalizationModal.howBigIsYourCompany')">
+				<n8n-input-label :label="$i18n2.baseText('personalizationModal.howBigIsYourCompany')">
-					<n8n-select :value="values[COMPANY_SIZE_KEY]" :placeholder="$baseText('personalizationModal.select')" @change="(value) => onInput(COMPANY_SIZE_KEY, value)">
+					<n8n-select :value="values[COMPANY_SIZE_KEY]" :placeholder="$i18n2.baseText('personalizationModal.select')" @change="(value) => onInput(COMPANY_SIZE_KEY, value)">
 						<n8n-option
-							:label="$baseText('personalizationModal.lessThan20People')"
+							:label="$i18n2.baseText('personalizationModal.lessThan20People')"
 							:value="COMPANY_SIZE_20_OR_LESS"
 						/>
 						<n8n-option
-							:label="`20-99 ${$baseText('personalizationModal.people')}`"
+							:label="`20-99 ${$i18n2.baseText('personalizationModal.people')}`"
 							:value="COMPANY_SIZE_20_99"
 						/>
 						<n8n-option
-							:label="`100-499 ${$baseText('personalizationModal.people')}`"
+							:label="`100-499 ${$i18n2.baseText('personalizationModal.people')}`"
 							:value="COMPANY_SIZE_100_499"
 						/>
 						<n8n-option
-							:label="`500-999 ${$baseText('personalizationModal.people')}`"
+							:label="`500-999 ${$i18n2.baseText('personalizationModal.people')}`"
 							:value="COMPANY_SIZE_500_999"
 						/>
 						<n8n-option
-							:label="`1000+ ${$baseText('personalizationModal.people')}`"
+							:label="`1000+ ${$i18n2.baseText('personalizationModal.people')}`"
 							:value="COMPANY_SIZE_1000_OR_MORE"
 						/>
 						<n8n-option
-							:label="$baseText('personalizationModal.imNotUsingN8nForWork')"
+							:label="$i18n2.baseText('personalizationModal.imNotUsingN8nForWork')"
 							:value="COMPANY_SIZE_PERSONAL_USE"
 						/>
 					</n8n-select>
@@ -197,8 +197,8 @@
 		</template>
 		<template v-slot:footer>
 			<div>
-				<n8n-button v-if="submitted" @click="closeDialog" :label="$baseText('personalizationModal.getStarted')" float="right" />
+				<n8n-button v-if="submitted" @click="closeDialog" :label="$i18n2.baseText('personalizationModal.getStarted')" float="right" />
-				<n8n-button v-else @click="save" :loading="isSaving" :label="$baseText('personalizationModal.continue')" float="right" />
+				<n8n-button v-else @click="save" :loading="isSaving" :label="$i18n2.baseText('personalizationModal.continue')" float="right" />
 			</div>
 		</template>
 	</Modal>
@@ -354,7 +354,7 @@ export default mixins(showMessage, renderText, workflowHelpers).extend({
 
 				this.submitted = true;
 			} catch (e) {
-				this.$showError(e, this.$baseText('personalizationModal.errorWhileSubmittingResults'));
+				this.$showError(e, this.$i18n2.baseText('personalizationModal.errorWhileSubmittingResults'));
 			}
 
 			this.$data.isSaving = false;

packages/editor-ui/src/components/PushConnectionTracker.vue

@@ -3,10 +3,10 @@
 		<div class="push-connection-lost primary-color" v-if="!pushConnectionActive">
 			<n8n-tooltip placement="bottom-end" >
 				<div slot="content">
-					{{ $baseText('pushConnectionTracker.cannotConnectToServer') }}
+					{{ $i18n2.baseText('pushConnectionTracker.cannotConnectToServer') }}
 				</div>
 				<span>
-					<font-awesome-icon icon="exclamation-triangle" />&nbsp; {{ $baseText('pushConnectionTracker.connectionLost') }}
+					<font-awesome-icon icon="exclamation-triangle" />&nbsp; {{ $i18n2.baseText('pushConnectionTracker.connectionLost') }}
 				</span>
 			</n8n-tooltip>
 		</div>

packages/editor-ui/src/components/RunData.vue

@@ -7,10 +7,10 @@
 			class="execute-node-button"
 		>
 			<n8n-button
-				:title="$baseText('runData.executesThisNodeAfterExecuting', { interpolate: { nodeName: node.name } })"
+				:title="$i18n2.baseText('runData.executesThisNodeAfterExecuting', { interpolate: { nodeName: node.name } })"
 				:loading="workflowRunning"
 				icon="play-circle"
-				:label="$baseText('runData.executeNode')"
+				:label="$i18n2.baseText('runData.executeNode')"
 				@click.stop="runWorkflow(node.name, 'RunData.ExecuteNodeButton')"
 			/>
 		</div>
@@ -18,10 +18,10 @@
 		<div class="header">
 			<div class="title-text">
 				<n8n-text :bold="true" v-if="dataCount < maxDisplayItems">
-					{{ $baseText('runData.items') }}: {{ dataCount }}
+					{{ $i18n2.baseText('runData.items') }}: {{ dataCount }}
 				</n8n-text>
 				<div v-else class="title-text">
-					<n8n-text :bold="true">{{ $baseText('runData.items') }}:</n8n-text>
+					<n8n-text :bold="true">{{ $i18n2.baseText('runData.items') }}:</n8n-text>
 					<span class="opts">
 						<n8n-select size="mini" v-model="maxDisplayItems" @click.stop>
 							<n8n-option v-for="option in maxDisplayItemsOptions" :label="option" :value="option" :key="option" />
@@ -34,13 +34,13 @@
 					placement="right"
 				>
 					<div slot="content">
-						<n8n-text :bold="true" size="small">{{ $baseText('runData.startTime') + ':' }}</n8n-text> {{runMetadata.startTime}}<br/>
+						<n8n-text :bold="true" size="small">{{ $i18n2.baseText('runData.startTime') + ':' }}</n8n-text> {{runMetadata.startTime}}<br/>
-						<n8n-text :bold="true" size="small">{{ $baseText('runData.executionTime') + ':' }}</n8n-text> {{runMetadata.executionTime}} {{ $baseText('runData.ms') }}
+						<n8n-text :bold="true" size="small">{{ $i18n2.baseText('runData.executionTime') + ':' }}</n8n-text> {{runMetadata.executionTime}} {{ $i18n2.baseText('runData.ms') }}
 					</div>
 					<font-awesome-icon icon="info-circle" class="primary-color" />
 				</n8n-tooltip>
 				<n8n-text :bold="true" v-if="maxOutputIndex > 0">
-					| {{ $baseText('runData.output') }}:
+					| {{ $i18n2.baseText('runData.output') }}:
 				</n8n-text>
 				<span class="opts" v-if="maxOutputIndex > 0" >
 					<n8n-select size="mini" v-model="outputIndex" @click.stop>
@@ -50,7 +50,7 @@
 				</span>
 
 				<n8n-text :bold="true" v-if="maxRunIndex > 0">
-					| {{ $baseText('runData.dataOfExecution') }}:
+					| {{ $i18n2.baseText('runData.dataOfExecution') }}:
 				</n8n-text>
 				<span class="opts">
 					<n8n-select v-if="maxRunIndex > 0" size="mini" v-model="runIndex" @click.stop>
@@ -62,25 +62,25 @@
 			</div>
 			<div v-if="hasNodeRun && !hasRunError" class="title-data-display-selector" @click.stop>
 				<el-radio-group v-model="displayMode" size="mini">
-					<el-radio-button :label="$baseText('runData.json')" :disabled="showData === false"></el-radio-button>
+					<el-radio-button :label="$i18n2.baseText('runData.json')" :disabled="showData === false"></el-radio-button>
-					<el-radio-button :label="$baseText('runData.table')"></el-radio-button>
+					<el-radio-button :label="$i18n2.baseText('runData.table')"></el-radio-button>
-					<el-radio-button :label="$baseText('runData.binary')" v-if="binaryData.length !== 0"></el-radio-button>
+					<el-radio-button :label="$i18n2.baseText('runData.binary')" v-if="binaryData.length !== 0"></el-radio-button>
 				</el-radio-group>
 			</div>
 			<div v-if="hasNodeRun && !hasRunError && displayMode === 'JSON' && state.path !== deselectedPlaceholder" class="select-button">
 				<el-dropdown trigger="click" @command="handleCopyClick">
 					<span class="el-dropdown-link">
-						<n8n-icon-button :title="$baseText('runData.copyToClipboard')" icon="copy" />
+						<n8n-icon-button :title="$i18n2.baseText('runData.copyToClipboard')" icon="copy" />
 					</span>
 					<el-dropdown-menu slot="dropdown">
 						<el-dropdown-item :command="{command: 'itemPath'}">
-							{{ $baseText('runData.copyItemPath') }}
+							{{ $i18n2.baseText('runData.copyItemPath') }}
 						</el-dropdown-item>
 						<el-dropdown-item :command="{command: 'parameterPath'}">
-							{{ $baseText('runData.copyParameterPath') }}
+							{{ $i18n2.baseText('runData.copyParameterPath') }}
 						</el-dropdown-item>
 						<el-dropdown-item :command="{command: 'value'}">
-							{{ $baseText('runData.copyValue') }}
+							{{ $i18n2.baseText('runData.copyValue') }}
 						</el-dropdown-item>
 					</el-dropdown-menu>
 				</el-dropdown>
@@ -94,7 +94,7 @@
 				<span v-else>
 					<div v-if="showData === false" class="too-much-data">
 						<h3>
-							{{ $baseText('runData.nodeReturnedALargeAmountOfData') }}
+							{{ $i18n2.baseText('runData.nodeReturnedALargeAmountOfData') }}
 						</h3>
 
 						<div class="text">
@@ -110,17 +110,17 @@
 
 						<n8n-button
 							icon="eye"
-							:label="$baseText('runData.displayDataAnyway')"
+							:label="$i18n2.baseText('runData.displayDataAnyway')"
 							@click="displayMode = 'Table';showData = true;"
 						/>
 					</div>
 					<div v-else-if="['JSON', 'Table'].includes(displayMode)">
 						<div v-if="jsonData.length === 0" class="no-data">
-							{{ $baseText('runData.noTextDataFound') }}
+							{{ $i18n2.baseText('runData.noTextDataFound') }}
 						</div>
 						<div v-else-if="displayMode === 'Table'">
 							<div v-if="tableData !== null && tableData.columns.length === 0" class="no-data">
-								{{ $baseText('runData.entriesExistButThey') }}
+								{{ $i18n2.baseText('runData.entriesExistButThey') }}
 							</div>
 							<table v-else-if="tableData !== null">
 								<tr>
@@ -148,7 +148,7 @@
 					</div>
 					<div v-else-if="displayMode === 'Binary'">
 						<div v-if="binaryData.length === 0" class="no-data">
-							{{ $baseText('runData.noBinaryDataFound') }}
+							{{ $i18n2.baseText('runData.noBinaryDataFound') }}
 						</div>
 
 						<div v-else>
@@ -166,24 +166,24 @@
 												{{key}}
 											</div>
 											<div v-if="binaryData.fileName">
-												<div class="label">{{ $baseText('runData.fileName') }}: </div>
+												<div class="label">{{ $i18n2.baseText('runData.fileName') }}: </div>
 												<div class="value">{{binaryData.fileName}}</div>
 											</div>
 											<div v-if="binaryData.directory">
-												<div class="label">{{ $baseText('runData.directory') }}: </div>
+												<div class="label">{{ $i18n2.baseText('runData.directory') }}: </div>
 												<div class="value">{{binaryData.directory}}</div>
 											</div>
 											<div v-if="binaryData.fileExtension">
-												<div class="label">{{ $baseText('runData.fileExtension') }}:</div>
+												<div class="label">{{ $i18n2.baseText('runData.fileExtension') }}:</div>
 												<div class="value">{{binaryData.fileExtension}}</div>
 											</div>
 											<div v-if="binaryData.mimeType">
-												<div class="label">{{ $baseText('runData.mimeType') }}: </div>
+												<div class="label">{{ $i18n2.baseText('runData.mimeType') }}: </div>
 												<div class="value">{{binaryData.mimeType}}</div>
 											</div>
 
 											<div class="binary-data-show-data-button-wrapper">
-												<n8n-button size="small" :label="$baseText('runData.showBinaryData')" class="binary-data-show-data-button" @click="displayBinaryData(index, key)" />
+												<n8n-button size="small" :label="$i18n2.baseText('runData.showBinaryData')" class="binary-data-show-data-button" @click="displayBinaryData(index, key)" />
 											</div>
 
 										</div>
@@ -196,9 +196,9 @@
 			</span>
 			<div v-else class="message">
 				<div>
-					<n8n-text :bold="true">{{ $baseText('runData.noData') }}</n8n-text ><br />
+					<n8n-text :bold="true">{{ $i18n2.baseText('runData.noData') }}</n8n-text ><br />
 					<br />
-					{{ $baseText('runData.dataReturnedByThisNodeWillDisplayHere') }}<br />
+					{{ $i18n2.baseText('runData.dataReturnedByThisNodeWillDisplayHere') }}<br />
 				</div>
 			</div>
 		</div>

packages/editor-ui/src/components/SaveButton.vue

@@ -1,6 +1,6 @@
 <template>
 	<span :class="$style.container">
-		<span :class="$style.saved" v-if="saved">{{ $baseText('saveButton.saved') }}</span>
+		<span :class="$style.saved" v-if="saved">{{ $i18n2.baseText('saveButton.saved') }}</span>
 		<n8n-button
 			v-else
 			:label="saveButtonLabel"
@@ -41,8 +41,8 @@ export default mixins(renderText).extend({
 	computed: {
 		saveButtonLabel() {
 			return this.isSaving
-				? this.$baseText('saveButton.saving')
+				? this.$i18n2.baseText('saveButton.saving')
-				: this.$baseText('saveButton.save');
+				: this.$i18n2.baseText('saveButton.save');
 		},
 	},
 });

packages/editor-ui/src/components/TagsDropdown.vue

@@ -25,13 +25,13 @@
 			>
 				<font-awesome-icon icon="plus-circle" />
 				<span>
-					{{ $baseText('tagsDropdown.createTag', { interpolate: { filter } }) }}
+					{{ $i18n2.baseText('tagsDropdown.createTag', { interpolate: { filter } }) }}
 				</span>
 			</n8n-option>
 			<n8n-option v-else-if="options.length === 0" value="message" disabled>
-				<span v-if="createEnabled">{{ $baseText('tagsDropdown.typeToCreateATag') }}</span>
+				<span v-if="createEnabled">{{ $i18n2.baseText('tagsDropdown.typeToCreateATag') }}</span>
-				<span v-else-if="allTags.length > 0">{{ $baseText('tagsDropdown.noMatchingTagsExist') }}</span>
+				<span v-else-if="allTags.length > 0">{{ $i18n2.baseText('tagsDropdown.noMatchingTagsExist') }}</span>
-				<span v-else>{{ $baseText('tagsDropdown.noTagsExist') }}</span>
+				<span v-else>{{ $i18n2.baseText('tagsDropdown.noTagsExist') }}</span>
 			</n8n-option>
 
 			<!-- key is id+index for keyboard navigation to work well with filter -->
@@ -46,7 +46,7 @@
 
 			<n8n-option :key="MANAGE_KEY" :value="MANAGE_KEY" class="ops manage-tags">
 				<font-awesome-icon icon="cog" />
-				<span>{{ $baseText('tagsDropdown.manageTags') }}</span>
+				<span>{{ $i18n2.baseText('tagsDropdown.manageTags') }}</span>
 			</n8n-option>
 		</n8n-select>
 	</div>
@@ -142,8 +142,8 @@ export default mixins(showMessage, renderText).extend({
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('tagsDropdown.showError.title'),
+					this.$i18n2.baseText('tagsDropdown.showError.title'),
-					this.$baseText(
+					this.$i18n2.baseText(
 						'tagsDropdown.showError.message',
 						{ interpolate: { name } },
 					),

packages/editor-ui/src/components/TagsManager/NoTagsView.vue

@@ -3,9 +3,9 @@
 		<el-col class="notags" :span="16">
 			<div class="icon">🗄️</div>
 			<div>
-				<div class="headline">{{ $baseText('noTagsView.readyToOrganizeYourWorkflows') }}</div>
+				<div class="headline">{{ $i18n2.baseText('noTagsView.readyToOrganizeYourWorkflows') }}</div>
 				<div class="description">
-					{{ $baseText('noTagsView.withWorkflowTagsYouReFree') }}
+					{{ $i18n2.baseText('noTagsView.withWorkflowTagsYouReFree') }}
 				</div>
 			</div>
 			<n8n-button label="Create a tag" size="large" @click="$emit('enableCreate')" />

packages/editor-ui/src/components/TagsManager/TagsManager.vue

@@ -1,6 +1,6 @@
 <template>
 	<Modal
-		:title="$baseText('tagsManager.manageTags')"
+		:title="$i18n2.baseText('tagsManager.manageTags')"
 		:name="TAGS_MANAGER_MODAL_KEY"
 		:eventBus="modalBus"
 		@enter="onEnter"
@@ -25,7 +25,7 @@
 			</el-row>
 		</template>
 		<template v-slot:footer="{ close }">
-			<n8n-button :label="$baseText('tagsManager.done')" @click="close" float="right" />
+			<n8n-button :label="$i18n2.baseText('tagsManager.done')" @click="close" float="right" />
 		</template>
 	</Modal>
 </template>
@@ -88,7 +88,7 @@ export default mixins(renderText, showMessage).extend({
 			try {
 				if (!name) {
 					throw new Error(
-						this.$baseText('tagsManager.tagNameCannotBeEmpty'),
+						this.$i18n2.baseText('tagsManager.tagNameCannotBeEmpty'),
 					);
 				}
 
@@ -99,8 +99,8 @@ export default mixins(renderText, showMessage).extend({
 				const escapedName = escape(name);
 				this.$showError(
 					error,
-					this.$baseText('tagsManager.showError.onCreate.title'),
+					this.$i18n2.baseText('tagsManager.showError.onCreate.title'),
-					this.$baseText(
+					this.$i18n2.baseText(
 						'tagsManager.showError.onCreate.message',
 						{ interpolate: { escapedName } },
 					) + ':',
@@ -116,7 +116,7 @@ export default mixins(renderText, showMessage).extend({
 			try {
 				if (!name) {
 					throw new Error(
-						this.$baseText('tagsManager.tagNameCannotBeEmpty'),
+						this.$i18n2.baseText('tagsManager.tagNameCannotBeEmpty'),
 					);
 				}
 
@@ -132,8 +132,8 @@ export default mixins(renderText, showMessage).extend({
 				const escapedOldName = escape(oldName);
 
 				this.$showMessage({
-					title: this.$baseText('tagsManager.showMessage.onUpdate.title'),
+					title: this.$i18n2.baseText('tagsManager.showMessage.onUpdate.title'),
-					message: this.$baseText(
+					message: this.$i18n2.baseText(
 						'tagsManager.showMessage.onUpdate.message',
 						{ interpolate: { escapedName, escapedOldName } },
 					),
@@ -143,8 +143,8 @@ export default mixins(renderText, showMessage).extend({
 				const escapedName = escape(oldName);
 				this.$showError(
 					error,
-					this.$baseText('tagsManager.showError.onUpdate.title'),
+					this.$i18n2.baseText('tagsManager.showError.onUpdate.title'),
-					this.$baseText(
+					this.$i18n2.baseText(
 						'tagsManager.showError.onUpdate.message',
 						{ interpolate: { escapedName } },
 					) + ':',
@@ -161,7 +161,7 @@ export default mixins(renderText, showMessage).extend({
 				const deleted = await this.$store.dispatch("tags/delete", id);
 				if (!deleted) {
 					throw new Error(
-						this.$baseText('tagsManager.couldNotDeleteTag'),
+						this.$i18n2.baseText('tagsManager.couldNotDeleteTag'),
 					);
 				}
 
@@ -171,8 +171,8 @@ export default mixins(renderText, showMessage).extend({
 
 				const escapedName = escape(name);
 				this.$showMessage({
-					title: this.$baseText('tagsManager.showMessage.onDelete.title'),
+					title: this.$i18n2.baseText('tagsManager.showMessage.onDelete.title'),
-					message: this.$baseText(
+					message: this.$i18n2.baseText(
 						'tagsManager.showMessage.onDelete.message',
 						{ interpolate: { escapedName } },
 					),
@@ -182,8 +182,8 @@ export default mixins(renderText, showMessage).extend({
 				const escapedName = escape(name);
 				this.$showError(
 					error,
-					this.$baseText('tagsManager.showError.onDelete.title'),
+					this.$i18n2.baseText('tagsManager.showError.onDelete.title'),
-					this.$baseText(
+					this.$i18n2.baseText(
 						'tagsManager.showError.onDelete.message',
 						{ interpolate: { escapedName } },
 					) + ':',

packages/editor-ui/src/components/TagsManager/TagsView/TagsTable.vue

@@ -3,13 +3,13 @@
 		stripe
 		max-height="450"
 		ref="table"
-		:empty-text="$baseText('tagsTable.noMatchingTagsExist')"
+		:empty-text="$i18n2.baseText('tagsTable.noMatchingTagsExist')"
 		:data="rows"
 		:span-method="getSpan"
 		:row-class-name="getRowClasses"
 		v-loading="isLoading"
 	>
-		<el-table-column :label="$baseText('tagsTable.name')">
+		<el-table-column :label="$i18n2.baseText('tagsTable.name')">
 			<template slot-scope="scope">
 				<div class="name" :key="scope.row.id" @keydown.stop>
 					<transition name="fade" mode="out-in">
@@ -21,7 +21,7 @@
 							ref="nameInput"
 						></n8n-input>
 						<span v-else-if="scope.row.delete">
-							<span>{{ $baseText('tagsTable.areYouSureYouWantToDeleteThisTag') }}</span>
+							<span>{{ $i18n2.baseText('tagsTable.areYouSureYouWantToDeleteThisTag') }}</span>
 							<input ref="deleteHiddenInput" class="hidden" />
 						</span>
 						<span v-else :class="{ disabled: scope.row.disable }">
@@ -31,7 +31,7 @@
 				</div>
 			</template>
 		</el-table-column>
-		<el-table-column :label="$baseText('tagsTable.usage')" width="150">
+		<el-table-column :label="$i18n2.baseText('tagsTable.usage')" width="150">
 			<template slot-scope="scope">
 				<transition name="fade" mode="out-in">
 						<div v-if="!scope.row.create && !scope.row.delete" :class="{ disabled: scope.row.disable }">
@@ -44,20 +44,20 @@
 			<template slot-scope="scope">
 				<transition name="fade" mode="out-in">
 					<div class="ops" v-if="scope.row.create">
-						<n8n-button :label="$baseText('tagsTable.cancel')" @click.stop="cancel" type="outline" :disabled="isSaving" />
+						<n8n-button :label="$i18n2.baseText('tagsTable.cancel')" @click.stop="cancel" type="outline" :disabled="isSaving" />
-						<n8n-button :label="$baseText('tagsTable.createTag')" @click.stop="apply" :loading="isSaving" />
+						<n8n-button :label="$i18n2.baseText('tagsTable.createTag')" @click.stop="apply" :loading="isSaving" />
 					</div>
 					<div class="ops" v-else-if="scope.row.update">
-						<n8n-button :label="$baseText('tagsTable.cancel')" @click.stop="cancel" type="outline" :disabled="isSaving" />
+						<n8n-button :label="$i18n2.baseText('tagsTable.cancel')" @click.stop="cancel" type="outline" :disabled="isSaving" />
-						<n8n-button :label="$baseText('tagsTable.saveChanges')" @click.stop="apply" :loading="isSaving" />
+						<n8n-button :label="$i18n2.baseText('tagsTable.saveChanges')" @click.stop="apply" :loading="isSaving" />
 					</div>
 					<div class="ops" v-else-if="scope.row.delete">
-						<n8n-button :label="$baseText('tagsTable.cancel')" @click.stop="cancel" type="outline" :disabled="isSaving" />
+						<n8n-button :label="$i18n2.baseText('tagsTable.cancel')" @click.stop="cancel" type="outline" :disabled="isSaving" />
-						<n8n-button :label="$baseText('tagsTable.deleteTag')" @click.stop="apply" :loading="isSaving" />
+						<n8n-button :label="$i18n2.baseText('tagsTable.deleteTag')" @click.stop="apply" :loading="isSaving" />
 					</div>
 					<div class="ops main" v-else-if="!scope.row.disable">
-						<n8n-icon-button :title="$baseText('tagsTable.editTag')" @click.stop="enableUpdate(scope.row)" icon="pen" />
+						<n8n-icon-button :title="$i18n2.baseText('tagsTable.editTag')" @click.stop="enableUpdate(scope.row)" icon="pen" />
-						<n8n-icon-button :title="$baseText('tagsTable.deleteTag')" @click.stop="enableDelete(scope.row)" icon="trash" />
+						<n8n-icon-button :title="$i18n2.baseText('tagsTable.deleteTag')" @click.stop="enableDelete(scope.row)" icon="trash" />
 					</div>
 				</transition>
 			</template>

packages/editor-ui/src/components/TagsManager/TagsView/TagsTableHeader.vue

@@ -2,7 +2,7 @@
 	<el-row class="tags-header">
 		<el-col :span="10">
 			<n8n-input
-				:placeholder="$baseText('tagsTableHeader.searchTags')"
+				:placeholder="$i18n2.baseText('tagsTableHeader.searchTags')"
 				:value="search"
 				@input="onSearchChange"
 				:disabled="disabled"
@@ -13,7 +13,7 @@
 			</n8n-input>
 		</el-col>
 		<el-col :span="14">
-			<n8n-button @click="onAddNew" :disabled="disabled" icon="plus" :label="$baseText('tagsTableHeader.addNew')" size="large" float="right" />
+			<n8n-button @click="onAddNew" :disabled="disabled" icon="plus" :label="$i18n2.baseText('tagsTableHeader.addNew')" size="large" float="right" />
 		</el-col>
 	</el-row>
 </template>

packages/editor-ui/src/components/TagsManager/TagsView/TagsView.vue

@@ -57,7 +57,7 @@ export default mixins(renderText).extend({
 		},
 		rows(): ITagRow[] {
 			const getUsage = (count: number | undefined) => count && count > 0
-				? this.$baseText(
+				? this.$i18n2.baseText(
 					count > 1 ?
 						'tagsView.inUse.plural' : 'tagsView.inUse.singular',
 					{
@@ -66,7 +66,7 @@ export default mixins(renderText).extend({
 						},
 					},
 				)
-				: this.$baseText('tagsView.notBeingUsed');
+				: this.$i18n2.baseText('tagsView.notBeingUsed');
 
 			const disabled = this.isCreateEnabled || this.$data.updateId || this.$data.deleteId;
 			const tagRows = (this.$props.tags || [])

packages/editor-ui/src/components/TextEdit.vue

@@ -1,11 +1,11 @@
 <template>
 	<div v-if="dialogVisible">
-		<el-dialog :visible="dialogVisible" append-to-body width="80%" :title="`${$baseText('textEdit.edit')} ${$nodeText.topParameterDisplayName(parameter)}`" :before-close="closeDialog">
+		<el-dialog :visible="dialogVisible" append-to-body width="80%" :title="`${$i18n2.baseText('textEdit.edit')} ${$i18n2.nodeText().topParameterDisplayName(parameter)}`" :before-close="closeDialog">
 
 			<div class="ignore-key-press">
-				<n8n-input-label :label="$nodeText.topParameterDisplayName(parameter)">
+				<n8n-input-label :label="$i18n2.nodeText().topParameterDisplayName(parameter)">
 					<div @keydown.stop @keydown.esc="closeDialog()">
-						<n8n-input v-model="tempValue" type="textarea" ref="inputField" :value="value" :placeholder="$nodeText.placeholder(parameter)" @change="valueChanged" @keydown.stop="noOp" :rows="15" />
+						<n8n-input v-model="tempValue" type="textarea" ref="inputField" :value="value" :placeholder="$i18n2.nodeText().placeholder(parameter)" @change="valueChanged" @keydown.stop="noOp" :rows="15" />
 					</div>
 				</n8n-input-label>
 			</div>

packages/editor-ui/src/components/TimeAgo.vue

@@ -32,20 +32,20 @@ export default mixins(renderText).extend({
 			// index: the index of array below;
 			// totalSec: total seconds between date to be formatted and today's date;
 			return [
-				[this.$baseText('timeAgo.justNow'), this.$baseText('timeAgo.rightNow')],
+				[this.$i18n2.baseText('timeAgo.justNow'), this.$i18n2.baseText('timeAgo.rightNow')],
-				[this.$baseText('timeAgo.justNow'), this.$baseText('timeAgo.rightNow')], // ['%s seconds ago', 'in %s seconds'],
+				[this.$i18n2.baseText('timeAgo.justNow'), this.$i18n2.baseText('timeAgo.rightNow')], // ['%s seconds ago', 'in %s seconds'],
-				[this.$baseText('timeAgo.oneMinuteAgo'), this.$baseText('timeAgo.inOneMinute')],
+				[this.$i18n2.baseText('timeAgo.oneMinuteAgo'), this.$i18n2.baseText('timeAgo.inOneMinute')],
-				[this.$baseText('timeAgo.minutesAgo'), this.$baseText('timeAgo.inMinutes')],
+				[this.$i18n2.baseText('timeAgo.minutesAgo'), this.$i18n2.baseText('timeAgo.inMinutes')],
-				[this.$baseText('timeAgo.oneHourAgo'), this.$baseText('timeAgo.inOneHour')],
+				[this.$i18n2.baseText('timeAgo.oneHourAgo'), this.$i18n2.baseText('timeAgo.inOneHour')],
-				[this.$baseText('timeAgo.hoursAgo'), this.$baseText('timeAgo.inHours')],
+				[this.$i18n2.baseText('timeAgo.hoursAgo'), this.$i18n2.baseText('timeAgo.inHours')],
-				[this.$baseText('timeAgo.oneDayAgo'), this.$baseText('timeAgo.inOneDay')],
+				[this.$i18n2.baseText('timeAgo.oneDayAgo'), this.$i18n2.baseText('timeAgo.inOneDay')],
-				[this.$baseText('timeAgo.daysAgo'), this.$baseText('timeAgo.inDays')],
+				[this.$i18n2.baseText('timeAgo.daysAgo'), this.$i18n2.baseText('timeAgo.inDays')],
-				[this.$baseText('timeAgo.oneWeekAgo'), this.$baseText('timeAgo.inOneWeek')],
+				[this.$i18n2.baseText('timeAgo.oneWeekAgo'), this.$i18n2.baseText('timeAgo.inOneWeek')],
-				[this.$baseText('timeAgo.weeksAgo'), this.$baseText('timeAgo.inWeeks')],
+				[this.$i18n2.baseText('timeAgo.weeksAgo'), this.$i18n2.baseText('timeAgo.inWeeks')],
-				[this.$baseText('timeAgo.oneMonthAgo'), this.$baseText('timeAgo.inOneMonth')],
+				[this.$i18n2.baseText('timeAgo.oneMonthAgo'), this.$i18n2.baseText('timeAgo.inOneMonth')],
-				[this.$baseText('timeAgo.monthsAgo'), this.$baseText('timeAgo.inMonths')],
+				[this.$i18n2.baseText('timeAgo.monthsAgo'), this.$i18n2.baseText('timeAgo.inMonths')],
-				[this.$baseText('timeAgo.oneYearAgo'), this.$baseText('timeAgo.inOneYear')],
+				[this.$i18n2.baseText('timeAgo.oneYearAgo'), this.$i18n2.baseText('timeAgo.inOneYear')],
-				[this.$baseText('timeAgo.yearsAgo'), this.$baseText('timeAgo.inYears')],
+				[this.$i18n2.baseText('timeAgo.yearsAgo'), this.$i18n2.baseText('timeAgo.inYears')],
 			][index] as [string, string];
 		},
 	},

packages/editor-ui/src/components/UpdatesPanel.vue

@@ -6,17 +6,17 @@
 	>
 		<template slot="header">
 			<span :class="$style.title">
-				{{ $baseText('updatesPanel.weVeBeenBusy') }}
+				{{ $i18n2.baseText('updatesPanel.weVeBeenBusy') }}
 			</span>
 		</template>
 		<template slot="content">
 			<section :class="$style['description']">
 				<p v-if="currentVersion">
-					{{ $baseText(
+					{{ $i18n2.baseText(
 						'updatesPanel.youReOnVersion',
 						{ interpolate: { currentVersionName: currentVersion.name } }
 					) }}
-					<strong><TimeAgo :date="currentVersion.createdAt" /></strong>{{ $baseText('updatesPanel.andIs') }} <strong>{{ $baseText(
+					<strong><TimeAgo :date="currentVersion.createdAt" /></strong>{{ $i18n2.baseText('updatesPanel.andIs') }} <strong>{{ $i18n2.baseText(
 							'updatesPanel.version',
 							{
 								interpolate: {
@@ -24,7 +24,7 @@
 									howManySuffix: nextVersions.length > 1 ? "s" : "",
 								}
 							}
-					)}}</strong> {{ $baseText('updatesPanel.behindTheLatest') }}
+					)}}</strong> {{ $i18n2.baseText('updatesPanel.behindTheLatest') }}
 				</p>
 
 				<a
@@ -35,7 +35,7 @@
 				>
 					<font-awesome-icon icon="info-circle"></font-awesome-icon>
 					<span>
-						{{ $baseText('updatesPanel.howToUpdateYourN8nVersion') }}
+						{{ $i18n2.baseText('updatesPanel.howToUpdateYourN8nVersion') }}
 					</span>
 				</a>
 

packages/editor-ui/src/components/VariableSelector.vue

@@ -1,7 +1,7 @@
 <template>
 	<div @keydown.stop class="variable-selector-wrapper">
 		<div class="input-wrapper">
-			<n8n-input :placeholder="$baseText('variableSelector.variableFilter')" v-model="variableFilter" ref="inputField" size="small" type="text"></n8n-input>
+			<n8n-input :placeholder="$i18n2.baseText('variableSelector.variableFilter')" v-model="variableFilter" ref="inputField" size="small" type="text"></n8n-input>
 		</div>
 
 		<div class="result-wrapper">
@@ -525,14 +525,14 @@ export default mixins(
 
 				currentNodeData.push(
 					{
-						name: this.$baseText('variableSelector.parameters'),
+						name: this.$i18n2.baseText('variableSelector.parameters'),
 						options: this.sortOptions(this.getNodeParameters(activeNode.name, initialPath, skipParameter, filterText) as IVariableSelectorOption[]),
 					},
 				);
 
 				returnData.push(
 					{
-						name: this.$baseText('variableSelector.currentNode'),
+						name: this.$i18n2.baseText('variableSelector.currentNode'),
 						options: this.sortOptions(currentNodeData),
 					},
 				);
@@ -557,7 +557,7 @@ export default mixins(
 
 					nodeOptions = [
 						{
-							name: this.$baseText('variableSelector.parameters'),
+							name: this.$i18n2.baseText('variableSelector.parameters'),
 							options: this.sortOptions(this.getNodeParameters(nodeName, `$node["${nodeName}"].parameter`, undefined, filterText)),
 						} as IVariableSelectorOption,
 					];
@@ -570,7 +570,7 @@ export default mixins(
 						if (tempOptions.length) {
 							nodeOptions = [
 								{
-									name: this.$baseText('variableSelector.context'),
+									name: this.$i18n2.baseText('variableSelector.context'),
 									options: this.sortOptions(tempOptions),
 								} as IVariableSelectorOption,
 							];
@@ -583,18 +583,18 @@ export default mixins(
 						if (tempOutputData) {
 							nodeOptions.push(
 								{
-									name: this.$baseText('variableSelector.outputData'),
+									name: this.$i18n2.baseText('variableSelector.outputData'),
 									options: this.sortOptions(tempOutputData),
 								} as IVariableSelectorOption,
 							);
 						}
 					}
 
-					const shortNodeType = this.$shortNodeType(node.type);
+					const shortNodeType = this.$i18n2.shortNodeType(node.type);
 
 					allNodesData.push(
 						{
-							name: this.$headerText({
+							name: this.$i18n2.headerText({
 								key: `headers.${shortNodeType}.displayName`,
 								fallback: nodeName,
 							}),
@@ -605,7 +605,7 @@ export default mixins(
 
 				returnData.push(
 					{
-						name: this.$baseText('variableSelector.nodes'),
+						name: this.$i18n2.baseText('variableSelector.nodes'),
 						options: this.sortOptions(allNodesData),
 					},
 				);

packages/editor-ui/src/components/VariableSelectorItem.vue

@@ -11,7 +11,7 @@
 
 					<el-dropdown trigger="click" @click.stop @command="optionSelected($event, item)" v-if="allowParentSelect === true">
 						<span class="el-dropdown-link clickable" @click.stop>
-							<font-awesome-icon icon="dot-circle" :title="$baseText('variableSelectorItem.selectItem')" />
+							<font-awesome-icon icon="dot-circle" :title="$i18n2.baseText('variableSelectorItem.selectItem')" />
 						</span>
 						<el-dropdown-menu slot="dropdown">
 							<el-dropdown-item :command="operation.command" v-for="operation in itemAddOperations" :key="operation.command">{{operation.displayName}}</el-dropdown-item>
@@ -29,7 +29,7 @@
 				{{item.name}}:
 				<font-awesome-icon icon="dot-circle" title="Select Item" />
 			</div>
-			<div class="item-value">{{ item.value !== undefined?item.value: $baseText('variableSelectorItem.empty') }}</div>
+			<div class="item-value">{{ item.value !== undefined?item.value: $i18n2.baseText('variableSelectorItem.empty') }}</div>
 		</div>
 	</div>
 </template>

packages/editor-ui/src/components/VersionCard.vue

@@ -4,26 +4,26 @@
 		<div :class="$style.header">
 			<div>
 				<div :class="$style.name">
-					{{ `${$baseText('versionCard.version')} ${version.name}` }}
+					{{ `${$i18n2.baseText('versionCard.version')} ${version.name}` }}
 				</div>
 				<WarningTooltip v-if="version.hasSecurityIssue">
 					<template>
-						{{ $baseText('versionCard.thisVersionHasASecurityIssue') }}
+						{{ $i18n2.baseText('versionCard.thisVersionHasASecurityIssue') }}
 					</template>
 				</WarningTooltip>
 				<Badge
 					v-if="version.hasSecurityFix"
-					:text="$baseText('versionCard.securityUpdate')"
+					:text="$i18n2.baseText('versionCard.securityUpdate')"
 					type="danger"
 				/>
 				<Badge
 					v-if="version.hasBreakingChange"
-					:text="$baseText('versionCard.breakingChanges')"
+					:text="$i18n2.baseText('versionCard.breakingChanges')"
 					type="warning"
 				/>
 			</div>
 			<div :class="$style['release-date']">
-				{{ $baseText('versionCard.released') }}&nbsp;<TimeAgo :date="version.createdAt" />
+				{{ $i18n2.baseText('versionCard.released') }}&nbsp;<TimeAgo :date="version.createdAt" />
 			</div>
 		</div>
 		<div :class="$style.divider" v-if="version.description || (version.nodes && version.nodes.length)"></div>
@@ -62,7 +62,7 @@ export default mixins(renderText).extend({
 	props: ['version'],
 	// @ts-ignore
 	nodeName (node: IVersionNode): string {
-		return node !== null ? node.displayName : this.$baseText('versionCard.unknown');
+		return node !== null ? node.displayName : this.$i18n2.baseText('versionCard.unknown');
 	},
 });
 </script>

packages/editor-ui/src/components/WorkflowActivator.vue

@@ -5,7 +5,7 @@
 			element-loading-spinner="el-icon-loading"
 			:value="workflowActive"
 			@change="activeChanged"
-			:title="workflowActive ? $baseText('workflowActivator.deactivateWorkflow') : $baseText('workflowActivator.activateWorkflow')"
+			:title="workflowActive ? $i18n2.baseText('workflowActivator.deactivateWorkflow') : $i18n2.baseText('workflowActivator.activateWorkflow')"
 			:disabled="disabled || loading"
 			:active-color="getActiveColor"
 			inactive-color="#8899AA">
@@ -13,7 +13,7 @@
 
 		<div class="could-not-be-started" v-if="couldNotBeStarted">
 			<n8n-tooltip placement="top">
-				<div @click="displayActivationError" slot="content">{{ $baseText('workflowActivator.theWorkflowIsSetToBeActiveBut') }}</div>
+				<div @click="displayActivationError" slot="content">{{ $i18n2.baseText('workflowActivator.theWorkflowIsSetToBeActiveBut') }}</div>
 				<font-awesome-icon @click="displayActivationError" icon="exclamation-triangle" />
 			</n8n-tooltip>
 		</div>
@@ -79,8 +79,8 @@ export default mixins(
 				async activeChanged (newActiveState: boolean) {
 					if (this.workflowId === undefined) {
 						this.$showMessage({
-							title: this.$baseText('workflowActivator.showMessage.activeChangedWorkflowIdUndefined.title'),
+							title: this.$i18n2.baseText('workflowActivator.showMessage.activeChangedWorkflowIdUndefined.title'),
-							message: this.$baseText('workflowActivator.showMessage.activeChangedWorkflowIdUndefined.message'),
+							message: this.$i18n2.baseText('workflowActivator.showMessage.activeChangedWorkflowIdUndefined.message'),
 							type: 'error',
 						});
 						return;
@@ -88,8 +88,8 @@ export default mixins(
 
 					if (this.nodesIssuesExist === true) {
 						this.$showMessage({
-							title: this.$baseText('workflowActivator.showMessage.activeChangedNodesIssuesExistTrue.title'),
+							title: this.$i18n2.baseText('workflowActivator.showMessage.activeChangedNodesIssuesExistTrue.title'),
-							message: this.$baseText('workflowActivator.showMessage.activeChangedNodesIssuesExistTrue.message'),
+							message: this.$i18n2.baseText('workflowActivator.showMessage.activeChangedNodesIssuesExistTrue.message'),
 							type: 'error',
 						});
 						return;
@@ -106,11 +106,11 @@ export default mixins(
 						// than the one they can currently see.
 						if (this.dirtyState) {
 							const importConfirm = await this.confirmMessage(
-								this.$baseText('workflowActivator.confirmMessage.message'),
+								this.$i18n2.baseText('workflowActivator.confirmMessage.message'),
-								this.$baseText('workflowActivator.confirmMessage.headline'),
+								this.$i18n2.baseText('workflowActivator.confirmMessage.headline'),
 								'warning',
-								this.$baseText('workflowActivator.confirmMessage.confirmButtonText'),
+								this.$i18n2.baseText('workflowActivator.confirmMessage.confirmButtonText'),
-								this.$baseText('workflowActivator.confirmMessage.cancelButtonText'),
+								this.$i18n2.baseText('workflowActivator.confirmMessage.cancelButtonText'),
 							);
 							if (importConfirm === false) {
 								return;
@@ -131,8 +131,8 @@ export default mixins(
 						const newStateName = newActiveState === true ? 'activated' : 'deactivated';
 						this.$showError(
 							error,
-							this.$baseText('workflowActivator.showError.title'),
+							this.$i18n2.baseText('workflowActivator.showError.title'),
-							this.$baseText(
+							this.$i18n2.baseText(
 								'workflowActivator.showError.message',
 								{ interpolate: { newStateName } },
 							) + ':',
@@ -168,19 +168,19 @@ export default mixins(
 						const errorData = await this.restApi().getActivationError(this.workflowId);
 
 						if (errorData === undefined) {
-							errorMessage = this.$baseText('workflowActivator.showMessage.displayActivationError.message.errorDataUndefined');
+							errorMessage = this.$i18n2.baseText('workflowActivator.showMessage.displayActivationError.message.errorDataUndefined');
 						} else {
-							errorMessage = this.$baseText(
+							errorMessage = this.$i18n2.baseText(
 								'workflowActivator.showMessage.displayActivationError.message.errorDataNotUndefined',
 								{ interpolate: { message: errorData.error.message } },
 							);
 						}
 					} catch (error) {
-						errorMessage = this.$baseText('workflowActivator.showMessage.displayActivationError.message.catchBlock');
+						errorMessage = this.$i18n2.baseText('workflowActivator.showMessage.displayActivationError.message.catchBlock');
 					}
 
 					this.$showMessage({
-						title: this.$baseText('workflowActivator.showMessage.displayActivationError.title'),
+						title: this.$i18n2.baseText('workflowActivator.showMessage.displayActivationError.title'),
 						message: errorMessage,
 						type: 'warning',
 						duration: 0,

packages/editor-ui/src/components/WorkflowOpen.vue

@@ -8,11 +8,11 @@
 			<template v-slot:header>
 				<div class="workflows-header">
 					<n8n-heading tag="h1" size="xlarge" class="title">
-						{{ $baseText('workflowOpen.openWorkflow') }}
+						{{ $i18n2.baseText('workflowOpen.openWorkflow') }}
 					</n8n-heading>
 					<div class="tags-filter">
 						<TagsDropdown
-							:placeholder="$baseText('workflowOpen.openWorkflow')"
+							:placeholder="$i18n2.baseText('workflowOpen.openWorkflow')"
 							:currentTagIds="filterTagIds"
 							:createEnabled="false"
 							@update="updateTagsFilter"
@@ -21,7 +21,7 @@
 						/>
 					</div>
 					<div class="search-filter">
-						<n8n-input :placeholder="$baseText('workflowOpen.searchWorkflows')" ref="inputFieldFilter" v-model="filterText">
+						<n8n-input :placeholder="$i18n2.baseText('workflowOpen.searchWorkflows')" ref="inputFieldFilter" v-model="filterText">
 							<font-awesome-icon slot="prefix" icon="search"></font-awesome-icon>
 						</n8n-input>
 					</div>
@@ -30,7 +30,7 @@
 
 			<template v-slot:content>
 				<el-table class="search-table" :data="filteredWorkflows" stripe @cell-click="openWorkflow" :default-sort = "{prop: 'updatedAt', order: 'descending'}" v-loading="isDataLoading">
-					<el-table-column property="name" :label="$baseText('workflowOpen.name')" class-name="clickable" sortable>
+					<el-table-column property="name" :label="$i18n2.baseText('workflowOpen.name')" class-name="clickable" sortable>
 						<template slot-scope="scope">
 							<div :key="scope.row.id">
 								<span class="name">{{scope.row.name}}</span>
@@ -38,9 +38,9 @@
 							</div>
 						</template>
 					</el-table-column>
-					<el-table-column property="createdAt" :label="$baseText('workflowOpen.created')" class-name="clickable" width="155" sortable></el-table-column>
+					<el-table-column property="createdAt" :label="$i18n2.baseText('workflowOpen.created')" class-name="clickable" width="155" sortable></el-table-column>
-					<el-table-column property="updatedAt" :label="$baseText('workflowOpen.updated')" class-name="clickable" width="155" sortable></el-table-column>
+					<el-table-column property="updatedAt" :label="$i18n2.baseText('workflowOpen.updated')" class-name="clickable" width="155" sortable></el-table-column>
-					<el-table-column :label="$baseText('workflowOpen.active')" width="75">
+					<el-table-column :label="$i18n2.baseText('workflowOpen.active')" width="75">
 						<template slot-scope="scope">
 							<workflow-activator :workflow-active="scope.row.active" :workflow-id="scope.row.id" @workflowActiveChanged="workflowActiveChanged" />
 						</template>
@@ -150,8 +150,8 @@ export default mixins(
 
 				if (data.id === currentWorkflowId) {
 					this.$showMessage({
-						title: this.$baseText('workflowOpen.showMessage.title'),
+						title: this.$i18n2.baseText('workflowOpen.showMessage.title'),
-						message: this.$baseText('workflowOpen.showMessage.message'),
+						message: this.$i18n2.baseText('workflowOpen.showMessage.message'),
 						type: 'error',
 						duration: 1500,
 					});
@@ -162,11 +162,11 @@ export default mixins(
 				const result = this.$store.getters.getStateIsDirty;
 				if(result) {
 					const importConfirm = await this.confirmMessage(
-						this.$baseText('workflowOpen.confirmMessage.message'),
+						this.$i18n2.baseText('workflowOpen.confirmMessage.message'),
-						this.$baseText('workflowOpen.confirmMessage.headline'),
+						this.$i18n2.baseText('workflowOpen.confirmMessage.headline'),
 						'warning',
-						this.$baseText('workflowOpen.confirmMessage.confirmButtonText'),
+						this.$i18n2.baseText('workflowOpen.confirmMessage.confirmButtonText'),
-						this.$baseText('workflowOpen.confirmMessage.cancelButtonText'),
+						this.$i18n2.baseText('workflowOpen.confirmMessage.cancelButtonText'),
 					);
 					if (importConfirm === false) {
 						return;
@@ -206,8 +206,8 @@ export default mixins(
 					(error: Error) => {
 						this.$showError(
 							error,
-							this.$baseText('workflowOpen.showError.title'),
+							this.$i18n2.baseText('workflowOpen.showError.title'),
-							this.$baseText('workflowOpen.showError.message') + ':',
+							this.$i18n2.baseText('workflowOpen.showError.message') + ':',
 						);
 						this.isDataLoading = false;
 					},

packages/editor-ui/src/components/WorkflowSettings.vue

@@ -3,7 +3,7 @@
 		:name="WORKFLOW_SETTINGS_MODAL_KEY"
 		width="65%"
 		maxHeight="80%"
-		:title="$baseText('workflowSettings.settingsFor', { interpolate: { workflowName, workflowId } })"
+		:title="$i18n2.baseText('workflowSettings.settingsFor', { interpolate: { workflowName, workflowId } })"
 		:eventBus="modalBus"
 		:scrollable="true"
 	>
@@ -11,7 +11,7 @@
 			<div v-loading="isLoading" class="workflow-settings">
 				<el-row>
 					<el-col :span="10" class="setting-name">
-						{{ $baseText('workflowSettings.errorWorkflow') + ":" }}
+						{{ $i18n2.baseText('workflowSettings.errorWorkflow') + ":" }}
 						<n8n-tooltip class="setting-info" placement="top" >
 							<div slot="content" v-html="helpTexts.errorWorkflow"></div>
 							<font-awesome-icon icon="question-circle" />
@@ -30,7 +30,7 @@
 				</el-row>
 				<el-row>
 					<el-col :span="10" class="setting-name">
-						{{ $baseText('workflowSettings.timezone') + ":" }}
+						{{ $i18n2.baseText('workflowSettings.timezone') + ":" }}
 						<n8n-tooltip class="setting-info" placement="top" >
 							<div slot="content" v-html="helpTexts.timezone"></div>
 							<font-awesome-icon icon="question-circle" />
@@ -49,14 +49,14 @@
 				</el-row>
 				<el-row>
 					<el-col :span="10" class="setting-name">
-						{{ $baseText('workflowSettings.saveDataErrorExecution') + ":" }}
+						{{ $i18n2.baseText('workflowSettings.saveDataErrorExecution') + ":" }}
 						<n8n-tooltip class="setting-info" placement="top" >
 							<div slot="content" v-html="helpTexts.saveDataErrorExecution"></div>
 							<font-awesome-icon icon="question-circle" />
 						</n8n-tooltip>
 					</el-col>
 					<el-col :span="14" class="ignore-key-press">
-						<n8n-select v-model="workflowSettings.saveDataErrorExecution" :placeholder="$baseText('workflowSettings.selectOption')" size="medium" filterable :limit-popper-width="true">
+						<n8n-select v-model="workflowSettings.saveDataErrorExecution" :placeholder="$i18n2.baseText('workflowSettings.selectOption')" size="medium" filterable :limit-popper-width="true">
 							<n8n-option
 								v-for="option of saveDataErrorExecutionOptions"
 								:key="option.key"
@@ -68,14 +68,14 @@
 				</el-row>
 				<el-row>
 					<el-col :span="10" class="setting-name">
-						{{ $baseText('workflowSettings.saveDataSuccessExecution') + ":" }}
+						{{ $i18n2.baseText('workflowSettings.saveDataSuccessExecution') + ":" }}
 						<n8n-tooltip class="setting-info" placement="top" >
 							<div slot="content" v-html="helpTexts.saveDataSuccessExecution"></div>
 							<font-awesome-icon icon="question-circle" />
 						</n8n-tooltip>
 					</el-col>
 					<el-col :span="14" class="ignore-key-press">
-						<n8n-select v-model="workflowSettings.saveDataSuccessExecution" :placeholder="$baseText('workflowSettings.selectOption')" size="medium" filterable :limit-popper-width="true">
+						<n8n-select v-model="workflowSettings.saveDataSuccessExecution" :placeholder="$i18n2.baseText('workflowSettings.selectOption')" size="medium" filterable :limit-popper-width="true">
 							<n8n-option
 								v-for="option of saveDataSuccessExecutionOptions"
 								:key="option.key"
@@ -87,14 +87,14 @@
 				</el-row>
 				<el-row>
 					<el-col :span="10" class="setting-name">
-						{{ $baseText('workflowSettings.saveManualExecutions') + ":" }}
+						{{ $i18n2.baseText('workflowSettings.saveManualExecutions') + ":" }}
 						<n8n-tooltip class="setting-info" placement="top" >
 							<div slot="content" v-html="helpTexts.saveManualExecutions"></div>
 							<font-awesome-icon icon="question-circle" />
 						</n8n-tooltip>
 					</el-col>
 					<el-col :span="14" class="ignore-key-press">
-						<n8n-select v-model="workflowSettings.saveManualExecutions" :placeholder="$baseText('workflowSettings.selectOption')" size="medium" filterable :limit-popper-width="true">
+						<n8n-select v-model="workflowSettings.saveManualExecutions" :placeholder="$i18n2.baseText('workflowSettings.selectOption')" size="medium" filterable :limit-popper-width="true">
 							<n8n-option
 								v-for="option of saveManualOptions"
 								:key="option.key"
@@ -106,14 +106,14 @@
 				</el-row>
 				<el-row>
 					<el-col :span="10" class="setting-name">
-						{{ $baseText('workflowSettings.saveExecutionProgress') + ":" }}
+						{{ $i18n2.baseText('workflowSettings.saveExecutionProgress') + ":" }}
 						<n8n-tooltip class="setting-info" placement="top" >
 							<div slot="content" v-html="helpTexts.saveExecutionProgress"></div>
 							<font-awesome-icon icon="question-circle" />
 						</n8n-tooltip>
 					</el-col>
 					<el-col :span="14" class="ignore-key-press">
-						<n8n-select v-model="workflowSettings.saveExecutionProgress" :placeholder="$baseText('workflowSettings.selectOption')" size="medium" filterable :limit-popper-width="true">
+						<n8n-select v-model="workflowSettings.saveExecutionProgress" :placeholder="$i18n2.baseText('workflowSettings.selectOption')" size="medium" filterable :limit-popper-width="true">
 							<n8n-option
 								v-for="option of saveExecutionProgressOptions"
 								:key="option.key"
@@ -125,7 +125,7 @@
 				</el-row>
 				<el-row>
 					<el-col :span="10" class="setting-name">
-						{{ $baseText('workflowSettings.timeoutWorkflow') + ":" }}
+						{{ $i18n2.baseText('workflowSettings.timeoutWorkflow') + ":" }}
 						<n8n-tooltip class="setting-info" placement="top" >
 							<div slot="content" v-html="helpTexts.executionTimeoutToggle"></div>
 							<font-awesome-icon icon="question-circle" />
@@ -140,7 +140,7 @@
 				<div v-if="workflowSettings.executionTimeout > -1">
 					<el-row>
 						<el-col :span="10" class="setting-name">
-							{{ $baseText('workflowSettings.timeoutAfter') + ":" }}
+							{{ $i18n2.baseText('workflowSettings.timeoutAfter') + ":" }}
 							<n8n-tooltip class="setting-info" placement="top" >
 								<div slot="content" v-html="helpTexts.executionTimeout"></div>
 								<font-awesome-icon icon="question-circle" />
@@ -148,17 +148,17 @@
 						</el-col>
 						<el-col :span="4">
 							<n8n-input size="medium" :value="timeoutHMS.hours" @input="(value) => setTimeout('hours', value)" :min="0">
-								<template slot="append">{{ $baseText('workflowSettings.hours') }}</template>
+								<template slot="append">{{ $i18n2.baseText('workflowSettings.hours') }}</template>
 							</n8n-input>
 						</el-col>
 						<el-col :span="4" class="timeout-input">
 							<n8n-input size="medium" :value="timeoutHMS.minutes" @input="(value) => setTimeout('minutes', value)" :min="0" :max="60">
-								<template slot="append">{{ $baseText('workflowSettings.minutes') }}</template>
+								<template slot="append">{{ $i18n2.baseText('workflowSettings.minutes') }}</template>
 							</n8n-input>
 						</el-col>
 						<el-col :span="4" class="timeout-input">
 							<n8n-input size="medium" :value="timeoutHMS.seconds" @input="(value) => setTimeout('seconds', value)" :min="0" :max="60">
-								<template slot="append">{{ $baseText('workflowSettings.seconds') }}</template>
+								<template slot="append">{{ $i18n2.baseText('workflowSettings.seconds') }}</template>
 							</n8n-input>
 						</el-col>
 					</el-row>
@@ -207,14 +207,14 @@ export default mixins(
 		return {
 			isLoading: true,
 			helpTexts: {
-				errorWorkflow: this.$baseText('workflowSettings.helpTexts.errorWorkflow'),
+				errorWorkflow: this.$i18n2.baseText('workflowSettings.helpTexts.errorWorkflow'),
-				timezone: this.$baseText('workflowSettings.helpTexts.timezone'),
+				timezone: this.$i18n2.baseText('workflowSettings.helpTexts.timezone'),
-				saveDataErrorExecution: this.$baseText('workflowSettings.helpTexts.saveDataErrorExecution'),
+				saveDataErrorExecution: this.$i18n2.baseText('workflowSettings.helpTexts.saveDataErrorExecution'),
-				saveDataSuccessExecution: this.$baseText('workflowSettings.helpTexts.saveDataSuccessExecution'),
+				saveDataSuccessExecution: this.$i18n2.baseText('workflowSettings.helpTexts.saveDataSuccessExecution'),
-				saveExecutionProgress: this.$baseText('workflowSettings.helpTexts.saveExecutionProgress'),
+				saveExecutionProgress: this.$i18n2.baseText('workflowSettings.helpTexts.saveExecutionProgress'),
-				saveManualExecutions: this.$baseText('workflowSettings.helpTexts.saveManualExecutions'),
+				saveManualExecutions: this.$i18n2.baseText('workflowSettings.helpTexts.saveManualExecutions'),
-				executionTimeoutToggle: this.$baseText('workflowSettings.helpTexts.executionTimeoutToggle'),
+				executionTimeoutToggle: this.$i18n2.baseText('workflowSettings.helpTexts.executionTimeoutToggle'),
-				executionTimeout: this.$baseText('workflowSettings.helpTexts.executionTimeout'),
+				executionTimeout: this.$i18n2.baseText('workflowSettings.helpTexts.executionTimeout'),
 			},
 			defaultValues: {
 				timezone: 'America/New_York',
@@ -324,24 +324,24 @@ export default mixins(
 				this.saveDataErrorExecutionOptions, [
 					{
 						key: 'DEFAULT',
-						value: this.$baseText(
+						value: this.$i18n2.baseText(
 							'workflowSettings.saveDataErrorExecutionOptions.defaultSave',
 							{
 								interpolate: {
 									defaultValue: this.defaultValues.saveDataErrorExecution === 'all'
-										? this.$baseText('workflowSettings.saveDataErrorExecutionOptions.save')
+										? this.$i18n2.baseText('workflowSettings.saveDataErrorExecutionOptions.save')
-										: this.$baseText('workflowSettings.saveDataErrorExecutionOptions.doNotsave'),
+										: this.$i18n2.baseText('workflowSettings.saveDataErrorExecutionOptions.doNotsave'),
 								},
 							},
 						),
 					},
 					{
 						key: 'all',
-						value: this.$baseText('workflowSettings.saveDataErrorExecutionOptions.save'),
+						value: this.$i18n2.baseText('workflowSettings.saveDataErrorExecutionOptions.save'),
 					},
 					{
 						key: 'none',
-						value: this.$baseText('workflowSettings.saveDataErrorExecutionOptions.doNotSave'),
+						value: this.$i18n2.baseText('workflowSettings.saveDataErrorExecutionOptions.doNotSave'),
 					},
 				],
 			);
@@ -352,24 +352,24 @@ export default mixins(
 				this.saveDataSuccessExecutionOptions, [
 					{
 						key: 'DEFAULT',
-						value: this.$baseText(
+						value: this.$i18n2.baseText(
 							'workflowSettings.saveDataSuccessExecutionOptions.defaultSave',
 							{
 								interpolate: {
 									defaultValue: this.defaultValues.saveDataSuccessExecution === 'all'
-										? this.$baseText('workflowSettings.saveDataSuccessExecutionOptions.save')
+										? this.$i18n2.baseText('workflowSettings.saveDataSuccessExecutionOptions.save')
-										: this.$baseText('workflowSettings.saveDataSuccessExecutionOptions.doNotSave'),
+										: this.$i18n2.baseText('workflowSettings.saveDataSuccessExecutionOptions.doNotSave'),
 								},
 							},
 						),
 					},
 					{
 						key: 'all',
-						value: this.$baseText('workflowSettings.saveDataSuccessExecutionOptions.save'),
+						value: this.$i18n2.baseText('workflowSettings.saveDataSuccessExecutionOptions.save'),
 					},
 					{
 						key: 'none',
-						value: this.$baseText('workflowSettings.saveDataSuccessExecutionOptions.doNotSave'),
+						value: this.$i18n2.baseText('workflowSettings.saveDataSuccessExecutionOptions.doNotSave'),
 					},
 				],
 			);
@@ -380,22 +380,22 @@ export default mixins(
 				this.saveExecutionProgressOptions, [
 					{
 						key: 'DEFAULT',
-						value: this.$baseText(
+						value: this.$i18n2.baseText(
 							'workflowSettings.saveExecutionProgressOptions.defaultSave',
 							{
 								interpolate: {
-									defaultValue: this.defaultValues.saveExecutionProgress ? this.$baseText('workflowSettings.saveExecutionProgressOptions.yes') : this.$baseText('workflowSettings.saveExecutionProgressOptions.no'),
+									defaultValue: this.defaultValues.saveExecutionProgress ? this.$i18n2.baseText('workflowSettings.saveExecutionProgressOptions.yes') : this.$i18n2.baseText('workflowSettings.saveExecutionProgressOptions.no'),
 								},
 							},
 						),
 					},
 					{
 						key: true,
-						value: this.$baseText('workflowSettings.saveExecutionProgressOptions.yes'),
+						value: this.$i18n2.baseText('workflowSettings.saveExecutionProgressOptions.yes'),
 					},
 					{
 						key: false,
-						value: this.$baseText('workflowSettings.saveExecutionProgressOptions.no'),
+						value: this.$i18n2.baseText('workflowSettings.saveExecutionProgressOptions.no'),
 					},
 				],
 			);
@@ -404,22 +404,22 @@ export default mixins(
 			this.saveManualOptions.length = 0;
 			this.saveManualOptions.push({
 				key: 'DEFAULT',
-				value: this.$baseText(
+				value: this.$i18n2.baseText(
 					'workflowSettings.saveManualOptions.defaultSave',
 					{
 						interpolate: {
-							defaultValue: this.defaultValues.saveManualExecutions ? this.$baseText('workflowSettings.saveManualOptions.yes') : this.$baseText('workflowSettings.saveManualOptions.no'),
+							defaultValue: this.defaultValues.saveManualExecutions ? this.$i18n2.baseText('workflowSettings.saveManualOptions.yes') : this.$i18n2.baseText('workflowSettings.saveManualOptions.no'),
 						},
 					},
 				),
 			});
 			this.saveManualOptions.push({
 				key: true,
-				value: this.$baseText('workflowSettings.saveManualOptions.yes'),
+				value: this.$i18n2.baseText('workflowSettings.saveManualOptions.yes'),
 			});
 			this.saveManualOptions.push({
 				key: false,
-				value: this.$baseText('workflowSettings.saveManualOptions.no'),
+				value: this.$i18n2.baseText('workflowSettings.saveManualOptions.no'),
 			});
 		},
 
@@ -433,12 +433,12 @@ export default mixins(
 
 			let defaultTimezoneValue = timezones[this.defaultValues.timezone] as string | undefined;
 			if (defaultTimezoneValue === undefined) {
-				defaultTimezoneValue = this.$baseText('workflowSettings.defaultTimezoneNotValid');
+				defaultTimezoneValue = this.$i18n2.baseText('workflowSettings.defaultTimezoneNotValid');
 			}
 
 			this.timezones.push({
 				key: 'DEFAULT',
-				value: this.$baseText(
+				value: this.$i18n2.baseText(
 					'workflowSettings.defaultTimezone',
 					{ interpolate: { defaultTimezoneValue } },
 				),
@@ -465,7 +465,7 @@ export default mixins(
 			// @ts-ignore
 			workflows.unshift({
 				id: undefined as unknown as string,
-				name: this.$baseText('workflowSettings.noWorkflow'),
+				name: this.$i18n2.baseText('workflowSettings.noWorkflow'),
 			});
 
 			Vue.set(this, 'workflows', workflows);
@@ -485,9 +485,9 @@ export default mixins(
 
 			if (data.settings!.executionTimeout === 0) {
 				this.$showError(
-					new Error(this.$baseText('workflowSettings.showError.saveSettings1.errorMessage')),
+					new Error(this.$i18n2.baseText('workflowSettings.showError.saveSettings1.errorMessage')),
-					this.$baseText('workflowSettings.showError.saveSettings1.title'),
+					this.$i18n2.baseText('workflowSettings.showError.saveSettings1.title'),
-					this.$baseText('workflowSettings.showError.saveSettings1.message') + ':',
+					this.$i18n2.baseText('workflowSettings.showError.saveSettings1.message') + ':',
 				);
 				return;
 			}
@@ -497,7 +497,7 @@ export default mixins(
 				const { hours, minutes, seconds } = this.convertToHMS(this.workflowSettings.maxExecutionTimeout as number);
 				this.$showError(
 					new Error(
-						this.$baseText(
+						this.$i18n2.baseText(
 							'workflowSettings.showError.saveSettings2.errorMessage',
 							{
 								interpolate: {
@@ -508,8 +508,8 @@ export default mixins(
 							},
 						),
 					),
-					this.$baseText('workflowSettings.showError.saveSettings2.title'),
+					this.$i18n2.baseText('workflowSettings.showError.saveSettings2.title'),
-					this.$baseText('workflowSettings.showError.saveSettings2.message') + ':',
+					this.$i18n2.baseText('workflowSettings.showError.saveSettings2.message') + ':',
 				);
 				return;
 			}
@@ -522,8 +522,8 @@ export default mixins(
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('workflowSettings.showError.saveSettings3.title'),
+					this.$i18n2.baseText('workflowSettings.showError.saveSettings3.title'),
-					this.$baseText('workflowSettings.showError.saveSettings3.message') + ':',
+					this.$i18n2.baseText('workflowSettings.showError.saveSettings3.message') + ':',
 				);
 				this.isLoading = false;
 				return;
@@ -544,8 +544,8 @@ export default mixins(
 			this.isLoading = false;
 
 			this.$showMessage({
-				title: this.$baseText('workflowSettings.showMessage.saveSettings.title'),
+				title: this.$i18n2.baseText('workflowSettings.showMessage.saveSettings.title'),
-				message: this.$baseText('workflowSettings.showMessage.saveSettings.message'),
+				message: this.$i18n2.baseText('workflowSettings.showMessage.saveSettings.message'),
 				type: 'success',
 			});
 

packages/editor-ui/src/components/mixins/genericHelpers.ts

@@ -23,23 +23,23 @@ export const genericHelpers = mixins(showMessage, renderText).extend({
 		displayTimer (msPassed: number, showMs = false): string {
 			if (msPassed < 60000) {
 				if (showMs === false) {
-					return `${this.$n(Math.floor(msPassed / 1000), 'decimal')} ${this.$baseText('genericHelpers.sec')}`;
+					return `${this.$n(Math.floor(msPassed / 1000), 'decimal')} ${this.$i18n2.baseText('genericHelpers.sec')}`;
 				}
 
-				return `${this.$n(msPassed / 1000, 'decimal')} ${this.$baseText('genericHelpers.sec')}`;
+				return `${this.$i18n2.number(msPassed / 1000, 'decimal')} ${this.$i18n2.baseText('genericHelpers.sec')}`;
 			}
 
 			const secondsPassed = Math.floor(msPassed / 1000);
 			const minutesPassed = Math.floor(secondsPassed / 60);
 
-			return `${this.$n(minutesPassed, 'decimal')}:${this.$n(secondsPassed, 'decimal')} ${this.$baseText('genericHelpers.min')}`;
+			return `${this.$i18n2.number(minutesPassed, 'decimal')}:${this.$i18n2.number(secondsPassed, 'decimal')} ${this.$i18n2.baseText('genericHelpers.min')}`;
 		},
 		editAllowedCheck (): boolean {
 			if (this.isReadOnly) {
 				this.$showMessage({
 					// title: 'Workflow can not be changed!',
-					title: this.$baseText('genericHelpers.showMessage.title'),
+					title: this.$i18n2.baseText('genericHelpers.showMessage.title'),
-					message: this.$baseText('genericHelpers.showMessage.message'),
+					message: this.$i18n2.baseText('genericHelpers.showMessage.message'),
 					type: 'error',
 					duration: 0,
 				});
@@ -58,7 +58,7 @@ export const genericHelpers = mixins(showMessage, renderText).extend({
 			this.loadingService = this.$loading(
 				{
 					lock: true,
-					text: text || this.$baseText('genericHelpers.loading'),
+					text: text || this.$i18n2.baseText('genericHelpers.loading'),
 					spinner: 'el-icon-loading',
 					background: 'rgba(255, 255, 255, 0.8)',
 				},

packages/editor-ui/src/components/mixins/nodeBase.ts

@@ -181,7 +181,7 @@ export const nodeBase = mixins(
 							hover: false,
 							showOutputLabel: nodeTypeData.outputs.length === 1,
 							size: nodeTypeData.outputs.length >= 3 ? 'small' : 'medium',
-							hoverMessage: this.$baseText('nodeBase.clickToAddNodeOrDragToConnect'),
+							hoverMessage: this.$i18n2.baseText('nodeBase.clickToAddNodeOrDragToConnect'),
 						},
 						endpointHoverStyle: {
 							fill: getStyleTokenValue('--color-primary'),

packages/editor-ui/src/components/mixins/pushConnection.ts

@@ -263,8 +263,8 @@ export const pushConnection = mixins(
 						// Workflow did execute without a problem
 						this.$titleSet(workflow.name as string, 'IDLE');
 						this.$showMessage({
-							title: this.$baseText('pushConnection.showMessage.title'),
+							title: this.$i18n2.baseText('pushConnection.showMessage.title'),
-							message: this.$baseText('pushConnection.showMessage.message'),
+							message: this.$i18n2.baseText('pushConnection.showMessage.message'),
 							type: 'success',
 						});
 					}

packages/editor-ui/src/components/mixins/renderText.ts

@@ -28,9 +28,9 @@ export const renderText = Vue.extend({
 		},
 
 		/**
-		 * Render a string of dynamic text, i.e. a string with a constructed path to the localized value in the node text object - in the credentials modal (`$credText`), in the node view (`$nodeText`), or in the headers (`$headerText`) in the nodes panel and node view. _Private method_, to be called only from within this mixin.
+		 * Render a string of dynamic text, i.e. a string with a constructed path to the localized value in the node text object - in the credentials modal (`$i18n2.credText`), in the node view (`$i18n2.nodeText`), or in the headers (`$i18n2.headerText`) in the nodes panel and node view. _Private method_, to be called only from within this mixin.
 		 *
-		 * Unlike in `$baseText`, the fallback has to be set manually for dynamic text.
+		 * Unlike in `$i18n2.baseText`, the fallback has to be set manually for dynamic text.
 		 */
 		__render(
 			{ key, fallback }: { key: string; fallback: string; },

packages/editor-ui/src/components/mixins/showMessage.ts

@@ -135,8 +135,8 @@ export const showMessage = mixins(externalHooks, renderText).extend({
 		async confirmMessage (message: string, headline: string, type: MessageType | null = 'warning', confirmButtonText?: string, cancelButtonText?: string): Promise<boolean> {
 			try {
 				const options: ElMessageBoxOptions  = {
-					confirmButtonText: confirmButtonText || this.$baseText('showMessage.ok'),
+					confirmButtonText: confirmButtonText || this.$i18n2.baseText('showMessage.ok'),
-					cancelButtonText: cancelButtonText || this.$baseText('showMessage.cancel'),
+					cancelButtonText: cancelButtonText || this.$i18n2.baseText('showMessage.cancel'),
 					dangerouslyUseHTMLString: true,
 					...(type && { type }),
 				};
@@ -174,7 +174,7 @@ export const showMessage = mixins(externalHooks, renderText).extend({
 					<summary
 						style="color: #ff6d5a; font-weight: bold; cursor: pointer;"
 					>
-						${this.$baseText('showMessage.showDetails')}
+						${this.$i18n2.baseText('showMessage.showDetails')}
 					</summary>
 					<p>${node.name}: ${errorDescription}</p>
 				</details>

packages/editor-ui/src/components/mixins/workflowHelpers.ts

@@ -480,8 +480,8 @@ export const workflowHelpers = mixins(
 					this.$store.commit('removeActiveAction', 'workflowSaving');
 
 					this.$showMessage({
-						title: this.$baseText('workflowHelpers.showMessage.title'),
+						title: this.$i18n2.baseText('workflowHelpers.showMessage.title'),
-						message: this.$baseText('workflowHelpers.showMessage.message') + `: "${e.message}"`,
+						message: this.$i18n2.baseText('workflowHelpers.showMessage.message') + `: "${e.message}"`,
 						type: 'error',
 					});
 
@@ -554,8 +554,8 @@ export const workflowHelpers = mixins(
 					this.$store.commit('removeActiveAction', 'workflowSaving');
 
 					this.$showMessage({
-						title: this.$baseText('workflowHelpers.showMessage.title'),
+						title: this.$i18n2.baseText('workflowHelpers.showMessage.title'),
-						message: this.$baseText('workflowHelpers.showMessage.message') + `: "${e.message}"`,
+						message: this.$i18n2.baseText('workflowHelpers.showMessage.message') + `: "${e.message}"`,
 						type: 'error',
 					});
 

packages/editor-ui/src/components/mixins/workflowRun.ts

@@ -34,7 +34,7 @@ export const workflowRun = mixins(
 				// Do not start if the connection to server is not active
 				// because then it can not receive the data as it executes.
 				throw new Error(
-					this.$baseText('workflowRun.noActiveConnectionToTheServer'),
+					this.$i18n2.baseText('workflowRun.noActiveConnectionToTheServer'),
 				);
 			}
 
@@ -93,8 +93,8 @@ export const workflowRun = mixins(
 						}
 
 						this.$showMessage({
-							title: this.$baseText('workflowRun.showMessage.title'),
+							title: this.$i18n2.baseText('workflowRun.showMessage.title'),
-							message: this.$baseText('workflowRun.showMessage.message') + ':<br />&nbsp;&nbsp;- ' + errorMessages.join('<br />&nbsp;&nbsp;- '),
+							message: this.$i18n2.baseText('workflowRun.showMessage.message') + ':<br />&nbsp;&nbsp;- ' + errorMessages.join('<br />&nbsp;&nbsp;- '),
 							type: 'error',
 							duration: 0,
 						});
@@ -206,8 +206,8 @@ export const workflowRun = mixins(
 				this.$titleSet(workflow.name as string, 'ERROR');
 				this.$showError(
 					error,
-					this.$baseText('workflowRun.showError.title'),
+					this.$i18n2.baseText('workflowRun.showError.title'),
-					this.$baseText('workflowRun.showError.message') + ':',
+					this.$i18n2.baseText('workflowRun.showError.message') + ':',
 				);
 				return undefined;
 			}

packages/editor-ui/src/i18n/locales/de.json

@@ -80,6 +80,8 @@
 			"couldNotFindCredentialOfType": "🇩🇪 Could not find credential of type",
 			"couldNotFindCredentialWithId": "🇩🇪 Could not find credential with ID",
 			"details": "🇩🇪 Details",
+			"delete": "🇩🇪 Delete",
+			"saving": "🇩🇪 Saving",
 			"showError": {
 				"createCredential": {
 					"message": "",
@@ -105,7 +107,8 @@
 			"showMessage": {
 				"message": "🇩🇪 The credential {savedCredentialName} was deleted!",
 				"title": "🇩🇪 Credential deleted"
-			}
+			},
+			"testing": "🇩🇪 Testing"
 		},
 		"credentialInfo": {
 			"allowUseBy": "🇩🇪 Allow use by",
@@ -555,6 +558,7 @@
 			"rename": "🇩🇪 Rename",
 			"renameNode": "🇩🇪 Rename Node"
 		},
+		"redirecting": "🇩🇪 Redirecting",
 		"refresh": "🇩🇪 Refresh",
 		"resetZoom": "🇩🇪 Reset Zoom",
 		"runButtonText": {

packages/editor-ui/src/i18n/locales/en.json

@@ -64,6 +64,8 @@
 			"couldNotFindCredentialOfType": "Could not find credential of type",
 			"couldNotFindCredentialWithId": "Could not find credential with ID",
 			"details": "Details",
+			"delete": "Delete",
+			"saving": "Saving",
 			"showError": {
 				"createCredential": {
 					"message": "",
@@ -89,7 +91,8 @@
 			"showMessage": {
 				"message": "The credential {savedCredentialName} was deleted!",
 				"title": "Credential deleted"
-			}
+			},
+			"testing": "Testing"
 		},
 		"credentialInfo": {
 			"allowUseBy": "Allow use by",
@@ -539,6 +542,7 @@
 			"rename": "Rename",
 			"renameNode": "Rename Node"
 		},
+		"redirecting": "Redirecting",
 		"refresh": "Refresh",
 		"resetZoom": "Reset Zoom",
 		"runButtonText": {

packages/editor-ui/src/main.ts

@@ -19,7 +19,7 @@ import router from './router';
 import { runExternalHook } from './components/mixins/externalHooks';
 import { TelemetryPlugin } from './plugins/telemetry';
 import { I18nPlugin } from './plugins/i18n';
-import { i18n } from './i18n';
+// import { i18n } from './i18n'; // legacy i18n
 
 import { store } from './store';
 
@@ -29,12 +29,12 @@ router.afterEach((to, from) => {
 });
 
 Vue.use(TelemetryPlugin);
-Vue.use(I18nPlugin);
+Vue.use((vue) => I18nPlugin(vue, store));
 
 new Vue({
 	router,
 	store,
-	i18n, // legacy i18n
+	// i18n, // legacy i18n
 	render: h => h(App),
 }).$mount('#app');
 

packages/editor-ui/src/plugins/i18n/index.ts

@@ -2,34 +2,30 @@ import _Vue from "vue";
 import { IRootState } from '@/Interface';
 import VueI18n from 'vue-i18n';
 import { i18n as i18nLib } from '../../i18n';
+import { Store } from "vuex";
 
 const REUSABLE_DYNAMIC_TEXT_KEY = 'reusableDynamicText';
 const CREDENTIALS_MODAL_KEY = 'credentialsModal';
 const NODE_VIEW_KEY = 'nodeView';
 
-// this.$i18n.baseText('key1.key1', { interpolate: { keyName: '...' } });
+export function I18nPlugin(vue: typeof _Vue, store: Store<IRootState>): void {
-// this.$i18n.nodeText.placeholder('...');
-// this.$i18n.credText.placeholder('...');
-// this.$i18n.headerText.placeholder({ key: '...', fallback: '...' });
-
-export function I18nPlugin(vue: typeof _Vue, store: IRootState): void {
 	const i18n = new I18nClass(store);
 
-	if (!vue.prototype.hasOwnProperty('$i18n2')) { // TODO: Rename to `$i18n` after removing legacy i18n property
+	if (!vue.prototype.hasOwnProperty('$i18n2')) {
-		Object.defineProperty(vue, '$i18n2', { // TODO: Rename to `$i18n` after removing legacy i18n property
+		Object.defineProperty(vue, '$i18n2', {
 			get() { return i18n; },
 		});
 
-		Object.defineProperty(vue.prototype, '$i18n2', { // TODO: Rename to `$i18n` after removing legacy i18n property
+		Object.defineProperty(vue.prototype, '$i18n2', {
 			get() { return i18n; },
 		});
 	}
 }
 
 export class I18nClass {
-	$store: IRootState;
+	$store: Store<IRootState>;
 
-	constructor(store: IRootState) {
+	constructor(store: Store<IRootState>) {
 		this.$store = store;
 	}
 
@@ -38,17 +34,27 @@ export class I18nClass {
 	}
 
 	/**
-	 * Render a string of dynamic text, i.e. a string with a constructed path to the localized value in the node text object - in the credentials modal (`$credText`), in the node view (`$nodeText`), or in the headers (`$headerText`) in the nodes panel and node view. _Private method_, to be called only from within this mixin.
+	 * Render a string of dynamic text, i.e. a string with a constructed path to the localized value in the node text object, in the credentials modal, in the node view, or in the headers. Unlike in `baseText`, the fallback has to be set manually for dynamic text.
-	 *
-	 * Unlike in `$baseText`, the fallback has to be set manually for dynamic text.
 	 */
-	private __render(
+	private dynamicRender(
 		{ key, fallback }: { key: string; fallback: string; },
 	) {
 		return this.i18n.te(key) ? this.i18n.t(key).toString() : fallback;
 	}
 
-	$shortNodeType(longNodeType: string) {
+	// ----------------------------------
+	//        template helpers
+	// ----------------------------------
+
+	exists(key: string) {
+		return this.i18n.te(key);
+	}
+
+	number(value: number, options: VueI18n.FormattedNumberPartType) {
+		return this.i18n.n(value, options);
+	}
+
+	shortNodeType(longNodeType: string) {
 		return longNodeType.replace('n8n-nodes-base.', '');
 	}
 
@@ -65,11 +71,11 @@ export class I18nClass {
 	 * Render a string of dynamic header text, used in the nodes panel and in the node view.
 	 */
 	headerText(arg: { key: string; fallback: string; }) {
-		return this.__render(arg);
+		return this.dynamicRender(arg);
 	}
 
 	credText () {
-		const keys = this.$store.credentialTextRenderKeys;
+		const { credentialTextRenderKeys: keys } = this.$store.getters;
 		const nodeType = keys ? keys.nodeType : '';
 		const credentialType = keys ? keys.credentialType : '';
 		const credentialPrefix = `${nodeType}.${CREDENTIALS_MODAL_KEY}.${credentialType}`;
@@ -84,13 +90,13 @@ export class I18nClass {
 				{ name: parameterName, displayName }: { name: string; displayName: string; },
 			) {
 				if (['clientId', 'clientSecret'].includes(parameterName)) {
-					return context.__render({
+					return context.dynamicRender({
 						key: `${REUSABLE_DYNAMIC_TEXT_KEY}.oauth2.${parameterName}`,
 						fallback: displayName,
 					});
 				}
 
-				return context.__render({
+				return context.dynamicRender({
 					key: `${credentialPrefix}.${parameterName}.displayName`,
 					fallback: displayName,
 				});
@@ -102,7 +108,7 @@ export class I18nClass {
 			topParameterDescription(
 				{ name: parameterName, description }: { name: string; description: string; },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${credentialPrefix}.${parameterName}.description`,
 					fallback: description,
 				});
@@ -115,7 +121,7 @@ export class I18nClass {
 				{ name: parameterName }: { name: string; },
 				{ value: optionName, name: displayName }: { value: string; name: string; },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${credentialPrefix}.${parameterName}.options.${optionName}.displayName`,
 					fallback: displayName,
 				});
@@ -128,7 +134,7 @@ export class I18nClass {
 				{ name: parameterName }: { name: string; },
 				{ value: optionName, description }: { value: string; description: string; },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${credentialPrefix}.${parameterName}.options.${optionName}.description`,
 					fallback: description,
 				});
@@ -142,7 +148,7 @@ export class I18nClass {
 			placeholder(
 				{ name: parameterName, displayName }: { name: string; displayName: string; },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${credentialPrefix}.${parameterName}.placeholder`,
 					fallback: displayName,
 				});
@@ -151,8 +157,7 @@ export class I18nClass {
 	}
 
 	nodeText () {
-		// @ts-ignore TODO
+		const type = this.$store.getters.activeNode.type;
-		const type = this.$store.activeNode.type;
 		const nodePrefix = `${type}.${NODE_VIEW_KEY}`;
 		const context = this;
 
@@ -163,7 +168,7 @@ export class I18nClass {
 			topParameterDisplayName(
 				{ name: parameterName, displayName }: { name: string; displayName: string; },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${nodePrefix}.${parameterName}.displayName`,
 					fallback: displayName,
 				});
@@ -175,7 +180,7 @@ export class I18nClass {
 			topParameterDescription(
 				{ name: parameterName, description }: { name: string; description: string; },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${nodePrefix}.${parameterName}.description`,
 					fallback: description,
 				});
@@ -188,7 +193,7 @@ export class I18nClass {
 				{ name: parameterName }: { name: string; },
 				{ name: optionName, displayName }: { name: string; displayName: string; },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${nodePrefix}.${parameterName}.options.${optionName}.displayName`,
 					fallback: displayName,
 				});
@@ -201,7 +206,7 @@ export class I18nClass {
 				{ name: parameterName }: { name: string; },
 				{ value: optionName, name: displayName }: { value: string; name: string; },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${nodePrefix}.${parameterName}.options.${optionName}.displayName`,
 					fallback: displayName,
 				});
@@ -214,7 +219,7 @@ export class I18nClass {
 				{ name: parameterName }: { name: string; },
 				{ value: optionName, description }: { value: string; description: string; },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${nodePrefix}.${parameterName}.options.${optionName}.description`,
 					fallback: description,
 				});
@@ -227,7 +232,7 @@ export class I18nClass {
 				{ name: parameterName, typeOptions: { multipleValueButtonText } }:
 				{ name: string; typeOptions: { multipleValueButtonText: string; } },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${nodePrefix}.${parameterName}.multipleValueButtonText`,
 					fallback: multipleValueButtonText,
 				});
@@ -241,12 +246,11 @@ export class I18nClass {
 			placeholder(
 				{ name: parameterName, placeholder }: { name: string; placeholder: string; },
 			) {
-				return context.__render({
+				return context.dynamicRender({
 					key: `${nodePrefix}.${parameterName}.placeholder`,
 					fallback: placeholder,
 				});
 			},
 		};
 	}
-
 }

packages/editor-ui/src/plugins/i18n/types.d.ts

@@ -0,0 +1,7 @@
+import { i18nClass } from '.';
+
+declare module 'vue/types/vue' {
+	interface Vue {
+		$i18n2: I18nClass;
+	}
+}

packages/editor-ui/src/plugins/telemetry/index.ts

@@ -34,7 +34,7 @@ interface IUserNodesPanelSession {
 }
 
 class Telemetry {
-	
+
 	private get telemetry() {
 		// @ts-ignore
 		return window.rudderanalytics;

packages/editor-ui/src/views/NodeView.vue

@@ -34,7 +34,7 @@
 			</div>
 		</div>
 		<DataDisplay @valueChanged="valueChanged"/>
-		<div v-if="!createNodeActive && !isReadOnly" class="node-creator-button" :title="$baseText('nodeView.addNode')" @click="() => openNodeCreator('add_node_button')">
+		<div v-if="!createNodeActive && !isReadOnly" class="node-creator-button" :title="$i18n2.baseText('nodeView.addNode')" @click="() => openNodeCreator('add_node_button')">
 			<n8n-icon-button size="xlarge" icon="plus" />
 		</div>
 		<node-creator
@@ -43,22 +43,22 @@
 			@closeNodeCreator="closeNodeCreator"
 			></node-creator>
 		<div :class="{ 'zoom-menu': true, expanded: !sidebarMenuCollapsed }">
-			<button @click="zoomToFit" class="button-white" :title="$baseText('nodeView.zoomToFit')">
+			<button @click="zoomToFit" class="button-white" :title="$i18n2.baseText('nodeView.zoomToFit')">
 				<font-awesome-icon icon="expand"/>
 			</button>
-			<button @click="zoomIn()" class="button-white" :title="$baseText('nodeView.zoomIn')">
+			<button @click="zoomIn()" class="button-white" :title="$i18n2.baseText('nodeView.zoomIn')">
 				<font-awesome-icon icon="search-plus"/>
 			</button>
-			<button @click="zoomOut()" class="button-white" :title="$baseText('nodeView.zoomOut')">
+			<button @click="zoomOut()" class="button-white" :title="$i18n2.baseText('nodeView.zoomOut')">
 				<font-awesome-icon icon="search-minus"/>
 			</button>
 			<button
 				v-if="nodeViewScale !== 1"
 				@click="resetZoom()"
 				class="button-white"
-				:title="$baseText('nodeView.resetZoom')"
+				:title="$i18n2.baseText('nodeView.resetZoom')"
 				>
-				<font-awesome-icon icon="undo" :title="$baseText('nodeView.resetZoom')"/>
+				<font-awesome-icon icon="undo" :title="$i18n2.baseText('nodeView.resetZoom')"/>
 			</button>
 		</div>
 		<div class="workflow-execute-wrapper" v-if="!isReadOnly">
@@ -68,7 +68,7 @@
 				:label="runButtonText"
 				size="large"
 				icon="play-circle"
-				:title="$baseText('nodeView.executesTheWorkflowFromTheStartOrWebhookNode')"
+				:title="$i18n2.baseText('nodeView.executesTheWorkflowFromTheStartOrWebhookNode')"
 				:type="workflowRunning ? 'light' : 'primary'"
 			/>
 
@@ -79,8 +79,8 @@
 				class="stop-execution"
 				type="light"
 				:title="stopExecutionInProgress
-					? $baseText('nodeView.stoppingCurrentExecution')
+					? $i18n2.baseText('nodeView.stoppingCurrentExecution')
-					: $baseText('nodeView.stopCurrentExecution')
+					: $i18n2.baseText('nodeView.stopCurrentExecution')
 				"
 				:loading="stopExecutionInProgress"
 				@click.stop="stopExecution()"
@@ -91,14 +91,14 @@
 				class="stop-execution"
 				icon="stop"
 				size="large"
-				:title="$baseText('nodeView.stopWaitingForWebhookCall')"
+				:title="$i18n2.baseText('nodeView.stopWaitingForWebhookCall')"
 				type="light"
 				@click.stop="stopWaitingForWebhook()"
 			/>
 
 			<n8n-icon-button
 				v-if="!isReadOnly && workflowExecution && !workflowRunning"
-				:title="$baseText('nodeView.deletesTheCurrentExecutionData')"
+				:title="$i18n2.baseText('nodeView.deletesTheCurrentExecutionData')"
 				icon="trash"
 				size="large"
 				@click.stop="clearExecutionData()"
@@ -245,11 +245,11 @@ export default mixins(
 			const result = this.$store.getters.getStateIsDirty;
 			if(result) {
 				const importConfirm = await this.confirmMessage(
-					this.$baseText('nodeView.confirmMessage.beforeRouteLeave.message'),
+					this.$i18n2.baseText('nodeView.confirmMessage.beforeRouteLeave.message'),
-					this.$baseText('nodeView.confirmMessage.beforeRouteLeave.headline'),
+					this.$i18n2.baseText('nodeView.confirmMessage.beforeRouteLeave.headline'),
 					'warning',
-					this.$baseText('nodeView.confirmMessage.beforeRouteLeave.confirmButtonText'),
+					this.$i18n2.baseText('nodeView.confirmMessage.beforeRouteLeave.confirmButtonText'),
-					this.$baseText('nodeView.confirmMessage.beforeRouteLeave.cancelButtonText'),
+					this.$i18n2.baseText('nodeView.confirmMessage.beforeRouteLeave.cancelButtonText'),
 				);
 				if (importConfirm === false) {
 					next(false);
@@ -287,14 +287,14 @@ export default mixins(
 			},
 			runButtonText (): string {
 				if (this.workflowRunning === false) {
-					return this.$baseText('nodeView.runButtonText.executeWorkflow');
+					return this.$i18n2.baseText('nodeView.runButtonText.executeWorkflow');
 				}
 
 				if (this.executionWaitingForWebhook === true) {
-					return this.$baseText('nodeView.runButtonText.waitingForTriggerEvent');
+					return this.$i18n2.baseText('nodeView.runButtonText.waitingForTriggerEvent');
 				}
 
-				return this.$baseText('nodeView.runButtonText.executingWorkflow');
+				return this.$i18n2.baseText('nodeView.runButtonText.executingWorkflow');
 			},
 			workflowStyle (): object {
 				const offsetPosition = this.$store.getters.getNodeViewOffsetPosition;
@@ -357,8 +357,8 @@ export default mixins(
 				this.updateNodesExecutionIssues();
 			},
 			translateName(type: string, originalName: string) {
-				return this.$headerText({
+				return this.$i18n2.headerText({
-					key: `headers.${this.$shortNodeType(type)}.displayName`,
+					key: `headers.${this.$i18n2.shortNodeType(type)}.displayName`,
 					fallback: originalName,
 				});
 			},
@@ -440,8 +440,8 @@ export default mixins(
 				} catch (error) {
 					this.$showError(
 						error,
-						this.$baseText('nodeView.showError.openExecution.title'),
+						this.$i18n2.baseText('nodeView.showError.openExecution.title'),
-						this.$baseText('nodeView.showError.openExecution.message') + ':',
+						this.$i18n2.baseText('nodeView.showError.openExecution.message') + ':',
 					);
 					return;
 				}
@@ -501,15 +501,15 @@ export default mixins(
 
 				if ((data as IExecutionsSummary).waitTill) {
 					this.$showMessage({
-						title: this.$baseText('nodeView.thisExecutionHasntFinishedYet'),
+						title: this.$i18n2.baseText('nodeView.thisExecutionHasntFinishedYet'),
-						message: `<a onclick="window.location.reload(false);">${this.$baseText('nodeView.refresh')}</a> ${this.$baseText('nodeView.toSeeTheLatestStatus')}.<br/> <a href="https://docs.n8n.io/nodes/n8n-nodes-base.wait/" target="_blank">${this.$baseText('nodeView.moreInfo')}</a>`,
+						message: `<a onclick="window.location.reload(false);">${this.$i18n2.baseText('nodeView.refresh')}</a> ${this.$i18n2.baseText('nodeView.toSeeTheLatestStatus')}.<br/> <a href="https://docs.n8n.io/nodes/n8n-nodes-base.wait/" target="_blank">${this.$i18n2.baseText('nodeView.moreInfo')}</a>`,
 						type: 'warning',
 						duration: 0,
 					});
 				}
 			},
 			async openWorkflowTemplate (templateId: string) {
-				this.setLoadingText(this.$baseText('nodeView.loadingTemplate'));
+				this.setLoadingText(this.$i18n2.baseText('nodeView.loadingTemplate'));
 				this.resetWorkspace();
 
 				let data: IWorkflowTemplate | undefined;
@@ -519,7 +519,7 @@ export default mixins(
 
 					if (!data) {
 						throw new Error(
-							this.$baseText(
+							this.$i18n2.baseText(
 								'nodeView.workflowTemplateWithIdCouldNotBeFound',
 								{ interpolate: { templateId } },
 							),
@@ -528,11 +528,11 @@ export default mixins(
 
 					data.workflow.nodes.forEach((node) => {
 						if (!this.$store.getters.nodeType(node.type)) {
-							throw new Error(`The ${this.$shortNodeType(node.type)} node is not supported`);
+							throw new Error(`The ${this.$i18n2.shortNodeType(node.type)} node is not supported`);
 						}
 					});
 				} catch (error) {
-					this.$showError(error, this.$baseText('nodeView.couldntImportWorkflow'));
+					this.$showError(error, this.$i18n2.baseText('nodeView.couldntImportWorkflow'));
 					this.$router.push({ name: 'NodeViewNew' });
 					return;
 				}
@@ -575,15 +575,15 @@ export default mixins(
 				} catch (error) {
 					this.$showError(
 						error,
-						this.$baseText('nodeView.showError.openWorkflow.title'),
+						this.$i18n2.baseText('nodeView.showError.openWorkflow.title'),
-						this.$baseText('nodeView.showError.openWorkflow.message') + ':',
+						this.$i18n2.baseText('nodeView.showError.openWorkflow.message') + ':',
 					);
 					return;
 				}
 
 				if (data === undefined) {
 					throw new Error(
-						this.$baseText(
+						this.$i18n2.baseText(
 							'nodeView.workflowWithIdCouldNotBeFound',
 							{ interpolate: { workflowId } },
 						),
@@ -744,8 +744,8 @@ export default mixins(
 					}
 
 					this.$showMessage({
-						title: this.$baseText('nodeView.showMessage.keyDown.title'),
+						title: this.$i18n2.baseText('nodeView.showMessage.keyDown.title'),
-						message: this.$baseText('nodeView.showMessage.keyDown.message'),
+						message: this.$i18n2.baseText('nodeView.showMessage.keyDown.message'),
 						type: 'success',
 					});
 				} else if ((e.key === 's') && (this.isCtrlKeyPressed(e) === true)) {
@@ -1035,8 +1035,8 @@ export default mixins(
 					this.stopExecutionInProgress = true;
 					await this.restApi().stopCurrentExecution(executionId);
 					this.$showMessage({
-						title: this.$baseText('nodeView.showMessage.stopExecutionTry.title'),
+						title: this.$i18n2.baseText('nodeView.showMessage.stopExecutionTry.title'),
-						message: this.$baseText(
+						message: this.$i18n2.baseText(
 							'nodeView.showMessage.stopExecutionTry.message',
 							{ interpolate: { executionId } },
 						),
@@ -1064,15 +1064,15 @@ export default mixins(
 						this.$store.commit('setWorkflowExecutionData', executedData);
 						this.$store.commit('removeActiveAction', 'workflowRunning');
 						this.$showMessage({
-							title: this.$baseText('nodeView.showMessage.stopExecutionCatch.title'),
+							title: this.$i18n2.baseText('nodeView.showMessage.stopExecutionCatch.title'),
-							message: this.$baseText('nodeView.showMessage.stopExecutionCatch.message'),
+							message: this.$i18n2.baseText('nodeView.showMessage.stopExecutionCatch.message'),
 							type: 'success',
 						});
 					} else {
 						this.$showError(
 							error,
-							this.$baseText('nodeView.showError.stopExecution.title'),
+							this.$i18n2.baseText('nodeView.showError.stopExecution.title'),
-							this.$baseText('nodeView.showError.stopExecution.message') + ':',
+							this.$i18n2.baseText('nodeView.showError.stopExecution.message') + ':',
 						);
 					}
 				}
@@ -1085,15 +1085,15 @@ export default mixins(
 				} catch (error) {
 					this.$showError(
 						error,
-						this.$baseText('nodeView.showError.stopWaitingForWebhook.title'),
+						this.$i18n2.baseText('nodeView.showError.stopWaitingForWebhook.title'),
-						this.$baseText('nodeView.showError.stopWaitingForWebhook.message') + ':',
+						this.$i18n2.baseText('nodeView.showError.stopWaitingForWebhook.message') + ':',
 					);
 					return;
 				}
 
 				this.$showMessage({
-					title: this.$baseText('nodeView.showMessage.stopWaitingForWebhook.title'),
+					title: this.$i18n2.baseText('nodeView.showMessage.stopWaitingForWebhook.title'),
-					message: this.$baseText('nodeView.showMessage.stopWaitingForWebhook.message'),
+					message: this.$i18n2.baseText('nodeView.showMessage.stopWaitingForWebhook.message'),
 					type: 'success',
 				});
 			},
@@ -1113,14 +1113,14 @@ export default mixins(
 					}
 
 					const importConfirm = await this.confirmMessage(
-						this.$baseText(
+						this.$i18n2.baseText(
 							'nodeView.confirmMessage.receivedCopyPasteData.message',
 							{ interpolate: { plainTextData } },
 						),
-						this.$baseText('nodeView.confirmMessage.receivedCopyPasteData.headline'),
+						this.$i18n2.baseText('nodeView.confirmMessage.receivedCopyPasteData.headline'),
 						'warning',
-						this.$baseText('nodeView.confirmMessage.receivedCopyPasteData.confirmButtonText'),
+						this.$i18n2.baseText('nodeView.confirmMessage.receivedCopyPasteData.confirmButtonText'),
-						this.$baseText('nodeView.confirmMessage.receivedCopyPasteData.cancelButtonText'),
+						this.$i18n2.baseText('nodeView.confirmMessage.receivedCopyPasteData.cancelButtonText'),
 					);
 
 					if (importConfirm === false) {
@@ -1165,8 +1165,8 @@ export default mixins(
 					this.stopLoading();
 					this.$showError(
 						error,
-						this.$baseText('nodeView.showError.getWorkflowDataFromUrl.title'),
+						this.$i18n2.baseText('nodeView.showError.getWorkflowDataFromUrl.title'),
-						this.$baseText('nodeView.showError.getWorkflowDataFromUrl.message') + ':',
+						this.$i18n2.baseText('nodeView.showError.getWorkflowDataFromUrl.message') + ':',
 					);
 					return;
 				}
@@ -1207,8 +1207,8 @@ export default mixins(
 				} catch (error) {
 					this.$showError(
 						error,
-						this.$baseText('nodeView.showError.importWorkflowData.title'),
+						this.$i18n2.baseText('nodeView.showError.importWorkflowData.title'),
-						this.$baseText('nodeView.showError.importWorkflowData.message') + ':',
+						this.$i18n2.baseText('nodeView.showError.importWorkflowData.message') + ':',
 					);
 				}
 			},
@@ -1251,8 +1251,8 @@ export default mixins(
 			showMaxNodeTypeError (nodeTypeData: INodeTypeDescription) {
 				const maxNodes = nodeTypeData.maxNodes;
 				this.$showMessage({
-					title: this.$baseText('nodeView.showMessage.showMaxNodeTypeError.title'),
+					title: this.$i18n2.baseText('nodeView.showMessage.showMaxNodeTypeError.title'),
-					message: this.$baseText(
+					message: this.$i18n2.baseText(
 						maxNodes === 1
 							? 'nodeView.showMessage.showMaxNodeTypeError.message.singular'
 							: 'nodeView.showMessage.showMaxNodeTypeError.message.plural',
@@ -1272,8 +1272,8 @@ export default mixins(
 
 				if (nodeTypeData === null) {
 					this.$showMessage({
-						title: this.$baseText('nodeView.showMessage.addNodeButton.title'),
+						title: this.$i18n2.baseText('nodeView.showMessage.addNodeButton.title'),
-						message: this.$baseText(
+						message: this.$i18n2.baseText(
 							'nodeView.showMessage.addNodeButton.message',
 							{ interpolate: { nodeTypeName } },
 						),
@@ -1793,11 +1793,11 @@ export default mixins(
 					const result = this.$store.getters.getStateIsDirty;
 					if(result) {
 						const importConfirm = await this.confirmMessage(
-							this.$baseText('nodeView.confirmMessage.initView.message'),
+							this.$i18n2.baseText('nodeView.confirmMessage.initView.message'),
-							this.$baseText('nodeView.confirmMessage.initView.headline'),
+							this.$i18n2.baseText('nodeView.confirmMessage.initView.headline'),
 							'warning',
-							this.$baseText('nodeView.confirmMessage.initView.confirmButtonText'),
+							this.$i18n2.baseText('nodeView.confirmMessage.initView.confirmButtonText'),
-							this.$baseText('nodeView.confirmMessage.initView.cancelButtonText'),
+							this.$i18n2.baseText('nodeView.confirmMessage.initView.cancelButtonText'),
 						);
 						if (importConfirm === false) {
 							return Promise.resolve();
@@ -1836,11 +1836,13 @@ export default mixins(
 
 				window.addEventListener("beforeunload",  (e) => {
 					if(this.$store.getters.getStateIsDirty === true) {
-						const confirmationMessage = this.$baseText('nodeView.itLooksLikeYouHaveBeenEditingSomething');
+						const confirmationMessage = this.$i18n2.baseText('nodeView.itLooksLikeYouHaveBeenEditingSomething');
 						(e || window.event).returnValue = confirmationMessage; //Gecko + IE
 						return confirmationMessage; //Gecko + Webkit, Safari, Chrome etc.
 					} else {
-						this.startLoading('Redirecting');
+						this.startLoading(
+							this.$i18n2.baseText('nodeView.redirecting'),
+						);
 
 						return;
 					}
@@ -2193,13 +2195,13 @@ export default mixins(
 			async renameNodePrompt (currentName: string) {
 				try {
 					const promptResponsePromise = this.$prompt(
-						this.$baseText('nodeView.prompt.newName') + ':',
+						this.$i18n2.baseText('nodeView.prompt.newName') + ':',
-						this.$baseText('nodeView.prompt.renameNode') + `: ${currentName}`,
+						this.$i18n2.baseText('nodeView.prompt.renameNode') + `: ${currentName}`,
 						{
 							customClass: 'rename-prompt',
-							confirmButtonText: this.$baseText('nodeView.prompt.rename'),
+							confirmButtonText: this.$i18n2.baseText('nodeView.prompt.rename'),
-							cancelButtonText: this.$baseText('nodeView.prompt.cancel'),
+							cancelButtonText: this.$i18n2.baseText('nodeView.prompt.cancel'),
-							inputErrorMessage: this.$baseText('nodeView.prompt.invalidName'),
+							inputErrorMessage: this.$i18n2.baseText('nodeView.prompt.invalidName'),
 							inputValue: currentName,
 						},
 					);
@@ -2337,7 +2339,7 @@ export default mixins(
 						try {
 							nodeParameters = NodeHelpers.getNodeParameters(nodeType.properties, node.parameters, true, false);
 						} catch (e) {
-							console.error(this.$baseText('nodeView.thereWasAProblemLoadingTheNodeParametersOfNode') + `: "${node.name}"`); // eslint-disable-line no-console
+							console.error(this.$i18n2.baseText('nodeView.thereWasAProblemLoadingTheNodeParametersOfNode') + `: "${node.name}"`); // eslint-disable-line no-console
 							console.error(e); // eslint-disable-line no-console
 						}
 						node.parameters = nodeParameters !== null ? nodeParameters : {};
@@ -2413,7 +2415,7 @@ export default mixins(
 				if (!data.nodes) {
 					// No nodes to add
 					throw new Error(
-						this.$baseText('nodeView.noNodesGivenToAdd'),
+						this.$i18n2.baseText('nodeView.noNodesGivenToAdd'),
 					);
 				}
 
@@ -2707,8 +2709,8 @@ export default mixins(
 			} catch (error) {
 				this.$showError(
 					error,
-					this.$baseText('nodeView.showError.mounted1.title'),
+					this.$i18n2.baseText('nodeView.showError.mounted1.title'),
-					this.$baseText('nodeView.showError.mounted1.message') + ':',
+					this.$i18n2.baseText('nodeView.showError.mounted1.message') + ':',
 				);
 				return;
 			}
@@ -2720,8 +2722,8 @@ export default mixins(
 				} catch (error) {
 					this.$showError(
 						error,
-						this.$baseText('nodeView.showError.mounted2.title'),
+						this.$i18n2.baseText('nodeView.showError.mounted2.title'),
-						this.$baseText('nodeView.showError.mounted2.message') + ':',
+						this.$i18n2.baseText('nodeView.showError.mounted2.message') + ':',
 					);
 				}
 				this.stopLoading();