Merge branch '198417-remove-design-feature-flag' into 'master'

Remove Geo Designs Feature Flag from Frontend

Closes #198417

See merge request gitlab-org/gitlab!23539

ee/app/assets/javascripts/geo_designs/components/app.vue

 <script>
 import { mapActions, mapState } from 'vuex';
 import { GlLoadingIcon } from '@gitlab/ui';
-import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import GeoDesignsFilterBar from './geo_designs_filter_bar.vue';
 import GeoDesigns from './geo_designs.vue';
 import GeoDesignsEmptyState from './geo_designs_empty_state.vue';
-import GeoDesignsDisabled from './geo_designs_disabled.vue';
 
 export default {
   name: 'GeoDesignsApp',
@@ -14,9 +12,7 @@ export default {
     GeoDesignsFilterBar,
     GeoDesigns,
     GeoDesignsEmptyState,
-    GeoDesignsDisabled,
   },
-  mixins: [glFeatureFlagsMixin()],
   props: {
     geoSvgPath: {
       type: String,
@@ -35,11 +31,6 @@ export default {
       required: true,
     },
   },
-  data() {
-    return {
-      designsEnabled: Boolean(this.glFeatures.enableGeoDesignSync),
-    };
-  },
   computed: {
     ...mapState(['isLoading', 'totalDesigns']),
     hasDesigns() {
@@ -57,23 +48,15 @@ export default {
 
 <template>
   <article class="geo-designs-container">
-    <section v-if="designsEnabled">
-      <geo-designs-filter-bar />
-      <gl-loading-icon v-if="isLoading" size="xl" />
-      <template v-else>
-        <geo-designs v-if="hasDesigns" />
-        <geo-designs-empty-state
-          v-else
-          :issues-svg-path="issuesSvgPath"
-          :geo-troubleshooting-link="geoTroubleshootingLink"
-        />
-      </template>
-    </section>
-    <geo-designs-disabled
-      v-else
-      :geo-svg-path="geoSvgPath"
-      :geo-troubleshooting-link="geoTroubleshootingLink"
-      :design-management-link="designManagementLink"
-    />
+    <geo-designs-filter-bar />
+    <gl-loading-icon v-if="isLoading" size="xl" />
+    <template v-else>
+      <geo-designs v-if="hasDesigns" />
+      <geo-designs-empty-state
+        v-else
+        :issues-svg-path="issuesSvgPath"
+        :geo-troubleshooting-link="geoTroubleshootingLink"
+      />
+    </template>
   </article>
 </template>

ee/app/assets/javascripts/geo_designs/components/geo_designs_disabled.vue

-<script>
-import { GlEmptyState, GlButton } from '@gitlab/ui';
-
-export default {
-  name: 'GeoDesignsDisabled',
-  components: {
-    GlEmptyState,
-    GlButton,
-  },
-  props: {
-    geoSvgPath: {
-      type: String,
-      required: true,
-    },
-    geoTroubleshootingLink: {
-      type: String,
-      required: true,
-    },
-    designManagementLink: {
-      type: String,
-      required: true,
-    },
-  },
-};
-</script>
-
-<template>
-  <gl-empty-state :title="__('Design Sync Not Enabled')" :svg-path="geoSvgPath">
-    <template #description>
-      <div class="text-center">
-        <p>
-          {{
-            __(
-              'If you believe this page to be an error, check out the links below for more information.',
-            )
-          }}
-        </p>
-        <div>
-          <gl-button :href="geoTroubleshootingLink" new-style>{{
-            __('Geo Troubleshooting')
-          }}</gl-button>
-          <gl-button :href="designManagementLink" new-style>{{
-            __('Design Management')
-          }}</gl-button>
-        </div>
-      </div>
-    </template>
-  </gl-empty-state>
-</template>

ee/spec/frontend/geo_designs/components/app_spec.js

@@ -3,7 +3,6 @@ import { createLocalVue, shallowMount } from '@vue/test-utils';
 import { GlLoadingIcon } from '@gitlab/ui';
 import GeoDesignsApp from 'ee/geo_designs/components/app.vue';
 import store from 'ee/geo_designs/store';
-import GeoDesignsDisabled from 'ee/geo_designs/components/geo_designs_disabled.vue';
 import GeoDesigns from 'ee/geo_designs/components/geo_designs.vue';
 import GeoDesignsEmptyState from 'ee/geo_designs/components/geo_designs_empty_state.vue';
 import GeoDesignsFilterBar from 'ee/geo_designs/components/geo_designs_filter_bar.vue';
@@ -33,10 +32,6 @@ describe('GeoDesignsApp', () => {
     setEndpoint: jest.fn(),
   };
 
-  const glFeatures = {
-    enableGeoDesignSync: true,
-  };
-
   const createComponent = () => {
     wrapper = shallowMount(GeoDesignsApp, {
       localVue,
@@ -45,9 +40,6 @@ describe('GeoDesignsApp', () => {
       methods: {
         ...actionSpies,
       },
-      provide: {
-        glFeatures,
-      },
     });
   };
 
@@ -56,8 +48,6 @@ describe('GeoDesignsApp', () => {
   });
 
   const findGeoDesignsContainer = () => wrapper.find('.geo-designs-container');
-  const findGeoDesignsEnabledContainer = () => findGeoDesignsContainer().find('section');
-  const findGeoDesignsDisabled = () => findGeoDesignsContainer().find(GeoDesignsDisabled);
   const findGlLoadingIcon = () => findGeoDesignsContainer().find(GlLoadingIcon);
   const findGeoDesigns = () => findGeoDesignsContainer().find(GeoDesigns);
   const findGeoDesignsEmptyState = () => findGeoDesignsContainer().find(GeoDesignsEmptyState);
@@ -72,98 +62,68 @@ describe('GeoDesignsApp', () => {
       expect(findGeoDesignsContainer().exists()).toBe(true);
     });
 
-    describe('when designsEnabled = false', () => {
-      beforeEach(() => {
-        glFeatures.enableGeoDesignSync = false;
-        createComponent();
-      });
-
-      it('shows designs disabled component', () => {
-        expect(findGeoDesignsDisabled().exists()).toBe(true);
-      });
-
-      it('hides designs enabled container', () => {
-        expect(findGeoDesignsEnabledContainer().exists()).toBe(false);
-      });
+    it('renders the filter bar', () => {
+      expect(findGeoDesignsFilterBar().exists()).toBe(true);
     });
 
-    describe('when designsEnabled = true', () => {
+    describe('when isLoading = true', () => {
       beforeEach(() => {
-        glFeatures.enableGeoDesignSync = true;
-        createComponent();
+        wrapper.vm.$store.state.isLoading = true;
       });
 
-      it('hides designs disabled component', () => {
-        expect(findGeoDesignsDisabled().exists()).toBe(false);
+      it('hides designs', () => {
+        expect(findGeoDesigns().exists()).toBe(false);
       });
 
-      it('shows designs enabled container', () => {
-        expect(findGeoDesignsEnabledContainer().exists()).toBe(true);
+      it('hides empty state', () => {
+        expect(findGeoDesignsEmptyState().exists()).toBe(false);
       });
 
-      it('renders the filter bar', () => {
-        expect(findGeoDesignsFilterBar().exists()).toBe(true);
+      it('shows loader', () => {
+        expect(findGlLoadingIcon().exists()).toBe(true);
       });
+    });
 
-      describe('when isLoading = true', () => {
+    describe('when isLoading = false', () => {
+      beforeEach(() => {
+        wrapper.vm.$store.state.isLoading = false;
+      });
+
+      describe('with designs', () => {
         beforeEach(() => {
-          wrapper.vm.$store.state.isLoading = true;
+          wrapper.vm.$store.state.designs = MOCK_BASIC_FETCH_DATA_MAP.data;
+          wrapper.vm.$store.state.totalDesigns = MOCK_BASIC_FETCH_DATA_MAP.total;
         });
 
-        it('hides designs', () => {
-          expect(findGeoDesigns().exists()).toBe(false);
+        it('shows designs', () => {
+          expect(findGeoDesigns().exists()).toBe(true);
         });
 
         it('hides empty state', () => {
           expect(findGeoDesignsEmptyState().exists()).toBe(false);
         });
 
-        it('shows loader', () => {
-          expect(findGlLoadingIcon().exists()).toBe(true);
+        it('hides loader', () => {
+          expect(findGlLoadingIcon().exists()).toBe(false);
         });
       });
 
-      describe('when isLoading = false', () => {
+      describe('with no designs', () => {
         beforeEach(() => {
-          wrapper.vm.$store.state.isLoading = false;
+          wrapper.vm.$store.state.designs = [];
+          wrapper.vm.$store.state.totalDesigns = 0;
         });
 
-        describe('with designs', () => {
-          beforeEach(() => {
-            wrapper.vm.$store.state.designs = MOCK_BASIC_FETCH_DATA_MAP.data;
-            wrapper.vm.$store.state.totalDesigns = MOCK_BASIC_FETCH_DATA_MAP.total;
-          });
-
-          it('shows designs', () => {
-            expect(findGeoDesigns().exists()).toBe(true);
-          });
-
-          it('hides empty state', () => {
-            expect(findGeoDesignsEmptyState().exists()).toBe(false);
-          });
-
-          it('hides loader', () => {
-            expect(findGlLoadingIcon().exists()).toBe(false);
-          });
+        it('hides designs', () => {
+          expect(findGeoDesigns().exists()).toBe(false);
         });
 
-        describe('with no designs', () => {
-          beforeEach(() => {
-            wrapper.vm.$store.state.designs = [];
-            wrapper.vm.$store.state.totalDesigns = 0;
-          });
-
-          it('hides designs', () => {
-            expect(findGeoDesigns().exists()).toBe(false);
-          });
-
-          it('shows empty state', () => {
-            expect(findGeoDesignsEmptyState().exists()).toBe(true);
-          });
+        it('shows empty state', () => {
+          expect(findGeoDesignsEmptyState().exists()).toBe(true);
+        });
 
-          it('hides loader', () => {
-            expect(findGlLoadingIcon().exists()).toBe(false);
-          });
+        it('hides loader', () => {
+          expect(findGlLoadingIcon().exists()).toBe(false);
         });
       });
     });

ee/spec/frontend/geo_designs/components/geo_designs_disabled_spec.js

-import Vuex from 'vuex';
-import { createLocalVue, mount } from '@vue/test-utils';
-import { GlButton, GlEmptyState } from '@gitlab/ui';
-import GeoDesignsDisabled from 'ee/geo_designs/components/geo_designs_disabled.vue';
-import store from 'ee/geo_designs/store';
-import {
-  MOCK_GEO_SVG_PATH,
-  MOCK_GEO_TROUBLESHOOTING_LINK,
-  MOCK_DESIGN_MANAGEMENT_LINK,
-} from '../mock_data';
-
-const localVue = createLocalVue();
-localVue.use(Vuex);
-
-describe('GeoDesignsDisabled', () => {
-  let wrapper;
-
-  const propsData = {
-    geoSvgPath: MOCK_GEO_SVG_PATH,
-    geoTroubleshootingLink: MOCK_GEO_TROUBLESHOOTING_LINK,
-    designManagementLink: MOCK_DESIGN_MANAGEMENT_LINK,
-  };
-
-  const createComponent = () => {
-    wrapper = mount(GeoDesignsDisabled, {
-      localVue,
-      store,
-      propsData,
-    });
-  };
-
-  afterEach(() => {
-    wrapper.destroy();
-  });
-
-  const findGlEmptyState = () => wrapper.find(GlEmptyState);
-  const findGlButton = () => findGlEmptyState().findAll(GlButton);
-
-  describe('template', () => {
-    beforeEach(() => {
-      createComponent();
-    });
-
-    it('renders GlEmptyState', () => {
-      expect(findGlEmptyState().exists()).toEqual(true);
-    });
-
-    it('renders 2 GlButtons', () => {
-      expect(findGlButton().length).toEqual(2);
-    });
-  });
-});

locale/gitlab.pot

@@ -6399,15 +6399,9 @@ msgstr ""
 msgid "Deselect all"
 msgstr ""
 
-msgid "Design Management"
-msgstr ""
-
 msgid "Design Management files and data"
 msgstr ""
 
-msgid "Design Sync Not Enabled"
-msgstr ""
-
 msgid "DesignManagement|%{current_design} of %{designs_count}"
 msgstr ""
 
@@ -8528,9 +8522,6 @@ msgstr ""
 msgid "Geo Settings"
 msgstr ""
 
-msgid "Geo Troubleshooting"
-msgstr ""
-
 msgid "Geo allows you to replicate your GitLab instance to other geographical locations."
 msgstr ""
 
@@ -10012,9 +10003,6 @@ msgstr ""
 msgid "If you believe this may be an error, please refer to the %{linkStart}Geo Troubleshooting%{linkEnd} documentation for more information."
 msgstr ""
 
-msgid "If you believe this page to be an error, check out the links below for more information."
-msgstr ""
-
 msgid "If you lose your recovery codes you can generate new ones, invalidating all previous codes."
 msgstr ""