Use provide and inject for HAML props

These HAML properties don't need to be props
since they are not reactive. We can use provide
and inject to get these props down to the child
components without having to pass props all
the way down.

ee/app/assets/javascripts/analytics/repository_analytics/components/download_test_coverage.vue

@@ -28,14 +28,10 @@ export default {
   directives: {
     GlModalDirective,
   },
-  props: {
+  inject: {
     groupAnalyticsCoverageReportsPath: {
       type: String,
-      required: true,
-    },
-    groupFullPath: {
-      type: String,
-      required: true,
+      default: '',
     },
   },
   data() {
@@ -173,7 +169,6 @@ export default {
         <select-projects-dropdown
           ref="projectsDropdown"
           class="gl-w-half"
-          :group-full-path="groupFullPath"
           @projects-query-error="projectsQueryError"
           @select-all-projects="selectAllProjects"
           @select-project="selectProject"

ee/app/assets/javascripts/analytics/repository_analytics/components/group_repository_analytics.vue

@@ -7,16 +7,6 @@ export default {
   components: {
     DownloadTestCoverage,
   },
-  inject: {
-    groupAnalyticsCoverageReportsPath: {
-      type: String,
-      default: '',
-    },
-    groupFullPath: {
-      type: String,
-      default: '',
-    },
-  },
   text: {
     codeCoverageHeader: s__('RepositoriesAnalytics|Test Code Coverage'),
   },
@@ -28,9 +18,6 @@ export default {
     <h4 data-testid="test-coverage-header">
       {{ $options.text.codeCoverageHeader }}
     </h4>
-    <download-test-coverage
-      :group-analytics-coverage-reports-path="groupAnalyticsCoverageReportsPath"
-      :group-full-path="groupFullPath"
-    />
+    <download-test-coverage />
   </div>
 </template>

ee/app/assets/javascripts/analytics/repository_analytics/components/select_projects_dropdown.vue

@@ -26,10 +26,10 @@ export default {
   directives: {
     GlModalDirective,
   },
-  props: {
+  inject: {
     groupFullPath: {
       type: String,
-      required: true,
+      default: '',
     },
   },
   apollo: {

ee/spec/frontend/analytics/repository_analytics/components/download_test_coverage_spec.js

@@ -23,9 +23,8 @@ describe('Download test coverage component', () => {
       .vm.$emit('click');
   const findAlert = () => wrapper.find(GlAlert);
 
-  const defaultProps = {
+  const injectedProperties = {
     groupAnalyticsCoverageReportsPath: '/coverage.csv?ref_path=refs/heads/master',
-    groupFullPath: 'gitlab-org',
   };
 
   const createComponent = () => {
@@ -38,8 +37,8 @@ describe('Download test coverage component', () => {
           selectedProjectIds: [],
         };
       },
-      propsData: {
-        ...defaultProps,
+      provide: {
+        ...injectedProperties,
       },
       stubs: { GlDropdown, GlDropdownItem, GlModal, SelectProjectsDropdown },
     });
@@ -76,7 +75,7 @@ describe('Download test coverage component', () => {
     describe('when selecting a project', () => {
       // Due to the fake_date helper, we can always expect today's date to be 2020-07-06
       // and the default date 30 days ago to be 2020-06-06
-      const groupAnalyticsCoverageReportsPathWithDates = `${defaultProps.groupAnalyticsCoverageReportsPath}&start_date=2020-06-06&end_date=2020-07-06`;
+      const groupAnalyticsCoverageReportsPathWithDates = `${injectedProperties.groupAnalyticsCoverageReportsPath}&start_date=2020-06-06&end_date=2020-07-06`;
 
       describe('with all projects selected', () => {
         it('renders primary action as a link with no project_ids param', () => {
@@ -138,11 +137,11 @@ describe('Download test coverage component', () => {
     describe('when selecting a date range', () => {
       it.each`
         date  | expected
-        ${7}  | ${`${defaultProps.groupAnalyticsCoverageReportsPath}&start_date=2020-06-29&end_date=2020-07-06`}
-        ${14} | ${`${defaultProps.groupAnalyticsCoverageReportsPath}&start_date=2020-06-22&end_date=2020-07-06`}
-        ${30} | ${`${defaultProps.groupAnalyticsCoverageReportsPath}&start_date=2020-06-06&end_date=2020-07-06`}
-        ${60} | ${`${defaultProps.groupAnalyticsCoverageReportsPath}&start_date=2020-05-07&end_date=2020-07-06`}
-        ${90} | ${`${defaultProps.groupAnalyticsCoverageReportsPath}&start_date=2020-04-07&end_date=2020-07-06`}
+        ${7}  | ${`${injectedProperties.groupAnalyticsCoverageReportsPath}&start_date=2020-06-29&end_date=2020-07-06`}
+        ${14} | ${`${injectedProperties.groupAnalyticsCoverageReportsPath}&start_date=2020-06-22&end_date=2020-07-06`}
+        ${30} | ${`${injectedProperties.groupAnalyticsCoverageReportsPath}&start_date=2020-06-06&end_date=2020-07-06`}
+        ${60} | ${`${injectedProperties.groupAnalyticsCoverageReportsPath}&start_date=2020-05-07&end_date=2020-07-06`}
+        ${90} | ${`${injectedProperties.groupAnalyticsCoverageReportsPath}&start_date=2020-04-07&end_date=2020-07-06`}
       `(
         'updates CSV path to have the start date be $date days before today',
         ({ date, expected }) => {

ee/spec/frontend/analytics/repository_analytics/components/group_repository_analytics_spec.js

@@ -7,18 +7,8 @@ const localVue = createLocalVue();
 describe('Group repository analytics app', () => {
   let wrapper;
 
-  const injectedProperties = {
-    groupAnalyticsCoverageReportsPath: '/coverage.csv?ref_path=refs/heads/master',
-    groupFullPath: 'gitlab-org',
-  };
-
   const createComponent = () => {
-    wrapper = shallowMount(GroupRepositoryAnalytics, {
-      localVue,
-      provide: {
-        ...injectedProperties,
-      },
-    });
+    wrapper = shallowMount(GroupRepositoryAnalytics, { localVue });
   };
 
   beforeEach(() => {

ee/spec/frontend/analytics/repository_analytics/components/select_projects_dropdown_spec.js

@@ -36,7 +36,7 @@ describe('Select projects dropdown component', () => {
           ...data,
         };
       },
-      propsData: {
+      provide: {
         groupFullPath: 'gitlab-org',
       },
       mocks: {