n8n-io/n8n
1
1
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-07-14 16:30:27 +03:00
Code Issues Projects Releases Wiki Activity

refactor(editor): Migrate ui.store to use composition API (no-changelog) (#9892)

Browse Source
This commit is contained in:
Ricardo Espinoza 2024-07-03 15:11:40 -04:00 committed by GitHub
parent 22990342df
commit f64ca621e1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
42 changed files with 710 additions and 649 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
packages/editor-ui/src/Interface.ts
View File

@ -6,7 +6,6 @@ import type {
TRIGGER_NODE_CREATOR_VIEW,
REGULAR_NODE_CREATOR_VIEW,
AI_OTHERS_NODE_CREATOR_VIEW,
VIEWS,
ROLE,
} from '@/constants';
import type { IMenuItem, NodeCreatorTag } from 'n8n-design-system';
@ -1264,41 +1263,6 @@ export interface NotificationOptions extends Partial<ElementNotificationOptions>
message: string | ElementNotificationOptions['message'];
}
export interface UIState {
activeActions: string[];
activeCredentialType: string | null;
sidebarMenuCollapsed: boolean;
modalStack: string[];
modals: Modals;
isPageLoading: boolean;
currentView: string;
mainPanelPosition: number;
fakeDoorFeatures: IFakeDoor[];
draggable: {
isDragging: boolean;
type: string;
data: string;
canDrop: boolean;
stickyPosition: null | XYPosition;
};
stateIsDirty: boolean;
lastSelectedNode: string | null;
lastSelectedNodeOutputIndex: number | null;
lastSelectedNodeEndpointUuid: string | null;
nodeViewOffsetPosition: XYPosition;
nodeViewMoveInProgress: boolean;
selectedNodes: INodeUi[];
nodeViewInitialized: boolean;
addFirstStepOnLoad: boolean;
bannersHeight: number;
bannerStack: BannerName[];
theme: ThemeOption;
pendingNotificationsForViews: {
[key in VIEWS]?: NotificationOptions[];
};
isCreateNodeActive: boolean;
}
export type IFakeDoor = {
id: FAKE_DOOR_FEATURES;
featureName: BaseTextKey;

4
packages/editor-ui/src/components/CredentialEdit/CredentialEdit.vue
View File

@ -448,8 +448,8 @@ const showSharingContent = computed(() => activeTab.value === 'sharing' && !!cre
onMounted(async () => {
requiredCredentials.value =
isCredentialModalState(uiStore.modals[CREDENTIAL_EDIT_MODAL_KEY]) &&
uiStore.modals[CREDENTIAL_EDIT_MODAL_KEY].showAuthSelector === true;
isCredentialModalState(uiStore.modalsById[CREDENTIAL_EDIT_MODAL_KEY]) &&
uiStore.modalsById[CREDENTIAL_EDIT_MODAL_KEY].showAuthSelector === true;
if (props.mode === 'new' && credentialTypeName.value) {
credentialName.value = await credentialsStore.getNewCredentialName({

2
packages/editor-ui/src/components/FeatureComingSoon.vue
View File

@ -56,7 +56,7 @@ export default defineComponent({
return this.rootStore.instanceId;
},
featureInfo(): IFakeDoor | undefined {
return this.uiStore.getFakeDoorById(this.featureId);
return this.uiStore.fakeDoorsById[this.featureId];
},
},
methods: {

4
packages/editor-ui/src/components/GenerateCurlModal.vue
View File

@ -61,8 +61,8 @@ const ndvStore = useNDVStore();
const modalBus = createEventBus();
const formBus = createEventBus();
const initialServiceValue = uiStore.getModalData(GENERATE_CURL_MODAL_KEY)?.service as string;
const initialRequestValue = uiStore.getModalData(GENERATE_CURL_MODAL_KEY)?.request as string;
const initialServiceValue = uiStore.modalsById[GENERATE_CURL_MODAL_KEY].data?.service as string;
const initialRequestValue = uiStore.modalsById[GENERATE_CURL_MODAL_KEY].data?.request as string;
const formInputs: IFormInput[] = [
{

2
packages/editor-ui/src/components/ImportCurlModal.vue
View File

@ -66,7 +66,7 @@ const { importCurlCommand } = useImportCurlCommand({
});
onMounted(() => {
curlCommand.value = (uiStore.getModalData(IMPORT_CURL_MODAL_KEY)?.curlCommand as string) ?? '';
curlCommand.value = (uiStore.modalsById[IMPORT_CURL_MODAL_KEY].data?.curlCommand as string) ?? '';
setTimeout(() => {
inputRef.value?.focus();

2
packages/editor-ui/src/components/InputPanel.vue
View File

@ -304,7 +304,7 @@ export default defineComponent({
return false;
},
workflowRunning(): boolean {
return this.uiStore.isActionActive('workflowRunning');
return this.uiStore.isActionActive['workflowRunning'];
},
activeNode(): INodeUi | null {

2
packages/editor-ui/src/components/MainHeader/WorkflowDetails.vue
View File

@ -111,7 +111,7 @@ const isNewWorkflow = computed(() => {
});
const isWorkflowSaving = computed(() => {
return uiStore.isActionActive('workflowSaving');
return uiStore.isActionActive['workflowSaving'];
});
const onWorkflowPage = computed(() => {

6
packages/editor-ui/src/components/Modal.vue
View File

@ -1,6 +1,6 @@
<template>
<el-dialog
:model-value="uiStore.isModalOpen(name)"
:model-value="uiStore.modalsById[name].open"
:before-close="closeDialog"
:class="{
'dialog-wrapper': true,
@ -169,7 +169,7 @@ export default defineComponent({
},
methods: {
onWindowKeydown(event: KeyboardEvent) {
if (!this.uiStore.isModalActive(this.name)) {
if (!this.uiStore.isModalActiveById[this.name]) {
return;
}
@ -178,7 +178,7 @@ export default defineComponent({
}
},
handleEnter() {
if (this.uiStore.isModalActive(this.name)) {
if (this.uiStore.isModalActiveById[this.name]) {
this.$emit('enter');
}
},

6
packages/editor-ui/src/components/ModalDrawer.vue
View File

@ -1,7 +1,7 @@
<template>
<ElDrawer
:direction="direction"
:model-value="uiStore.isModalOpen(name)"
:model-value="uiStore.modalsById[name].open"
:size="width"
:before-close="close"
:modal="modal"
@ -74,7 +74,7 @@ export default defineComponent({
},
methods: {
onWindowKeydown(event: KeyboardEvent) {
if (!this.uiStore.isModalActive(this.name)) {
if (!this.uiStore.isModalActiveById[this.name]) {
return;
}
@ -83,7 +83,7 @@ export default defineComponent({
}
},
handleEnter() {
if (this.uiStore.isModalActive(this.name)) {
if (this.uiStore.isModalActiveById[this.name]) {
this.$emit('enter');
}
},

12
packages/editor-ui/src/components/ModalRoot.vue
View File

@ -1,12 +1,12 @@
<template>
<div v-if="uiStore.isModalOpen(name) || keepAlive">
<div v-if="uiStore.modalsById[name].open || keepAlive">
<slot
:modal-name="name"
:active="uiStore.isModalActive(name)"
:open="uiStore.isModalOpen(name)"
:active-id="uiStore.getModalActiveId(name)"
:mode="uiStore.getModalMode(name)"
:data="uiStore.getModalData(name)"
:active="uiStore.isModalActiveById[name]"
:open="uiStore.modalsById[name].open"
:active-id="uiStore.modalsById[name].activeId"
:mode="uiStore.modalsById[name].mode"
:data="uiStore.modalsById[name].data"
></slot>
</div>
</template>

2
packages/editor-ui/src/components/Node.vue
View File

@ -592,7 +592,7 @@ export default defineComponent({
return undefined;
},
workflowRunning(): boolean {
return this.uiStore.isActionActive('workflowRunning');
return this.uiStore.isActionActive['workflowRunning'];
},
nodeStyle() {
const returnStyles: {

4
packages/editor-ui/src/components/NodeDetailsView.vue
View File

@ -242,7 +242,7 @@ const activeNodeType = computed(() => {
return null;
});
const workflowRunning = computed(() => uiStore.isActionActive('workflowRunning'));
const workflowRunning = computed(() => uiStore.isActionActive['workflowRunning']);
const showTriggerWaitingWarning = computed(
() =>
@ -432,7 +432,7 @@ const featureRequestUrl = computed(() => {
const outputPanelEditMode = computed(() => ndvStore.outputPanelEditMode);
const isWorkflowRunning = computed(() => uiStore.isActionActive('workflowRunning'));
const isWorkflowRunning = computed(() => uiStore.isActionActive['workflowRunning']);
const isExecutionWaitingForWebhook = computed(() => workflowsStore.executionWaitingForWebhook);

2
packages/editor-ui/src/components/NodeExecuteButton.vue
View File

@ -128,7 +128,7 @@ export default defineComponent({
);
},
workflowRunning(): boolean {
return this.uiStore.isActionActive('workflowRunning');
return this.uiStore.isActionActive['workflowRunning'];
},
isTriggerNode(): boolean {
if (!this.node) {

2
packages/editor-ui/src/components/OutputPanel.vue
View File

@ -230,7 +230,7 @@ export default defineComponent({
return !!this.node && this.workflowsStore.isNodeExecuting(this.node.name);
},
workflowRunning(): boolean {
return this.uiStore.isActionActive('workflowRunning');
return this.uiStore.isActionActive['workflowRunning'];
},
workflowExecution(): IExecutionResponse | null {
return this.workflowsStore.getWorkflowExecution;

4
packages/editor-ui/src/components/Projects/ProjectMoveResourceConfirmModal.test.ts
View File

@ -8,7 +8,9 @@ import { useTelemetry } from '@/composables/useTelemetry';
vi.mock('@/stores/ui.store', () => ({
useUIStore: vi.fn().mockReturnValue({
isModalOpen: vi.fn().mockReturnValue(() => true),
modalsById: vi.fn().mockReturnValue(() => {
open: true;
}),
closeModal: vi.fn(),
}),
}));

4
packages/editor-ui/src/components/SettingsSidebar.vue
View File

@ -46,7 +46,9 @@ export default defineComponent({
computed: {
...mapStores(useRootStore, useSettingsStore, useUIStore),
settingsFakeDoorFeatures(): IFakeDoor[] {
return this.uiStore.getFakeDoorByLocation('settings');
return Object.keys(this.uiStore.fakeDoorsByLocation)
.filter((location: string) => location.includes('settings'))
.map((location) => this.uiStore.fakeDoorsByLocation[location]);
},
sidebarMenuItems(): IMenuItem[] {
const menuItems: IMenuItem[] = [

2
packages/editor-ui/src/components/SourceControlPushModal.ee.vue
View File

@ -141,7 +141,7 @@ function getContext() {
return 'workflows';
} else if (
route.fullPath.startsWith('/credentials') ||
uiStore.modals[CREDENTIAL_EDIT_MODAL_KEY].open
uiStore.modalsById[CREDENTIAL_EDIT_MODAL_KEY].open
) {
return 'credentials';
} else if (route.fullPath.startsWith('/workflow/')) {

2
packages/editor-ui/src/components/Sticky.vue
View File

@ -288,7 +288,7 @@ export default defineComponent({
);
},
workflowRunning(): boolean {
return this.uiStore.isActionActive('workflowRunning');
return this.uiStore.isActionActive['workflowRunning'];
},
},
mounted() {

2
packages/editor-ui/src/components/TriggerPanel.vue
View File

@ -264,7 +264,7 @@ export default defineComponent({
);
},
workflowRunning(): boolean {
return this.uiStore.isActionActive('workflowRunning');
return this.uiStore.isActionActive['workflowRunning'];
},
isActivelyPolling(): boolean {
const triggeredNode = this.workflowsStore.executedNode;

2
packages/editor-ui/src/components/WorkflowLMChat.vue
View File

@ -219,7 +219,7 @@ export default defineComponent({
computed: {
...mapStores(useWorkflowsStore, useUIStore, useNodeTypesStore),
isLoading(): boolean {
return this.uiStore.isActionActive('workflowRunning');
return this.uiStore.isActionActive['workflowRunning'];
},
},
async mounted() {

2
packages/editor-ui/src/components/__tests__/ChatEmbedModal.test.ts
View File

@ -12,7 +12,7 @@ const renderComponent = createComponentRenderer(ChatEmbedModal, {
pinia: createTestingPinia({
initialState: {
[STORES.UI]: {
modals: {
modalsById: {
[CHAT_EMBED_MODAL_KEY]: { open: true },
},
},

2
packages/editor-ui/src/components/__tests__/CommunityPackageInstallModal.spec.ts
View File

@ -17,7 +17,7 @@ const renderComponent = createComponentRenderer(CommunityPackageInstallModal, {
pinia: createTestingPinia({
initialState: {
[STORES.UI]: {
modals: {
modalsById: {
[COMMUNITY_PACKAGE_INSTALL_MODAL_KEY]: { open: true },
},
},

2
packages/editor-ui/src/components/__tests__/PersonalizationModal.spec.ts
View File

@ -11,7 +11,7 @@ import { useUsageStore } from '@/stores/usage.store';
const pinia = createTestingPinia({
initialState: {
[STORES.UI]: {
modals: {
modalsById: {
[PERSONALIZATION_MODAL_KEY]: { open: true },
},
},

2
packages/editor-ui/src/components/__tests__/WorkflowSettings.spec.ts
View File

@ -53,7 +53,7 @@ describe('WorkflowSettingsVue', () => {
versionId: '123',
} as IWorkflowDb);
uiStore.modals[WORKFLOW_SETTINGS_MODAL_KEY] = {
uiStore.modalsById[WORKFLOW_SETTINGS_MODAL_KEY] = {
open: true,
};
});

2
packages/editor-ui/src/components/canvas/elements/buttons/CanvasExecuteWorkflowButton.vue
View File

@ -11,7 +11,7 @@ defineEmits<{
const uiStore = useUIStore();
const locale = useI18n();
const workflowRunning = computed(() => uiStore.isActionActive('workflowRunning'));
const workflowRunning = computed(() => uiStore.isActionActive['workflowRunning']);
const runButtonText = computed(() => {
if (!workflowRunning.value) {

4
packages/editor-ui/src/composables/__tests__/useCanvasPanning.test.ts
View File

@ -8,7 +8,7 @@ vi.mock('@/stores/ui.store', () => ({
useUIStore: vi.fn(() => ({
nodeViewOffsetPosition: [0, 0],
nodeViewMoveInProgress: false,
isActionActive: vi.fn(),
isActionActive: vi.fn().mockReturnValue(() => true),
})),
}));
@ -62,7 +62,7 @@ describe('useCanvasPanning()', () => {
vi.mocked(useUIStore).mockReturnValueOnce({
nodeViewOffsetPosition: [0, 0],
nodeViewMoveInProgress: true,
isActionActive: vi.fn(),
isActionActive: vi.fn().mockReturnValue(() => true),
} as unknown as ReturnType<typeof useUIStore>);
const removeEventListenerSpy = vi.spyOn(element, 'removeEventListener');

10
packages/editor-ui/src/composables/__tests__/useNodeBase.spec.ts
View File

@ -140,21 +140,15 @@ describe('useNodeBase', () => {
it('should handle mouse left click correctly', () => {
const { mouseLeftClick } = nodeBase;
const isActionActiveFn = vi.fn().mockReturnValue(false);
// @ts-expect-error Pinia has a known issue when mocking getters, will be solved when migrating the uiStore to composition api
vi.spyOn(uiStore, 'isActionActive', 'get').mockReturnValue(isActionActiveFn);
// @ts-expect-error Pinia has a known issue when mocking getters, will be solved when migrating the uiStore to composition api
vi.spyOn(uiStore, 'isNodeSelected', 'get').mockReturnValue(() => false);
const event = new MouseEvent('click', {
bubbles: true,
cancelable: true,
});
uiStore.addActiveAction('notDragActive');
mouseLeftClick(event);
expect(isActionActiveFn).toHaveBeenCalledWith('dragActive');
expect(emit).toHaveBeenCalledWith('deselectAllNodes');
expect(emit).toHaveBeenCalledWith('nodeSelected', node.name);
});

16
packages/editor-ui/src/composables/__tests__/useRunWorkflow.spec.ts
View File

@ -25,14 +25,6 @@ vi.mock('@/stores/workflows.store', () => ({
}),
}));
vi.mock('@/stores/ui.store', () => ({
useUIStore: vi.fn().mockReturnValue({
isActionActive: vi.fn().mockReturnValue(false),
addActiveAction: vi.fn(),
removeActiveAction: vi.fn(),
}),
}));
vi.mock('@/composables/useTelemetry', () => ({
useTelemetry: vi.fn().mockReturnValue({ track: vi.fn() }),
}));
@ -103,6 +95,10 @@ describe('useRunWorkflow({ router })', () => {
workflowHelpers = useWorkflowHelpers({ router });
});
beforeEach(() => {
uiStore.activeActions = [];
});
describe('runWorkflowApi()', () => {
it('should throw an error if push connection is not active', async () => {
const { runWorkflowApi } = useRunWorkflow({ router });
@ -157,7 +153,7 @@ describe('useRunWorkflow({ router })', () => {
describe('runWorkflow()', () => {
it('should return undefined if UI action "workflowRunning" is active', async () => {
const { runWorkflow } = useRunWorkflow({ router });
vi.mocked(uiStore).isActionActive.mockReturnValue(true);
uiStore.addActiveAction('workflowRunning');
const result = await runWorkflow({});
expect(result).toBeUndefined();
});
@ -166,7 +162,7 @@ describe('useRunWorkflow({ router })', () => {
const mockExecutionResponse = { executionId: '123' };
const { runWorkflow } = useRunWorkflow({ router });
vi.mocked(uiStore).isActionActive.mockReturnValue(false);
vi.mocked(uiStore).activeActions = [''];
vi.mocked(workflowHelpers).getCurrentWorkflow.mockReturnValue({
name: 'Test Workflow',
} as unknown as Workflow);

2
packages/editor-ui/src/composables/useCanvasMouseSelect.ts
View File

@ -167,7 +167,7 @@ export default function useCanvasMouseSelect() {
return;
}
if (uiStore.isActionActive('dragActive')) {
if (uiStore.isActionActive['dragActive']) {
// If a node does currently get dragged we do not activate the selection
return;
}

4
packages/editor-ui/src/composables/useCanvasPanning.ts
View File

@ -49,7 +49,7 @@ export function useCanvasPanning(
return;
}
if (uiStore.isActionActive('dragActive')) {
if (uiStore.isActionActive['dragActive']) {
// If a node does currently get dragged we do not activate the selection
return;
}
@ -95,7 +95,7 @@ export function useCanvasPanning(
return;
}
if (uiStore.isActionActive('dragActive')) {
if (uiStore.isActionActive['dragActive']) {
return;
}

6
packages/editor-ui/src/composables/useNodeBase.ts
View File

@ -621,7 +621,7 @@ export function useNodeBase({
}
function touchEnd(_e: MouseEvent) {
if (deviceSupport.isTouchDevice && uiStore.isActionActive('dragActive')) {
if (deviceSupport.isTouchDevice && uiStore.isActionActive['dragActive']) {
uiStore.removeActiveAction('dragActive');
}
}
@ -640,14 +640,14 @@ export function useNodeBase({
}
if (!deviceSupport.isTouchDevice) {
if (uiStore.isActionActive('dragActive')) {
if (uiStore.isActionActive['dragActive']) {
uiStore.removeActiveAction('dragActive');
} else {
if (!deviceSupport.isCtrlKeyPressed(e)) {
emit('deselectAllNodes');
}
if (uiStore.isNodeSelected(data.value?.name ?? '')) {
if (uiStore.isNodeSelected[data.value?.name ?? '']) {
emit('deselectNode', name);
} else {
emit('nodeSelected', name);

6
packages/editor-ui/src/composables/usePushConnection.ts
View File

@ -149,7 +149,7 @@ export function usePushConnection({ router }: { router: ReturnType<typeof useRou
}
if (receivedData.type === 'nodeExecuteAfter' || receivedData.type === 'nodeExecuteBefore') {
if (!uiStore.isActionActive('workflowRunning')) {
if (!uiStore.isActionActive['workflowRunning']) {
// No workflow is running so ignore the messages
return false;
}
@ -169,7 +169,7 @@ export function usePushConnection({ router }: { router: ReturnType<typeof useRou
let recoveredPushData: IPushDataExecutionFinished | undefined = undefined;
if (receivedData.type === 'executionRecovered') {
const recoveredExecutionId = receivedData.data?.executionId;
const isWorkflowRunning = uiStore.isActionActive('workflowRunning');
const isWorkflowRunning = uiStore.isActionActive['workflowRunning'];
if (isWorkflowRunning && workflowsStore.activeExecutionId === recoveredExecutionId) {
// pull execution data for the recovered execution from the server
const executionData = await workflowsStore.fetchExecutionDataById(
@ -262,7 +262,7 @@ export function usePushConnection({ router }: { router: ReturnType<typeof useRou
workflowsStore.finishActiveExecution(pushData);
}
if (!uiStore.isActionActive('workflowRunning')) {
if (!uiStore.isActionActive['workflowRunning']) {
// No workflow is running so ignore the messages
return false;
}

2
packages/editor-ui/src/composables/useRunWorkflow.ts
View File

@ -91,7 +91,7 @@ export function useRunWorkflow(useRunWorkflowOpts: { router: ReturnType<typeof u
}): Promise<IExecutionPushResponse | undefined> {
const workflow = workflowHelpers.getCurrentWorkflow();
if (uiStore.isActionActive('workflowRunning')) {
if (uiStore.isActionActive['workflowRunning']) {
return;
}

2
packages/editor-ui/src/composables/useToast.ts
View File

@ -175,7 +175,7 @@ export function useToast() {
function showNotificationForViews(views: VIEWS[]) {
const notifications: NotificationOptions[] = [];
views.forEach((view) => {
notifications.push(...uiStore.getNotificationsForView(view));
notifications.push(...(uiStore.pendingNotificationsForViews[view] ?? []));
});
if (notifications.length) {
notifications.forEach(async (notification) => {

8
packages/editor-ui/src/hooks/utils/hooksAddFakeDoorFeatures.ts
View File

@ -4,8 +4,8 @@ import { FAKE_DOOR_FEATURES } from '@/constants';
import type { BaseTextKey } from '@/plugins/i18n';
export function compileFakeDoorFeatures(): IFakeDoor[] {
const store = useUIStore();
const fakeDoorFeatures: IFakeDoor[] = store.fakeDoorFeatures.map((feature) => ({ ...feature }));
const uiStore = useUIStore();
const fakeDoorFeatures: IFakeDoor[] = uiStore.fakeDoorFeatures.map((feature) => ({ ...feature }));
const environmentsFeature = fakeDoorFeatures.find(
(feature) => feature.id === FAKE_DOOR_FEATURES.ENVIRONMENTS,
@ -28,7 +28,7 @@ export function compileFakeDoorFeatures(): IFakeDoor[] {
}
export const hooksAddFakeDoorFeatures = () => {
const store = useUIStore();
const uiStore = useUIStore();
store.fakeDoorFeatures = compileFakeDoorFeatures();
uiStore.fakeDoorFeatures = compileFakeDoorFeatures();
};

4
packages/editor-ui/src/plugins/codemirror/completions/__tests__/completions.test.ts
View File

@ -357,7 +357,7 @@ describe('Resolution-based completions', () => {
vi.spyOn(workflowHelpers, 'resolveParameter').mockReturnValue($input);
uiStore.modals[CREDENTIAL_EDIT_MODAL_KEY].open = true;
uiStore.modalsById[CREDENTIAL_EDIT_MODAL_KEY].open = true;
set(settingsStore.settings, ['enterprise', EnterpriseEditionFeature.ExternalSecrets], true);
externalSecretsStore.state.secrets = {
[provider]: secrets,
@ -380,7 +380,7 @@ describe('Resolution-based completions', () => {
vi.spyOn(workflowHelpers, 'resolveParameter').mockReturnValue($input);
uiStore.modals[CREDENTIAL_EDIT_MODAL_KEY].open = true;
uiStore.modalsById[CREDENTIAL_EDIT_MODAL_KEY].open = true;
set(settingsStore.settings, ['enterprise', EnterpriseEditionFeature.ExternalSecrets], true);
externalSecretsStore.state.secrets = {
[provider]: secrets,

2
packages/editor-ui/src/plugins/codemirror/completions/utils.ts
View File

@ -108,7 +108,7 @@ export function hasNoParams(toResolve: string) {
// state-based utils
// ----------------------------------
export const isCredentialsModalOpen = () => useUIStore().modals[CREDENTIAL_EDIT_MODAL_KEY].open;
export const isCredentialsModalOpen = () => useUIStore().modalsById[CREDENTIAL_EDIT_MODAL_KEY].open;
export const isInHttpNodePagination = () => {
const ndvStore = useNDVStore();

6
packages/editor-ui/src/stores/__tests__/ui.test.ts
View File

@ -1,5 +1,5 @@
import { createPinia, setActivePinia } from 'pinia';
import { useUIStore } from '@/stores/ui.store';
import { generateUpgradeLinkUrl, useUIStore } from '@/stores/ui.store';
import { useSettingsStore } from '@/stores/settings.store';
import { useUsersStore } from '@/stores/users.store';
import { merge } from 'lodash-es';
@ -98,7 +98,7 @@ describe('UI store', () => {
'https://n8n.io/pricing?utm_campaign=utm-test-campaign&source=test_source',
],
])(
'"upgradeLinkUrl" should generate the correct URL for "%s" deployment and "%s" license environment and user role "%s"',
'"generateUpgradeLinkUrl" should generate the correct URL for "%s" deployment and "%s" license environment and user role "%s"',
async (type, environment, role, expectation) => {
setUser(role as IRole);
@ -115,7 +115,7 @@ describe('UI store', () => {
}),
);
const updateLinkUrl = await uiStore.upgradeLinkUrl('test_source', 'utm-test-campaign', type);
const updateLinkUrl = await generateUpgradeLinkUrl('test_source', 'utm-test-campaign', type);
expect(updateLinkUrl).toBe(expectation);
},

6
packages/editor-ui/src/stores/canvas.store.ts
View File

@ -236,7 +236,7 @@ export const useCanvasStore = defineStore('canvas', () => {
if (!nodeName) return;
isDragging.value = true;
const isSelected = uiStore.isNodeSelected(nodeName);
const isSelected = uiStore.isNodeSelected[nodeName];
if (params.e && !isSelected) {
// Only the node which gets dragged directly gets an event, for all others it is
@ -255,7 +255,7 @@ export const useCanvasStore = defineStore('canvas', () => {
if (!nodeName) return;
const nodeData = workflowStore.getNodeByName(nodeName);
isDragging.value = false;
if (uiStore.isActionActive('dragActive') && nodeData) {
if (uiStore.isActionActive['dragActive'] && nodeData) {
const moveNodes = uiStore.getSelectedNodes.slice();
const selectedNodeNames = moveNodes.map((node: INodeUi) => node.name);
if (!selectedNodeNames.includes(nodeData.name)) {
@ -300,7 +300,7 @@ export const useCanvasStore = defineStore('canvas', () => {
if (moveNodes.length > 1) {
historyStore.stopRecordingUndo();
}
if (uiStore.isActionActive('dragActive')) {
if (uiStore.isActionActive['dragActive']) {
uiStore.removeActiveAction('dragActive');
}
}

1165
packages/editor-ui/src/stores/ui.store.ts
View File

File diff suppressed because it is too large Load Diff

2
packages/editor-ui/src/views/NodeView.vue
View File

@ -678,7 +678,7 @@ export default defineComponent({
return this.workflowsStore.getWorkflowExecution;
},
workflowRunning(): boolean {
return this.uiStore.isActionActive('workflowRunning');
return this.uiStore.isActionActive['workflowRunning'];
},
currentWorkflow(): string {
return this.$route.params.name?.toString() || this.workflowsStore.workflowId;

2
packages/editor-ui/src/views/SettingsFakeDoorView.vue
View File

@ -23,7 +23,7 @@ export default defineComponent({
computed: {
...mapStores(useUIStore),
featureInfo(): IFakeDoor | undefined {
return this.uiStore.getFakeDoorById(this.featureId);
return this.uiStore.fakeDoorsById[this.featureId];
},
},
methods: {