6 files changed, 54 insertions, 12 deletions
diff --git a/app/views/groups/_archived_projects.html.haml b/app/views/groups/_archived_projects.html.haml
new file mode 100644
index 00000000000..ed79f5790f0
--- /dev/null
+++ b/app/views/groups/_archived_projects.html.haml
@@ -0,0 +1,8 @@
+#js-groups-archived-tree
+  .empty-state.text-center.hidden
+    %p= _("There are no archived projects yet")
+
+  %ul.content-list{ data: { hide_projects: 'false', group_id: group.id, path: group_path(group) } }
+    .js-groups-list-holder
+      .loading-container.text-center
+        = icon('spinner spin 2x', class: 'loading-animation prepend-top-20')
diff --git a/app/views/groups/_children.html.haml b/app/views/groups/_children.html.haml
deleted file mode 100644
index 742b40784d3..00000000000
--- a/app/views/groups/_children.html.haml
+++ /dev/null
@@ -1,4 +0,0 @@
-.js-groups-list-holder
-  #js-groups-tree{ data: { hide_projects: 'false', group_id: group.id, endpoint: group_children_path(group, format: :json), path: group_path(group), form_sel: 'form#group-filter-form', filter_sel: '.js-groups-list-filter', holder_sel: '.js-groups-list-holder', dropdown_sel: '.js-group-filter-dropdown-wrap' } }
-    .loading-container.text-center
-      = icon('spinner spin 2x', class: 'loading-animation prepend-top-20')
diff --git a/app/views/groups/_shared_projects.html.haml b/app/views/groups/_shared_projects.html.haml
new file mode 100644
index 00000000000..4eb8367f633
--- /dev/null
+++ b/app/views/groups/_shared_projects.html.haml
@@ -0,0 +1,8 @@
+#js-groups-shared-tree
+  .empty-state.text-center.hidden
+    %p= _("There are no projects shared with this group yet")
+
+  %ul.content-list{ data: { hide_projects: 'false', group_id: group.id, path: group_path(group) } }
+    .js-groups-list-holder
+      .loading-container.text-center
+        = icon('spinner spin 2x', class: 'loading-animation prepend-top-20')
diff --git a/app/views/groups/_subgroups_and_projects.html.haml b/app/views/groups/_subgroups_and_projects.html.haml
new file mode 100644
index 00000000000..d53c8026df8
--- /dev/null
+++ b/app/views/groups/_subgroups_and_projects.html.haml
@@ -0,0 +1,8 @@
+#js-groups-subgroups_and_projects-tree
+  .empty-state.hidden
+    = render "shared/groups/empty_state"
+
+  %ul.content-list{ data: { hide_projects: 'false', group_id: group.id, path: group_path(group) } }
+    .js-groups-list-holder
+      .loading-container.text-center
+        = icon('spinner spin 2x', class: 'loading-animation prepend-top-20')
diff --git a/app/views/groups/labels/index.html.haml b/app/views/groups/labels/index.html.haml
index e6821009d03..86178eb2ffd 100644
--- a/app/views/groups/labels/index.html.haml
+++ b/app/views/groups/labels/index.html.haml
@@ -22,6 +22,7 @@
             %span.input-group-append
               %button.btn.btn-default{ type: "submit", "aria-label" => _('Submit search') }
                 = icon("search")
+        = render 'shared/labels/sort_dropdown'
 
     .labels-container.prepend-top-5
       - if @labels.any?
diff --git a/app/views/groups/show.html.haml b/app/views/groups/show.html.haml
index 5a88619f769..f1bd817f17a 100644
--- a/app/views/groups/show.html.haml
+++ b/app/views/groups/show.html.haml
@@ -7,11 +7,10 @@
 
 = render 'groups/home_panel'
 
-.groups-header{ class: container_class }
-  .group-nav-container
-    .nav-controls.clearfix
+.groups-listing{ class: container_class, data: { endpoints: { default: group_children_path(@group, format: :json), shared: group_shared_projects_path(@group, format: :json) } } }
+  .top-area.group-nav-container
+    .group-search
       = render "shared/groups/search_form"
-      = render "shared/groups/dropdown", show_archive_options: true
       - if can? current_user, :create_projects, @group
         - new_project_label = _("New project")
         - new_subgroup_label = _("New subgroup")
@@ -39,7 +38,29 @@
         - else
           = link_to new_project_label, new_project_path(namespace_id: @group.id), class: "btn btn-success"
 
-  - if params[:filter].blank? && !@has_children
-    = render "shared/groups/empty_state"
-  - else
-    = render "children", children: @children, group: @group
+    .scrolling-tabs-container.inner-page-scroll-tabs
+      .fade-left= icon('angle-left')
+      .fade-right= icon('angle-right')
+      %ul.nav-links.scrolling-tabs.mobile-separator.nav.nav-tabs
+        %li.js-subgroups_and_projects-tab
+          = link_to group_path, data: { target: 'div#subgroups_and_projects', action: 'subgroups_and_projects', toggle: 'tab'} do
+            = _("Subgroups and projects")
+        %li.js-shared-tab
+          = link_to group_shared_path, data: { target: 'div#shared', action: 'shared', toggle: 'tab'} do
+            = _("Shared projects")
+        %li.js-archived-tab
+          = link_to group_archived_path, data: { target: 'div#archived', action: 'archived', toggle: 'tab'} do
+            = _("Archived projects")
+
+    .nav-controls
+      = render "shared/groups/dropdown"
+
+  .tab-content
+    #subgroups_and_projects.tab-pane
+      = render "subgroups_and_projects", group: @group
+
+    #shared.tab-pane
+      = render "shared_projects", group: @group
+
+    #archived.tab-pane
+      = render "archived_projects", group: @group