Make Epics tree default by removing ff check

Makes Epics Tree default for everyone

changelogs/unreleased/32685-remove-epics-tree-feature-flag.yml

+---
+title: Show Tree UI containing child Epics and Issues within an Epic
+merge_request: 19812
+author:
+type: added

ee/app/assets/javascripts/epic/components/epic_body.vue

@@ -21,8 +21,6 @@ export default {
     ...mapState([
       'endpoint',
       'updateEndpoint',
-      'epicLinksEndpoint',
-      'issueLinksEndpoint',
       'groupPath',
       'markdownPreviewPath',
       'markdownDocsPath',
@@ -37,9 +35,6 @@ export default {
       'sidebarCollapsed',
     ]),
     ...mapGetters(['isUserSignedIn']),
-    isEpicTreeEnabled() {
-      return gon.features && gon.features.epicTrees;
-    },
     isVueIssuableEpicSidebarEnabled() {
       return gon.features && gon.features.vueIssuableEpicSidebar;
     },
@@ -69,33 +64,11 @@ export default {
         :initial-description-text="initialDescriptionText"
         :show-inline-edit-button="true"
         :enable-autocomplete="true"
-        project-namespace=""
-        issuable-ref=""
+        project-namespace
+        issuable-ref
         issuable-type="epic"
       />
     </div>
-    <related-items
-      v-if="!isEpicTreeEnabled"
-      :endpoint="epicLinksEndpoint"
-      :can-admin="canAdmin"
-      :can-reorder="canAdmin"
-      :allow-auto-complete="false"
-      :path-id-separator="$options.PathIdSeparator.Epic"
-      :title="__('Epics')"
-      issuable-type="epic"
-      css-class="js-related-epics-block"
-    />
-    <related-items
-      v-if="!isEpicTreeEnabled"
-      :endpoint="issueLinksEndpoint"
-      :can-admin="canAdmin"
-      :can-reorder="canAdmin"
-      :allow-auto-complete="false"
-      :title="__('Issues')"
-      issuable-type="issue"
-      css-class="js-related-issues-block"
-      path-id-separator="#"
-    />
     <issuable-sidebar
       v-if="isVueIssuableEpicSidebarEnabled"
       :signed-in="isUserSignedIn"

ee/app/assets/javascripts/epic/epic_tabs.js

@@ -9,41 +9,22 @@ export default class EpicTabs {
     this.epicTabs = this.wrapper.querySelector('.js-epic-tabs-container');
     this.discussionFilterContainer = this.epicTabs.querySelector('.js-discussion-filter-container');
 
-    if (this.epicTreesEnabled) {
-      initRelatedItemsTree();
-    }
+    initRelatedItemsTree();
 
-    this.treeTabLoaded = this.epicTreesEnabled;
     this.roadmapTabLoaded = false;
 
     this.bindEvents();
   }
 
   bindEvents() {
-    const $treeTab = $('#tree-tab', this.epicTabs);
     const $roadmapTab = $('#roadmap-tab', this.epicTabs);
 
-    $treeTab.on('show.bs.tab', this.onTreeShow.bind(this));
-    $treeTab.on('hide.bs.tab', this.onTreeHide.bind(this));
     $roadmapTab.on('show.bs.tab', this.onRoadmapShow.bind(this));
     $roadmapTab.on('hide.bs.tab', this.onRoadmapHide.bind(this));
   }
 
-  onTreeShow() {
-    if (!this.epicTreesEnabled) this.discussionFilterContainer.classList.add('hidden');
-    if (!this.treeTabLoaded) {
-      initRelatedItemsTree();
-      this.treeTabLoaded = true;
-    }
-  }
-
-  onTreeHide() {
-    if (!this.epicTreesEnabled) this.discussionFilterContainer.classList.remove('hidden');
-  }
-
   onRoadmapShow() {
     this.wrapper.classList.remove('container-limited');
-    if (!this.epicTreesEnabled) this.discussionFilterContainer.classList.add('hidden');
     if (!this.roadmapTabLoaded) {
       initRoadmap();
       this.roadmapTabLoaded = true;
@@ -52,6 +33,5 @@ export default class EpicTabs {
 
   onRoadmapHide() {
     this.wrapper.classList.add('container-limited');
-    if (!this.epicTreesEnabled) this.discussionFilterContainer.classList.remove('hidden');
   }
 }

ee/app/assets/javascripts/epic/store/state.js

@@ -3,8 +3,6 @@ export default () => ({
   endpoint: '',
   updateEndpoint: '',
 
-  epicLinksEndpoint: '',
-  issueLinksEndpoint: '',
   groupPath: '',
   markdownPreviewPath: '',
   labelsPath: '',

ee/app/controllers/groups/epics_controller.rb

@@ -16,7 +16,6 @@ class Groups::EpicsController < Groups::ApplicationController
   before_action :verify_group_bulk_edit_enabled!, only: [:bulk_update]
 
   before_action do
-    push_frontend_feature_flag(:epic_trees, @group)
     push_frontend_feature_flag(:roadmap_graphql, @group)
     push_frontend_feature_flag(:vue_issuable_epic_sidebar, @group)
     push_frontend_feature_flag(:epic_new_issue, @group)

ee/app/views/groups/epics/show.html.haml

@@ -13,91 +13,50 @@
 
 #epic-app-root{ data: epic_show_app_data(@epic) }
 
-- if Feature.enabled?(:epic_trees, @group)
-  .epic-tabs-holder
-    .epic-tabs-container.js-epic-tabs-container
-      %ul.epic-tabs.nav-tabs.nav.nav-links.scrolling-tabs
-        %li.tree-tab
-          %a#tree-tab.active{ href: '#tree', data: { toggle: 'tab' } }
-            = _('Epics and Issues')
-        %li.roadmap-tab
-          %a#roadmap-tab{ href: '#roadmap', data: { toggle: 'tab' } }
-            = _('Roadmap')
-
-  .tab-content.epic-tabs-content.js-epic-tabs-content
-    #tree.tab-pane.show.active
-      .row
-        %section.col-md-12
-          #js-tree{ data: { id: @epic.to_global_id,
-            iid: @epic.iid,
-            full_path: @group.full_path,
-            auto_complete_epics: 'true',
-            auto_complete_issues: 'false',
-            user_signed_in: current_user.present? ? 'true' : 'false',
-            initial: issuable_initial_data(@epic).to_json } }
-    #roadmap.tab-pane
-      .row
-        %section.col-md-12
-          #js-roadmap{ data: { epics_path: group_epics_path(@group, parent_id: @epic.id, format: :json),
-            group_id: @group.id,
-            iid: @epic.iid,
-            full_path: @group.full_path,
-            empty_state_illustration: image_path('illustrations/epics/roadmap.svg'),
-            has_filters_applied: 'false',
-            new_epic_endpoint: group_epics_path(@group),
-            preset_type: roadmap_layout,
-            epics_state: 'all',
-            sorted_by: roadmap_sort_order,
-            inner_height: '600',
-            child_epics: 'true' } }
-  %hr.epic-discussion-separator.mt-1.mb-0
-  .d-flex.justify-content-between.content-block.content-block-small.emoji-list-container.js-noteable-awards
-    = render 'award_emoji/awards_block', awardable: @epic, inline: true
-    .d-flex.flex-wrap.align-items-center.justify-content-lg-end
-      #js-vue-discussion-filter{ data: { default_filter: current_user&.notes_filter_for(@epic),
-        notes_filters: UserPreference.notes_filters.to_json } }
-  .row
-    %section.col-md-12
-      %script.js-notes-data{ type: "application/json" }= initial_notes_data(true).to_json.html_safe
-      .issuable-discussion
-        = render 'discussion'
-- else # Everything below will go away once we remove this feature flag
-  .content-block.content-block-small.emoji-list-container.js-noteable-awards
-    = render 'award_emoji/awards_block', awardable: @epic, inline: true
-
-  .epic-tabs-holder
-    .epic-tabs-container.js-epic-tabs-container
-      %ul.epic-tabs.nav-tabs.nav.nav-links.scrolling-tabs
-        %li.notes-tab.qa-notes-tab
-          %a#discussion-tab.active{ href: '#discussion', data: { toggle: 'tab' } }
-            = _('Discussion')
-            %span.badge.badge-pill= @epic.notes.user.count
-        %li.roadmap-tab
-          %a#roadmap-tab{ href: '#roadmap', data: { toggle: 'tab' } }
-            = _('Roadmap')
-      .d-flex.flex-wrap.align-items-center.justify-content-lg-end
-        #js-vue-discussion-filter{ data: { default_filter: current_user&.notes_filter_for(@epic),
-          notes_filters: UserPreference.notes_filters.to_json } }
-
-  .tab-content.epic-tabs-content.js-epic-tabs-content
-    #discussion.tab-pane.show.active
-      .row
-        %section.col-md-12
-          %script.js-notes-data{ type: "application/json" }= initial_notes_data(true).to_json.html_safe
-          .issuable-discussion
-            = render 'discussion'
-    #roadmap.tab-pane
-      .row
-        %section.col-md-12
-          #js-roadmap{ data: { epics_path: group_epics_path(@group, parent_id: @epic.id, format: :json),
-            group_id: @group.id,
-            iid: @epic.iid,
-            full_path: @group.full_path,
-            empty_state_illustration: image_path('illustrations/epics/roadmap.svg'),
-            has_filters_applied: 'false',
-            new_epic_endpoint: group_epics_path(@group),
-            preset_type: roadmap_layout,
-            epics_state: 'all',
-            sorted_by: roadmap_sort_order,
-            inner_height: '600',
-            child_epics: 'true' } }
+.epic-tabs-holder
+  .epic-tabs-container.js-epic-tabs-container
+    %ul.epic-tabs.nav-tabs.nav.nav-links.scrolling-tabs
+      %li.tree-tab
+        %a#tree-tab.active{ href: '#tree', data: { toggle: 'tab' } }
+          = _('Epics and Issues')
+      %li.roadmap-tab
+        %a#roadmap-tab{ href: '#roadmap', data: { toggle: 'tab' } }
+          = _('Roadmap')
+
+.tab-content.epic-tabs-content.js-epic-tabs-content
+  #tree.tab-pane.show.active
+    .row
+      %section.col-md-12
+        #js-tree{ data: { id: @epic.to_global_id,
+          iid: @epic.iid,
+          full_path: @group.full_path,
+          auto_complete_epics: 'true',
+          auto_complete_issues: 'false',
+          user_signed_in: current_user.present? ? 'true' : 'false',
+          initial: issuable_initial_data(@epic).to_json } }
+  #roadmap.tab-pane
+    .row
+      %section.col-md-12
+        #js-roadmap{ data: { epics_path: group_epics_path(@group, parent_id: @epic.id, format: :json),
+          group_id: @group.id,
+          iid: @epic.iid,
+          full_path: @group.full_path,
+          empty_state_illustration: image_path('illustrations/epics/roadmap.svg'),
+          has_filters_applied: 'false',
+          new_epic_endpoint: group_epics_path(@group),
+          preset_type: roadmap_layout,
+          epics_state: 'all',
+          sorted_by: roadmap_sort_order,
+          inner_height: '600',
+          child_epics: 'true' } }
+%hr.epic-discussion-separator.mt-1.mb-0
+.d-flex.justify-content-between.content-block.content-block-small.emoji-list-container.js-noteable-awards
+  = render 'award_emoji/awards_block', awardable: @epic, inline: true
+  .d-flex.flex-wrap.align-items-center.justify-content-lg-end
+    #js-vue-discussion-filter{ data: { default_filter: current_user&.notes_filter_for(@epic),
+      notes_filters: UserPreference.notes_filters.to_json } }
+.row
+  %section.col-md-12
+    %script.js-notes-data{ type: "application/json" }= initial_notes_data(true).to_json.html_safe
+    .issuable-discussion
+      = render 'discussion'

