feat: Replace Vue.extend with defineComponent in editor-ui (no-changelog) (#6033)

* refactor: replace Vue.extend with defineComponent in editor-ui

* fix: change $externalHooks extractions from mixins

* fix: refactor externalHooks mixin
This commit is contained in:
Alex Grozav
2023-04-21 18:51:08 +03:00
committed by GitHub
parent 8a38624cbc
commit 9c94050deb
90 changed files with 265 additions and 235 deletions

View File

@@ -37,7 +37,7 @@
</template>
<script lang="ts">
import Vue from 'vue';
import { defineComponent } from 'vue';
import { getMidCanvasPosition } from '@/utils/nodeViewUtils';
import {
DEFAULT_STICKY_HEIGHT,
@@ -48,7 +48,7 @@ import {
import { mapStores } from 'pinia';
import { useUIStore } from '@/stores/ui';
export default Vue.extend({
export default defineComponent({
name: 'node-creation',
components: {
NodeCreator: () => import('@/components/Node/NodeCreator/NodeCreator.vue'),

View File

@@ -96,7 +96,6 @@ import {
nextTick,
} from 'vue';
import { camelCase } from 'lodash-es';
import { externalHooks } from '@/mixins/externalHooks';
import { INodeTypeDescription } from 'n8n-workflow';
import ItemIterator from './ItemIterator.vue';
import SearchBar from './SearchBar.vue';
@@ -114,6 +113,7 @@ import { sublimeSearch, matchesNodeType, matchesSelectType } from '@/utils';
import { useWorkflowsStore } from '@/stores/workflows';
import { useRootStore } from '@/stores/n8nRootStore';
import { useNodeCreatorStore } from '@/stores/nodeCreator';
import { useExternalHooks } from '@/composables';
export interface Props {
showSubcategoryIcon?: boolean;
@@ -148,7 +148,7 @@ const emit = defineEmits<{
}>();
const instance = getCurrentInstance();
const { $externalHooks } = new externalHooks();
const externalHooks = useExternalHooks();
const { defaultLocale } = useRootStore();
const { workflowId } = useWorkflowsStore();
@@ -549,7 +549,7 @@ onUnmounted(() => {
});
watch(filteredNodeTypes, (returnItems) => {
$externalHooks().run('nodeCreateList.filteredNodeTypesComputed', {
externalHooks.run('nodeCreateList.filteredNodeTypesComputed', {
nodeFilter: nodeCreatorStore.itemsFilter,
result: returnItems,
selectedType: nodeCreatorStore.selectedView,
@@ -569,7 +569,7 @@ watch(
// Reset the index whenver the filter-value changes
state.activeIndex = 0;
state.activeSubcategoryIndex = 0;
$externalHooks().run('nodeCreateList.nodeFilterChanged', {
externalHooks.run('nodeCreateList.nodeFilterChanged', {
oldValue,
newValue,
selectedType: nodeCreatorStore.selectedView,

View File

@@ -105,12 +105,12 @@ import {
import CategorizedItems from './CategorizedItems.vue';
import { useNodeCreatorStore } from '@/stores/nodeCreator';
import { getCategoriesWithNodes, getCategorizedList } from '@/utils';
import { externalHooks } from '@/mixins/externalHooks';
import { useNodeTypesStore } from '@/stores/nodeTypes';
import { BaseTextKey } from '@/plugins/i18n';
import NoResults from './NoResults.vue';
import { useRootStore } from '@/stores/n8nRootStore';
import useMainPanelView from './useMainPanelView';
import { useExternalHooks } from '@/composables';
const instance = getCurrentInstance();
@@ -124,7 +124,8 @@ const state = reactive({
activeNodeActions: null as INodeTypeDescription | null,
});
const { baseUrl } = useRootStore();
const { $externalHooks } = new externalHooks();
const externalHooks = useExternalHooks();
const {
mergedAppNodes,
getActionData,
@@ -324,7 +325,7 @@ function addHttpNode(isAction: boolean) {
setAddedNodeActionParameters(updateData, telemetry, false);
const app_identifier = state.activeNodeActions?.name;
$externalHooks().run('nodeCreateList.onActionsCustmAPIClicked', { app_identifier });
externalHooks.run('nodeCreateList.onActionsCustmAPIClicked', { app_identifier });
telemetry?.trackNodesPanel('nodeCreateList.onActionsCustmAPIClicked', { app_identifier });
}
}
@@ -362,7 +363,7 @@ function trackActionsView() {
trigger_action_count,
};
$externalHooks().run('nodeCreateList.onViewActions', trackingPayload);
externalHooks.run('nodeCreateList.onViewActions', trackingPayload);
telemetry?.trackNodesPanel('nodeCreateList.onViewActions', trackingPayload);
}

View File

@@ -25,8 +25,8 @@
<script setup lang="ts">
import { onMounted, reactive, toRefs, onBeforeUnmount } from 'vue';
import { externalHooks } from '@/mixins/externalHooks';
import { EventBus } from '@/event-bus';
import { useExternalHooks } from '@/composables';
export interface Props {
placeholder: string;
@@ -43,7 +43,7 @@ const emit = defineEmits<{
(event: 'input', value: string): void;
}>();
const { $externalHooks } = new externalHooks();
const externalHooks = useExternalHooks();
const state = reactive({
inputRef: null as HTMLInputElement | null,
@@ -63,7 +63,7 @@ function clear() {
}
onMounted(() => {
$externalHooks().run('nodeCreator_searchBar.mount', { inputRef: state.inputRef });
externalHooks.run('nodeCreator_searchBar.mount', { inputRef: state.inputRef });
setTimeout(focus, 0);
});