n8n/packages/editor-ui/src/store.ts

783 lines
23 KiB
TypeScript
Raw Normal View History

2019-06-23 03:35:23 -07:00
import Vue from 'vue';
import Vuex from 'vuex';
import { PLACEHOLDER_EMPTY_WORKFLOW_ID } from '@/constants';
import {
IConnection,
IConnections,
ICredentialType,
INodeConnections,
INodeIssueData,
INodeTypeDescription,
IRunData,
ITaskData,
IWorkflowSettings,
} from 'n8n-workflow';
import {
ICredentialsResponse,
IExecutionResponse,
IExecutionsCurrentSummaryExtended,
IPushDataExecutionFinished,
2019-06-23 03:35:23 -07:00
IPushDataNodeExecuteAfter,
IWorkflowDb,
INodeUi,
INodeUpdatePropertiesInformation,
IUpdateInformation,
XYPositon,
} from './Interface';
import { get } from 'lodash';
Vue.use(Vuex);
export const store = new Vuex.Store({
strict: process.env.NODE_ENV !== 'production',
state: {
activeExecutions: [] as IExecutionsCurrentSummaryExtended[],
2019-06-23 03:35:23 -07:00
activeWorkflows: [] as string[],
activeActions: [] as string[],
activeNode: null as string | null,
baseUrl: process.env.VUE_APP_URL_BASE_API ? process.env.VUE_APP_URL_BASE_API : '/',
credentials: null as ICredentialsResponse[] | null,
credentialTypes: null as ICredentialType[] | null,
endpointWebhook: 'webhook',
endpointWebhookTest: 'webhook-test',
executionId: null as string | null,
executingNode: '' as string | null,
executionWaitingForWebhook: false,
pushConnectionActive: false,
saveDataErrorExecution: 'all',
saveDataSuccessExecution: 'all',
saveManualExecutions: false,
2019-06-23 03:35:23 -07:00
timezone: 'America/New_York',
versionCli: '0.0.0',
2019-06-23 03:35:23 -07:00
workflowExecutionData: null as IExecutionResponse | null,
lastSelectedNode: null as string | null,
nodeIndex: [] as Array<string | null>,
nodeTypes: [] as INodeTypeDescription[],
nodeViewOffsetPosition: [0, 0] as XYPositon,
nodeViewMoveInProgress: false,
selectedNodes: [] as INodeUi[],
sessionId: Math.random().toString(36).substring(2, 15),
urlBaseWebhook: 'http://localhost:5678/',
workflow: {
id: PLACEHOLDER_EMPTY_WORKFLOW_ID,
name: '',
active: false,
createdAt: -1,
updatedAt: -1,
connections: {} as IConnections,
nodes: [] as INodeUi[],
settings: {} as IWorkflowSettings,
} as IWorkflowDb,
},
mutations: {
// Active Actions
addActiveAction (state, action: string) {
if (!state.activeActions.includes(action)) {
state.activeActions.push(action);
}
},
removeActiveAction (state, action: string) {
const actionIndex = state.activeActions.indexOf(action);
if (actionIndex !== -1) {
state.activeActions.splice(actionIndex, 1);
}
},
// Active Executions
addActiveExecution (state, newActiveExecution: IExecutionsCurrentSummaryExtended) {
// Check if the execution exists already
const activeExecution = state.activeExecutions.find(execution => {
return execution.idActive === newActiveExecution.idActive;
});
if (activeExecution !== undefined) {
// Exists already so no need to add it again
if (activeExecution.workflowName === undefined) {
activeExecution.workflowName = newActiveExecution.workflowName;
}
return;
}
state.activeExecutions.unshift(newActiveExecution);
},
finishActiveExecution (state, finishedActiveExecution: IPushDataExecutionFinished) {
// Find the execution to set to finished
const activeExecution = state.activeExecutions.find(execution => {
return execution.idActive === finishedActiveExecution.executionIdActive;
});
if (activeExecution === undefined) {
// The execution could not be found
return;
}
if (finishedActiveExecution.executionIdDb !== undefined) {
Vue.set(activeExecution, 'id', finishedActiveExecution.executionIdDb);
}
Vue.set(activeExecution, 'finished', finishedActiveExecution.data.finished);
Vue.set(activeExecution, 'stoppedAt', finishedActiveExecution.data.stoppedAt);
},
setActiveExecutions (state, newActiveExecutions: IExecutionsCurrentSummaryExtended[]) {
Vue.set(state, 'activeExecutions', newActiveExecutions);
},
2019-06-23 03:35:23 -07:00
// Active Workflows
setActiveWorkflows (state, newActiveWorkflows: string[]) {
state.activeWorkflows = newActiveWorkflows;
},
setWorkflowActive (state, workflowId: string) {
const index = state.activeWorkflows.indexOf(workflowId);
if (index === -1) {
state.activeWorkflows.push(workflowId);
}
},
setWorkflowInactive (state, workflowId: string) {
const index = state.activeWorkflows.indexOf(workflowId);
if (index !== -1) {
state.selectedNodes.splice(index, 1);
}
},
// Selected Nodes
addSelectedNode (state, node: INodeUi) {
state.selectedNodes.push(node);
},
removeNodeFromSelection (state, node: INodeUi) {
let index;
for (index in state.selectedNodes) {
if (state.selectedNodes[index].name === node.name) {
state.selectedNodes.splice(parseInt(index, 10), 1);
break;
}
}
},
resetSelectedNodes (state) {
Vue.set(state, 'selectedNodes', []);
},
// Active
setActive (state, newActive: boolean) {
state.workflow.active = newActive;
},
// Connections
addConnection (state, data) {
if (data.connection.length !== 2) {
// All connections need two entries
// TODO: Check if there is an error or whatever that is supposed to be returned
return;
}
const sourceData: IConnection = data.connection[0];
const destinationData: IConnection = data.connection[1];
// Check if source node and type exist already and if not add them
if (!state.workflow.connections.hasOwnProperty(sourceData.node)) {
Vue.set(state.workflow.connections, sourceData.node, {});
}
if (!state.workflow.connections[sourceData.node].hasOwnProperty(sourceData.type)) {
Vue.set(state.workflow.connections[sourceData.node], sourceData.type, []);
}
if (state.workflow.connections[sourceData.node][sourceData.type].length < (sourceData.index + 1)) {
for (let i = state.workflow.connections[sourceData.node][sourceData.type].length; i <= sourceData.index; i++) {
state.workflow.connections[sourceData.node][sourceData.type].push([]);
}
}
// Check if the same connection exists already
const checkProperties = ['index', 'node', 'type'];
let propertyName: string;
let connectionExists = false;
connectionLoop:
for (const existingConnection of state.workflow.connections[sourceData.node][sourceData.type][sourceData.index]) {
for (propertyName of checkProperties) {
if ((existingConnection as any)[propertyName] !== (destinationData as any)[propertyName]) { // tslint:disable-line:no-any
continue connectionLoop;
}
}
connectionExists = true;
break;
}
// Add the new connection if it does not exist already
if (connectionExists === false) {
state.workflow.connections[sourceData.node][sourceData.type][sourceData.index].push(destinationData);
}
},
removeConnection (state, data) {
const sourceData = data.connection[0];
const destinationData = data.connection[1];
if (!state.workflow.connections.hasOwnProperty(sourceData.node)) {
return;
}
if (!state.workflow.connections[sourceData.node].hasOwnProperty(sourceData.type)) {
return;
}
if (state.workflow.connections[sourceData.node][sourceData.type].length < (sourceData.index + 1)) {
return;
}
const connections = state.workflow.connections[sourceData.node][sourceData.type][sourceData.index];
for (const index in connections) {
if (connections[index].node === destinationData.node && connections[index].type === destinationData.type && connections[index].index === destinationData.index) {
// Found the connection to remove
connections.splice(parseInt(index, 10), 1);
}
}
},
removeAllConnections (state) {
state.workflow.connections = {};
},
removeAllNodeConnection (state, node: INodeUi) {
// Remove all source connections
if (state.workflow.connections.hasOwnProperty(node.name)) {
delete state.workflow.connections[node.name];
}
// Remove all destination connections
const indexesToRemove = [];
let sourceNode: string, type: string, sourceIndex: string, connectionIndex: string, connectionData: IConnection;
for (sourceNode of Object.keys(state.workflow.connections)) {
for (type of Object.keys(state.workflow.connections[sourceNode])) {
for (sourceIndex of Object.keys(state.workflow.connections[sourceNode][type])) {
indexesToRemove.length = 0;
for (connectionIndex of Object.keys(state.workflow.connections[sourceNode][type][parseInt(sourceIndex, 10)])) {
connectionData = state.workflow.connections[sourceNode][type][parseInt(sourceIndex, 10)][parseInt(connectionIndex, 10)];
if (connectionData.node === node.name) {
indexesToRemove.push(connectionIndex);
}
}
indexesToRemove.forEach((index) => {
state.workflow.connections[sourceNode][type][parseInt(sourceIndex, 10)].splice(parseInt(index, 10), 1);
});
}
}
}
},
// Credentials
addCredentials (state, credentialData: ICredentialsResponse) {
if (state.credentials !== null) {
state.credentials.push(credentialData);
}
},
removeCredentials (state, credentialData: ICredentialsResponse) {
if (state.credentials === null) {
return;
}
for (let i = 0; i < state.credentials.length; i++) {
if (state.credentials[i].id === credentialData.id) {
state.credentials.splice(i, 1);
return;
}
}
},
updateCredentials (state, credentialData: ICredentialsResponse) {
if (state.credentials === null) {
return;
}
for (let i = 0; i < state.credentials.length; i++) {
if (state.credentials[i].id === credentialData.id) {
state.credentials[i] = credentialData;
return;
}
}
},
setCredentials (state, credentials: ICredentialsResponse[]) {
Vue.set(state, 'credentials', credentials);
},
setCredentialTypes (state, credentialTypes: ICredentialType[]) {
Vue.set(state, 'credentialTypes', credentialTypes);
},
renameNodeSelectedAndExecution (state, nameData) {
// If node has any WorkflowResultData rename also that one that the data
// does still get displayed also after node got renamed
if (state.workflowExecutionData !== null && state.workflowExecutionData.data.resultData.runData.hasOwnProperty(nameData.old)) {
state.workflowExecutionData.data.resultData.runData[nameData.new] = state.workflowExecutionData.data.resultData.runData[nameData.old];
delete state.workflowExecutionData.data.resultData.runData[nameData.old];
}
// In case the renamed node was last selected set it also there with the new name
if (state.lastSelectedNode === nameData.old) {
state.lastSelectedNode = nameData.new;
}
},
resetAllNodesIssues (state) {
state.workflow.nodes.forEach((node) => {
node.issues = undefined;
});
return true;
},
setNodeIssue (state, nodeIssueData: INodeIssueData) {
const node = state.workflow.nodes.find(node => {
return node.name === nodeIssueData.node;
});
if (!node) {
return false;
}
if (nodeIssueData.value === null) {
// Remove the value if one exists
if (node.issues === undefined || node.issues[nodeIssueData.type] === undefined) {
// No values for type exist so nothing has to get removed
return true;
}
// @ts-ignore
Vue.delete(node.issues, nodeIssueData.type);
} else {
if (node.issues === undefined) {
Vue.set(node, 'issues', {});
}
// Set/Overwrite the value
Vue.set(node.issues!, nodeIssueData.type, nodeIssueData.value);
}
return true;
},
// Id
setWorkflowId (state, id: string) {
state.workflow.id = id;
},
// Name
setWorkflowName (state, newName: string) {
state.workflow.name = newName;
},
// Nodes
addNode (state, nodeData: INodeUi) {
if (!nodeData.hasOwnProperty('name')) {
// All nodes have to have a name
// TODO: Check if there is an error or whatever that is supposed to be returned
return;
}
state.workflow.nodes.push(nodeData);
},
removeNode (state, node: INodeUi) {
for (let i = 0; i < state.workflow.nodes.length; i++) {
if (state.workflow.nodes[i].name === node.name) {
state.workflow.nodes.splice(i, 1);
return;
}
}
},
removeAllNodes (state) {
state.workflow.nodes.splice(0, state.workflow.nodes.length);
},
updateNodeProperties (state, updateInformation: INodeUpdatePropertiesInformation) {
// Find the node that should be updated
const node = state.workflow.nodes.find(node => {
return node.name === updateInformation.name;
});
if (node) {
for (const key of Object.keys(updateInformation.properties)) {
Vue.set(node, key, updateInformation.properties[key]);
}
}
},
setNodeValue (state, updateInformation: IUpdateInformation) {
2019-06-23 03:35:23 -07:00
// Find the node that should be updated
const node = state.workflow.nodes.find(node => {
return node.name === updateInformation.name;
});
if (node === undefined || node === null) {
throw new Error(`Node with the name "${updateInformation.name}" could not be found to set parameter.`);
}
Vue.set(node, updateInformation.key, updateInformation.value);
},
setNodeParameters (state, updateInformation: IUpdateInformation) {
// Find the node that should be updated
const node = state.workflow.nodes.find(node => {
return node.name === updateInformation.name;
});
2019-06-23 03:35:23 -07:00
if (node === undefined || node === null) {
throw new Error(`Node with the name "${updateInformation.name}" could not be found to set parameter.`);
2019-06-23 03:35:23 -07:00
}
Vue.set(node, 'parameters', updateInformation.value);
2019-06-23 03:35:23 -07:00
},
// Node-Index
addToNodeIndex (state, nodeName: string) {
state.nodeIndex.push(nodeName);
},
setNodeIndex (state, newData: { index: number, name: string | null}) {
state.nodeIndex[newData.index] = newData.name;
},
resetNodeIndex (state) {
Vue.set(state, 'nodeIndex', []);
},
// Node-View
setNodeViewMoveInProgress (state, value: boolean) {
state.nodeViewMoveInProgress = value;
},
setNodeViewOffsetPosition (state, newOffset: XYPositon) {
state.nodeViewOffsetPosition = newOffset;
},
// Node-Types
setNodeTypes (state, nodeTypes: INodeTypeDescription[]) {
Vue.set(state, 'nodeTypes', nodeTypes);
},
// Active Execution
setExecutingNode (state, executingNode: string) {
state.executingNode = executingNode;
},
setExecutionWaitingForWebhook (state, newWaiting: boolean) {
state.executionWaitingForWebhook = newWaiting;
},
setActiveExecutionId (state, executionId: string | null) {
state.executionId = executionId;
},
// Push Connection
setPushConnectionActive (state, newActive: boolean) {
state.pushConnectionActive = newActive;
},
// Webhooks
setUrlBaseWebhook (state, urlBaseWebhook: string) {
Vue.set(state, 'urlBaseWebhook', urlBaseWebhook);
},
setEndpointWebhook (state, endpointWebhook: string) {
Vue.set(state, 'endpointWebhook', endpointWebhook);
},
setEndpointWebhookTest (state, endpointWebhookTest: string) {
Vue.set(state, 'endpointWebhookTest', endpointWebhookTest);
},
setSaveDataErrorExecution (state, newValue: string) {
Vue.set(state, 'saveDataErrorExecution', newValue);
},
setSaveDataSuccessExecution (state, newValue: string) {
Vue.set(state, 'saveDataSuccessExecution', newValue);
},
setSaveManualExecutions (state, saveManualExecutions: boolean) {
Vue.set(state, 'saveManualExecutions', saveManualExecutions);
2019-06-23 03:35:23 -07:00
},
setTimezone (state, timezone: string) {
Vue.set(state, 'timezone', timezone);
},
2019-09-11 14:44:19 -07:00
setVersionCli (state, version: string) {
Vue.set(state, 'versionCli', version);
},
2019-06-23 03:35:23 -07:00
addNodeType (state, typeData: INodeTypeDescription) {
if (!typeData.hasOwnProperty('name')) {
// All node-types have to have a name
// TODO: Check if there is an error or whatever that is supposed to be returned
return;
}
state.nodeTypes.push(typeData);
},
setActiveNode (state, nodeName: string) {
state.activeNode = nodeName;
},
setLastSelectedNode (state, nodeName: string) {
state.lastSelectedNode = nodeName;
},
setWorkflowExecutionData (state, workflowResultData: IExecutionResponse | null) {
state.workflowExecutionData = workflowResultData;
},
addNodeExecutionData (state, pushData: IPushDataNodeExecuteAfter): void {
if (state.workflowExecutionData === null) {
throw new Error('The "workflowExecutionData" is not initialized!');
}
if (state.workflowExecutionData.data.resultData.runData[pushData.nodeName] === undefined) {
Vue.set(state.workflowExecutionData.data.resultData.runData, pushData.nodeName, []);
}
state.workflowExecutionData.data.resultData.runData[pushData.nodeName].push(pushData.data);
},
setWorkflowSettings (state, workflowSettings: IWorkflowSettings) {
Vue.set(state.workflow, 'settings', workflowSettings);
},
// Workflow
setWorkflow (state, workflow: IWorkflowDb) {
Vue.set(state, 'workflow', workflow);
if (!state.workflow.hasOwnProperty('active')) {
Vue.set(state.workflow, 'active', false);
}
if (!state.workflow.hasOwnProperty('connections')) {
Vue.set(state.workflow, 'connections', {});
}
if (!state.workflow.hasOwnProperty('createdAt')) {
Vue.set(state.workflow, 'createdAt', -1);
}
if (!state.workflow.hasOwnProperty('updatedAt')) {
Vue.set(state.workflow, 'updatedAt', -1);
}
if (!state.workflow.hasOwnProperty('id')) {
Vue.set(state.workflow, 'id', PLACEHOLDER_EMPTY_WORKFLOW_ID);
}
if (!state.workflow.hasOwnProperty('nodes')) {
Vue.set(state.workflow, 'nodes', []);
}
if (!state.workflow.hasOwnProperty('settings')) {
Vue.set(state.workflow, 'settings', {});
}
},
},
getters: {
isActionActive: (state) => (action: string): boolean => {
return state.activeActions.includes(action);
},
getActiveExecutions: (state): IExecutionsCurrentSummaryExtended[] => {
return state.activeExecutions;
},
2019-06-23 03:35:23 -07:00
getBaseUrl: (state): string => {
return state.baseUrl;
},
getRestUrl: (state): string => {
let endpoint = 'rest';
if (process.env.VUE_APP_ENDPOINT_REST) {
endpoint = process.env.VUE_APP_ENDPOINT_REST;
}
return `${state.baseUrl}${endpoint}`;
},
getWebhookUrl: (state): string => {
return `${state.urlBaseWebhook}${state.endpointWebhook}`;
},
getWebhookTestUrl: (state): string => {
return `${state.urlBaseWebhook}${state.endpointWebhookTest}`;
},
saveDataErrorExecution: (state): string => {
return state.saveDataErrorExecution;
},
saveDataSuccessExecution: (state): string => {
return state.saveDataSuccessExecution;
},
saveManualExecutions: (state): boolean => {
return state.saveManualExecutions;
2019-06-23 03:35:23 -07:00
},
timezone: (state): string => {
return state.timezone;
},
versionCli: (state): string => {
return state.versionCli;
},
2019-06-23 03:35:23 -07:00
// Push Connection
pushConnectionActive: (state): boolean => {
return state.pushConnectionActive;
},
sessionId: (state): string => {
return state.sessionId;
},
// Active Workflows
getActiveWorkflows: (state): string[] => {
return state.activeWorkflows;
},
// Node-Index
getNodeIndex: (state) => (nodeName: string): number => {
return state.nodeIndex.indexOf(nodeName);
},
getNodeNameByIndex: (state) => (index: number): string | null => {
return state.nodeIndex[index];
},
getNodeViewOffsetPosition: (state): XYPositon => {
return state.nodeViewOffsetPosition;
},
isNodeViewMoveInProgress: (state): boolean => {
return state.nodeViewMoveInProgress;
},
// Selected Nodes
getSelectedNodes: (state): INodeUi[] => {
return state.selectedNodes;
},
isNodeSelected: (state) => (nodeName: string): boolean => {
let index;
for (index in state.selectedNodes) {
if (state.selectedNodes[index].name === nodeName) {
return true;
}
}
return false;
},
isActive: (state): boolean => {
return state.workflow.active;
},
allConnections: (state): IConnections => {
return state.workflow.connections;
},
// connectionsByNodeName: (state) => (nodeName: string): {[key: string]: Connection[][]} | null => {
// connectionsByNodeName: (state) => (nodeName: string): { [key: string]: NodeConnections} | null => {
connectionsByNodeName: (state) => (nodeName: string): INodeConnections => {
if (state.workflow.connections.hasOwnProperty(nodeName)) {
return state.workflow.connections[nodeName];
}
return {};
},
allNodes: (state): INodeUi[] => {
return state.workflow.nodes;
},
nodeByName: (state) => (nodeName: string): INodeUi | null => {
const foundNode = state.workflow.nodes.find(node => {
return node.name === nodeName;
});
if (foundNode === undefined) {
return null;
}
return foundNode;
},
nodesIssuesExist: (state): boolean => {
for (const node of state.workflow.nodes) {
if (node.issues === undefined || Object.keys(node.issues).length === 0) {
continue;
}
return true;
}
return false;
},
allCredentialTypes: (state): ICredentialType[] | null => {
return state.credentialTypes;
},
allCredentials: (state): ICredentialsResponse[] | null => {
return state.credentials;
},
credentialsByType: (state) => (credentialType: string): ICredentialsResponse[] | null => {
if (state.credentials === null) {
return null;
}
return state.credentials.filter((credentialData) => credentialData.type === credentialType);
},
credentialType: (state) => (credentialType: string): ICredentialType | null => {
if (state.credentialTypes === null) {
return null;
}
const foundType = state.credentialTypes.find(credentialData => {
return credentialData.name === credentialType;
});
if (foundType === undefined) {
return null;
}
return foundType;
},
allNodeTypes: (state): INodeTypeDescription[] => {
return state.nodeTypes;
},
nodeType: (state) => (nodeType: string): INodeTypeDescription | null => {
const foundType = state.nodeTypes.find(typeData => {
return typeData.name === nodeType;
});
if (foundType === undefined) {
return null;
}
return foundType;
},
activeNode: (state, getters): INodeUi | null => {
return getters.nodeByName(state.activeNode);
},
lastSelectedNode: (state, getters): INodeUi | null => {
return getters.nodeByName(state.lastSelectedNode);
},
// Active Execution
executingNode: (state): string | null => {
return state.executingNode;
},
activeExecutionId: (state): string | null => {
return state.executionId;
},
executionWaitingForWebhook: (state): boolean => {
return state.executionWaitingForWebhook;
},
workflowName: (state): string => {
return state.workflow.name;
},
workflowId: (state): string => {
return state.workflow.id;
},
workflowSettings: (state): IWorkflowSettings => {
if (state.workflow.settings === undefined) {
return {};
}
return state.workflow.settings;
},
// Workflow Result Data
getWorkflowExecution: (state): IExecutionResponse | null => {
return state.workflowExecutionData;
},
getWorkflowRunData: (state): IRunData | null => {
if (state.workflowExecutionData === null) {
return null;
}
return state.workflowExecutionData.data.resultData.runData;
},
getWorkflowResultDataByNodeName: (state, getters) => (nodeName: string): ITaskData[] | null => {
const workflowRunData = getters.getWorkflowRunData;
if (workflowRunData === null) {
return null;
}
if (!workflowRunData.hasOwnProperty(nodeName)) {
return null;
}
return workflowRunData[nodeName];
},
},
});
// import Vue from 'vue';
// import Vuex from 'vuex';
// Vue.use(Vuex)
// export default new Vuex.Store({
// state: {
// },
// mutations: {
// },
// actions: {
// }
// });