mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-12-23 11:44:06 -08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

refactor(editor): Drop vue-typed-mixins (no-changelog) (#6257)

Browse source
This commit is contained in:
कारतोफ्फेलस्क्रिप्ट™ 2023-05-16 09:43:46 +00:00 committed by GitHub
parent 79d0a0f247
commit ebb3aaf61e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
98 changed files with 340 additions and 287 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
packages/@n8n_io/eslint-config/frontend.js
View file

@ -25,5 +25,11 @@ module.exports = {
'vue/no-deprecated-slot-scope-attribute': 'error',
'vue/no-multiple-template-root': 'error',
'vue/v-slot-style': 'error',
// TODO: remove these
'vue/no-unused-components': 'warn',
'vue/return-in-computed-property': 'warn',
'vue/no-mutating-props': 'warn',
'@typescript-eslint/no-floating-promises': 'warn',
},
};

2
packages/design-system/package.json
View file

@ -35,7 +35,6 @@
"markdown-it-link-attributes": "^4.0.0",
"markdown-it-task-lists": "^2.1.1",
"vue": "^2.7.14",
"vue-typed-mixins": "^0.2.0",
"xss": "^1.0.14"
},
"devDependencies": {
@ -71,7 +70,6 @@
"markdown-it-task-lists": "^2.1.1",
"sanitize-html": "2.10.0",
"vue": "^2.7.14",
"vue-typed-mixins": "^0.2.0",
"vue2-boring-avatars": "^0.3.8",
"xss": "^1.0.14"
}

1
packages/editor-ui/package.json
View file

@ -76,7 +76,6 @@
"vue-infinite-loading": "^2.4.5",
"vue-json-pretty": "1.9.3",
"vue-router": "^3.6.5",
"vue-typed-mixins": "^0.2.0",
"vue2-teleport": "^1.0.1",
"vue2-touch-events": "^3.2.1",
"xss": "^1.0.14"

5
packages/editor-ui/src/App.vue
View file

