1 files changed, 20 insertions, 0 deletions
diff --git a/app/assets/javascripts/groups/components/groups.vue b/app/assets/javascripts/groups/components/groups.vue
index 2ee7ec96dfe..78e97e416c8 100644
--- a/app/assets/javascripts/groups/components/groups.vue
+++ b/app/assets/javascripts/groups/components/groups.vue
@@ -1,10 +1,27 @@
 <script>
+import TablePaginationComponent from '~/vue_shared/components/table_pagination';
+
 export default {
+  components: {
+    'gl-pagination': TablePaginationComponent,
+  },
   props: {
     groups: {
       type: Array,
       required: true,
     },
+    pageInfo: {
+      type: Object,
+      required: true,
+    },
+  },
+  methods: {
+    change(pageNumber) {
+      const param = gl.utils.setParamInURL('page', pageNumber);
+
+      gl.utils.visitUrl(param);
+      return param;
+    },
   },
 };
 </script>
@@ -12,5 +29,8 @@ export default {
 <template>
   <div>
     <group-folder :groups="groups" />
+    <gl-pagination
+      :change="change"
+      :pageInfo="pageInfo" />
   </div>
 </template>