Refactor license_compliance to use provide/inject for static values

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

@@ -36,20 +36,7 @@ export default {
     LicenseManagement,
   },
   mixins: [glFeatureFlagsMixin()],
-  props: {
-    emptyStateSvgPath: {
-      type: String,
-      required: true,
-    },
-    sbomSurveySvgPath: {
-      type: String,
-      required: true,
-    },
-    documentationPath: {
-      type: String,
-      required: true,
-    },
-  },
+  inject: ['sbomSurveySvgPath', 'emptyStateSvgPath', 'documentationPath'],
   data() {
     return {
       tabIndex: this.activeTabIndex(),

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

@@ -7,8 +7,6 @@ export default () => {
   const el = document.querySelector('#js-licenses-app');
   const {
     projectLicensesEndpoint,
-    emptyStateSvgPath,
-    documentationPath,
     readLicensePoliciesEndpoint,
     writeLicensePoliciesEndpoint,
     projectId,
@@ -18,7 +16,6 @@ export default () => {
     approvalsDocumentationPath,
     lockedApprovalsRuleName,
     softwareLicenses,
-    sbomSurveySvgPath,
   } = el.dataset;
 
   const storeSettings = {
@@ -31,6 +28,12 @@ export default () => {
   };
   const store = createStore(storeSettings);
 
+  const provide = {
+    sbomSurveySvgPath: el.dataset.sbomSurveySvgPath,
+    emptyStateSvgPath: el.dataset.emptyStateSvgPath,
+    documentationPath: el.dataset.documentationPath,
+  };
+
   store.dispatch('licenseManagement/setIsAdmin', Boolean(writeLicensePoliciesEndpoint));
   store.dispatch('licenseManagement/setAPISettings', {
     apiUrlManageLicenses: readLicensePoliciesEndpoint,
@@ -45,15 +48,9 @@ export default () => {
     components: {
       LicenseComplianceApp,
     },
+    provide: () => provide,
     render(createElement) {
-      return createElement(LicenseComplianceApp, {
-        // none of these can be injected.
-        props: {
-          sbomSurveySvgPath,
-          emptyStateSvgPath,
-          documentationPath,
-        },
-      });
+      return createElement(LicenseComplianceApp);
     },
   });
 };

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

@@ -74,15 +74,17 @@ const createComponent = ({ state, props, options }) => {
 
   wrapper = mountFunc(LicenseComplianceApp, {
     propsData: {
-      emptyStateSvgPath,
-      documentationPath,
-      sbomSurveySvgPath,
       readLicensePoliciesEndpoint,
       ...props,
     },
     ...options,
     store: fakeStore,
     stubs: { transition: stubTransition() },
+    provide: {
+      sbomSurveySvgPath,
+      emptyStateSvgPath,
+      documentationPath,
+    },
   });
 };
 
@@ -190,7 +192,7 @@ describe('Project Licenses', () => {
     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);
     });
 
     it('renders a "Detected in project" tab and a "Policies" tab', () => {