@ -27,6 +27,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import Modals from '@/components/Modals.vue';
import LoadingView from '@/views/LoadingView.vue';
import Telemetry from '@/components/Telemetry.vue';
@ -35,7 +38,6 @@ import { CLOUD_TRIAL_CHECK_INTERVAL, HIRING_BANNER, LOCAL_STORAGE_THEME, VIEWS }
import { userHelpers } from '@/mixins/userHelpers';
import { loadLanguage } from '@/plugins/i18n';
import { useGlobalLinkActions, useToast } from '@/composables';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useUsersStore } from '@/stores/users.store';
@ -49,7 +51,6 @@ import { useRoute } from 'vue-router/composables';
import { useVersionControlStore } from '@/stores/versionControl.store';
import { useUsageStore } from '@/stores/usage.store';
import { useExternalHooks } from '@/composables';
import { defineComponent } from 'vue';
export default defineComponent({
name: 'App',

7
packages/editor-ui/src/components/BinaryDataDisplay.vue
View file

@ -19,18 +19,19 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import type { IBinaryData, IRunData } from 'n8n-workflow';
import BinaryDataDisplayEmbed from '@/components/BinaryDataDisplayEmbed.vue';
import { nodeHelpers } from '@/mixins/nodeHelpers';
import mixins from 'vue-typed-mixins';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows.store';
export default mixins(nodeHelpers).extend({
export default defineComponent({
name: 'BinaryDataDisplay',
mixins: [nodeHelpers],
components: {
BinaryDataDisplayEmbed,
},

6
packages/editor-ui/src/components/BinaryDataDisplayEmbed.vue
View file

@ -19,15 +19,15 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import type { IBinaryData } from 'n8n-workflow';
import { jsonParse } from 'n8n-workflow';
import type { PropType } from 'vue';
import VueJsonPretty from 'vue-json-pretty';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores';
import Vue from 'vue';
export default Vue.extend({
export default defineComponent({
name: 'BinaryDataDisplayEmbed',
components: {
VueJsonPretty,

5
packages/editor-ui/src/components/BreakpointsObserver.vue
View file

@ -5,6 +5,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { BREAKPOINT_SM, BREAKPOINT_MD, BREAKPOINT_LG, BREAKPOINT_XL } from '@/constants';
/**
@ -16,12 +17,12 @@ import { BREAKPOINT_SM, BREAKPOINT_MD, BREAKPOINT_LG, BREAKPOINT_XL } from '@/co
* xl >= 1920
*/
import mixins from 'vue-typed-mixins';
import { genericHelpers } from '@/mixins/genericHelpers';
import { debounceHelper } from '@/mixins/debounce';
export default mixins(genericHelpers, debounceHelper).extend({
export default defineComponent({
name: 'BreakpointsObserver',
mixins: [genericHelpers, debounceHelper],
props: ['valueXS', 'valueXL', 'valueLG', 'valueMD', 'valueSM', 'valueDefault'],
data() {
return {

2
packages/editor-ui/src/components/ChangePasswordModal.vue
View file

@ -40,8 +40,8 @@ import { useUsersStore } from '@/stores/users.store';
import { createEventBus } from '@/event-bus';
export default defineComponent({
components: { Modal },
name: 'ChangePasswordModal',
components: { Modal },
props: {
modalName: {
type: String,

5
packages/editor-ui/src/components/CodeNodeEditor/CodeNodeEditor.vue
View file

@ -19,9 +19,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import mixins from 'vue-typed-mixins';
import type { LanguageSupport } from '@codemirror/language';
import type { Extension } from '@codemirror/state';
@ -47,8 +47,9 @@ import { linterExtension } from './linter';
import { completerExtension } from './completer';
import { codeNodeEditorTheme } from './theme';
export default mixins(linterExtension, completerExtension, workflowHelpers).extend({
export default defineComponent({
name: 'code-node-editor',
mixins: [linterExtension, completerExtension, workflowHelpers],
components: { Modal },
props: {
mode: {

34
packages/editor-ui/src/components/CodeNodeEditor/completer.ts
View file

@ -1,7 +1,8 @@
import Vue from 'vue';
import mixins from 'vue-typed-mixins';
import Vue, { defineComponent } from 'vue';
import { autocompletion } from '@codemirror/autocomplete';
import { localCompletionSource } from '@codemirror/lang-javascript';
import type { Completion, CompletionContext, CompletionResult } from '@codemirror/autocomplete';
import type { Extension } from '@codemirror/state';
import { baseCompletions } from './completions/base.completions';
import { jsSnippets } from './completions/js.snippets';
@ -15,23 +16,22 @@ import { itemFieldCompletions } from './completions/itemField.completions';
import { jsonFieldCompletions } from './completions/jsonField.completions';
import { variablesCompletions } from './completions/variables.completions';
import type { Completion, CompletionContext, CompletionResult } from '@codemirror/autocomplete';
import type { Extension } from '@codemirror/state';
import type { CodeNodeEditorMixin } from './types';
export const completerExtension = mixins(
Vue as CodeNodeEditorMixin,
baseCompletions,
requireCompletions,
executionCompletions,
workflowCompletions,
variablesCompletions,
prevNodeCompletions,
luxonCompletions,
itemIndexCompletions,
itemFieldCompletions,
jsonFieldCompletions,
).extend({
export const completerExtension = defineComponent({
mixins: [
Vue as CodeNodeEditorMixin,
baseCompletions,
requireCompletions,
executionCompletions,
workflowCompletions,
variablesCompletions,
prevNodeCompletions,
luxonCompletions,
itemIndexCompletions,
itemFieldCompletions,
jsonFieldCompletions,
],
methods: {
autocompletionExtension(language: 'javaScript' | 'python'): Extension {
const completions = [];

5
packages/editor-ui/src/components/CollectionCard.vue
View file

@ -11,13 +11,14 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { genericHelpers } from '@/mixins/genericHelpers';
import Card from '@/components/CollectionWorkflowCard.vue';
import mixins from 'vue-typed-mixins';
import NodeList from '@/components/NodeList.vue';
export default mixins(genericHelpers).extend({
export default defineComponent({
name: 'CollectionCard',
mixins: [genericHelpers],
props: {
loading: {
type: Boolean,

9
packages/editor-ui/src/components/CollectionParameter.vue
View file

@ -46,6 +46,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { Component } from 'vue';
import { mapStores } from 'pinia';
import type { INodeUi, IUpdateInformation } from '@/Interface';
import type { INodeProperties, INodePropertyOptions } from 'n8n-workflow';
@ -55,13 +58,11 @@ import { nodeHelpers } from '@/mixins/nodeHelpers';
import { get } from 'lodash-es';
import mixins from 'vue-typed-mixins';
import type { Component } from 'vue';
import { mapStores } from 'pinia';
import { useNDVStore } from '@/stores/ndv.store';
export default mixins(nodeHelpers).extend({
export default defineComponent({
name: 'CollectionParameter',
mixins: [nodeHelpers],
props: [
'hideDelete', // boolean
'nodeValues', // NodeParameters

5
packages/editor-ui/src/components/CollectionWorkflowCard.vue
View file

@ -11,11 +11,12 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { genericHelpers } from '@/mixins/genericHelpers';
import mixins from 'vue-typed-mixins';
export default mixins(genericHelpers).extend({
export default defineComponent({
name: 'Card',
mixins: [genericHelpers],
props: {
loading: {
type: Boolean,

5
packages/editor-ui/src/components/CollectionsCarousel.vue
View file

@ -26,6 +26,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import type { ITemplatesCollection } from '@/Interface';
import Card from '@/components/CollectionWorkflowCard.vue';
@ -33,12 +34,12 @@ import CollectionCard from '@/components/CollectionCard.vue';
import VueAgile from 'vue-agile';
import { genericHelpers } from '@/mixins/genericHelpers';
import mixins from 'vue-typed-mixins';
type SliderRef = InstanceType<typeof VueAgile>;
export default mixins(genericHelpers).extend({
export default defineComponent({
name: 'CollectionsCarousel',
mixins: [genericHelpers],
props: {
collections: {
type: Array as PropType<ITemplatesCollection[]>,

10
packages/editor-ui/src/components/ContactPromptModal.vue
View file

@ -33,21 +33,21 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import type { IN8nPromptResponse } from '@/Interface';
import { VALID_EMAIL_REGEX } from '@/constants';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import Modal from '@/components/Modal.vue';
import { mapStores } from 'pinia';
import { useSettingsStore } from '@/stores/settings.store';
import { useRootStore } from '@/stores/n8nRoot.store';
import { createEventBus } from '@/event-bus';
import { useToast } from '@/composables';
export default mixins(workflowHelpers).extend({
components: { Modal },
export default defineComponent({
name: 'ContactPromptModal',
mixins: [workflowHelpers],
components: { Modal },
props: ['modalName'],
setup() {
return {

5
packages/editor-ui/src/components/CopyInput.vue
View file

@ -17,11 +17,12 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { copyPaste } from '@/mixins/copyPaste';
import { useToast } from '@/composables';
export default mixins(copyPaste).extend({
export default defineComponent({
mixins: [copyPaste],
props: {
label: {
type: String,

7
packages/editor-ui/src/components/CredentialEdit/CredentialConfig.vue
View file

@ -129,6 +129,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import type { ICredentialType, INodeTypeDescription } from 'n8n-workflow';
import { getAppNameFromCredType, isCommunityPackageName } from '@/utils';
@ -139,7 +142,6 @@ import OauthButton from './OauthButton.vue';
import { addCredentialTranslation } from '@/plugins/i18n';
import { BUILTIN_CREDENTIALS_DOCS_URL, DOCS_DOMAIN, EnterpriseEditionFeature } from '@/constants';
import type { IPermissions } from '@/permissions';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useRootStore } from '@/stores/n8nRoot.store';
@ -149,9 +151,8 @@ import { useNodeTypesStore } from '@/stores/nodeTypes.store';
import type { ICredentialsResponse } from '@/Interface';
import AuthTypeSelector from '@/components/CredentialEdit/AuthTypeSelector.vue';
import GoogleAuthButton from './GoogleAuthButton.vue';
import Vue from 'vue';
export default Vue.extend({
export default defineComponent({
name: 'CredentialConfig',
components: {
AuthTypeSelector,

7
packages/editor-ui/src/components/CredentialEdit/CredentialEdit.vue
View file

@ -110,6 +110,8 @@
<script lang="ts">
import Vue from 'vue';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import type { ICredentialsResponse, IUser } from '@/Interface';
@ -129,7 +131,6 @@ import type {
import { NodeHelpers } from 'n8n-workflow';
import CredentialIcon from '@/components/CredentialIcon.vue';
import mixins from 'vue-typed-mixins';
import { nodeHelpers } from '@/mixins/nodeHelpers';
import { useToast, useMessage } from '@/composables';
@ -146,7 +147,6 @@ import type { IPermissions } from '@/permissions';
import { getCredentialPermissions } from '@/permissions';
import type { IMenuItem } from 'n8n-design-system';
import { createEventBus } from 'n8n-design-system';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useUsersStore } from '@/stores/users.store';
@ -166,8 +166,9 @@ interface NodeAccessMap {
[nodeType: string]: ICredentialNodeAccess | null;
}
export default mixins(nodeHelpers, externalHooks).extend({
export default defineComponent({
name: 'CredentialEdit',
mixins: [nodeHelpers, externalHooks],
components: {
CredentialSharing,
CredentialConfig,

5
packages/editor-ui/src/components/CredentialIcon.vue
View file

@ -7,12 +7,13 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { useCredentialsStore } from '@/stores/credentials.store';
import { useRootStore } from '@/stores/n8nRoot.store';
import { useNodeTypesStore } from '@/stores/nodeTypes.store';
import type { ICredentialType, INodeTypeDescription } from 'n8n-workflow';
import { mapStores } from 'pinia';
import { defineComponent } from 'vue';
export default defineComponent({
props: {

5
packages/editor-ui/src/components/CredentialsSelectModal.vue
View file

@ -58,7 +58,7 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import Modal from './Modal.vue';
import { CREDENTIAL_SELECT_MODAL_KEY } from '../constants';
import { externalHooks } from '@/mixins/externalHooks';
@ -68,8 +68,9 @@ import { useWorkflowsStore } from '@/stores/workflows.store';
import { useCredentialsStore } from '@/stores/credentials.store';
import { createEventBus } from '@/event-bus';
export default mixins(externalHooks).extend({
export default defineComponent({
name: 'CredentialsSelectModal',
mixins: [externalHooks],
components: {
Modal,
},

2
packages/editor-ui/src/components/DeleteUserModal.vue
View file

@ -79,10 +79,10 @@ import { useUsersStore } from '@/stores/users.store';
import { createEventBus } from '@/event-bus';
export default defineComponent({
name: 'DeleteUserModal',
components: {
Modal,
},
name: 'DeleteUserModal',
props: {
modalName: {
type: String,

4
packages/editor-ui/src/components/DraggableTarget.vue
View file

@ -5,10 +5,10 @@
</template>
<script lang="ts">
import { useNDVStore } from '@/stores/ndv.store';
import { mapStores } from 'pinia';
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import { useNDVStore } from '@/stores/ndv.store';
export default defineComponent({
props: {

10
packages/editor-ui/src/components/DuplicateWorkflowDialog.vue
View file

@ -49,14 +49,13 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { MAX_WORKFLOW_NAME_LENGTH, PLACEHOLDER_EMPTY_WORKFLOW_ID } from '@/constants';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import { useToast } from '@/composables';
import TagsDropdown from '@/components/TagsDropdown.vue';
import Modal from '@/components/Modal.vue';
import { mapStores } from 'pinia';
import { useSettingsStore } from '@/stores/settings.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import type { IWorkflowDataUpdate } from '@/Interface';
@ -66,9 +65,10 @@ import { useUsersStore } from '@/stores/users.store';
import { createEventBus } from '@/event-bus';
import { useCredentialsStore } from '@/stores';
export default mixins(workflowHelpers).extend({
components: { TagsDropdown, Modal },
export default defineComponent({
name: 'DuplicateWorkflow',
mixins: [workflowHelpers],
components: { TagsDropdown, Modal },
props: ['modalName', 'isActive', 'data'],
setup() {
return {

7
packages/editor-ui/src/components/Error/NodeErrorView.vue
View file

@ -118,20 +118,21 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import VueJsonPretty from 'vue-json-pretty';
import { copyPaste } from '@/mixins/copyPaste';
import { useToast } from '@/composables';
import mixins from 'vue-typed-mixins';
import { MAX_DISPLAY_DATA_SIZE } from '@/constants';
import type { INodeProperties, INodePropertyCollection, INodePropertyOptions } from 'n8n-workflow';
import { sanitizeHtml } from '@/utils';
import { mapStores } from 'pinia';
import { useNDVStore } from '@/stores/ndv.store';
import { useNodeTypesStore } from '@/stores/nodeTypes.store';
export default mixins(copyPaste).extend({
export default defineComponent({
name: 'NodeErrorView',
mixins: [copyPaste],
props: ['error'],
components: {
VueJsonPretty,

6
packages/editor-ui/src/components/ExecutionTime.vue
View file

@ -5,12 +5,12 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { genericHelpers } from '@/mixins/genericHelpers';
import mixins from 'vue-typed-mixins';
export default mixins(genericHelpers).extend({
export default defineComponent({
name: 'ExecutionTime',
mixins: [genericHelpers],
props: ['startTime'],
computed: {
time(): string {

8
packages/editor-ui/src/components/ExecutionsList.vue
View file

@ -280,7 +280,8 @@
</template>
<script lang="ts">
import Vue from 'vue';
import Vue, { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import ExecutionTime from '@/components/ExecutionTime.vue';
import WorkflowActivator from '@/components/WorkflowActivator.vue';
import ExecutionFilter from '@/components/ExecutionFilter.vue';
@ -299,15 +300,14 @@ import type {
} from '@/Interface';
import type { IExecutionsSummary, ExecutionStatus } from 'n8n-workflow';
import { range as _range } from 'lodash-es';
import mixins from 'vue-typed-mixins';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { isEmpty, setPageTitle } from '@/utils';
import { executionFilterToQueryFilter } from '@/utils/executionUtils';
export default mixins(externalHooks, genericHelpers, executionHelpers).extend({
export default defineComponent({
name: 'ExecutionsList',
mixins: [externalHooks, genericHelpers, executionHelpers],
components: {
ExecutionTime,
WorkflowActivator,

5
packages/editor-ui/src/components/ExecutionsView/ExecutionCard.vue
View file

@ -81,15 +81,16 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { IExecutionsSummary } from '@/Interface';
import mixins from 'vue-typed-mixins';
import type { IExecutionUIData } from '@/mixins/executionsHelpers';
import { executionHelpers } from '@/mixins/executionsHelpers';
import { VIEWS } from '@/constants';
import ExecutionTime from '@/components/ExecutionTime.vue';
export default mixins(executionHelpers).extend({
export default defineComponent({
name: 'execution-card',
mixins: [executionHelpers],
components: {
ExecutionTime,
},

8
packages/editor-ui/src/components/ExecutionsView/ExecutionPreview.vue
View file

@ -126,20 +126,22 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { useMessage } from '@/composables';
import WorkflowPreview from '@/components/WorkflowPreview.vue';
import type { IExecutionUIData } from '@/mixins/executionsHelpers';
import { executionHelpers } from '@/mixins/executionsHelpers';
import { MODAL_CONFIRM, VIEWS } from '@/constants';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { Dropdown as ElDropdown } from 'element-ui';
type RetryDropdownRef = InstanceType<typeof ElDropdown> & { hide: () => void };
export default mixins(executionHelpers).extend({
export default defineComponent({
name: 'execution-preview',
mixins: [executionHelpers],
components: {
ElDropdown,
WorkflowPreview,

7
packages/editor-ui/src/components/ExecutionsView/ExecutionsInfoAccordion.vue
View file

@ -36,15 +36,15 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { useRootStore } from '@/stores/n8nRoot.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { mapStores } from 'pinia';
import { PLACEHOLDER_EMPTY_WORKFLOW_ID, WORKFLOW_SETTINGS_MODAL_KEY } from '@/constants';
import type { IWorkflowSettings } from 'n8n-workflow';
import { deepCopy } from 'n8n-workflow';
import mixins from 'vue-typed-mixins';
import { workflowHelpers } from '@/mixins/workflowHelpers';
interface IWorkflowSaveSettings {
@ -53,8 +53,9 @@ interface IWorkflowSaveSettings {
saveTestExecutions: boolean;
}
export default mixins(workflowHelpers).extend({
export default defineComponent({
name: 'executions-info-accordion',
mixins: [workflowHelpers],
props: {
initiallyExpanded: {
type: Boolean,

8
packages/editor-ui/src/components/ExecutionsView/ExecutionsList.vue
View file

@ -23,6 +23,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import ExecutionsSidebar from '@/components/ExecutionsView/ExecutionsSidebar.vue';
import {
MAIN_HEADER_TABS,
@ -48,7 +51,6 @@ import type {
INodeTypeNameVersion,
} from 'n8n-workflow';
import { NodeHelpers } from 'n8n-workflow';
import mixins from 'vue-typed-mixins';
import { useToast, useMessage } from '@/composables';
import { v4 as uuid } from 'uuid';
import type { Route } from 'vue-router';
@ -57,7 +59,6 @@ import { range as _range } from 'lodash-es';
import { debounceHelper } from '@/mixins/debounce';
import { getNodeViewTab, NO_NETWORK_ERROR_CODE } from '@/utils';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useUIStore } from '@/stores/ui.store';
import { useSettingsStore } from '@/stores/settings.store';
@ -70,8 +71,9 @@ const MAX_LOADING_ATTEMPTS = 5;
// Number of executions fetched on each page
const LOAD_MORE_PAGE_SIZE = 100;
export default mixins(executionHelpers, debounceHelper, workflowHelpers).extend({
export default defineComponent({
name: 'executions-list',
mixins: [executionHelpers, debounceHelper, workflowHelpers],
components: {
ExecutionsSidebar,
},

2
packages/editor-ui/src/components/ExpandableInput/ExpandableInputEdit.vue
View file

@ -22,8 +22,8 @@ import type { PropType } from 'vue';
import type { EventBus } from '@/event-bus';
export default defineComponent({
components: { ExpandableInputBase },
name: 'ExpandableInputEdit',
components: { ExpandableInputBase },
props: {
value: {},
placeholder: {},

2
packages/editor-ui/src/components/ExpandableInput/ExpandableInputPreview.vue
View file

@ -16,8 +16,8 @@ import { defineComponent } from 'vue';
import ExpandableInputBase from './ExpandableInputBase.vue';
export default defineComponent({
components: { ExpandableInputBase },
name: 'ExpandableInputPreview',
components: { ExpandableInputBase },
props: ['value'],
});
</script>

7
packages/editor-ui/src/components/ExpressionEdit.vue
View file

@ -74,6 +74,8 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import ExpressionEditorModalInput from '@/components/ExpressionEditorModal/ExpressionEditorModalInput.vue';
import ExpressionEditorModalOutput from '@/components/ExpressionEditorModal/ExpressionEditorModalOutput.vue';
import VariableSelector from '@/components/VariableSelector.vue';
@ -85,17 +87,16 @@ import { genericHelpers } from '@/mixins/genericHelpers';
import { EXPRESSIONS_DOCS_URL } from '@/constants';
import mixins from 'vue-typed-mixins';
import { debounceHelper } from '@/mixins/debounce';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useNDVStore } from '@/stores/ndv.store';
import { createExpressionTelemetryPayload } from '@/utils/telemetryUtils';
import type { Segment } from '@/types/expressions';
export default mixins(externalHooks, genericHelpers, debounceHelper).extend({
export default defineComponent({
name: 'ExpressionEdit',
mixins: [externalHooks, genericHelpers, debounceHelper],
props: ['dialogVisible', 'parameter', 'path', 'value', 'eventSource'],
components: {
ExpressionEditorModalInput,

5
packages/editor-ui/src/components/ExpressionEditorModal/ExpressionEditorModalInput.vue
View file

@ -3,7 +3,7 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { EditorView, keymap } from '@codemirror/view';
import { EditorState, Prec } from '@codemirror/state';
import { history, redo } from '@codemirror/commands';
@ -20,8 +20,9 @@ import { acceptCompletion, autocompletion } from '@codemirror/autocomplete';
import type { IVariableItemSelected } from '@/Interface';
export default mixins(expressionManager, completionManager, workflowHelpers).extend({
export default defineComponent({
name: 'ExpressionEditorModalInput',
mixins: [expressionManager, completionManager, workflowHelpers],
props: {
value: {
type: String,

4
packages/editor-ui/src/components/FeatureComingSoon.vue
View file

@ -29,13 +29,13 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import type { IFakeDoor } from '@/Interface';
import { useRootStore } from '@/stores/n8nRoot.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useUIStore } from '@/stores/ui.store';
import { useUsersStore } from '@/stores/users.store';
import { mapStores } from 'pinia';
import { defineComponent } from 'vue';
export default defineComponent({
name: 'FeatureComingSoon',

2
packages/editor-ui/src/components/GoBackButton.vue
View file

@ -6,8 +6,8 @@
</template>
<script lang="ts">
import { VIEWS } from '@/constants';
import { defineComponent } from 'vue';
import { VIEWS } from '@/constants';
export default defineComponent({
name: 'GoBackButton',

5
packages/editor-ui/src/components/HtmlEditor/HtmlEditor.vue
View file

@ -3,7 +3,7 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import prettier from 'prettier/standalone';
import htmlParser from 'prettier/parser-html';
import cssParser from 'prettier/parser-postcss';
@ -39,8 +39,9 @@ import { theme } from './theme';
import { nonTakenRanges } from './utils';
import type { Range, Section } from './types';
export default mixins(expressionManager).extend({
export default defineComponent({
name: 'HtmlEditor',
mixins: [expressionManager],
props: {
html: {
type: String,

5
packages/editor-ui/src/components/InlineExpressionEditor/InlineExpressionEditorInput.vue
View file

@ -3,7 +3,7 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { EditorView, keymap } from '@codemirror/view';
import { EditorState, Prec } from '@codemirror/state';
@ -19,8 +19,9 @@ import { inputTheme } from './theme';
import { n8nLang } from '@/plugins/codemirror/n8nLang';
import { completionManager } from '@/mixins/completionManager';
export default mixins(completionManager, expressionManager, workflowHelpers).extend({
export default defineComponent({
name: 'InlineExpressionEditorInput',
mixins: [completionManager, expressionManager, workflowHelpers],
props: {
value: {
type: String,

7
packages/editor-ui/src/components/InputPanel.vue
View file

@ -131,11 +131,12 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import type { INodeUi } from '@/Interface';
import type { IConnectedNode, INodeTypeDescription, Workflow } from 'n8n-workflow';
import RunData from './RunData.vue';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import mixins from 'vue-typed-mixins';
import NodeExecuteButton from './NodeExecuteButton.vue';
import WireMeUp from './WireMeUp.vue';
import {
@ -144,13 +145,13 @@ import {
MANUAL_TRIGGER_NODE_TYPE,
START_NODE_TYPE,
} from '@/constants';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useNDVStore } from '@/stores/ndv.store';
import { useNodeTypesStore } from '@/stores/nodeTypes.store';
export default mixins(workflowHelpers).extend({
export default defineComponent({
name: 'InputPanel',
mixins: [workflowHelpers],
components: { RunData, NodeExecuteButton, WireMeUp },
props: {
currentNodeName: {

5
packages/editor-ui/src/components/IntersectionObserved.vue
View file

@ -5,11 +5,12 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import emitter from '@/mixins/emitter';
export default mixins(emitter).extend({
export default defineComponent({
name: 'IntersectionObserved',
mixins: [emitter],
props: ['enabled'],
mounted() {
if (!this.enabled) {

10
packages/editor-ui/src/components/InviteUsersModal.vue
View file

@ -64,15 +64,14 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { useToast } from '@/composables';
import { copyPaste } from '@/mixins/copyPaste';
import Modal from './Modal.vue';
import type { IFormInputs, IInviteResponse, IUser } from '@/Interface';
import { VALID_EMAIL_REGEX, INVITE_USER_MODAL_KEY } from '@/constants';
import { ROLE } from '@/utils';
import { mapStores } from 'pinia';
import { useUsersStore } from '@/stores/users.store';
import { useSettingsStore } from '@/stores/settings.store';
import { createEventBus } from '@/event-bus';
@ -90,9 +89,10 @@ function getEmail(email: string): string {
return parsed;
}
export default mixins(copyPaste).extend({
components: { Modal },
export default defineComponent({
name: 'InviteUsersModal',
mixins: [copyPaste],
components: { Modal },
props: {
modalName: {
type: String,

4
packages/editor-ui/src/components/Logo.vue
View file

@ -3,9 +3,9 @@
</template>
<script lang="ts">
import { useRootStore } from '@/stores/n8nRoot.store';
import { mapStores } from 'pinia';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { useRootStore } from '@/stores/n8nRoot.store';
export default defineComponent({
computed: {

6
packages/editor-ui/src/components/MainHeader/MainHeader.vue
View file

@ -15,6 +15,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { Route } from 'vue-router';
import { mapStores } from 'pinia';
import { pushConnection } from '@/mixins/pushConnection';
import WorkflowDetails from '@/components/MainHeader/WorkflowDetails.vue';
import TabBar from '@/components/MainHeader/TabBar.vue';
@ -26,11 +29,8 @@ import {
} from '@/constants';
import type { IExecutionsSummary, INodeUi, ITabBarItem } from '@/Interface';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import type { Route } from 'vue-router';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useNDVStore } from '@/stores/ndv.store';
import { defineComponent } from 'vue';
export default defineComponent({
name: 'MainHeader',

8
packages/editor-ui/src/components/MainHeader/WorkflowDetails.vue
View file

@ -123,7 +123,9 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import {
DUPLICATE_MODAL_KEY,
EnterpriseEditionFeature,
@ -150,7 +152,6 @@ import type { IUser, IWorkflowDataUpdate, IWorkflowDb, IWorkflowToShare } from '
import { saveAs } from 'file-saver';
import { useTitleChange, useToast, useMessage } from '@/composables';
import type { MessageBoxInputData } from 'element-ui/types/message-box';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
@ -171,8 +172,9 @@ const hasChanged = (prev: string[], curr: string[]) => {
return curr.reduce((accu, val) => accu || !set.has(val), false);
};
export default mixins(workflowHelpers).extend({
export default defineComponent({
name: 'WorkflowDetails',
mixins: [workflowHelpers],
components: {
TagsContainer,
PushConnectionTracker,

7
packages/editor-ui/src/components/NDVDraggablePanels.vue
View file

@ -37,16 +37,16 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import { get } from 'lodash-es';
import type { INodeTypeDescription } from 'n8n-workflow';
import PanelDragButton from './PanelDragButton.vue';
import { LOCAL_STORAGE_MAIN_PANEL_RELATIVE_WIDTH, MAIN_NODE_PANEL_WIDTH } from '@/constants';
import mixins from 'vue-typed-mixins';
import { debounceHelper } from '@/mixins/debounce';
import { mapStores } from 'pinia';
import { useNDVStore } from '@/stores/ndv.store';
const SIDE_MARGIN = 24;
@ -63,8 +63,9 @@ const initialMainPanelWidth: { [key: string]: number } = {
wide: MAIN_NODE_PANEL_WIDTH * 2,
};
export default mixins(debounceHelper).extend({
export default defineComponent({
name: 'NDVDraggablePanels',
mixins: [debounceHelper],
components: {
PanelDragButton,
},

18
packages/editor-ui/src/components/Node.vue
View file

@ -169,7 +169,8 @@
</template>
<script lang="ts">
import Vue from 'vue';
import Vue, { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import {
CUSTOM_API_CALL_KEY,
LOCAL_STORAGE_PIN_DATA_DISCOVERY_CANVAS_FLAG,
@ -188,13 +189,10 @@ import { NodeHelpers } from 'n8n-workflow';
import NodeIcon from '@/components/NodeIcon.vue';
import TitledList from '@/components/TitledList.vue';
import mixins from 'vue-typed-mixins';
import { get } from 'lodash-es';
import { getStyleTokenValue, getTriggerNodeServiceName } from '@/utils';
import type { IExecutionsSummary, INodeUi, XYPosition } from '@/Interface';
import { debounceHelper } from '@/mixins/debounce';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useNDVStore } from '@/stores/ndv.store';
@ -202,15 +200,9 @@ import { useNodeTypesStore } from '@/stores/nodeTypes.store';
import { EnableNodeToggleCommand } from '@/models/history';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
export default mixins(
externalHooks,
nodeBase,
nodeHelpers,
workflowHelpers,
pinData,
debounceHelper,
).extend({
export default defineComponent({
name: 'Node',
mixins: [externalHooks, nodeBase, nodeHelpers, workflowHelpers, pinData, debounceHelper],
components: {
TitledList,
FontAwesomeIcon,
@ -408,7 +400,7 @@ export default mixins(
}
}
return;
return undefined;
},
workflowRunning(): boolean {
return this.uiStore.isActionActive('workflowRunning');

8
packages/editor-ui/src/components/NodeCredentials.vue
View file

@ -97,7 +97,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import type {
ICredentialsResponse,
INodeUi,
@ -118,9 +120,6 @@ import { nodeHelpers } from '@/mixins/nodeHelpers';
import { useToast } from '@/composables';
import TitledList from '@/components/TitledList.vue';
import mixins from 'vue-typed-mixins';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useUsersStore } from '@/stores/users.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
@ -141,8 +140,9 @@ interface CredentialDropdownOption extends ICredentialsResponse {
typeDisplayName: string;
}
export default mixins(genericHelpers, nodeHelpers).extend({
export default defineComponent({
name: 'NodeCredentials',
mixins: [genericHelpers, nodeHelpers],
props: {
readonly: {
type: Boolean,

6
packages/editor-ui/src/components/NodeList.vue
View file

@ -13,13 +13,15 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import NodeIcon from '@/components/NodeIcon.vue';
import { genericHelpers } from '@/mixins/genericHelpers';
import type { ITemplatesNode } from '@/Interface';
import mixins from 'vue-typed-mixins';
import { filterTemplateNodes } from '@/utils';
export default mixins(genericHelpers).extend({
export default defineComponent({
name: 'NodeList',
mixins: [genericHelpers],
props: {
nodes: {
type: Array,

8
packages/editor-ui/src/components/NodeSettings.vue
View file

@ -158,7 +158,8 @@
<script lang="ts">
import type { PropType } from 'vue';
import Vue from 'vue';
import Vue, { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import type {
INodeTypeDescription,
INodeParameters,
@ -191,10 +192,8 @@ import { get, set, unset } from 'lodash-es';
import { externalHooks } from '@/mixins/externalHooks';
import { nodeHelpers } from '@/mixins/nodeHelpers';
import mixins from 'vue-typed-mixins';
import NodeExecuteButton from './NodeExecuteButton.vue';
import { isCommunityPackageName } from '@/utils';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useNDVStore } from '@/stores/ndv.store';
@ -205,8 +204,9 @@ import useWorkflowsEEStore from '@/stores/workflows.ee.store';
import { useCredentialsStore } from '@/stores/credentials.store';
import type { EventBus } from '@/event-bus';
export default mixins(externalHooks, nodeHelpers).extend({
export default defineComponent({
name: 'NodeSettings',
mixins: [externalHooks, nodeHelpers],
components: {
NodeTitle,
NodeCredentials,

7
packages/editor-ui/src/components/NodeSettingsTabs.vue
View file

@ -3,6 +3,8 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { externalHooks } from '@/mixins/externalHooks';
import {
BUILTIN_NODES_DOCS_URL,
@ -13,13 +15,12 @@ import type { INodeUi, ITab } from '@/Interface';
import { useNDVStore } from '@/stores/ndv.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import type { INodeTypeDescription } from 'n8n-workflow';
import { mapStores } from 'pinia';
import mixins from 'vue-typed-mixins';
import { isCommunityPackageName } from '@/utils';
export default mixins(externalHooks).extend({
export default defineComponent({
name: 'NodeSettingsTabs',
mixins: [externalHooks],
props: {
value: {
type: String,

6
packages/editor-ui/src/components/NodeWebhooks.vue
View file

@ -58,6 +58,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { INodeTypeDescription, IWebhookDescription } from 'n8n-workflow';
import { WEBHOOK_NODE_TYPE } from '@/constants';
@ -65,10 +66,9 @@ import { copyPaste } from '@/mixins/copyPaste';
import { useToast } from '@/composables';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import mixins from 'vue-typed-mixins';
export default mixins(copyPaste, workflowHelpers).extend({
export default defineComponent({
name: 'NodeWebhooks',
mixins: [copyPaste, workflowHelpers],
props: [
'node', // NodeUi
'nodeType', // INodeTypeDescription

2
packages/editor-ui/src/components/OnboardingCallSignupModal.vue
View file

@ -58,10 +58,10 @@ import { useUIStore } from '@/stores/ui.store';
import { createEventBus } from '@/event-bus';
export default defineComponent({
name: 'OnboardingCallSignupModal',
components: {
Modal,
},
name: 'OnboardingCallSignupModal',
props: ['modalName'],
setup() {
return {

5
packages/editor-ui/src/components/OutputPanel.vue
View file

@ -98,12 +98,12 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { IExecutionResponse, INodeUi } from '@/Interface';
import type { INodeTypeDescription, IRunData, IRunExecutionData, ITaskData } from 'n8n-workflow';
import RunData from './RunData.vue';
import RunInfo from './RunInfo.vue';
import { pinData } from '@/mixins/pinData';
import mixins from 'vue-typed-mixins';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
@ -112,8 +112,9 @@ import { useNodeTypesStore } from '@/stores/nodeTypes.store';
type RunDataRef = InstanceType<typeof RunData>;
export default mixins(pinData).extend({
export default defineComponent({
name: 'OutputPanel',
mixins: [pinData],
components: { RunData, RunInfo },
props: {
runIndex: {

7
packages/editor-ui/src/components/ParameterInput.vue
View file

@ -347,6 +347,8 @@
<script lang="ts">
/* eslint-disable prefer-spread */
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { get } from 'lodash-es';
@ -382,11 +384,9 @@ import { nodeHelpers } from '@/mixins/nodeHelpers';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import { hasExpressionMapping, isValueExpression, isResourceLocatorValue } from '@/utils';
import mixins from 'vue-typed-mixins';
import { CODE_NODE_TYPE, CUSTOM_API_CALL_KEY, HTML_NODE_TYPE } from '@/constants';
import type { PropType } from 'vue';
import { debounceHelper } from '@/mixins/debounce';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useNDVStore } from '@/stores/ndv.store';
import { useNodeTypesStore } from '@/stores/nodeTypes.store';
@ -396,8 +396,9 @@ import Vue from 'vue';
type ResourceLocatorRef = InstanceType<typeof ResourceLocator>;
export default mixins(externalHooks, nodeHelpers, workflowHelpers, debounceHelper).extend({
export default defineComponent({
name: 'parameter-input',
mixins: [externalHooks, nodeHelpers, workflowHelpers, debounceHelper],
components: {
CodeNodeEditor,
HtmlEditor,

13
packages/editor-ui/src/components/ParameterInputFull.vue
View file

@ -69,13 +69,14 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import type { IN8nButton, INodeUi, IRunDataDisplayMode, IUpdateInformation } from '@/Interface';
import ParameterOptions from '@/components/ParameterOptions.vue';
import DraggableTarget from '@/components/DraggableTarget.vue';
import mixins from 'vue-typed-mixins';
import { useToast } from '@/composables';
import {
hasExpressionMapping,
@ -91,18 +92,18 @@ import type {
IParameterLabel,
} from 'n8n-workflow';
import type { BaseTextKey } from '@/plugins/i18n';
import { mapStores } from 'pinia';
import { useNDVStore } from '@/stores/ndv.store';
import { useSegment } from '@/stores/segment.store';
import { externalHooks } from '@/mixins/externalHooks';
import { getMappedResult } from '@/utils/mappingUtils';
type ParamterInputWrapperRef = InstanceType<typeof ParameterInputWrapper>;
type ParameterInputWrapperRef = InstanceType<typeof ParameterInputWrapper>;
const DISPLAY_MODES_WITH_DATA_MAPPING = ['table', 'json', 'schema'];
export default mixins(externalHooks).extend({
export default defineComponent({
name: 'parameter-input-full',
mixins: [externalHooks],
components: {
ParameterOptions,
DraggableTarget,
@ -231,14 +232,14 @@ export default mixins(externalHooks).extend({
this.menuExpanded = expanded;
},
optionSelected(command: string) {
const paramRef = this.$refs.param as ParamterInputWrapperRef | undefined;
const paramRef = this.$refs.param as ParameterInputWrapperRef | undefined;
paramRef?.$emit('optionSelected', command);
},
valueChanged(parameterData: IUpdateInformation) {
this.$emit('valueChanged', parameterData);
},
onTextInput(parameterData: IUpdateInformation) {
const paramRef = this.$refs.param as ParamterInputWrapperRef | undefined;
const paramRef = this.$refs.param as ParameterInputWrapperRef | undefined;
if (isValueExpression(this.parameter, parameterData.value)) {
paramRef?.$emit('optionSelected', 'addExpression');

2
packages/editor-ui/src/components/ParameterInputHint.vue
View file

@ -11,8 +11,8 @@
</template>
<script lang="ts">
import { sanitizeHtml } from '@/utils';
import { defineComponent } from 'vue';
import { sanitizeHtml } from '@/utils';
export default defineComponent({
name: 'InputHint',

10
packages/editor-ui/src/components/ParameterInputList.vue
View file

@ -115,6 +115,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import type { INodeParameters, INodeProperties, NodeParameterValue } from 'n8n-workflow';
import { deepCopy } from 'n8n-workflow';
@ -126,17 +129,14 @@ import ParameterInputFull from '@/components/ParameterInputFull.vue';
import ImportParameter from '@/components/ImportParameter.vue';
import { get, set } from 'lodash-es';
import mixins from 'vue-typed-mixins';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import { useNDVStore } from '@/stores/ndv.store';
import { useNodeTypesStore } from '@/stores/nodeTypes.store';
import { isAuthRelatedParameter, getNodeAuthFields, getMainAuthField } from '@/utils';
import { KEEP_AUTH_IN_NDV_FOR_NODES } from '@/constants';
export default mixins(workflowHelpers).extend({
export default defineComponent({
name: 'ParameterInputList',
mixins: [workflowHelpers],
components: {
MultipleParameter,
ParameterInputFull,

7
packages/editor-ui/src/components/ParameterInputWrapper.vue
View file

@ -42,11 +42,12 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import ParameterInput from '@/components/ParameterInput.vue';
import InputHint from '@/components/ParameterInputHint.vue';
import mixins from 'vue-typed-mixins';
import type {
INodeProperties,
INodePropertyMode,
@ -57,13 +58,13 @@ import { isResourceLocatorValue } from 'n8n-workflow';
import type { INodeUi, IUpdateInformation, TargetItem } from '@/Interface';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import { isValueExpression } from '@/utils';
import { mapStores } from 'pinia';
import { useNDVStore } from '@/stores/ndv.store';
type ParamRef = InstanceType<typeof ParameterInput>;
export default mixins(workflowHelpers).extend({
export default defineComponent({
name: 'parameter-input-wrapper',
mixins: [workflowHelpers],
components: {
ParameterInput,
InputHint,

9
packages/editor-ui/src/components/PersonalizationModal.vue
View file

@ -36,7 +36,8 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
const SURVEY_VERSION = 'v4';
@ -130,16 +131,16 @@ import Modal from '@/components/Modal.vue';
import type { IFormInputs, IPersonalizationLatestVersion, IUser } from '@/Interface';
import { getAccountAge } from '@/utils';
import type { GenericValue } from 'n8n-workflow';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useRootStore } from '@/stores/n8nRoot.store';
import { useUsersStore } from '@/stores/users.store';
import { createEventBus } from '@/event-bus';
export default mixins(workflowHelpers).extend({
components: { Modal },
export default defineComponent({
name: 'PersonalizationModal',
mixins: [workflowHelpers],
components: { Modal },
data() {
return {
isSaving: false,

4
packages/editor-ui/src/components/PushConnectionTracker.vue
View file

@ -16,9 +16,9 @@
</template>
<script lang="ts">
import { useRootStore } from '@/stores/n8nRoot.store';
import { mapStores } from 'pinia';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { useRootStore } from '@/stores/n8nRoot.store';
export default defineComponent({
name: 'PushConnectionTracker',

8
packages/editor-ui/src/components/ResourceLocator/ResourceLocator.vue
View file

@ -142,8 +142,8 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import type {
ILoadOptions,
INode,
@ -172,7 +172,6 @@ import {
hasOnlyListMode,
getMainAuthField,
} from '@/utils';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useRootStore } from '@/stores/n8nRoot.store';
@ -188,8 +187,9 @@ interface IResourceLocatorQuery {
loading: boolean;
}
export default mixins(debounceHelper, workflowHelpers, nodeHelpers).extend({
export default defineComponent({
name: 'resource-locator',
mixins: [debounceHelper, workflowHelpers, nodeHelpers],
components: {
DraggableTarget,
ExpressionEdit,

7
packages/editor-ui/src/components/RunData.vue
View file

@ -464,8 +464,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import mixins from 'vue-typed-mixins';
import { mapStores } from 'pinia';
import { saveAs } from 'file-saver';
import type {
IBinaryData,
@ -510,7 +511,6 @@ import CodeNodeEditor from '@/components/CodeNodeEditor/CodeNodeEditor.vue';
import { dataPinningEventBus } from '@/event-bus';
import { clearJsonKey, executionDataToJson, stringSizeInBytes, isEmpty } from '@/utils';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { mapStores } from 'pinia';
import { useNDVStore } from '@/stores/ndv.store';
import { useNodeTypesStore } from '@/stores/nodeTypes.store';
import { useToast } from '@/composables';
@ -524,8 +524,9 @@ export type EnterEditModeArgs = {
origin: 'editIconButton' | 'insertTestDataLink';
};
export default mixins(externalHooks, genericHelpers, nodeHelpers, pinData).extend({
export default defineComponent({
name: 'RunData',
mixins: [externalHooks, genericHelpers, nodeHelpers, pinData],
components: {
BinaryDataDisplay,
NodeErrorView,

5
packages/editor-ui/src/components/RunDataJson.vue
View file

@ -70,8 +70,8 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import mixins from 'vue-typed-mixins';
import VueJsonPretty from 'vue-json-pretty';
import type { IDataObject, INodeExecutionData } from 'n8n-workflow';
import Draggable from '@/components/Draggable.vue';
@ -87,8 +87,9 @@ import { nonExistingJsonPath } from '@/components/RunDataJsonActions.vue';
const runDataJsonActions = async () => import('@/components/RunDataJsonActions.vue');
export default mixins(externalHooks).extend({
export default defineComponent({
name: 'run-data-json',
mixins: [externalHooks],
components: {
VueJsonPretty,
Draggable,

8
packages/editor-ui/src/components/RunDataJsonActions.vue
View file

@ -35,8 +35,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import mixins from 'vue-typed-mixins';
import { mapStores } from 'pinia';
import jp from 'jsonpath';
import type { INodeUi } from '@/Interface';
import type { IDataObject } from 'n8n-workflow';
@ -45,7 +46,6 @@ import { pinData } from '@/mixins/pinData';
import { nodeHelpers } from '@/mixins/nodeHelpers';
import { genericHelpers } from '@/mixins/genericHelpers';
import { clearJsonKey, convertPath, executionDataToJson } from '@/utils';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useNDVStore } from '@/stores/ndv.store';
import { useToast } from '@/composables';
@ -58,8 +58,10 @@ type JsonPathData = {
// A path that does not exist so that nothing is selected by default
export const nonExistingJsonPath = '_!^&*';
export default mixins(genericHelpers, nodeHelpers, pinData, copyPaste).extend({
export default defineComponent({
name: 'run-data-json-actions',
mixins: [genericHelpers, nodeHelpers, pinData, copyPaste],
props: {
node: {
type: Object as PropType<INodeUi>,

9
packages/editor-ui/src/components/RunDataTable.vue
View file

@ -162,15 +162,15 @@
<script lang="ts">
/* eslint-disable prefer-spread */
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import type { INodeUi, ITableData, NDVState } from '@/Interface';
import { getPairedItemId } from '@/utils';
import type { PropType } from 'vue';
import mixins from 'vue-typed-mixins';
import type { GenericValue, IDataObject, INodeExecutionData } from 'n8n-workflow';
import Draggable from './Draggable.vue';
import { shorten } from '@/utils';
import { externalHooks } from '@/mixins/externalHooks';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useNDVStore } from '@/stores/ndv.store';
import MappingPill from './MappingPill.vue';
@ -180,8 +180,9 @@ const MAX_COLUMNS_LIMIT = 40;
type DraggableRef = InstanceType<typeof Draggable>;
export default mixins(externalHooks).extend({
export default defineComponent({
name: 'run-data-table',
mixins: [externalHooks],
components: { Draggable, MappingPill },
props: {
node: {

2
packages/editor-ui/src/components/RunInfo.vue
View file

@ -14,8 +14,8 @@
</template>
<script lang="ts">
import type { ITaskData } from 'n8n-workflow';
import { defineComponent } from 'vue';
import type { ITaskData } from 'n8n-workflow';
export default defineComponent({
props: {

4
packages/editor-ui/src/components/ScopesNotice.vue
View file

@ -3,9 +3,9 @@
</template>
<script lang="ts">
import { useCredentialsStore } from '@/stores/credentials.store';
import { mapStores } from 'pinia';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { useCredentialsStore } from '@/stores/credentials.store';
export default defineComponent({
name: 'ScopesNotice',

7
packages/editor-ui/src/components/SettingsSidebar.vue
View file

@ -21,19 +21,20 @@
</template>
<script lang="ts">
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { ABOUT_MODAL_KEY, VERSIONS_MODAL_KEY, VIEWS } from '@/constants';
import { userHelpers } from '@/mixins/userHelpers';
import type { IFakeDoor } from '@/Interface';
import type { IMenuItem } from 'n8n-design-system';
import type { BaseTextKey } from '@/plugins/i18n';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useRootStore } from '@/stores/n8nRoot.store';
export default mixins(userHelpers).extend({
export default defineComponent({
name: 'SettingsSidebar',
mixins: [userHelpers],
computed: {
...mapStores(useRootStore, useSettingsStore, useUIStore),
settingsFakeDoorFeatures(): IFakeDoor[] {

9
packages/editor-ui/src/components/Sticky.vue
View file

@ -56,9 +56,9 @@
</template>
<script lang="ts">
import Vue from 'vue';
import Vue, { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import mixins from 'vue-typed-mixins';
import { externalHooks } from '@/mixins/externalHooks';
import { nodeBase } from '@/mixins/nodeBase';
import { nodeHelpers } from '@/mixins/nodeHelpers';
@ -73,14 +73,15 @@ import type {
import type { INodeTypeDescription } from 'n8n-workflow';
import { QUICKSTART_NOTE_NAME } from '@/constants';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useNDVStore } from '@/stores/ndv.store';
import { useNodeTypesStore } from '@/stores/nodeTypes.store';
export default mixins(externalHooks, nodeBase, nodeHelpers, workflowHelpers).extend({
export default defineComponent({
name: 'Sticky',
mixins: [externalHooks, nodeBase, nodeHelpers, workflowHelpers],
props: {
nodeViewScale: {
type: Number,

2
packages/editor-ui/src/components/TagsContainer.vue
View file

@ -57,8 +57,8 @@ interface TagEl extends ITag {
}
export default defineComponent({
components: { IntersectionObserver, IntersectionObserved },
name: 'TagsContainer',
components: { IntersectionObserver, IntersectionObserved },
props: ['tagIds', 'limit', 'clickable', 'responsive', 'hoverable'],
data() {
return {

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

@ -28,8 +28,8 @@
</template>
<script lang="ts">
import { MAX_TAG_NAME_LENGTH } from '@/constants';
import { defineComponent } from 'vue';
import { MAX_TAG_NAME_LENGTH } from '@/constants';
export default defineComponent({
props: {

2
packages/editor-ui/src/components/TagsManager/TagsView/TagsView.vue
View file

@ -35,8 +35,8 @@ const matches = (name: string, filter: string) =>
name.toLowerCase().trim().includes(filter.toLowerCase().trim());
export default defineComponent({
components: { TagsTableHeader, TagsTable },
name: 'TagsView',
components: { TagsTableHeader, TagsTable },
props: ['tags', 'isLoading'],
data() {
return {

7
packages/editor-ui/src/components/Telemetry.vue
View file

@ -3,16 +3,17 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { useRootStore } from '@/stores/n8nRoot.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useUsersStore } from '@/stores/users.store';
import type { ITelemetrySettings } from 'n8n-workflow';
import { mapStores } from 'pinia';
import mixins from 'vue-typed-mixins';
import { externalHooks } from '@/mixins/externalHooks';
export default mixins(externalHooks).extend({
export default defineComponent({
name: 'Telemetry',
mixins: [externalHooks],
data() {
return {
isTelemetryInitialized: false,

5
packages/editor-ui/src/components/TemplateCard.vue
View file

@ -45,13 +45,14 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { genericHelpers } from '@/mixins/genericHelpers';
import mixins from 'vue-typed-mixins';
import { filterTemplateNodes, abbreviateNumber } from '@/utils';
import NodeList from './NodeList.vue';
export default mixins(genericHelpers).extend({
export default defineComponent({
name: 'TemplateCard',
mixins: [genericHelpers],
props: {
lastItem: {
type: Boolean,

5
packages/editor-ui/src/components/TemplateFilters.vue
View file

@ -37,12 +37,13 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { genericHelpers } from '@/mixins/genericHelpers';
import type { ITemplatesCategory } from '@/Interface';
import mixins from 'vue-typed-mixins';
export default mixins(genericHelpers).extend({
export default defineComponent({
name: 'TemplateFilters',
mixins: [genericHelpers],
props: {
sortOnPopulate: {
type: Boolean,

5
packages/editor-ui/src/components/TemplateList.vue
View file

@ -32,12 +32,13 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { genericHelpers } from '@/mixins/genericHelpers';
import mixins from 'vue-typed-mixins';
import TemplateCard from './TemplateCard.vue';
export default mixins(genericHelpers).extend({
export default defineComponent({
name: 'TemplateList',
mixins: [genericHelpers],
props: {
infiniteScrollEnabled: {
type: Boolean,

7
packages/editor-ui/src/components/TriggerPanel.vue
View file

@ -102,17 +102,17 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { EXECUTIONS_MODAL_KEY, WEBHOOK_NODE_TYPE, WORKFLOW_SETTINGS_MODAL_KEY } from '@/constants';
import type { INodeUi } from '@/Interface';
import type { INodeTypeDescription } from 'n8n-workflow';
import { getTriggerNodeServiceName } from '@/utils';
import NodeExecuteButton from '@/components/NodeExecuteButton.vue';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import mixins from 'vue-typed-mixins';
import CopyInput from '@/components/CopyInput.vue';
import NodeIcon from '@/components/NodeIcon.vue';
import { copyPaste } from '@/mixins/copyPaste';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useNDVStore } from '@/stores/ndv.store';
@ -121,8 +121,9 @@ import type { N8nInfoAccordion } from 'n8n-design-system';
type HelpRef = InstanceType<typeof N8nInfoAccordion>;
export default mixins(workflowHelpers, copyPaste).extend({
export default defineComponent({
name: 'TriggerPanel',
mixins: [workflowHelpers, copyPaste],
components: {
NodeExecuteButton,
CopyInput,

7
packages/editor-ui/src/components/ValueSurvey.vue
View file

@ -56,14 +56,14 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { VALID_EMAIL_REGEX, VALUE_SURVEY_MODAL_KEY } from '@/constants';
import type { IN8nPromptResponse } from '@/Interface';
import ModalDrawer from '@/components/ModalDrawer.vue';
import mixins from 'vue-typed-mixins';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import { mapStores } from 'pinia';
import { useSettingsStore } from '@/stores/settings.store';
import { useRootStore } from '@/stores/n8nRoot.store';
import { createEventBus } from '@/event-bus';
@ -75,8 +75,9 @@ const GREAT_FEEDBACK_TITLE =
const DEFAULT_FEEDBACK_TITLE =
"Thanks for your feedback! We'd love to understand how we can improve. Can we reach out?";
export default mixins(workflowHelpers).extend({
export default defineComponent({
name: 'ValueSurvey',
mixins: [workflowHelpers],
props: ['isActive'],
components: {
ModalDrawer,

7
packages/editor-ui/src/components/VariableSelector.vue
View file

@ -24,6 +24,8 @@
<script lang="ts">
/* eslint-disable prefer-spread */
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { PLACEHOLDER_FILLED_AT_EXECUTION_TIME, STICKY_NODE_TYPE } from '@/constants';
import type {
@ -44,8 +46,6 @@ import type { INodeUi, IVariableItemSelected, IVariableSelectorOption } from '@/
import { workflowHelpers } from '@/mixins/workflowHelpers';
import mixins from 'vue-typed-mixins';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useRootStore } from '@/stores/n8nRoot.store';
import { useNDVStore } from '@/stores/ndv.store';
@ -53,8 +53,9 @@ import { useNDVStore } from '@/stores/ndv.store';
// Node types that should not be displayed in variable selector
const SKIPPED_NODE_TYPES = [STICKY_NODE_TYPE];
export default mixins(workflowHelpers).extend({
export default defineComponent({
name: 'VariableSelector',
mixins: [workflowHelpers],
components: {
VariableSelectorItem,
},

5
packages/editor-ui/src/components/VariableSelectorItem.vue
View file

@ -59,12 +59,13 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import type { IVariableSelectorOption, IVariableItemSelected } from '@/Interface';
import { externalHooks } from '@/mixins/externalHooks';
import mixins from 'vue-typed-mixins';
export default mixins(externalHooks).extend({
export default defineComponent({
name: 'VariableSelectorItem',
mixins: [externalHooks],
props: ['allowParentSelect', 'extendAll', 'item'],
mounted() {
if (this.extended) return;

2
packages/editor-ui/src/components/VersionCard.vue
View file

@ -68,8 +68,8 @@ Vue.component('Badge', Badge);
Vue.component('WarningTooltip', WarningTooltip);
export default defineComponent({
components: { NodeIcon, TimeAgo, Badge, WarningTooltip },
name: 'VersionCard',
components: { NodeIcon, TimeAgo, Badge, WarningTooltip },
props: ['version'],
// @ts-ignore
nodeName(node: IVersionNode): string {

8
packages/editor-ui/src/components/WorkflowSettings.vue
View file

@ -325,6 +325,8 @@
<script lang="ts">
import Vue from 'vue';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { externalHooks } from '@/mixins/externalHooks';
import { genericHelpers } from '@/mixins/genericHelpers';
@ -344,11 +346,8 @@ import {
WORKFLOW_SETTINGS_MODAL_KEY,
} from '@/constants';
import mixins from 'vue-typed-mixins';
import type { WorkflowSettings } from 'n8n-workflow';
import { deepCopy } from 'n8n-workflow';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useRootStore } from '@/stores/n8nRoot.store';
@ -356,8 +355,9 @@ import useWorkflowsEEStore from '@/stores/workflows.ee.store';
import { useUsersStore } from '@/stores/users.store';
import { createEventBus } from '@/event-bus';
export default mixins(externalHooks, genericHelpers).extend({
export default defineComponent({
name: 'WorkflowSettings',
mixins: [externalHooks, genericHelpers],
components: {
Modal,
},

4
packages/editor-ui/src/components/layouts/PageViewLayout.vue
View file

@ -12,9 +12,9 @@
</template>
<script lang="ts">
import { useUIStore } from '@/stores/ui.store';
import { mapStores } from 'pinia';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
export default defineComponent({
name: 'PageViewLayout',

11
packages/editor-ui/src/components/layouts/ResourcesListLayout.vue
View file

@ -195,9 +195,11 @@
</template>
<script lang="ts">
import type { IUser } from '@/Interface';
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import type { IUser } from '@/Interface';
import PageViewLayout from '@/components/layouts/PageViewLayout.vue';
import PageViewLayoutList from '@/components/layouts/PageViewLayoutList.vue';
import {
@ -206,11 +208,9 @@ import {
MAIN_REPOSITORY_URL,
} from '@/constants';
import TemplateCard from '@/components/TemplateCard.vue';
import type { PropType } from 'vue';
import { debounceHelper } from '@/mixins/debounce';
import ResourceOwnershipSelect from '@/components/forms/ResourceOwnershipSelect.ee.vue';
import ResourceFiltersDropdown from '@/components/forms/ResourceFiltersDropdown.vue';
import { mapStores } from 'pinia';
import { useSettingsStore } from '@/stores/settings.store';
import { useUsersStore } from '@/stores/users.store';
import type { N8nInput } from 'n8n-design-system';
@ -236,8 +236,9 @@ interface IFilters {
type IResourceKeyType = 'credentials' | 'workflows';
type SearchRef = InstanceType<typeof N8nInput>;
export default mixins(debounceHelper).extend({
export default defineComponent({
name: 'resources-list-layout',
mixins: [debounceHelper],
components: {
TemplateCard,
PageViewLayout,

5
packages/editor-ui/src/mixins/completionManager.ts
View file

@ -1,10 +1,11 @@
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { ExpressionExtensions } from 'n8n-workflow';
import type { EditorView, ViewUpdate } from '@codemirror/view';
import { expressionManager } from './expressionManager';
export const completionManager = mixins(expressionManager).extend({
export const completionManager = defineComponent({
mixins: [expressionManager],
data() {
return {
editor: {} as EditorView,

7
packages/editor-ui/src/mixins/executionsHelpers.ts
View file

@ -1,7 +1,7 @@
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { i18n as locale } from '@/plugins/i18n';
import { mapStores } from 'pinia';
import mixins from 'vue-typed-mixins';
import { genericHelpers } from './genericHelpers';
import type { IExecutionsSummary } from 'n8n-workflow';
@ -12,7 +12,8 @@ export interface IExecutionUIData {
runningTime: string;
}
export const executionHelpers = mixins(genericHelpers).extend({
export const executionHelpers = defineComponent({
mixins: [genericHelpers],
computed: {
...mapStores(useWorkflowsStore),
executionId(): string {

10
packages/editor-ui/src/mixins/expressionManager.ts
View file

@ -1,18 +1,20 @@
import mixins from 'vue-typed-mixins';
import { Expression, ExpressionExtensions } from 'n8n-workflow';
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import { mapStores } from 'pinia';
import { Expression, ExpressionExtensions } from 'n8n-workflow';
import { ensureSyntaxTree } from '@codemirror/language';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import { useNDVStore } from '@/stores/ndv.store';
import { EXPRESSION_EDITOR_PARSER_TIMEOUT } from '@/constants';
import type { PropType } from 'vue';
import type { EditorView } from '@codemirror/view';
import type { TargetItem } from '@/Interface';
import type { Html, Plaintext, RawSegment, Resolvable, Segment } from '@/types/expressions';
export const expressionManager = mixins(workflowHelpers).extend({
export const expressionManager = defineComponent({
mixins: [workflowHelpers],
props: {
targetItem: {
type: Object as PropType<TargetItem | null>,

8
packages/editor-ui/src/mixins/moveNodeWorkflow.ts
View file

@ -1,10 +1,12 @@
import mixins from 'vue-typed-mixins';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { deviceSupportHelpers } from '@/mixins/deviceSupportHelpers';
import { getMousePosition } from '@/utils/nodeViewUtils';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
export const moveNodeWorkflow = mixins(deviceSupportHelpers).extend({
export const moveNodeWorkflow = defineComponent({
mixins: [deviceSupportHelpers],
data() {
return {
moveLastPosition: [0, 0],

8
packages/editor-ui/src/mixins/nodeBase.ts
View file

@ -1,11 +1,12 @@
import { defineComponent } from 'vue';
import type { PropType } from 'vue';
import mixins from 'vue-typed-mixins';
import { mapStores } from 'pinia';
import type { INodeUi } from '@/Interface';
import { deviceSupportHelpers } from '@/mixins/deviceSupportHelpers';
import { NO_OP_NODE_TYPE } from '@/constants';
import type { INodeTypeDescription } from 'n8n-workflow';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useNodeTypesStore } from '@/stores/nodeTypes.store';
@ -15,7 +16,8 @@ import * as NodeViewUtils from '@/utils/nodeViewUtils';
import { useHistoryStore } from '@/stores/history.store';
import { useCanvasStore } from '@/stores/canvas.store';
export const nodeBase = mixins(deviceSupportHelpers).extend({
export const nodeBase = defineComponent({
mixins: [deviceSupportHelpers],
mounted() {
// Initialize the node
if (this.data !== null) {

5
packages/editor-ui/src/mixins/workflowActivate.ts
View file

@ -1,14 +1,15 @@
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { externalHooks } from '@/mixins/externalHooks';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import { useToast } from '@/composables';
import { defineComponent } from 'vue';
import {
LOCAL_STORAGE_ACTIVATION_FLAG,
PLACEHOLDER_EMPTY_WORKFLOW_ID,
WORKFLOW_ACTIVE_MODAL_KEY,
} from '@/constants';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useWorkflowsStore } from '@/stores/workflows.store';

4
packages/editor-ui/src/mixins/workflowHelpers.ts
View file

@ -1,3 +1,5 @@
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import {
PLACEHOLDER_FILLED_AT_EXECUTION_TIME,
PLACEHOLDER_EMPTY_WORKFLOW_ID,
@ -47,7 +49,6 @@ import { isEqual } from 'lodash-es';
import { v4 as uuid } from 'uuid';
import { getSourceItems } from '@/utils';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useRootStore } from '@/stores/n8nRoot.store';
@ -61,7 +62,6 @@ import type { IPermissions } from '@/permissions';
import { getWorkflowPermissions } from '@/permissions';
import type { ICredentialsResponse } from '@/Interface';
import { useEnvironmentsStore } from '@/stores';
import { defineComponent } from 'vue';
export function resolveParameter(
parameter: NodeParameterValue | INodeParameters | NodeParameterValue[] | INodeParameters[],

4
packages/editor-ui/src/mixins/workflowRun.ts
View file

@ -1,3 +1,5 @@
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import type { IExecutionPushResponse, IExecutionResponse, IStartRunData } from '@/Interface';
import type { IRunData, IRunExecutionData, IWorkflowBase } from 'n8n-workflow';
@ -7,9 +9,7 @@ import { externalHooks } from '@/mixins/externalHooks';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import { useToast } from '@/composables';
import { defineComponent } from 'vue';
import { useTitleChange } from '@/composables/useTitleChange';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useWorkflowsStore } from '@/stores/workflows.store';
import { useRootStore } from '@/stores/n8nRoot.store';

6
packages/editor-ui/src/views/SettingsLogStreamingView.vue
View file

@ -79,9 +79,9 @@
</template>
<script lang="ts">
import { v4 as uuid } from 'uuid';
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import mixins from 'vue-typed-mixins';
import { v4 as uuid } from 'uuid';
import { useWorkflowsStore } from '../stores/workflows.store';
import { useUsersStore } from '../stores/users.store';
import { useCredentialsStore } from '../stores/credentials.store';
@ -95,7 +95,7 @@ import PageViewLayout from '@/components/layouts/PageViewLayout.vue';
import EventDestinationCard from '@/components/SettingsLogStreaming/EventDestinationCard.ee.vue';
import { createEventBus } from '@/event-bus';
export default mixins().extend({
export default defineComponent({
name: 'SettingsLogStreamingView',
props: {},
components: {

7
packages/editor-ui/src/views/SettingsUsersView.vue
View file

@ -59,22 +59,23 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import { EnterpriseEditionFeature, INVITE_USER_MODAL_KEY, VIEWS } from '@/constants';
import PageAlert from '@/components/PageAlert.vue';
import type { IUser, IUserListAction } from '@/Interface';
import mixins from 'vue-typed-mixins';
import { useToast } from '@/composables';
import { copyPaste } from '@/mixins/copyPaste';
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useUsersStore } from '@/stores/users.store';
import { useUsageStore } from '@/stores/usage.store';
import { useSSOStore } from '@/stores/sso.store';
export default mixins(copyPaste).extend({
export default defineComponent({
name: 'SettingsUsersView',
mixins: [copyPaste],
components: {
PageAlert,
},

8
packages/editor-ui/src/views/TemplatesCollectionView.vue
View file

@ -50,6 +50,9 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import TemplateDetails from '@/components/TemplateDetails.vue';
import TemplateList from '@/components/TemplateList.vue';
import TemplatesView from './TemplatesView.vue';
@ -62,14 +65,13 @@ import type {
ITemplatesWorkflowFull,
} from '@/Interface';
import mixins from 'vue-typed-mixins';
import { setPageTitle } from '@/utils';
import { VIEWS } from '@/constants';
import { mapStores } from 'pinia';
import { useTemplatesStore } from '@/stores/templates.store';
export default mixins(workflowHelpers).extend({
export default defineComponent({
name: 'TemplatesCollectionView',
mixins: [workflowHelpers],
components: {
TemplateDetails,
TemplateList,

7
packages/editor-ui/src/views/TemplatesSearchView.vue
View file

@ -75,6 +75,8 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import CollectionsCarousel from '@/components/CollectionsCarousel.vue';
import TemplateFilters from '@/components/TemplateFilters.vue';
import TemplateList from '@/components/TemplateList.vue';
@ -87,12 +89,10 @@ import type {
ITemplatesQuery,
ITemplatesCategory,
} from '@/Interface';
import mixins from 'vue-typed-mixins';
import type { IDataObject } from 'n8n-workflow';
import { setPageTitle } from '@/utils';
import { VIEWS } from '@/constants';
import { debounceHelper } from '@/mixins/debounce';
import { mapStores } from 'pinia';
import { useSettingsStore } from '@/stores/settings.store';
import { useUsersStore } from '@/stores/users.store';
import { useTemplatesStore } from '@/stores/templates.store';
@ -107,8 +107,9 @@ interface ISearchEvent {
wf_template_repo_session_id: string;
}
export default mixins(genericHelpers, debounceHelper).extend({
export default defineComponent({
name: 'TemplatesSearchView',
mixins: [genericHelpers, debounceHelper],
components: {
CollectionsCarousel,
TemplateFilters,

8
packages/editor-ui/src/views/TemplatesWorkflowView.vue
View file

@ -55,20 +55,22 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { mapStores } from 'pinia';
import TemplateDetails from '@/components/TemplateDetails.vue';
import TemplatesView from './TemplatesView.vue';
import WorkflowPreview from '@/components/WorkflowPreview.vue';
import type { ITemplatesWorkflow, ITemplatesWorkflowFull } from '@/Interface';
import { workflowHelpers } from '@/mixins/workflowHelpers';
import mixins from 'vue-typed-mixins';
import { setPageTitle } from '@/utils';
import { VIEWS } from '@/constants';
import { mapStores } from 'pinia';
import { useTemplatesStore } from '@/stores/templates.store';
export default mixins(workflowHelpers).extend({
export default defineComponent({
name: 'TemplatesWorkflowView',
mixins: [workflowHelpers],
components: {
TemplateDetails,
TemplatesView,

10
pnpm-lock.yaml
View file

@ -738,9 +738,6 @@ importers:
vue:
specifier: ^2.7.14
version: 2.7.14
vue-typed-mixins:
specifier: ^0.2.0
version: 0.2.0
vue2-boring-avatars:
specifier: ^0.3.8
version: 0.3.8
@ -970,9 +967,6 @@ importers:
vue-router:
specifier: ^3.6.5
version: 3.6.5(vue@2.7.14)
vue-typed-mixins:
specifier: ^0.2.0
version: 0.2.0
vue2-teleport:
specifier: ^1.0.1
version: 1.0.1
@ -22820,10 +22814,6 @@ packages:
typescript: 5.0.3
dev: true
/vue-typed-mixins@0.2.0:
resolution: {integrity: sha512-0OxuinandPWv3nm5k/reYkuKtX3jjPZ40Sy9roJz0ih8PUzmI7zSRiXFEJ62LsyRegw9Tqy+qMkajk7ipKP8Vg==}
dev: false
/vue2-boring-avatars@0.3.8:
resolution: {integrity: sha512-8vNN+zhCIiIMnSQDu0DwhJ11e9r3t4t12dromXmXDtRryBhV58NPn4XgMb4JKrBlfNK92KFrY/cxRy3nzhQfpQ==}
dependencies: