refactor: Integrate consistent-type-imports in FE packages (no-changelog)

packages/@n8n_io/eslint-config/base.js

@@ -194,6 +194,11 @@ const config = (module.exports = {
 		 */
 		'@typescript-eslint/consistent-type-assertions': 'error',
 
+		/**
+		 * https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/consistent-type-imports.md
+		 */
+		'@typescript-eslint/consistent-type-imports': 'error',
+
 		/**
 		 * https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/member-delimiter-style.md
 		 */

packages/cli/.eslintrc.js

@@ -16,8 +16,6 @@ module.exports = {
 	],
 
 	rules: {
-		'@typescript-eslint/consistent-type-imports': 'error',
-
 		// TODO: Remove this
 		'import/no-cycle': 'warn',
 		'import/order': 'off',

packages/core/.eslintrc.js

@@ -11,8 +11,6 @@ module.exports = {
 	ignorePatterns: ['bin/*.js'],
 
 	rules: {
-		'@typescript-eslint/consistent-type-imports': 'error',
-
 		// TODO: Remove this
 		'import/order': 'off',
 		'@typescript-eslint/ban-ts-comment': ['error', { 'ts-ignore': true }],

packages/design-system/src/components/N8nActionDropdown/ActionDropdown.vue

@@ -41,7 +41,8 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue';
+import type { PropType } from 'vue';
+import Vue from 'vue';
 import {
 	Dropdown as ElDropdown,
 	DropdownMenu as ElDropdownMenu,

packages/design-system/src/components/N8nDatatable/Datatable.vue

@@ -1,6 +1,7 @@
 <script lang="ts">
-import { computed, defineComponent, PropType, ref, useCssModule } from 'vue';
-import {
+import type { PropType } from 'vue';
+import { computed, defineComponent, ref, useCssModule } from 'vue';
+import type {
 	DatatableColumn,
 	DatatableRow,
 	DatatableRowDataType,

packages/design-system/src/components/N8nDatatable/__tests__/data.ts

@@ -1,5 +1,6 @@
-import { defineComponent, h, PropType } from 'vue';
-import { DatatableRow } from '../mixins';
+import type { PropType } from 'vue';
+import { defineComponent, h } from 'vue';
+import type { DatatableRow } from '../mixins';
 import N8nButton from '../../N8nButton';
 
 // eslint-disable-next-line @typescript-eslint/naming-convention

packages/design-system/src/components/N8nDatatable/mixins.ts

@@ -1,4 +1,4 @@
-import { VNode } from 'vue';
+import type { VNode } from 'vue';
 
 export type DatatableRowDataType = string | number | boolean | null | undefined;
 

packages/design-system/src/components/N8nFormInput/FormInput.vue

@@ -95,7 +95,7 @@ import N8nCheckbox from '../N8nCheckbox';
 import ElSwitch from 'element-ui/lib/switch';
 
 import { getValidationError, VALIDATORS } from './validators';
-import { Rule, RuleGroup, IValidator, Validatable, FormState } from '../../types';
+import type { Rule, RuleGroup, IValidator, Validatable, FormState } from '../../types';
 
 import { t } from '../../locale';
 

packages/design-system/src/components/N8nFormInput/validators.ts

@@ -1,4 +1,4 @@
-import { IValidator, RuleGroup, Validatable } from '../../types';
+import type { IValidator, RuleGroup, Validatable } from '../../types';
 
 export const emailRegex =
 	/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;

packages/design-system/src/components/N8nFormInputs/FormInputs.vue

@@ -37,11 +37,12 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue';
+import type { PropType } from 'vue';
+import Vue from 'vue';
 import N8nFormInput from '../N8nFormInput';
 import type { IFormInput } from '../../types';
 import ResizeObserver from '../ResizeObserver';
-import { EventBus } from '@/utils';
+import type { EventBus } from '@/utils';
 
 export default Vue.extend({
 	name: 'n8n-form-inputs',

packages/design-system/src/components/N8nInfoAccordion/InfoAccordion.vue

@@ -41,7 +41,8 @@
 <script lang="ts">
 import N8nText from '../N8nText';
 import N8nIcon from '../N8nIcon';
-import Vue, { PropType } from 'vue';
+import type { PropType } from 'vue';
+import Vue from 'vue';
 
 interface IAccordionItem {
 	id: string;

packages/design-system/src/components/N8nMarkdown/Markdown.vue

@@ -60,7 +60,8 @@ interface Options {
 	tasklists: typeof DEFAULT_OPTIONS_TASKLISTS;
 }
 
-import Vue, { PropType } from 'vue';
+import type { PropType } from 'vue';
+import Vue from 'vue';
 
 export default Vue.extend({
 	components: {

packages/design-system/src/components/N8nMenu/Menu.vue

@@ -55,8 +55,9 @@
 import { Menu as ElMenu } from 'element-ui';
 import N8nMenuItem from '../N8nMenuItem';
 
-import Vue, { PropType } from 'vue';
-import { IMenuItem } from '../../types';
+import type { PropType } from 'vue';
+import Vue from 'vue';
+import type { IMenuItem } from '../../types';
 
 export default Vue.extend({
 	name: 'n8n-menu',

packages/design-system/src/components/N8nMenuItem/MenuItem.vue

@@ -74,8 +74,9 @@
 import { Submenu as ElSubmenu, MenuItem as ElMenuItem } from 'element-ui';
 import N8nTooltip from '../N8nTooltip';
 import N8nIcon from '../N8nIcon';
-import { IMenuItem } from '../../types';
-import Vue, { PropType } from 'vue';
+import type { IMenuItem } from '../../types';
+import type { PropType } from 'vue';
+import Vue from 'vue';
 
 export default Vue.extend({
 	name: 'n8n-menu-item',

packages/design-system/src/components/N8nNodeCreatorNode/NodeCreatorNode.stories.ts

@@ -1,5 +1,5 @@
 import N8nNodeCreatorNode from './NodeCreatorNode.vue';
-import { StoryFn } from '@storybook/vue';
+import type { StoryFn } from '@storybook/vue';
 
 export default {
 	title: 'Modules/Node Creator Node',

packages/design-system/src/components/N8nRecycleScroller/RecycleScroller.stories.ts

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment */
 import type { StoryFn } from '@storybook/vue';
 import N8nRecycleScroller from './RecycleScroller.vue';
-import { ComponentInstance } from 'vue';
+import type { ComponentInstance } from 'vue';
 
 export default {
 	title: 'Atoms/RecycleScroller',

packages/design-system/src/components/N8nRecycleScroller/RecycleScroller.vue

@@ -1,16 +1,8 @@
 <script lang="ts">
 /* eslint-disable @typescript-eslint/no-use-before-define */
 
-import {
-	computed,
-	defineComponent,
-	onMounted,
-	onBeforeMount,
-	ref,
-	PropType,
-	nextTick,
-	watch,
-} from 'vue';
+import type { PropType } from 'vue';
+import { computed, defineComponent, onMounted, onBeforeMount, ref, nextTick, watch } from 'vue';
 
 export default defineComponent({
 	name: 'n8n-recycle-scroller',

packages/design-system/src/components/N8nTags/Tags.vue

@@ -22,7 +22,7 @@
 import N8nTag from '../N8nTag';
 import N8nLink from '../N8nLink';
 import Locale from '../../mixins/locale';
-import { PropType } from 'vue';
+import type { PropType } from 'vue';
 import mixins from 'vue-typed-mixins';
 
 interface ITag {

packages/design-system/src/components/N8nTooltip/Tooltip.vue

@@ -20,7 +20,8 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue';
+import type { PropType } from 'vue';
+import Vue from 'vue';
 import { Tooltip as ElTooltip } from 'element-ui';
 import type { IN8nButton } from '@/types';
 import N8nButton from '../N8nButton';

packages/design-system/src/components/N8nUserSelect/UserSelect.vue

@@ -34,7 +34,7 @@ import 'vue';
 import mixins from 'vue-typed-mixins';
 import { Select as ElSelect, Option as ElOption } from 'element-ui';
 import N8nUserInfo from '../N8nUserInfo';
-import { IUser } from '../../types';
+import type { IUser } from '../../types';
 import Locale from '../../mixins/locale';
 import { t } from '../../locale';
 

packages/design-system/src/components/N8nUsersList/UsersList.stories.ts

@@ -1,7 +1,7 @@
 import N8nUsersList from './UsersList.vue';
 import { action } from '@storybook/addon-actions';
 import type { StoryFn } from '@storybook/vue';
-import { IUser } from '@/types';
+import type { IUser } from '@/types';
 
 export default {
 	title: 'Modules/UsersList',

packages/design-system/src/components/N8nUsersList/UsersList.vue

@@ -32,13 +32,13 @@
 </template>
 
 <script lang="ts">
-import { IUser, IUserListAction } from '../../types';
+import type { IUser, IUserListAction } from '../../types';
 import N8nActionToggle from '../N8nActionToggle';
 import N8nBadge from '../N8nBadge';
 import N8nUserInfo from '../N8nUserInfo';
 import Locale from '../../mixins/locale';
 import mixins from 'vue-typed-mixins';
-import { PropType } from 'vue';
+import type { PropType } from 'vue';
 
 export default mixins(Locale).extend({
 	name: 'n8n-users-list',

packages/design-system/src/plugins/n8nComponents.ts

@@ -1,4 +1,4 @@
-import Vue from 'vue';
+import type Vue from 'vue';
 import N8nActionBox from '../components/N8nActionBox';
 import N8nActionDropdown from '../components/N8nActionDropdown';
 import N8nActionToggle from '../components/N8nActionToggle';

packages/editor-ui/src/Interface.ts

@@ -1,7 +1,7 @@
-import { CREDENTIAL_EDIT_MODAL_KEY } from './constants';
+import type { CREDENTIAL_EDIT_MODAL_KEY } from './constants';
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { IMenuItem } from 'n8n-design-system';
-import {
+import type { IMenuItem } from 'n8n-design-system';
+import type {
 	GenericValue,
 	IConnections,
 	ICredentialsDecrypted,
@@ -34,10 +34,10 @@ import {
 	ExecutionStatus,
 	ITelemetryTrackProperties,
 } from 'n8n-workflow';
-import { SignInType } from './constants';
-import { FAKE_DOOR_FEATURES, TRIGGER_NODE_FILTER, REGULAR_NODE_FILTER } from './constants';
-import { BulkCommand, Undoable } from '@/models/history';
-import { PartialBy } from '@/utils/typeHelpers';
+import type { SignInType } from './constants';
+import type { FAKE_DOOR_FEATURES, TRIGGER_NODE_FILTER, REGULAR_NODE_FILTER } from './constants';
+import type { BulkCommand, Undoable } from '@/models/history';
+import type { PartialBy } from '@/utils/typeHelpers';
 
 export * from 'n8n-design-system/types';
 

packages/editor-ui/src/__tests__/permissions.spec.ts

@@ -1,5 +1,5 @@
 import { parsePermissionsTable } from '@/permissions';
-import { IUser } from '@/Interface';
+import type { IUser } from '@/Interface';
 
 describe('parsePermissionsTable()', () => {
 	const user: IUser = {

packages/editor-ui/src/__tests__/server/endpoints/credential.ts

@@ -1,5 +1,6 @@
-import { Response, Server } from 'miragejs';
-import { AppSchema } from '../types';
+import type { Server } from 'miragejs';
+import { Response } from 'miragejs';
+import type { AppSchema } from '../types';
 
 export function routesForCredentials(server: Server) {
 	server.get('/rest/credentials', (schema: AppSchema) => {

packages/editor-ui/src/__tests__/server/endpoints/credentialType.ts

@@ -1,5 +1,6 @@
-import { Response, Server } from 'miragejs';
-import { AppSchema } from '../types';
+import type { Server } from 'miragejs';
+import { Response } from 'miragejs';
+import type { AppSchema } from '../types';
 
 export function routesForCredentialTypes(server: Server) {
 	server.get('/types/credentials.json', (schema: AppSchema) => {

packages/editor-ui/src/__tests__/server/endpoints/index.ts

@@ -1,6 +1,6 @@
 import { routesForUsers } from './user';
 import { routesForCredentials } from './credential';
-import { Server } from 'miragejs';
+import type { Server } from 'miragejs';
 import { routesForCredentialTypes } from '@/__tests__/server/endpoints/credentialType';
 
 const endpoints: Array<(server: Server) => void> = [

packages/editor-ui/src/__tests__/server/endpoints/user.ts

@@ -1,5 +1,6 @@
-import { Response, Server } from 'miragejs';
-import { AppSchema } from '../types';
+import type { Server } from 'miragejs';
+import { Response } from 'miragejs';
+import type { AppSchema } from '../types';
 
 export function routesForUsers(server: Server) {
 	server.get('/rest/users', (schema: AppSchema) => {

packages/editor-ui/src/__tests__/server/models/credential.ts

@@ -1,4 +1,4 @@
-import { ICredentialsResponse } from '@/Interface';
+import type { ICredentialsResponse } from '@/Interface';
 import { Model } from 'miragejs';
 import type { ModelDefinition } from 'miragejs/-types';
 

packages/editor-ui/src/__tests__/server/models/user.ts

@@ -1,4 +1,4 @@
-import { IUser } from '@/Interface';
+import type { IUser } from '@/Interface';
 import { Model } from 'miragejs';
 import type { ModelDefinition } from 'miragejs/-types';
 

packages/editor-ui/src/__tests__/server/types.ts

@@ -1,10 +1,10 @@
-import { Registry } from 'miragejs';
+import type { Registry } from 'miragejs';
 
 // eslint-disable-next-line import/no-unresolved
-import Schema from 'miragejs/orm/schema';
+import type Schema from 'miragejs/orm/schema';
 
-import { models } from './models';
-import { factories } from './factories';
+import type { models } from './models';
+import type { factories } from './factories';
 
 type AppRegistry = Registry<typeof models, typeof factories>;
 export type AppSchema = Schema<AppRegistry>;

packages/editor-ui/src/api/api-keys.ts

@@ -1,4 +1,4 @@
-import { IRestApiContext } from '@/Interface';
+import type { IRestApiContext } from '@/Interface';
 import { makeRestApiRequest } from '@/utils';
 
 export function getApiKey(context: IRestApiContext): Promise<{ apiKey: string | null }> {

packages/editor-ui/src/api/communityNodes.ts

@@ -1,5 +1,5 @@
-import { IRestApiContext } from '@/Interface';
-import { PublicInstalledPackage } from 'n8n-workflow';
+import type { IRestApiContext } from '@/Interface';
+import type { PublicInstalledPackage } from 'n8n-workflow';
 import { get, post, makeRestApiRequest } from '@/utils';
 
 export async function getInstalledCommunityNodes(

packages/editor-ui/src/api/credentials.ee.ts

@@ -1,6 +1,6 @@
-import { ICredentialsResponse, IRestApiContext, IShareCredentialsPayload } from '@/Interface';
+import type { ICredentialsResponse, IRestApiContext, IShareCredentialsPayload } from '@/Interface';
 import { makeRestApiRequest } from '@/utils';
-import { IDataObject } from 'n8n-workflow';
+import type { IDataObject } from 'n8n-workflow';
 
 export async function setCredentialSharedWith(
 	context: IRestApiContext,

packages/editor-ui/src/api/credentials.ts

@@ -1,6 +1,10 @@
-import { ICredentialsDecryptedResponse, ICredentialsResponse, IRestApiContext } from '@/Interface';
+import type {
+	ICredentialsDecryptedResponse,
+	ICredentialsResponse,
+	IRestApiContext,
+} from '@/Interface';
 import { makeRestApiRequest } from '@/utils';
-import {
+import type {
 	ICredentialsDecrypted,
 	ICredentialType,
 	IDataObject,

packages/editor-ui/src/api/curlHelper.ts

@@ -1,4 +1,4 @@
-import { CurlToJSONResponse, IRestApiContext } from '@/Interface';
+import type { CurlToJSONResponse, IRestApiContext } from '@/Interface';
 import { makeRestApiRequest } from '@/utils';
 
 export function getCurlToJson(

packages/editor-ui/src/api/eventbus.ee.ts

@@ -1,6 +1,6 @@
-import { IRestApiContext } from '@/Interface';
+import type { IRestApiContext } from '@/Interface';
 import { makeRestApiRequest } from '@/utils';
-import { IDataObject, MessageEventBusDestinationOptions } from 'n8n-workflow';
+import type { IDataObject, MessageEventBusDestinationOptions } from 'n8n-workflow';
 
 export async function saveDestinationToDb(
 	context: IRestApiContext,

packages/editor-ui/src/api/ldap.ts

@@ -1,6 +1,6 @@
-import { ILdapConfig, ILdapSyncData, IRestApiContext } from '@/Interface';
+import type { ILdapConfig, ILdapSyncData, IRestApiContext } from '@/Interface';
 import { makeRestApiRequest } from '@/utils';
-import { IDataObject } from 'n8n-workflow';
+import type { IDataObject } from 'n8n-workflow';
 
 export function getLdapConfig(context: IRestApiContext): Promise<ILdapConfig> {
 	return makeRestApiRequest(context, 'GET', '/ldap/config');

packages/editor-ui/src/api/settings.ts

@@ -1,4 +1,4 @@
-import {
+import type {
 	IRestApiContext,
 	IN8nPrompts,
 	IN8nValueSurveyData,