ee/spec/javascripts/epic/components/epic_body_spec.js

@@ -50,28 +50,5 @@ describe('EpicBodyComponent', () => {
       expect(vm.$el.querySelector('.title-container')).not.toBeNull();
       expect(vm.$el.querySelector('.description')).not.toBeNull();
     });
-
-    it('renders related epics list elements', () => {
-      const relatedEpicsEl = vm.$el.querySelector('.js-related-epics-block');
-
-      expect(relatedEpicsEl).not.toBeNull();
-      expect(relatedEpicsEl.querySelector('.card-title').innerText.trim()).toContain('Epics');
-      expect(relatedEpicsEl.querySelector('.js-related-issues-header-issue-count')).not.toBeNull();
-      expect(relatedEpicsEl.querySelector('button.js-issue-count-badge-add-button')).not.toBeNull();
-      expect(relatedEpicsEl.querySelector('.related-items-list')).toBeNull();
-    });
-
-    it('renders related issues list elements', () => {
-      const relatedIssuesEl = vm.$el.querySelector('.js-related-issues-block');
-
-      expect(relatedIssuesEl).not.toBeNull();
-      expect(relatedIssuesEl.querySelector('.card-title').innerText.trim()).toContain('Issues');
-      expect(relatedIssuesEl.querySelector('.js-related-issues-header-issue-count')).not.toBeNull();
-      expect(
-        relatedIssuesEl.querySelector('button.js-issue-count-badge-add-button'),
-      ).not.toBeNull();
-
-      expect(relatedIssuesEl.querySelector('.related-items-list')).toBeNull();
-    });
   });
 });