mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2025-01-12 13:27:31 -08:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor: Clean up executions modal (#6822)

Browse source 
chore: Clean up executions modal
This commit is contained in:
Mutasem Aldmour 2023-08-01 13:51:49 +02:00 committed by GitHub
parent 2df0c2c473
commit 1d72225cb0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 14 additions and 83 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
packages/editor-ui/src/components/ExecutionsModal.vue
View file

@ -1,34 +0,0 @@
<template>
<Modal :name="EXECUTIONS_MODAL_KEY" width="80%" :eventBus="modalBus">
<template #content>
<ExecutionsList @closeModal="onCloseModal" />
</template>
</Modal>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import ExecutionsList from '@/components/ExecutionsList.vue';
import Modal from '@/components/Modal.vue';
import { EXECUTIONS_MODAL_KEY } from '@/constants';
import { createEventBus } from 'n8n-design-system/utils';
export default defineComponent({
name: 'ExecutionsModal',
components: {
Modal,
ExecutionsList,
},
data() {
return {
modalBus: createEventBus(),
EXECUTIONS_MODAL_KEY,
};
},
methods: {
onCloseModal() {
this.modalBus.emit('close');
},
},
});
</script>

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

@ -65,10 +65,6 @@
</template> </template>
</ModalRoot> </ModalRoot>
<ModalRoot :name="EXECUTIONS_MODAL_KEY">
<ExecutionsModal />
</ModalRoot>
<ModalRoot :name="WORKFLOW_ACTIVE_MODAL_KEY"> <ModalRoot :name="WORKFLOW_ACTIVE_MODAL_KEY">
<ActivationModal /> <ActivationModal />
</ModalRoot> </ModalRoot>
@ -138,7 +134,6 @@ import {
CREDENTIAL_SELECT_MODAL_KEY, CREDENTIAL_SELECT_MODAL_KEY,
DELETE_USER_MODAL_KEY, DELETE_USER_MODAL_KEY,
DUPLICATE_MODAL_KEY, DUPLICATE_MODAL_KEY,
EXECUTIONS_MODAL_KEY,
INVITE_USER_MODAL_KEY, INVITE_USER_MODAL_KEY,
ONBOARDING_CALL_SIGNUP_MODAL_KEY, ONBOARDING_CALL_SIGNUP_MODAL_KEY,
PERSONALIZATION_MODAL_KEY, PERSONALIZATION_MODAL_KEY,
@ -173,7 +168,6 @@ import UpdatesPanel from './UpdatesPanel.vue';
import ValueSurvey from './ValueSurvey.vue'; import ValueSurvey from './ValueSurvey.vue';
import WorkflowSettings from './WorkflowSettings.vue'; import WorkflowSettings from './WorkflowSettings.vue';
import DeleteUserModal from './DeleteUserModal.vue'; import DeleteUserModal from './DeleteUserModal.vue';
import ExecutionsModal from './ExecutionsModal.vue';
import ActivationModal from './ActivationModal.vue'; import ActivationModal from './ActivationModal.vue';
import ImportCurlModal from './ImportCurlModal.vue'; import ImportCurlModal from './ImportCurlModal.vue';
import WorkflowShareModal from './WorkflowShareModal.ee.vue'; import WorkflowShareModal from './WorkflowShareModal.ee.vue';
@ -196,7 +190,6 @@ export default defineComponent({
DeleteUserModal, DeleteUserModal,
DuplicateWorkflowDialog, DuplicateWorkflowDialog,
InviteUsersModal, InviteUsersModal,
ExecutionsModal,
ModalRoot, ModalRoot,
OnboardingCallSignupModal, OnboardingCallSignupModal,
PersonalizationModal, PersonalizationModal,
@ -229,7 +222,6 @@ export default defineComponent({
WORKFLOW_SETTINGS_MODAL_KEY, WORKFLOW_SETTINGS_MODAL_KEY,
WORKFLOW_SHARE_MODAL_KEY, WORKFLOW_SHARE_MODAL_KEY,
VALUE_SURVEY_MODAL_KEY, VALUE_SURVEY_MODAL_KEY,
EXECUTIONS_MODAL_KEY,
WORKFLOW_ACTIVE_MODAL_KEY, WORKFLOW_ACTIVE_MODAL_KEY,
IMPORT_CURL_MODAL_KEY, IMPORT_CURL_MODAL_KEY,
LOG_STREAM_MODAL_KEY, LOG_STREAM_MODAL_KEY,

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

@ -105,7 +105,7 @@
<script lang="ts"> <script lang="ts">
import { defineComponent } from 'vue'; import { defineComponent } from 'vue';
import { mapStores } from 'pinia'; import { mapStores } from 'pinia';
import { EXECUTIONS_MODAL_KEY, WEBHOOK_NODE_TYPE, WORKFLOW_SETTINGS_MODAL_KEY } from '@/constants'; import { VIEWS, WEBHOOK_NODE_TYPE, WORKFLOW_SETTINGS_MODAL_KEY } from '@/constants';
import type { INodeUi } from '@/Interface'; import type { INodeUi } from '@/Interface';
import type { INodeTypeDescription } from 'n8n-workflow'; import type { INodeTypeDescription } from 'n8n-workflow';
import { getTriggerNodeServiceName } from '@/utils'; import { getTriggerNodeServiceName } from '@/utils';
@ -158,9 +158,7 @@ export default defineComponent({
}, },
hasIssues(): boolean { hasIssues(): boolean {
return Boolean( return Boolean(
this.node && this.node?.issues && (this.node.issues.parameters || this.node.issues.credentials),
this.node.issues &&
(this.node.issues.parameters || this.node.issues.credentials),
); );
}, },
serviceName(): string { serviceName(): string {
@ -174,38 +172,28 @@ export default defineComponent({
return Boolean(this.node && this.node.type === WEBHOOK_NODE_TYPE); return Boolean(this.node && this.node.type === WEBHOOK_NODE_TYPE);
}, },
webhookHttpMethod(): string | undefined { webhookHttpMethod(): string | undefined {
if ( if (!this.node || !this.nodeType?.webhooks?.length) {
!this.node ||
!this.nodeType ||
!this.nodeType.webhooks ||
!this.nodeType.webhooks.length
) {
return undefined; return undefined;
} }
return this.getWebhookExpressionValue(this.nodeType.webhooks[0], 'httpMethod'); return this.getWebhookExpressionValue(this.nodeType.webhooks[0], 'httpMethod');
}, },
webhookTestUrl(): string | undefined { webhookTestUrl(): string | undefined {
if ( if (!this.node || !this.nodeType?.webhooks?.length) {
!this.node ||
!this.nodeType ||
!this.nodeType.webhooks ||
!this.nodeType.webhooks.length
) {
return undefined; return undefined;
} }
return this.getWebhookUrl(this.nodeType.webhooks[0], this.node, 'test'); return this.getWebhookUrl(this.nodeType.webhooks[0], this.node, 'test');
}, },
isWebhookBasedNode(): boolean { isWebhookBasedNode(): boolean {
return Boolean(this.nodeType && this.nodeType.webhooks && this.nodeType.webhooks.length); return Boolean(this.nodeType?.webhooks?.length);
}, },
isPollingNode(): boolean { isPollingNode(): boolean {
return Boolean(this.nodeType && this.nodeType.polling); return Boolean(this.nodeType && this.nodeType.polling);
}, },
isListeningForEvents(): boolean { isListeningForEvents(): boolean {
const waitingOnWebhook = this.workflowsStore.executionWaitingForWebhook as boolean; const waitingOnWebhook = this.workflowsStore.executionWaitingForWebhook;
const executedNode = this.workflowsStore.executedNode as string | undefined; const executedNode = this.workflowsStore.executedNode;
return ( return (
!!this.node && !!this.node &&
!this.node.disabled && !this.node.disabled &&
@ -232,11 +220,7 @@ export default defineComponent({
return this.$locale.baseText('ndv.trigger.pollingNode.fetchingEvent'); return this.$locale.baseText('ndv.trigger.pollingNode.fetchingEvent');
} }
if ( if (this.nodeType?.triggerPanel && typeof this.nodeType.triggerPanel.header === 'string') {
this.nodeType &&
this.nodeType.triggerPanel &&
typeof this.nodeType.triggerPanel.header === 'string'
) {
return this.nodeType.triggerPanel.header; return this.nodeType.triggerPanel.header;
} }
@ -259,11 +243,7 @@ export default defineComponent({
return ''; return '';
}, },
executionsHelp(): string { executionsHelp(): string {
if ( if (this.nodeType?.triggerPanel?.executionsHelp !== undefined) {
this.nodeType &&
this.nodeType.triggerPanel &&
this.nodeType.triggerPanel.executionsHelp !== undefined
) {
if (typeof this.nodeType.triggerPanel.executionsHelp === 'string') { if (typeof this.nodeType.triggerPanel.executionsHelp === 'string') {
return this.nodeType.triggerPanel.executionsHelp; return this.nodeType.triggerPanel.executionsHelp;
} }
@ -306,11 +286,7 @@ export default defineComponent({
return ''; return '';
} }
if ( if (this.nodeType?.triggerPanel?.activationHint) {
this.nodeType &&
this.nodeType.triggerPanel &&
this.nodeType.triggerPanel.activationHint
) {
if (typeof this.nodeType.triggerPanel.activationHint === 'string') { if (typeof this.nodeType.triggerPanel.activationHint === 'string') {
return this.nodeType.triggerPanel.activationHint; return this.nodeType.triggerPanel.activationHint;
} }
@ -368,7 +344,7 @@ export default defineComponent({
const target = e.target as HTMLElement; const target = e.target as HTMLElement;
if (target.localName !== 'a') return; if (target.localName !== 'a') return;
if (target.dataset && target.dataset.key) { if (target.dataset?.key) {
e.stopPropagation(); e.stopPropagation();
e.preventDefault(); e.preventDefault();
@ -382,7 +358,9 @@ export default defineComponent({
type: 'open-executions-log', type: 'open-executions-log',
}); });
this.ndvStore.activeNodeName = null; this.ndvStore.activeNodeName = null;
this.uiStore.openModal(EXECUTIONS_MODAL_KEY); void this.$router.push({
name: VIEWS.EXECUTIONS,
});
} else if (target.dataset.key === 'settings') { } else if (target.dataset.key === 'settings') {
this.uiStore.openModal(WORKFLOW_SETTINGS_MODAL_KEY); this.uiStore.openModal(WORKFLOW_SETTINGS_MODAL_KEY);
} }

1
packages/editor-ui/src/constants.ts
View file

@ -40,7 +40,6 @@ export const WORKFLOW_SHARE_MODAL_KEY = 'workflowShare';
export const PERSONALIZATION_MODAL_KEY = 'personalization'; export const PERSONALIZATION_MODAL_KEY = 'personalization';
export const CONTACT_PROMPT_MODAL_KEY = 'contactPrompt'; export const CONTACT_PROMPT_MODAL_KEY = 'contactPrompt';
export const VALUE_SURVEY_MODAL_KEY = 'valueSurvey'; export const VALUE_SURVEY_MODAL_KEY = 'valueSurvey';
export const EXECUTIONS_MODAL_KEY = 'executions';
export const WORKFLOW_ACTIVE_MODAL_KEY = 'activation'; export const WORKFLOW_ACTIVE_MODAL_KEY = 'activation';
export const ONBOARDING_CALL_SIGNUP_MODAL_KEY = 'onboardingCallSignup'; export const ONBOARDING_CALL_SIGNUP_MODAL_KEY = 'onboardingCallSignup';
export const COMMUNITY_PACKAGE_INSTALL_MODAL_KEY = 'communityPackageInstall'; export const COMMUNITY_PACKAGE_INSTALL_MODAL_KEY = 'communityPackageInstall';

4
packages/editor-ui/src/stores/ui.store.ts
View file

@ -15,7 +15,6 @@ import {
CREDENTIAL_SELECT_MODAL_KEY, CREDENTIAL_SELECT_MODAL_KEY,
DELETE_USER_MODAL_KEY, DELETE_USER_MODAL_KEY,
DUPLICATE_MODAL_KEY, DUPLICATE_MODAL_KEY,
EXECUTIONS_MODAL_KEY,
FAKE_DOOR_FEATURES, FAKE_DOOR_FEATURES,
IMPORT_CURL_MODAL_KEY, IMPORT_CURL_MODAL_KEY,
INVITE_USER_MODAL_KEY, INVITE_USER_MODAL_KEY,
@ -107,9 +106,6 @@ export const useUIStore = defineStore(STORES.UI, {
[WORKFLOW_SETTINGS_MODAL_KEY]: { [WORKFLOW_SETTINGS_MODAL_KEY]: {
open: false, open: false,
}, },
[EXECUTIONS_MODAL_KEY]: {
open: false,
},
[WORKFLOW_SHARE_MODAL_KEY]: { [WORKFLOW_SHARE_MODAL_KEY]: {
open: false, open: false,
}, },