diff --git a/packages/editor-ui/src/components/MainHeader.vue b/packages/editor-ui/src/components/MainHeader.vue
index 1a40ce261d..ae4aac9c49 100644
--- a/packages/editor-ui/src/components/MainHeader.vue
+++ b/packages/editor-ui/src/components/MainHeader.vue
@@ -89,6 +89,7 @@ import { workflowHelpers } from '@/components/mixins/workflowHelpers';
import { saveAs } from 'file-saver';
import mixins from 'vue-typed-mixins';
+import titleChange from './mixins/titleChange';
export default mixins(
genericHelpers,
@@ -96,6 +97,7 @@ export default mixins(
restApi,
showMessage,
workflowHelpers,
+ titleChange
)
.extend({
name: 'MainHeader',
@@ -155,6 +157,7 @@ export default mixins(
},
methods: {
async openWorkflow (workflowId: string) {
+ titleChange.set(workflowId, 'IDLE');
// Change to other workflow
this.$router.push({
name: 'NodeViewExisting',
@@ -162,7 +165,6 @@ export default mixins(
});
},
},
-
async mounted () {
// Initialize the push connection
this.pushConnect();
diff --git a/packages/editor-ui/src/components/MainSidebar.vue b/packages/editor-ui/src/components/MainSidebar.vue
index baea830b01..85455c1f37 100644
--- a/packages/editor-ui/src/components/MainSidebar.vue
+++ b/packages/editor-ui/src/components/MainSidebar.vue
@@ -186,6 +186,7 @@ import { workflowRun } from '@/components/mixins/workflowRun';
import { saveAs } from 'file-saver';
import mixins from 'vue-typed-mixins';
+import titleChange from './mixins/titleChange';
export default mixins(
genericHelpers,
@@ -194,6 +195,7 @@ export default mixins(
workflowHelpers,
workflowRun,
workflowSave,
+ titleChange
)
.extend({
name: 'MainHeader',
@@ -417,7 +419,8 @@ export default mixins(
this.$showError(error, 'Problem deleting the workflow', 'There was a problem deleting the workflow:');
return;
}
-
+ // Reset tab title since workflow is deleted.
+ titleChange.reset();
this.$showMessage({
title: 'Workflow got deleted',
message: `The workflow "${this.workflowName}" got deleted!`,
diff --git a/packages/editor-ui/src/components/WorkflowOpen.vue b/packages/editor-ui/src/components/WorkflowOpen.vue
index 9592ecb4d5..9383363b80 100644
--- a/packages/editor-ui/src/components/WorkflowOpen.vue
+++ b/packages/editor-ui/src/components/WorkflowOpen.vue
@@ -37,11 +37,13 @@ import { showMessage } from '@/components/mixins/showMessage';
import { IWorkflowShortResponse } from '@/Interface';
import mixins from 'vue-typed-mixins';
+import titleChange from './mixins/titleChange';
export default mixins(
genericHelpers,
restApi,
showMessage,
+ titleChange
).extend({
name: 'WorkflowOpen',
props: [
@@ -89,6 +91,7 @@ export default mixins(
},
openWorkflow (data: IWorkflowShortResponse, column: any) { // tslint:disable-line:no-any
if (column.label !== 'Active') {
+ titleChange.set(data.name, 'IDLE');
this.$emit('openWorkflow', data.id);
}
},
diff --git a/packages/editor-ui/src/components/mixins/pushConnection.ts b/packages/editor-ui/src/components/mixins/pushConnection.ts
index d9e77d929c..bfc7318204 100644
--- a/packages/editor-ui/src/components/mixins/pushConnection.ts
+++ b/packages/editor-ui/src/components/mixins/pushConnection.ts
@@ -12,10 +12,12 @@ import { nodeHelpers } from '@/components/mixins/nodeHelpers';
import { showMessage } from '@/components/mixins/showMessage';
import mixins from 'vue-typed-mixins';
+import titleChange from './titleChange';
export const pushConnection = mixins(
nodeHelpers,
showMessage,
+ titleChange
)
.extend({
data () {
@@ -147,7 +149,7 @@ export const pushConnection = mixins(
*/
pushMessageReceived (event: Event, isRetry?: boolean): boolean {
const retryAttempts = 5;
-
+ const workflow = this.getWorkflow();
let receivedData: IPushData;
try {
// @ts-ignore
@@ -207,7 +209,7 @@ export const pushConnection = mixins(
if (runDataExecuted.data.resultData.error && runDataExecuted.data.resultData.error.message) {
errorMessage = `There was a problem executing the workflow:
"${runDataExecuted.data.resultData.error.message}"`;
}
-
+ titleChange.set(workflow.name, 'ERROR');
this.$showMessage({
title: 'Problem executing workflow',
message: errorMessage,
@@ -215,6 +217,7 @@ export const pushConnection = mixins(
});
} else {
// Workflow did execute without a problem
+ titleChange.set(workflow.name, 'IDLE');
this.$showMessage({
title: 'Workflow got executed',
message: 'Workflow did get executed successfully!',
diff --git a/packages/editor-ui/src/components/mixins/titleChange.ts b/packages/editor-ui/src/components/mixins/titleChange.ts
new file mode 100644
index 0000000000..eb931b2449
--- /dev/null
+++ b/packages/editor-ui/src/components/mixins/titleChange.ts
@@ -0,0 +1,25 @@
+type Status = 'EXECUTING' | 'IDLE' | 'ERROR';
+
+export default {
+ /**
+ * Change title of n8n tab
+ * @param workflow Name of workflow
+ * @param status Status of workflow
+ */
+ set (workflow : string, status : Status) {
+ if (status === 'EXECUTING') {
+ window.document.title = `n8n - 🔄 ${workflow}}`;
+ }
+ else if (status === 'IDLE') {
+ window.document.title = `n8n - ▶️ ${workflow}`;
+ }
+ else {
+ window.document.title = `n8n - ⚠️ ${workflow}`;
+ }
+
+ },
+
+ reset () {
+ document.title = `n8n - Workflow Automation`;
+ }
+};
\ No newline at end of file
diff --git a/packages/editor-ui/src/components/mixins/workflowRun.ts b/packages/editor-ui/src/components/mixins/workflowRun.ts
index a32814f5bb..5b064a308c 100644
--- a/packages/editor-ui/src/components/mixins/workflowRun.ts
+++ b/packages/editor-ui/src/components/mixins/workflowRun.ts
@@ -14,10 +14,13 @@ import { restApi } from '@/components/mixins/restApi';
import { workflowHelpers } from '@/components/mixins/workflowHelpers';
import mixins from 'vue-typed-mixins';
+import titleChange from './titleChange';
+import { title } from 'process';
export const workflowRun = mixins(
restApi,
workflowHelpers,
+ titleChange
).extend({
methods: {
// Starts to executes a workflow on server.
@@ -27,6 +30,7 @@ export const workflowRun = mixins(
// because then it can not receive the data as it executes.
throw new Error('No active connection to server. It is maybe down.');
}
+ const workflow = this.getWorkflow();
this.$store.commit('addActiveAction', 'workflowRunning');
@@ -55,7 +59,8 @@ export const workflowRun = mixins(
}
const workflow = this.getWorkflow();
-
+ titleChange.set(workflow.name, 'EXECUTING');
+
try {
// Check first if the workflow has any issues before execute it
const issuesExist = this.$store.getters.nodesIssuesExist;
@@ -78,6 +83,7 @@ export const workflowRun = mixins(
type: 'error',
duration: 0,
});
+ titleChange.set(workflow.name, 'ERROR');
return;
}
}
@@ -164,9 +170,10 @@ export const workflowRun = mixins(
},
};
this.$store.commit('setWorkflowExecutionData', executionData);
-
- return await this.runWorkflowApi(startRunData);
+
+ return await this.runWorkflowApi(startRunData);
} catch (error) {
+ titleChange.set(workflow.name, 'ERROR');
this.$showError(error, 'Problem running workflow', 'There was a problem running the workflow:');
return undefined;
}
diff --git a/packages/editor-ui/src/main.ts b/packages/editor-ui/src/main.ts
index 37784f7e89..0caf2905cb 100644
--- a/packages/editor-ui/src/main.ts
+++ b/packages/editor-ui/src/main.ts
@@ -15,6 +15,8 @@ import './n8n-theme.scss';
import App from '@/App.vue';
import router from './router';
+import titleChange from './components/mixins/titleChange';
+
import { library } from '@fortawesome/fontawesome-svg-core';
import {
faAngleDoubleLeft,
@@ -92,6 +94,7 @@ import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
import { store } from './store';
Vue.use(ElementUI, { locale });
+Vue.mixin(titleChange);
library.add(faAngleDoubleLeft);
library.add(faAngleDown);
diff --git a/packages/editor-ui/src/views/NodeView.vue b/packages/editor-ui/src/views/NodeView.vue
index 10b7896856..b16d4933ac 100644
--- a/packages/editor-ui/src/views/NodeView.vue
+++ b/packages/editor-ui/src/views/NodeView.vue
@@ -157,6 +157,7 @@ import {
IWorkflowDataUpdate,
XYPositon,
} from '../Interface';
+import titleChange from '../components/mixins/titleChange';
export default mixins(
copyPaste,
@@ -167,6 +168,7 @@ export default mixins(
showMessage,
workflowHelpers,
workflowRun,
+ titleChange
)
.extend({
name: 'NodeView',
@@ -1324,6 +1326,8 @@ export default mixins(
}
if (workflowId !== null) {
+ let workflow = await this.restApi().getWorkflow(workflowId);
+ titleChange.set(workflow.name, 'IDLE');
// Open existing workflow
await this.openWorkflow(workflowId);
} else {