n8n-io · mutdmour · Mar 11, 2022 · Mar 10, 2022 · Mar 10, 2022 · Mar 10, 2022
diff --git a/packages/design-system/src/components/N8nActionBox/ActionBox.vue b/packages/design-system/src/components/N8nActionBox/ActionBox.vue
@@ -1,7 +1,9 @@
 <template functional>
 	<div :class="$style.container">
-		<div :class="$style.description">
+		<div :class="$style.heading">
 			<component :is="$options.components.N8nHeading" size="xlarge" align="center">{{ props.heading }}</component>
+		</div>
+		<div :class="$style.description">
 			<n8n-text color="text-base"><span v-html="props.description"></span></n8n-text>
 		</div>
 		<component :is="$options.components.N8nButton" :label="props.buttonText" size="large"
@@ -54,12 +56,11 @@ export default {
 	font-size: 40px;
 }
 
-.description {
-	display: flex;
-	flex-direction: column;
+.heading {
+	margin-bottom: var(--spacing-l);
+}
 
-	> *:first-child {
-		margin-bottom: var(--spacing-xs);
-	}
+.description {
+	margin-bottom: var(--spacing-xl);
 }
 </style>
diff --git a/packages/design-system/src/components/N8nAvatar/Avatar.vue b/packages/design-system/src/components/N8nAvatar/Avatar.vue
@@ -84,6 +84,6 @@ export default {
 	font-size: var(--font-size-2xs);
 	font-weight: var(--font-weight-bold);
 	color: var(--color-text-xlight);
-	text-shadow: 0px 1px 6px rgba(25, 11, 9, 0.2);
+	text-shadow: 0px 1px 6px rgba(25, 11, 9, 0.3);
 }
 </style>
diff --git a/packages/design-system/src/components/N8nFormInput/FormInput.vue b/packages/design-system/src/components/N8nFormInput/FormInput.vue
@@ -10,6 +10,7 @@
 				@change="onInput"
 				@focus="onFocus"
 				@blur="onBlur"
+				ref="input"
 			>
 				<n8n-option
 					v-for="option in (options || [])"
@@ -28,6 +29,7 @@
 				@input="onInput"
 				@blur="onBlur"
 				@focus="onFocus"
+				ref="input"
 			/>
 		</div>
 		<div :class="$style.errors" v-if="showErrors">
@@ -130,9 +132,16 @@ export default mixins(Locale).extend({
 		autocomplete: {
 			type: String,
 		},
+		focusInitially: {
+			type: Boolean,
+		},
 	},
 	mounted() {
 		this.$emit('validate', !this.validationError);
+
+		if (this.focusInitially && this.$refs.input) {
+			this.$refs.input.focus();
+		}
 	},
 	computed: {
 		validationError(): string | null {

diff --git a/packages/design-system/theme/src/notification.scss b/packages/design-system/theme/src/notification.scss
@@ -38,13 +38,14 @@
 
 	@include mixins.e(content) {
 		font-size: var.$notification-content-font-size;
-		line-height: 21px;
+		line-height: 1.5;
 		margin: 6px 0 0 0;
 		color: var.$notification-content-color;
 		text-align: justify;
 
 		p {
 			margin: 0;
+			line-height: 1.5;
 		}
 	}
 

diff --git a/packages/editor-ui/src/Interface.ts b/packages/editor-ui/src/Interface.ts
@@ -944,6 +944,7 @@ export type IFormInput = {
 		options?: Array<{label: string; value: string}>;
 		autocomplete?: 'off' | 'new-password' | 'current-password' | 'given-name' | 'family-name' | 'email'; // https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
 		capitalize?: boolean;
+		focusInitially?: boolean;
 	};
 	shouldDisplay?: (values: {[key: string]: unknown}) => boolean;
 };

diff --git a/packages/editor-ui/src/components/ChangePasswordModal.vue b/packages/editor-ui/src/components/ChangePasswordModal.vue
@@ -60,6 +60,7 @@ export default mixins(showMessage).extend({
 					required: true,
 					autocomplete: 'current-password',
 					capitalize: true,
+					focusInitially: true,
 				},
 			},
 			{

diff --git a/packages/editor-ui/src/components/ContactPromptModal.vue b/packages/editor-ui/src/components/ContactPromptModal.vue
@@ -76,10 +76,12 @@ export default mixins(workflowHelpers).extend({
 	},
 	methods: {
 		closeDialog(): void {
-			this.$telemetry.track('User closed email modal', {
-				instance_id: this.$store.getters.instanceId,
-				email: null,
-			});
+			if (!this.isEmailValid) {
+				this.$telemetry.track('User closed email modal', {
+					instance_id: this.$store.getters.instanceId,
+					email: null,
+				});
+			}
 		},
 		async send() {
 			if (this.isEmailValid) {

diff --git a/packages/editor-ui/src/components/InviteUsersModal.vue b/packages/editor-ui/src/components/InviteUsersModal.vue
@@ -35,7 +35,6 @@ import { ROLE } from "@/modules/userHelpers";
 
 const NAME_EMAIL_FORMAT_REGEX = /^.* <(.*)>$/;
 
-
 function getEmail(email: string): string {
 	let parsed = email.trim();
 	if (NAME_EMAIL_FORMAT_REGEX.test(parsed)) {
@@ -80,6 +79,7 @@ export default mixins(showMessage).extend({
 					},
 					placeholder: 'name1@email.com, name2@email.com, ...',
 					capitalize: true,
+					focusInitially: true,
 				},
 			},
 			{
@@ -179,7 +179,7 @@ export default mixins(showMessage).extend({
 					setTimeout(() => {
 						this.$showMessage({
 							type: 'error',
-							title: this.$locale.baseText(invitedEmails.error.length > 1 ? 'settings.users.usersInvitedError': 'settings.users.userInvitedError'),
+							title: this.$locale.baseText('settings.users.usersEmailedError'),
 							message: this.$locale.baseText('settings.users.emailInvitesSentError', { interpolate: { emails: invitedEmails.error.join(', ') }}),
 						});
 					}, 0); // notifications stack on top of each other otherwise

diff --git a/packages/editor-ui/src/components/ValueSurvey.vue b/packages/editor-ui/src/components/ValueSurvey.vue
@@ -116,7 +116,8 @@ export default mixins(workflowHelpers).extend({
 					instance_id: this.$store.getters.instanceId,
 					nps: '',
 				});
-			} else {
+			}
+			if (this.form.value !== '' && this.form.email === '') {
 				this.$telemetry.track('User responded value survey email', {
 					instance_id: this.$store.getters.instanceId,
 					email: '',

diff --git a/packages/editor-ui/src/plugins/i18n/locales/en.json b/packages/editor-ui/src/plugins/i18n/locales/en.json
@@ -1168,7 +1168,7 @@
 	"settings.users.setupMyAccount": "Set up my owner account",
 	"settings.users.setupSMTPToInviteUsers": "Set up SMTP to invite users. <a href=\"https://docs.n8n.io/reference/user-management.html#step-one-smtp\" target=\"_blank\">Instructions</a>",
 	"settings.users.setupToInviteUsers": "To invite users, set up your own account",
-	"settings.users.setupToInviteUsersInfo": "Invited users won’t be able to see workflows and credentials of other users. <a href=\"https://docs.n8n.io/reference/user-management.html\" target=\"_blank\">More info</a> <br /> You will need details of an <a href=\"https://docs.n8n.io/reference/user-management.html#step-one-smtp\" target=\"_blank\">SMTP server</a> to complete the setup.",
+	"settings.users.setupToInviteUsersInfo": "Invited users won’t be able to see workflows and credentials of other users. <a href=\"https://docs.n8n.io/reference/user-management.html\" target=\"_blank\">More info</a> <br /> <br /> You will need details of an <a href=\"https://docs.n8n.io/reference/user-management.html#step-one-smtp\" target=\"_blank\">SMTP server</a> to complete the setup.",
 	"settings.users.smtpToAddUsersWarning": "Set up SMTP before adding users (so that n8n can send them invitation emails). <a target=\"_blank\" href=\"https://docs.n8n.io/reference/user-management.html#step-one-smtp\">Instructions</a>",
 	"settings.users.transferWorkflowsAndCredentials": "Transfer their workflows and credentials to another user",
 	"settings.users.transferredToUser": "Data transferred to {user}",
@@ -1180,6 +1180,7 @@
 	"settings.users.userToTransferTo": "User to transfer to",
 	"settings.users.usersInvited": "Users invited",
 	"settings.users.usersInvitedError": "Could not invite users",
+	"settings.users.usersEmailedError": "Couldn't send invite email",
 	"settings.version": "Version",
 	"startupError": "Error connecting to n8n",
 	"startupError.message": "Could not connect to server. <a onclick='window.location.reload(false);'>Refresh</a> to try again"