diff --git a/package-lock.json b/package-lock.json
index df6e4b4acc7307becb13621059e917201d9b3dd3..28e8d6283c98ecadac74aa1ae05a2ca6faea002a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2693,6 +2693,11 @@
       "resolved": "https://registry.npmjs.org/bulma/-/bulma-0.8.1.tgz",
       "integrity": "sha512-Afi2zv4DKmNSYfmx55V+Mtnt8+WfR8Rs65kWArmzEuWP7vNr7dSAEDI+ORZlgOR1gueNZwpKaPdUi4ZiTNwgPA=="
     },
+    "bulma-toast": {
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/bulma-toast/-/bulma-toast-1.5.4.tgz",
+      "integrity": "sha512-yLGeupj1WOCgOS6Gtik2eyJ2aA55nFwDyTeLSoTDdRRdWsWbBcMsna3j7ZATiQTZ4o5BI05X4z/qCKc9qMysUA=="
+    },
     "bytes": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.0.0.tgz",
diff --git a/package.json b/package.json
index 8197d632b3e4d92ffc8580f72a805d964877ddc7..fd54ac8d792e242958ea2635f4082de8c83b6452 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,7 @@
     "@fortawesome/free-solid-svg-icons": "^5.13.0",
     "@ng-select/ng-select": "^3.7.3",
     "bulma": "^0.8.1",
+    "bulma-toast": "^1.5.4",
     "html2canvas": "^1.0.0-rc.5",
     "python": "0.0.4",
     "python-shell": "^1.0.8",
diff --git a/src/app/analysis.service.ts b/src/app/analysis.service.ts
index f782af95a6e371be95ad3b1279e9e2fa55c20991..a302c42ad6f56705a769774e796883779ed10cd3 100644
--- a/src/app/analysis.service.ts
+++ b/src/app/analysis.service.ts
@@ -3,6 +3,7 @@ import {QueryItem, Task} from './interfaces';
 import {Subject} from 'rxjs';
 import {HttpClient} from '@angular/common/http';
 import {environment} from '../environments/environment';
+import {toast} from 'bulma-toast';
 
 @Injectable({
   providedIn: 'root'
@@ -14,20 +15,28 @@ export class AnalysisService {
   private selectSubject = new Subject<{ item: QueryItem, selected: boolean }>();
 
   public tokens: string[] = [];
+  public finishedTokens: string[] = [];
   public tasks: Task[] = [];
 
   private intervalId: any;
 
   constructor(private http: HttpClient) {
     const tokens = localStorage.getItem('tokens');
+    const finishedTokens = localStorage.getItem('finishedTokens');
+
+
     if (tokens) {
       this.tokens = JSON.parse(tokens);
     }
+    if (finishedTokens) {
+      this.finishedTokens = JSON.parse(finishedTokens);
+    }
     this.startWatching();
   }
 
   removeTask(token) {
     this.tokens = this.tokens.filter((item) => item !== token);
+    this.finishedTokens = this.finishedTokens.filter((item) => item !== token);
     this.tasks = this.tasks.filter((item) => item.token !== (token));
     localStorage.setItem('tokens', JSON.stringify(this.tokens));
   }
@@ -93,14 +102,59 @@ export class AnalysisService {
     this.startWatching();
   }
 
+  showToast(task: Task, status: 'DONE' | 'FAILED') {
+    let toastMessage;
+    let toastType;
+    const startDate = new Date(task.info.startedAt);
+    const finishedDate = new Date(task.info.finishedAt);
+    if (status === 'DONE') {
+      toastMessage = `Computation finished succesfully.
+              \n- Algorithm: ${task.info.algorithm}
+              \n- Started At: ${startDate.getHours()}:${startDate.getMinutes()}
+              \n- Finished At: ${finishedDate.getHours()}:${finishedDate.getMinutes()}`;
+      toastType = 'is-success';
+    } else if (status === 'FAILED') {
+      toastMessage = `Computation failed.
+              \n- Algorithm: ${task.info.algorithm}
+              \n- Started At: ${startDate.getHours()}:${startDate.getMinutes()}`;
+      toastType = 'is-danger';
+    }
+
+    toast({
+      message: toastMessage,
+      duration: 5000,
+      dismissible: true,
+      pauseOnHover: true,
+      type: toastType,
+      position: 'top-center',
+      animate: { in: 'fadeIn', out: 'fadeOut' }
+    });
+  }
+
   startWatching() {
     const watch = async () => {
       if (this.tokens.length > 0) {
         this.tasks = await this.getTasks();
+        this.tasks.forEach((task) => {
+          if (this.finishedTokens.find((finishedToken) => finishedToken === task.token)) {
+          } else {
+            if (task.info.done) {
+              this.finishedTokens.push(task.token);
+              this.showToast(task, 'DONE');
+              localStorage.setItem('finishedTokens', JSON.stringify(this.finishedTokens));
+            } else if (task.info.failed) {
+              this.finishedTokens.push(task.token);
+              this.showToast(task, 'FAILED');
+              localStorage.setItem('finishedTokens', JSON.stringify(this.finishedTokens));
+            } else {
+            }
+          }
+        });
       }
     };
     watch();
     this.intervalId = setInterval(watch, 5000);
   }
 
+
 }
diff --git a/src/app/pages/explorer-page/explorer-page.component.ts b/src/app/pages/explorer-page/explorer-page.component.ts
index d27ba75fbc31d99759bf50e62f7aa6bd960b1855..7dd8002b7f8b90f32f62f7c09c3aa3b781fdb1e8 100644
--- a/src/app/pages/explorer-page/explorer-page.component.ts
+++ b/src/app/pages/explorer-page/explorer-page.component.ts
@@ -12,6 +12,7 @@ import {AnalysisService} from '../../analysis.service';
 import html2canvas from 'html2canvas';
 import {environment} from '../../../environments/environment';
 
+
 declare var vis: any;
 
 @Component({
diff --git a/src/index.html b/src/index.html
index 1c8b9b651bd9e8067206019a473495af2e120f5f..3a8acea8a766bd1ebf7a4fe6142b918998ab4a81 100644
--- a/src/index.html
+++ b/src/index.html
@@ -11,6 +11,7 @@
   <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
   <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
   <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet">
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
 </head>
 <body>
   <app-root></app-root>