Add error message

app/components/task-toast.hbs

@@ -1,13 +1,26 @@
 <Toast>
   {{#if this.icon}}
-    <div class='inline-flex flex-shrink-0 justify-center items-center self-start'>
+    <div
+      class='inline-flex flex-shrink-0 justify-center items-center self-start'
+    >
       <this.icon @spin={{this.isEnqueued}} class='mr-4 {{this.color}}' />
     </div>
   {{/if}}
 
   <div>
     <div class='mb-2'>Task {{this.taskType}} Uid:{{this.taskUid}}</div>
-    Status: <span class={{this.color}}>{{this.taskStatus}}</span>
+    <div class='mb-2'>
+      Status:
+      <span class={{this.color}}>{{this.taskStatus}}</span>
+    </div>
+    {{#if this.task.error}}
+      Error: <a
+        href={{this.task.error.link}}
+        class='text-danger'
+        target='_blank'
+        rel='noopener noreferrer'
+      >{{this.task.error.message}}</a>
+    {{/if}}
   </div>
 
   <button

app/components/task-toast.js

@@ -72,6 +72,10 @@ export default class TaskToastComponent extends Component {
   reloadTask() {
     this.meilisearch.getTask(this.taskUid).then((task) => {
       this.task = task;
+
+      if (this.isSucceeded) {
+        this.clearInterval();
+      }
     });
   }