refactor(GUI): reuse WarningModalService in FlashErrorModal (#1051)

This is the first commit in a series of changes to normalise the use of
modals throughout the application.

`FlashStateModel` is basically a `WarningModalService` that cleans the
flash state, therefore making it re-use `WarningModalService` directly
removes unnecessary duplication.

Signed-off-by: Juan Cruz Viotti <jviotti@openmailbox.org>

lib/gui/components/flash-error-modal/controllers/flash-error-modal.js

@@ -1,47 +0,0 @@
-/*
- * Copyright 2016 resin.io
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-'use strict';
-
-module.exports = function(
-  $uibModalInstance,
-  FlashStateModel,
-  AnalyticsService,
-  flashErrorData
-) {
-
-  /**
-   * @summary Flash error data
-   * @property
-   * @public
-   */
-  this.data = flashErrorData;
-
-  /**
-   * @summary Retry flash process
-   * @function
-   * @public
-   *
-   * @example
-   * FlashErrorModalController.retry();
-   */
-  this.retry = () => {
-    FlashStateModel.resetState();
-    AnalyticsService.logEvent('Restart after failure');
-    $uibModalInstance.dismiss();
-  };
-
-};

lib/gui/components/flash-error-modal/flash-error-modal.js

@@ -23,12 +23,12 @@
 const angular = require('angular');
 const MODULE_NAME = 'Etcher.Components.FlashErrorModal';
 const FlashErrorModal = angular.module(MODULE_NAME, [
-  require('../modal/modal'),
+  require('../warning-modal/warning-modal'),
   require('../../models/flash-state'),
+  require('../../models/selection-state'),
   require('../../modules/analytics')
 ]);
 
-FlashErrorModal.controller('FlashErrorModalController', require('./controllers/flash-error-modal'));
 FlashErrorModal.service('FlashErrorModalService', require('./services/flash-error-modal'));
 
 module.exports = MODULE_NAME;

lib/gui/components/flash-error-modal/services/flash-error-modal.js

@@ -16,9 +16,7 @@
 
 'use strict';
 
-const _ = require('lodash');
+module.exports = function(WarningModalService, FlashStateModel, SelectionStateModel, AnalyticsService) {
-
-module.exports = function(ModalService) {
 
   /**
    * @summary Open the flash error modal
@@ -32,16 +30,18 @@ module.exports = function(ModalService) {
    * FlashErrorModalService.show('The drive is not large enough!');
    */
   this.show = (message) => {
-    return ModalService.open({
+    return WarningModalService.display({
-      template: './components/flash-error-modal/templates/flash-error-modal.tpl.html',
+      confirmationLabel: 'Retry',
-      controller: 'FlashErrorModalController as modal',
+      description: message
-      size: 'flash-error-modal',
+    }).then((confirmed) => {
-      resolve: {
+      FlashStateModel.resetState();
-        flashErrorData: _.constant({
+
-          message: message
+      if (confirmed) {
-        })
+        AnalyticsService.logEvent('Restart after failure');
+      } else {
+        SelectionStateModel.clear();
       }
-    }).result;
+    });
   };
 
 };

lib/gui/components/flash-error-modal/styles/_flash-error-modal.scss

@@ -1,19 +0,0 @@
-/*
- * Copyright 2016 resin.io
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-.modal-flash-error-modal .modal-title .glyphicon {
-  color: $palette-theme-danger-background;
-}

lib/gui/components/flash-error-modal/templates/flash-error-modal.tpl.html

@@ -1,19 +0,0 @@
-<div class="modal-header">
-  <h4 class="modal-title">
-    <span class="glyphicon glyphicon-exclamation-sign"></span>
-    <span>An error ocurred!</span>
-  </h4>
-
-  <button class="close" ng-click="modal.retry()">&times;</button>
-</div>
-
-<div class="modal-body">
-  <div class="modal-text">
-    <p>{{ ::modal.data.message }}</p>
-  </div>
-</div>
-
-<div class="modal-footer">
-  <button class="button button-danger button-block"
-    ng-click="modal.retry()">Retry</button>
-</div>