refactor(edge-compute): enforce es6 good practices (#3961)

* refactor(edge-groups): use es6 imports

* refactor(edge-jobs): es6 imports

* refactor(edge-stacks): use es6 imports

* refactor(edge-compute): use es6 imports in components

* refactor(edge-compute): use named imports

app/edge/views/edge-groups/editEdgeGroupView/editEdgeGroupView.html

@@ -0,0 +1,23 @@
+<rd-header>
+  <rd-header-title title-text="Edit edge group"></rd-header-title>
+  <rd-header-content> <a ui-sref="edge.groups">Edge Groups</a> &gt; {{ $ctrl.model.Name }} </rd-header-content>
+</rd-header>
+
+<div class="row" ng-if="$ctrl.model">
+  <div class="col-sm-12">
+    <rd-widget>
+      <rd-widget-body>
+        <edge-group-form
+          loaded="$ctrl.state.loaded"
+          page-type="edit"
+          form-action-label="Save edge group"
+          form-action="$ctrl.updateGroup"
+          endpoints="$ctrl.endpoints"
+          groups="$ctrl.endpointGroups"
+          tags="$ctrl.tags"
+          model="$ctrl.model"
+        ></edge-group-form>
+      </rd-widget-body>
+    </rd-widget>
+  </div>
+</div>

app/edge/views/edge-groups/editEdgeGroupView/editEdgeGroupViewController.js

@@ -0,0 +1,51 @@
+export class EditEdgeGroupController {
+  /* @ngInject */
+  constructor(EdgeGroupService, GroupService, TagService, Notifications, $state, $async, EndpointService, EndpointHelper) {
+    this.EdgeGroupService = EdgeGroupService;
+    this.GroupService = GroupService;
+    this.TagService = TagService;
+    this.Notifications = Notifications;
+    this.$state = $state;
+    this.$async = $async;
+    this.EndpointService = EndpointService;
+    this.EndpointHelper = EndpointHelper;
+
+    this.state = {
+      actionInProgress: false,
+      loaded: false,
+    };
+
+    this.updateGroup = this.updateGroup.bind(this);
+    this.updateGroupAsync = this.updateGroupAsync.bind(this);
+  }
+
+  async $onInit() {
+    const [tags, endpointGroups, group] = await Promise.all([this.TagService.tags(), this.GroupService.groups(), this.EdgeGroupService.group(this.$state.params.groupId)]);
+
+    if (!group) {
+      this.Notifications.error('Failed to find edge group', {});
+      this.$state.go('edge.groups');
+    }
+    this.tags = tags;
+    this.endpointGroups = endpointGroups;
+    this.model = group;
+    this.state.loaded = true;
+  }
+
+  updateGroup() {
+    return this.$async(this.updateGroupAsync);
+  }
+
+  async updateGroupAsync() {
+    this.state.actionInProgress = true;
+    try {
+      await this.EdgeGroupService.update(this.model);
+      this.Notifications.success('Edge group successfully updated');
+      this.$state.go('edge.groups');
+    } catch (err) {
+      this.Notifications.error('Failure', err, 'Unable to update edge group');
+    } finally {
+      this.state.actionInProgress = false;
+    }
+  }
+}

app/edge/views/edge-groups/editEdgeGroupView/index.js

@@ -0,0 +1,8 @@
+import angular from 'angular';
+
+import { EditEdgeGroupController } from './editEdgeGroupViewController';
+
+angular.module('portainer.edge').component('editEdgeGroupView', {
+  templateUrl: './editEdgeGroupView.html',
+  controller: EditEdgeGroupController,
+});