From 7ea10d4d4c6d51cc98a25eaa95fbf98dfd4bdff1 Mon Sep 17 00:00:00 2001
From: George Tsiolis <tsiolis.g@gmail.com>
Date: Tue, 27 Feb 2018 20:06:55 +0200
Subject: Move SidebarAssignees vue component

---
 .../components/assignees/sidebar_assignees.js      | 92 ---------------------
 .../components/assignees/sidebar_assignees.vue     | 95 ++++++++++++++++++++++
 app/assets/javascripts/sidebar/mount_sidebar.js    |  2 +-
 3 files changed, 96 insertions(+), 93 deletions(-)
 delete mode 100644 app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.js
 create mode 100644 app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.vue

(limited to 'app/assets')

diff --git a/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.js b/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.js
deleted file mode 100644
index 8269fe1281d..00000000000
--- a/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import Flash from '../../../flash';
-import AssigneeTitle from './assignee_title';
-import Assignees from './assignees.vue';
-import Store from '../../stores/sidebar_store';
-import eventHub from '../../event_hub';
-
-export default {
-  name: 'SidebarAssignees',
-  data() {
-    return {
-      store: new Store(),
-      loading: false,
-    };
-  },
-  props: {
-    mediator: {
-      type: Object,
-      required: true,
-    },
-    field: {
-      type: String,
-      required: true,
-    },
-    signedIn: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
-  },
-  components: {
-    AssigneeTitle,
-    Assignees,
-  },
-  methods: {
-    assignSelf() {
-      // Notify gl dropdown that we are now assigning to current user
-      this.$el.parentElement.dispatchEvent(new Event('assignYourself'));
-
-      this.mediator.assignYourself();
-      this.saveAssignees();
-    },
-    saveAssignees() {
-      this.loading = true;
-
-      function setLoadingFalse() {
-        this.loading = false;
-      }
-
-      this.mediator.saveAssignees(this.field)
-        .then(setLoadingFalse.bind(this))
-        .catch(() => {
-          setLoadingFalse();
-          return new Flash('Error occurred when saving assignees');
-        });
-    },
-  },
-  created() {
-    this.removeAssignee = this.store.removeAssignee.bind(this.store);
-    this.addAssignee = this.store.addAssignee.bind(this.store);
-    this.removeAllAssignees = this.store.removeAllAssignees.bind(this.store);
-
-    // Get events from glDropdown
-    eventHub.$on('sidebar.removeAssignee', this.removeAssignee);
-    eventHub.$on('sidebar.addAssignee', this.addAssignee);
-    eventHub.$on('sidebar.removeAllAssignees', this.removeAllAssignees);
-    eventHub.$on('sidebar.saveAssignees', this.saveAssignees);
-  },
-  beforeDestroy() {
-    eventHub.$off('sidebar.removeAssignee', this.removeAssignee);
-    eventHub.$off('sidebar.addAssignee', this.addAssignee);
-    eventHub.$off('sidebar.removeAllAssignees', this.removeAllAssignees);
-    eventHub.$off('sidebar.saveAssignees', this.saveAssignees);
-  },
-  template: `
-    <div>
-      <assignee-title
-        :number-of-assignees="store.assignees.length"
-        :loading="loading || store.isFetching.assignees"
-        :editable="store.editable"
-        :show-toggle="!signedIn"
-      />
-      <assignees
-        v-if="!store.isFetching.assignees"
-        class="value"
-        :root-path="store.rootPath"
-        :users="store.assignees"
-        :editable="store.editable"
-        @assign-self="assignSelf"
-      />
-    </div>
-  `,
-};
diff --git a/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.vue b/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.vue
new file mode 100644
index 00000000000..b58e04b5e60
--- /dev/null
+++ b/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees.vue
@@ -0,0 +1,95 @@
+<script>
+import Flash from '../../../flash';
+import AssigneeTitle from './assignee_title';
+import Assignees from './assignees.vue';
+import Store from '../../stores/sidebar_store';
+import eventHub from '../../event_hub';
+
+export default {
+  name: 'SidebarAssignees',
+  components: {
+    AssigneeTitle,
+    Assignees,
+  },
+  props: {
+    mediator: {
+      type: Object,
+      required: true,
+    },
+    field: {
+      type: String,
+      required: true,
+    },
+    signedIn: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      store: new Store(),
+      loading: false,
+    };
+  },
+  created() {
+    this.removeAssignee = this.store.removeAssignee.bind(this.store);
+    this.addAssignee = this.store.addAssignee.bind(this.store);
+    this.removeAllAssignees = this.store.removeAllAssignees.bind(this.store);
+
+    // Get events from glDropdown
+    eventHub.$on('sidebar.removeAssignee', this.removeAssignee);
+    eventHub.$on('sidebar.addAssignee', this.addAssignee);
+    eventHub.$on('sidebar.removeAllAssignees', this.removeAllAssignees);
+    eventHub.$on('sidebar.saveAssignees', this.saveAssignees);
+  },
+  beforeDestroy() {
+    eventHub.$off('sidebar.removeAssignee', this.removeAssignee);
+    eventHub.$off('sidebar.addAssignee', this.addAssignee);
+    eventHub.$off('sidebar.removeAllAssignees', this.removeAllAssignees);
+    eventHub.$off('sidebar.saveAssignees', this.saveAssignees);
+  },
+  methods: {
+    assignSelf() {
+      // Notify gl dropdown that we are now assigning to current user
+      this.$el.parentElement.dispatchEvent(new Event('assignYourself'));
+
+      this.mediator.assignYourself();
+      this.saveAssignees();
+    },
+    saveAssignees() {
+      this.loading = true;
+
+      function setLoadingFalse() {
+        this.loading = false;
+      }
+
+      this.mediator.saveAssignees(this.field)
+        .then(setLoadingFalse.bind(this))
+        .catch(() => {
+          setLoadingFalse();
+          return new Flash('Error occurred when saving assignees');
+        });
+    },
+  },
+};
+</script>
+
+<template>
+  <div>
+    <assignee-title
+      :number-of-assignees="store.assignees.length"
+      :loading="loading || store.isFetching.assignees"
+      :editable="store.editable"
+      :show-toggle="!signedIn"
+    />
+    <assignees
+      v-if="!store.isFetching.assignees"
+      class="value"
+      :root-path="store.rootPath"
+      :users="store.assignees"
+      :editable="store.editable"
+      @assign-self="assignSelf"
+    />
+  </div>
+</template>
diff --git a/app/assets/javascripts/sidebar/mount_sidebar.js b/app/assets/javascripts/sidebar/mount_sidebar.js
index 56cc78ca0ca..ef748f18301 100644
--- a/app/assets/javascripts/sidebar/mount_sidebar.js
+++ b/app/assets/javascripts/sidebar/mount_sidebar.js
@@ -1,6 +1,6 @@
 import Vue from 'vue';
 import SidebarTimeTracking from './components/time_tracking/sidebar_time_tracking';
-import SidebarAssignees from './components/assignees/sidebar_assignees';
+import SidebarAssignees from './components/assignees/sidebar_assignees.vue';
 import ConfidentialIssueSidebar from './components/confidential/confidential_issue_sidebar.vue';
 import SidebarMoveIssue from './lib/sidebar_move_issue';
 import LockIssueSidebar from './components/lock/lock_issue_sidebar.vue';
-- 
cgit v1.2.1