Merge pull request #242 from sahibamittal/Issue-1903-osv-ecosystem

Issue 1903 : OSV - user-enabled list of ecosystem

Author: nscuro

src/i18n/locales/en.json

@@ -390,7 +390,7 @@
     "nvd": "NVD",
     "national_vulnerability_database": "National Vulnerability Database",
     "github_advisories": "GitHub Advisories",
-    "osv_advisories": "Google OSV Advisories",
+    "osv_advisories": "Google OSV Advisories (Beta)",
     "repositories": "Repositories",
     "cargo": "Cargo",
     "composer": "Composer",
@@ -455,7 +455,7 @@
     "vulnsource_nvd_feeds_url": "NVD Feeds URL",
     "vulnsource_github_advisories_enable": "Enable GitHub Advisory mirroring",
     "vulnsource_github_advisories_desc": "GitHub Advisories (GHSA) is a database of CVEs and GitHub-originated security advisories affecting the open source world. Dependency-Track integrates with GHSA by mirroring advisories via GitHub's public GraphQL API. The mirror is refreshed daily, or upon restart of the Dependency-Track instance. A personal access token (PAT) is required in order to authenticate with GitHub, but no scopes need to be assigned to it.",
-    "vulnsource_osv_advisories_enable": "Enable Google OSV Advisory mirroring",
+    "vulnsource_osv_advisories_enable": "Select ecosystem to enable Google OSV Advisory mirroring",
     "vulnsource_osv_advisories_desc": "Google OSV is a distributed vulnerability and triage infrastructure for open source projects aimed at helping both open source maintainers and consumers of open source. It serves as an aggregator of vulnerability databases that have adopted the OpenSSF Vulnerability format.",
     "registered_email_address": "Registered email address",
     "api_token": "API token",

src/shared/api.json

@@ -52,5 +52,6 @@
   "URL_LICENSE_GROUP": "api/v1/licenseGroup",
   "URL_ACL_MAPPING": "api/v1/acl/mapping",
   "URL_ACL_TEAM": "api/v1/acl/team",
-  "URL_VEX": "api/v1/vex"
+  "URL_VEX": "api/v1/vex",
+  "URL_OSV_ECOSYSTEM": "api/v1/integration/osv/ecosystem"
 }

src/views/administration/vuln-sources/EcosystemModal.vue

@@ -0,0 +1,68 @@
+<template>
+  <b-modal id="ecosystemModal" size="lg" hide-header-close no-stacking :title="$t('admin.select_ecosystem')">
+    <bootstrap-table
+      ref="table"
+      :columns="columns"
+      :data="data"
+      :options="options">
+    </bootstrap-table>
+    <template v-slot:modal-footer="{ cancel }">
+      <b-button size="md" variant="secondary" @click="cancel()">{{ $t('message.cancel') }}</b-button>
+      <b-button size="md" variant="primary" @click="$emit('selection', $refs.table.getSelections())">{{ $t('message.select') }}</b-button>
+    </template>
+  </b-modal>
+</template>
+
+<script>
+  import xssFilters from "xss-filters";
+  import common from "../../../shared/common";
+
+  export default {
+    mixins: [],
+    data() {
+      return {
+        labelIcon: {
+          dataOn: '\u2713',
+          dataOff: '\u2715'
+        },
+        columns: [
+          {
+            field: "state",
+            checkbox: true,
+            align: "center"
+          },
+          {
+            title: this.$t('message.name'),
+            field: "name",
+            sortable: true,
+            formatter(value) {
+              return xssFilters.inHTMLData(common.valueWithDefault(value, ""));
+            }
+          }
+        ],
+        data: [],
+        options: {
+          search: true,
+          showColumns: true,
+          showRefresh: true,
+          pagination: true,
+          silentSort: false,
+          sidePagination: 'client',
+          queryParamsType: 'pageSize',
+          pageList: '[10, 25, 50, 100]',
+          pageSize: 10,
+          icons: {
+            refresh: 'fa-refresh'
+          },
+          responseHandler: function (res, xhr) {
+            res.total = xhr.getResponseHeader("X-Total-Count");
+            return res.map(ecosystem => ({
+                name: ecosystem
+            }));
+          },
+          url: `${this.$api.BASE_URL}/${this.$api.URL_OSV_ECOSYSTEM}`
+        }
+      };
+    }
+  }
+</script>

