Refactor dependency list to use provide/inject for static values

This commit refactors the dependency list page to use
provide/inject instead of props for static values.

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

@@ -24,28 +24,13 @@ export default {
     DependencyListJobFailedAlert,
     PaginatedDependenciesTable,
   },
-  props: {
-    endpoint: {
-      type: String,
-      required: true,
-    },
-    sbomSurveySvgPath: {
-      type: String,
-      required: true,
-    },
-    emptyStateSvgPath: {
-      type: String,
-      required: true,
-    },
-    documentationPath: {
-      type: String,
-      required: true,
-    },
-    supportDocumentationPath: {
-      type: String,
-      required: true,
-    },
-  },
+  inject: [
+    'sbomSurveySvgPath',
+    'emptyStateSvgPath',
+    'documentationPath',
+    'endpoint',
+    'supportDocumentationPath',
+  ],
   data() {
     return {
       isIncompleteAlertDismissed: false,

ee/app/assets/javascripts/dependencies/index.js

@@ -5,13 +5,13 @@ import createStore from './store';
 export default () => {
   const el = document.querySelector('#js-dependencies-app');
 
-  const {
-    endpoint,
-    emptyStateSvgPath,
-    documentationPath,
-    supportDocumentationPath,
-    sbomSurveySvgPath,
-  } = el.dataset;
+  const provide = {
+    sbomSurveySvgPath: el.dataset.sbomSurveySvgPath,
+    emptyStateSvgPath: el.dataset.emptyStateSvgPath,
+    documentationPath: el.dataset.documentationPath,
+    endpoint: el.dataset.endpoint,
+    supportDocumentationPath: el.dataset.supportDocumentationPath,
+  };
 
   const store = createStore();
 
@@ -21,16 +21,9 @@ export default () => {
       DependenciesApp,
     },
     store,
+    provide: () => provide,
     render(createElement) {
-      return createElement(DependenciesApp, {
-        props: {
-          endpoint,
-          emptyStateSvgPath,
-          documentationPath,
-          supportDocumentationPath,
-          sbomSurveySvgPath,
-        },
-      });
+      return createElement(DependenciesApp);
     },
   });
 };

ee/app/assets/javascripts/license_compliance/index.js

@@ -47,6 +47,7 @@ export default () => {
     },
     render(createElement) {
       return createElement(LicenseComplianceApp, {
+        // none of these can be injected.
         props: {
           sbomSurveySvgPath,
           emptyStateSvgPath,

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

@@ -26,7 +26,7 @@ describe('DependenciesApp component', () => {
     supportDocumentationPath: `${TEST_HOST}/dependency_scanning#supported-languages`,
   };
 
-  const factory = ({ props = basicAppProps, ...options } = {}) => {
+  const factory = ({ ...options } = {}) => {
     store = createStore();
     jest.spyOn(store, 'dispatch').mockImplementation();
 
@@ -41,9 +41,15 @@ describe('DependenciesApp component', () => {
     wrapper = extendedWrapper(
       mount(DependenciesApp, {
         store,
-        propsData: { ...props },
         stubs,
         ...options,
+        provide: {
+          endpoint: '/foo',
+          emptyStateSvgPath: '/bar.svg',
+          sbomSurveySvgPath: '/foo.svg',
+          documentationPath: TEST_HOST,
+          supportDocumentationPath: `${TEST_HOST}/dependency_scanning#supported-languages`,
+        },
       }),
     );
   };
@@ -221,7 +227,7 @@ describe('DependenciesApp component', () => {
       it('renders the SbomBannercomponent with the right props', () => {
         const sbomBanner = findSbomBanner();
         expect(sbomBanner.exists()).toBe(true);
-        expect(sbomBanner.props().sbomSurveySvgPath).toEqual(wrapper.props().sbomSurveySvgPath);
+        expect(sbomBanner.props().sbomSurveySvgPath).toEqual(wrapper.vm.sbomSurveySvgPath);
       });
 
       describe('given the user has public permissions', () => {