From 5b74a1aebcc1712316b8269c415e83e9d59750d5 Mon Sep 17 00:00:00 2001
From: Dennis Tang <dennis@dennistang.net>
Date: Fri, 7 Sep 2018 06:09:13 +0000
Subject: Resolve "Improve handling of projects shared with a group"

---
 .../javascripts/groups/components/groups.vue       | 68 ++++++++++++----------
 1 file changed, 37 insertions(+), 31 deletions(-)

(limited to 'app/assets/javascripts/groups/components/groups.vue')

diff --git a/app/assets/javascripts/groups/components/groups.vue b/app/assets/javascripts/groups/components/groups.vue
index 73ae928b0d9..a1beb222950 100644
--- a/app/assets/javascripts/groups/components/groups.vue
+++ b/app/assets/javascripts/groups/components/groups.vue
@@ -1,39 +1,44 @@
 <script>
-  import tablePagination from '~/vue_shared/components/table_pagination.vue';
-  import eventHub from '../event_hub';
-  import { getParameterByName } from '../../lib/utils/common_utils';
+import tablePagination from '~/vue_shared/components/table_pagination.vue';
+import eventHub from '../event_hub';
+import { getParameterByName } from '../../lib/utils/common_utils';
 
-  export default {
-    components: {
-      tablePagination,
+export default {
+  components: {
+    tablePagination,
+  },
+  props: {
+    groups: {
+      type: Array,
+      required: true,
     },
-    props: {
-      groups: {
-        type: Array,
-        required: true,
-      },
-      pageInfo: {
-        type: Object,
-        required: true,
-      },
-      searchEmpty: {
-        type: Boolean,
-        required: true,
-      },
-      searchEmptyMessage: {
-        type: String,
-        required: true,
-      },
+    pageInfo: {
+      type: Object,
+      required: true,
     },
-    methods: {
-      change(page) {
-        const filterGroupsParam = getParameterByName('filter_groups');
-        const sortParam = getParameterByName('sort');
-        const archivedParam = getParameterByName('archived');
-        eventHub.$emit('fetchPage', page, filterGroupsParam, sortParam, archivedParam);
-      },
+    searchEmpty: {
+      type: Boolean,
+      required: true,
     },
-  };
+    searchEmptyMessage: {
+      type: String,
+      required: true,
+    },
+    action: {
+      type: String,
+      required: false,
+      default: '',
+    },
+  },
+  methods: {
+    change(page) {
+      const filterGroupsParam = getParameterByName('filter_groups');
+      const sortParam = getParameterByName('sort');
+      const archivedParam = getParameterByName('archived');
+      eventHub.$emit(`${this.action}fetchPage`, page, filterGroupsParam, sortParam, archivedParam);
+    },
+  },
+};
 </script>
 
 <template>
@@ -47,6 +52,7 @@
     <group-folder
       v-if="!searchEmpty"
       :groups="groups"
+      :action="action"
     />
     <table-pagination
       v-if="!searchEmpty"
-- 
cgit v1.2.1


From 106640e031c92813803c98674e0304a91ce07db4 Mon Sep 17 00:00:00 2001
From: Adriel Santiago <adriel@gitlab.com>
Date: Mon, 10 Sep 2018 15:36:09 -0400
Subject: Use GitLab ui pagination component for groups

---
 .../javascripts/groups/components/groups.vue       | 27 ++++++++++++----------
 1 file changed, 15 insertions(+), 12 deletions(-)

(limited to 'app/assets/javascripts/groups/components/groups.vue')

diff --git a/app/assets/javascripts/groups/components/groups.vue b/app/assets/javascripts/groups/components/groups.vue
index a1beb222950..81b2e5ea37b 100644
--- a/app/assets/javascripts/groups/components/groups.vue
+++ b/app/assets/javascripts/groups/components/groups.vue
@@ -1,11 +1,11 @@
 <script>
-import tablePagination from '~/vue_shared/components/table_pagination.vue';
+import PaginationLinks from '~/vue_shared/components/pagination_links.vue';
 import eventHub from '../event_hub';
 import { getParameterByName } from '../../lib/utils/common_utils';
 
 export default {
   components: {
-    tablePagination,
+    PaginationLinks,
   },
   props: {
     groups: {
@@ -49,15 +49,18 @@ export default {
     >
       {{ searchEmptyMessage }}
     </div>
-    <group-folder
-      v-if="!searchEmpty"
-      :groups="groups"
-      :action="action"
-    />
-    <table-pagination
-      v-if="!searchEmpty"
-      :change="change"
-      :page-info="pageInfo"
-    />
+    <template
+      v-else
+    >
+      <group-folder
+        :groups="groups"
+        :action="action"
+      />
+      <pagination-links
+        :change="change"
+        :page-info="pageInfo"
+        class="d-flex justify-content-center prepend-top-default"
+      />
+    </template>
   </div>
 </template>
-- 
cgit v1.2.1