src/views/administration/vuln-sources/VulnSourceOSVAdvisories.vue

@@ -9,49 +9,81 @@
         label
         v-bind="labelIcon"
         v-model="vulnsourceEnabled"
+        @change="handleVulnsourceEnabled"
+        :disabled="enabledEcosystems.length === 0"
       />
       {{$t('admin.vulnsource_osv_advisories_enable')}}
       <hr/>
       {{ $t('admin.vulnsource_osv_advisories_desc') }}
     </b-card-body>
-    <b-card-footer>
-      <b-button
-        @click="saveChanges"
-        class="px-4"
-        variant="outline-primary">
-          {{ $t('message.update') }}
-      </b-button>
-    </b-card-footer>
+    <b-card-body>
+      <b-form-group label="Ecosystems">
+        <div class="list-group" style="width: 40%">
+          <span v-for="ecosystem in enabledEcosystems" :key="ecosystem">
+            <actionable-list-group-item :value="ecosystem" :delete-icon="true" @actionClicked="removeEcosystem(ecosystem)"/>
+          </span>
+          <actionable-list-group-item :add-icon="true" @actionClicked="$root.$emit('bv::show::modal', 'ecosystemModal')"/>
+        </div>
+      </b-form-group>
+      <hr/>
+    </b-card-body>
+    <ecosystem-modal v-on:selection="updateEcosystem"/>
   </b-card>
 </template>
-
 <script>
+
 import { Switch as cSwitch } from '@coreui/vue';
-import common from "../../../shared/common";
 import configPropertyMixin from "../mixins/configPropertyMixin";
+import EcosystemModal from "./EcosystemModal";
+import ActionableListGroupItem from '../../components/ActionableListGroupItem.vue';
 
 export default {
   mixins: [configPropertyMixin],
   props: {
     header: String
   },
   components: {
-    cSwitch
-  },
+    cSwitch,
+    EcosystemModal,
+    ActionableListGroupItem
+},
   data() {
     return {
       vulnsourceEnabled: false,
+      ecosystemConfig: null,
+      enabledEcosystems: [],
       labelIcon: {
         dataOn: '\u2713',
         dataOff: '\u2715'
       },
     }
   },
   methods: {
-    saveChanges: function() {
+    removeEcosystem: function(ecosystem) {
+      this.enabledEcosystems = this.enabledEcosystems.filter(e => e !== ecosystem);
+      this.vulnsourceEnabled = this.enabledEcosystems.length !== 0;
       this.updateConfigProperties([
-        {groupName: 'vuln-source', propertyName: 'google.osv.enabled', propertyValue: this.vulnsourceEnabled}
+        {groupName: 'vuln-source', propertyName: 'google.osv.enabled', propertyValue: this.enabledEcosystems.join(";")}
       ]);
+    },
+    updateEcosystem: function(ecosystems) {
+      this.$root.$emit('bv::hide::modal', 'ecosystemModal');
+      for(let i=0; i<ecosystems.length; i++) {
+        let ecosystem = ecosystems[i];
+        this.enabledEcosystems.push(ecosystem.name);
+      }
+      this.vulnsourceEnabled = this.enabledEcosystems.length !== 0;
+      this.updateConfigProperties([
+        {groupName: 'vuln-source', propertyName: 'google.osv.enabled', propertyValue: this.enabledEcosystems.join(";")}
+      ]);
+    },
+    handleVulnsourceEnabled: function(vulnsourceEnabled) {
+      if (vulnsourceEnabled === false) {
+        this.enabledEcosystems = [];
+        this.updateConfigProperties([
+          {groupName: 'vuln-source', propertyName: 'google.osv.enabled', propertyValue: null}
+        ]);
+      }
     }
   },
   created () {
@@ -61,10 +93,13 @@ export default {
         let item = configItems[i];
         switch (item.propertyName) {
           case "google.osv.enabled":
-            this.vulnsourceEnabled = common.toBoolean(item.propertyValue); break;
+            this.ecosystemConfig = item.propertyValue;
+            this.vulnsourceEnabled = this.ecosystemConfig != null;
+            break;
         }
       }
+      this.enabledEcosystems = this.ecosystemConfig.split(';').map(ecosystem => ecosystem.trim());
     });
   }
 }
-</script>
+</script>