Error typed changed to dismissable global toast (#14099)

ui/app/controllers/variables/variable/index.js

@@ -1,7 +1,6 @@
 import Controller from '@ember/controller';
 import { set, action } from '@ember/object';
 import { task } from 'ember-concurrency';
-import messageForError from '../../../utils/message-from-adapter-error';
 import { inject as service } from '@ember/service';
 import { tracked } from '@glimmer/tracking';
 
@@ -19,9 +18,6 @@ export default class VariablesVariableIndexController extends Controller {
     return this.sortDescending ? sorted : sorted.reverse();
   }
 
-  @tracked
-  error = null;
-
   @tracked isDeleting = false;
 
   @action
@@ -43,20 +39,25 @@ export default class VariablesVariableIndexController extends Controller {
       } else {
         this.router.transitionTo('variables');
       }
-      // TODO: alert the user that the variable was successfully deleted
+      this.flashMessages.add({
+        title: 'Secure Variable deleted',
+        message: `${this.model.path} successfully deleted`,
+        type: 'success',
+        destroyOnClick: false,
+        timeout: 5000,
+      });
     } catch (err) {
-      this.error = {
-        title: 'Could Not Delete Variable',
-        description: messageForError(err, 'delete secure variables'),
-      };
+      this.flashMessages.add({
+        title: `Error deleting ${this.model.path}`,
+        message: err,
+        type: 'error',
+        destroyOnClick: false,
+        sticky: true,
+      });
     }
   })
   deleteVariableFile;
 
-  onDismissError() {
-    this.error = null;
-  }
-
   //#region Code View
   /**
    * @type {"table" | "json"}

ui/app/templates/variables/variable/index.hbs

@@ -1,28 +1,3 @@
-{{#if this.error}}
-  <div data-test-inline-error class="notification is-danger">
-    <div class="columns">
-      <div class="column">
-        <h3 data-test-inline-error-title class="title is-4">
-          {{this.error.title}}
-        </h3>
-        <p data-test-inline-error-body>
-          {{this.error.description}}
-        </p>
-      </div>
-      <div class="column is-centered is-minimum">
-        <button
-          data-test-inline-error-close
-          class="button is-danger"
-          onclick={{action this.onDismissError}}
-          type="button"
-        >
-          Okay
-        </button>
-      </div>
-    </div>
-  </div>
-{{/if}}
-
 <h1 class="variable-title title with-flex">
   <div>
     <FlightIcon @name="file-text" />