Hide old MR widgets when the extension flag is enabled

Closes https://gitlab.com/gitlab-org/gitlab/-/issues/352761

app/assets/javascripts/vue_merge_request_widget/mr_widget_options.vue

@@ -574,7 +574,7 @@ export default {
       />
 
       <grouped-accessibility-reports-app
-        v-if="shouldShowAccessibilityReport"
+        v-if="shouldShowAccessibilityReport && !shouldShowExtension"
         :endpoint="mr.accessibilityReportPath"
       />
 

ee/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.vue

@@ -83,7 +83,11 @@ export default {
       return threshold + totalScoreDelta <= 0;
     },
     shouldRenderBrowserPerformance() {
-      return this.hasBrowserPerformancePaths && this.hasBrowserPerformanceDegradation;
+      return (
+        this.hasBrowserPerformancePaths &&
+        this.hasBrowserPerformanceDegradation &&
+        !this.shouldShowExtension
+      );
     },
     hasLoadPerformanceMetrics() {
       return (
@@ -352,7 +356,7 @@ export default {
         :has-issues="hasBrowserPerformanceMetrics"
       />
       <grouped-load-performance-reports-app
-        v-if="hasLoadPerformancePaths"
+        v-if="hasLoadPerformancePaths && !shouldShowExtension"
         :status="loadPerformanceStatus"
         :loading-text="translateText('load-performance').loading"
         :error-text="translateText('load-performance').error"
@@ -472,12 +476,12 @@ export default {
       />
 
       <grouped-accessibility-reports-app
-        v-if="shouldShowAccessibilityReport"
+        v-if="shouldShowAccessibilityReport && !shouldShowExtension"
         :endpoint="mr.accessibilityReportPath"
       />
 
       <status-checks-reports-app
-        v-if="shouldRenderStatusReport"
+        v-if="shouldRenderStatusReport && !shouldShowExtension"
         :endpoint="mr.apiStatusChecksPath"
       />
 

ee/spec/features/merge_request/user_sees_status_checks_widget_spec.rb

@@ -23,6 +23,9 @@ RSpec.describe 'Merge request > User sees status checks widget', :js do
 
   context 'user is authorized' do
     before do
+      stub_feature_flags(refactor_mr_widgets_extensions: false)
+      stub_feature_flags(refactor_mr_widgets_extensions_user: false)
+
       project.add_maintainer(user)
       sign_in(user)
 
@@ -48,6 +51,31 @@ RSpec.describe 'Merge request > User sees status checks widget', :js do
     end
   end
 
+  context 'widget extension flag is enabled' do
+    before do
+      project.add_maintainer(user)
+      sign_in(user)
+
+      visit project_merge_request_path(project, merge_request)
+    end
+
+    it 'shows the widget' do
+      expect(page).to have_content('Status checks 1 pending')
+    end
+
+    it 'shows the status check issues', :aggregate_failures do
+      within '[data-testid="widget-extension"]' do
+        find('[data-testid="toggle-button"]').click
+      end
+
+      [check1, check2].each do |rule|
+        icon_type = rule.approved?(merge_request, merge_request.source_branch_sha) ? 'success' : 'neutral'
+        expect(page).to have_css("[data-testid='status-#{icon_type}-icon']")
+        expect(page).to have_content("#{rule.name}: #{rule.external_url}")
+      end
+    end
+  end
+
   context 'user is not logged in' do
     before do
       visit project_merge_request_path(project, merge_request)