refactor(editor): Migrate part of the vuex store to pinia (#4484)

* ✨ Added pinia support. Migrated community nodes module.
* ✨ Added ui pinia store, moved some data from root store to it, updated modals to work with pinia stores
* ✨ Added ui pinia store and migrated a part of the root store
* ✨ Migrated `settings` store to pinia
* ✨ Removing vuex store refs from router
* ✨ Migrated `users` module to pinia store
* ⚡ Fixing errors after sync with master
* ⚡ One more error after merge
* ⚡ Created `workflows` pinia store. Moved large part of root store to it. Started updating references.
* ✨ Finished migrating workflows store to pinia
* ⚡ Renaming some getters and actions to make more sense
* ✨ Finished migrating the root store to pinia
* ✨ Migrated ndv store to pinia
* ⚡ Renaming main panel dimensions getter so it doesn't clash with data prop name
* ✔️ Fixing lint errors
* ✨ Migrated `templates` store to pinia
* ✨ Migrated the `nodeTypes`store
* ⚡ Removed unused pieces of code and oold vuex modules
* ✨ Adding vuex calls to pinia store, fi	xing wrong references
* 💄 Removing leftover $store refs
* ⚡ Added legacy getters and mutations to store to support webhooks
* ⚡ Added missing front-end hooks, updated vuex state subscriptions to pinia
* ✔️ Fixing linting errors
* ⚡ Removing vue composition api plugin
* ⚡ Fixing main sidebar state when loading node view
* 🐛 Fixing an error when activating workflows
* 🐛 Fixing isses with workflow settings and executions auto-refresh
* 🐛 Removing duplicate listeners which cause import error
* 🐛 Fixing route authentication
* ⚡ Updating freshly pulled $store refs
* Adding deleted const
* ⚡ Updating store references in ee features. Reseting NodeView credentials update flag when resetting workspace
* ⚡ Adding return type to email submission modal
* ⚡ Making NodeView only react to paste event when active
* 🐛 Fixing signup view errors
* 👌 Addressing PR review comments
* 👌 Addressing new PR comments
* 👌 Updating invite id logic in signup view

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

@@ -14,6 +14,8 @@ import {
 } from 'n8n-design-system';
 
 import englishBaseText from './locales/en.json';
+import { useUIStore } from "@/stores/ui";
+import { useNDVStore } from "@/stores/ndv";
 import {INodeProperties, INodePropertyCollection, INodePropertyOptions} from "n8n-workflow";
 
 Vue.use(VueI18n);
@@ -22,7 +24,7 @@ locale.use('en');
 export let i18n: I18nClass;
 
 export function I18nPlugin(vue: typeof Vue, store: Store<IRootState>): void {
-	i18n = new I18nClass(store);
+	i18n = new I18nClass();
 
 	Object.defineProperty(vue, '$locale', {
 		get() { return i18n; },
@@ -34,11 +36,6 @@ export function I18nPlugin(vue: typeof Vue, store: Store<IRootState>): void {
 }
 
 export class I18nClass {
-	$store: Store<IRootState>;
-
-	constructor(store: Store<IRootState>) {
-		this.$store = store;
-	}
 
 	private get i18n(): VueI18n {
 		return i18nInstance;
@@ -95,7 +92,8 @@ export class I18nClass {
 	 * Namespace for methods to render text in the credentials details modal.
 	 */
 	credText () {
-		const credentialType = this.$store.getters.activeCredentialType;
+		const uiStore = useUIStore();
+		const credentialType = uiStore.activeCredentialType;
 		const credentialPrefix = `n8n-nodes-base.credentials.${credentialType}`;
 		const context = this;
 
@@ -189,8 +187,9 @@ export class I18nClass {
 	 * except for `eventTriggerDescription`.
 	 */
 	nodeText () {
-		const activeNode = this.$store.getters['ndv/activeNode'];
-		const nodeType = activeNode ? this.shortNodeType(activeNode.type) : ''; // unused in eventTriggerDescription
+		const ndvStore = useNDVStore();
+		const activeNode = ndvStore.activeNode;
+		const nodeType = activeNode ? this.shortNodeType(activeNode.type as string) : ''; // unused in eventTriggerDescription
 		const initialKey = `n8n-nodes-base.nodes.${nodeType}.nodeView`;
 		const context = this;
 

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

@@ -67,6 +67,7 @@
 	"auth.changePassword.reenterNewPassword": "Re-enter New Password",
 	"auth.changePassword.tokenValidationError": "Issue validating invite token",
 	"auth.defaultPasswordRequirements": "8+ characters, at least 1 number and 1 capital letter",
+	"auth.validation.missingParameters": "Missing token or user id",
 	"auth.email": "Email",
 	"auth.firstName": "First Name",
 	"auth.lastName": "Last Name",