6 files changed, 30 insertions, 15 deletions
diff --git a/app/views/shared/nav/_scope_menu.html.haml b/app/views/shared/nav/_scope_menu.html.haml
index 2f10914ef3d..cbee0e0429c 100644
--- a/app/views/shared/nav/_scope_menu.html.haml
+++ b/app/views/shared/nav/_scope_menu.html.haml
@@ -1,6 +1,6 @@
-.context-header
-  = link_to scope_menu.link, **scope_menu.container_html_options do
-    %span.avatar-container.rect-avatar.s40.project-avatar
-      = source_icon(scope_menu.container, alt: scope_menu.title, class: 'avatar s40 avatar-tile', width: 40, height: 40)
-    %span.sidebar-context-title
-      = scope_menu.title
+- if sidebar_refactor_enabled?
+  = nav_link(**scope_menu.active_routes, html_options: scope_menu.nav_link_html_options) do
+    = render 'shared/nav/scope_menu_body', scope_menu: scope_menu
+- else
+  .context-header
+    = render 'shared/nav/scope_menu_body', scope_menu: scope_menu
diff --git a/app/views/shared/nav/_scope_menu_body.html.haml b/app/views/shared/nav/_scope_menu_body.html.haml
new file mode 100644
index 00000000000..a94c681e2d3
--- /dev/null
+++ b/app/views/shared/nav/_scope_menu_body.html.haml
@@ -0,0 +1,8 @@
+- avatar_size = sidebar_refactor_disabled? ? 40 : 32
+- avatar_size_class = sidebar_refactor_disabled? ? 's40' : 's32'
+
+= link_to scope_menu.link, **scope_menu.container_html_options, data: { qa_selector: 'project_scope_link' } do
+  %span{ class: ['avatar-container', 'rect-avatar', 'project-avatar', avatar_size_class] }
+    = source_icon(scope_menu.container, alt: scope_menu.title, class: ['avatar', 'avatar-tile', avatar_size_class], width: avatar_size, height: avatar_size)
+  %span.sidebar-context-title
+    = scope_menu.title
diff --git a/app/views/shared/nav/_sidebar.html.haml b/app/views/shared/nav/_sidebar.html.haml
index 552dcbfd6fd..54c3b8a281d 100644
--- a/app/views/shared/nav/_sidebar.html.haml
+++ b/app/views/shared/nav/_sidebar.html.haml
@@ -1,11 +1,13 @@
 %aside.nav-sidebar{ class: ('sidebar-collapsed-desktop' if collapsed_sidebar?), **sidebar_tracking_attributes_by_object(sidebar.container), 'aria-label': sidebar.aria_label }
   .nav-sidebar-inner-scroll
-    - if sidebar.scope_menu
+    - if sidebar.scope_menu && sidebar_refactor_disabled?
       = render partial: 'shared/nav/scope_menu', object: sidebar.scope_menu
     - elsif sidebar.render_raw_scope_menu_partial
       = render sidebar.render_raw_scope_menu_partial
 
     %ul.sidebar-top-level-items.qa-project-sidebar
+      - if sidebar.scope_menu && sidebar_refactor_enabled?
+        = render partial: 'shared/nav/scope_menu', object: sidebar.scope_menu
       - if sidebar.renderable_menus.any?
         = render partial: 'shared/nav/sidebar_menu', collection: sidebar.renderable_menus
       - if sidebar.render_raw_menus_partial
diff --git a/app/views/shared/nav/_sidebar_menu.html.haml b/app/views/shared/nav/_sidebar_menu.html.haml
index 67c775d1a85..b80bd515a32 100644
--- a/app/views/shared/nav/_sidebar_menu.html.haml
+++ b/app/views/shared/nav/_sidebar_menu.html.haml
@@ -15,13 +15,13 @@
 
   %ul.sidebar-sub-level-items{ class: ('is-fly-out-only' unless sidebar_menu.has_renderable_items?) }
     = nav_link(**sidebar_menu.all_active_routes, html_options: { class: 'fly-out-top-item' } ) do
-      = link_to sidebar_menu.link, **sidebar_menu.collapsed_container_html_options do
-        %strong.fly-out-top-item-name
-          = sidebar_menu.title
-        - if sidebar_menu.has_pill?
-          %span.badge.badge-pill.count.fly-out-badge{ **sidebar_menu.pill_html_options }
-            = number_with_delimiter(sidebar_menu.pill_count)
+      - if sidebar_refactor_disabled?
+        = link_to sidebar_menu.link, class: "'has-sub-items' if sidebar_menu.has_renderable_items?", **sidebar_menu.collapsed_container_html_options do
+          = render 'shared/nav/sidebar_menu_collapsed', sidebar_menu: sidebar_menu
+      - else
+        %span.fly-out-top-item-container
+          = render 'shared/nav/sidebar_menu_collapsed', sidebar_menu: sidebar_menu
 
-    - if sidebar_menu.has_items?
+    - if sidebar_menu.has_renderable_items?
       %li.divider.fly-out-top-item
       = render partial: 'shared/nav/sidebar_menu_item', collection: sidebar_menu.renderable_items
diff --git a/app/views/shared/nav/_sidebar_menu_collapsed.html.haml b/app/views/shared/nav/_sidebar_menu_collapsed.html.haml
new file mode 100644
index 00000000000..78567a991df
--- /dev/null
+++ b/app/views/shared/nav/_sidebar_menu_collapsed.html.haml
@@ -0,0 +1,5 @@
+%strong.fly-out-top-item-name
+  = sidebar_menu.title
+- if sidebar_menu.has_pill?
+  %span.badge.badge-pill.count.fly-out-badge{ **sidebar_menu.pill_html_options }
+    = number_with_delimiter(sidebar_menu.pill_count)
diff --git a/app/views/shared/nav/_sidebar_menu_item.html.haml b/app/views/shared/nav/_sidebar_menu_item.html.haml
index 0b0e4c7aec9..674ce593ee2 100644
--- a/app/views/shared/nav/_sidebar_menu_item.html.haml
+++ b/app/views/shared/nav/_sidebar_menu_item.html.haml
@@ -1,4 +1,4 @@
-= nav_link(**sidebar_menu_item.active_routes) do
+= nav_link(**sidebar_menu_item.active_routes, html_options: sidebar_menu_item.nav_link_html_options) do
   = link_to sidebar_menu_item.link, **sidebar_menu_item.container_html_options, data: { qa_selector: 'sidebar_menu_item_link', qa_menu_item: sidebar_menu_item.title } do
     %span
       = sidebar_menu_item.title