1 files changed, 48 insertions, 0 deletions
diff --git a/app/assets/javascripts/vue_shared/security_reports/components/security_report_download_dropdown.vue b/app/assets/javascripts/vue_shared/security_reports/components/security_report_download_dropdown.vue
new file mode 100644
index 00000000000..d7c1e27ff3e
--- /dev/null
+++ b/app/assets/javascripts/vue_shared/security_reports/components/security_report_download_dropdown.vue
@@ -0,0 +1,48 @@
+<script>
+import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
+import { s__, sprintf } from '~/locale';
+
+export default {
+  name: 'SecurityReportDownloadDropdown',
+  components: {
+    GlDropdown,
+    GlDropdownItem,
+  },
+  props: {
+    artifacts: {
+      type: Array,
+      required: true,
+    },
+    loading: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+  },
+  methods: {
+    artifactText({ name }) {
+      return sprintf(s__('SecurityReports|Download %{artifactName}'), {
+        artifactName: name,
+      });
+    },
+  },
+};
+</script>
+
+<template>
+  <gl-dropdown
+    :text="s__('SecurityReports|Download results')"
+    :loading="loading"
+    icon="download"
+    right
+  >
+    <gl-dropdown-item
+      v-for="artifact in artifacts"
+      :key="artifact.path"
+      :href="artifact.path"
+      download
+    >
+      {{ artifactText(artifact) }}
+    </gl-dropdown-item>
+  </gl-dropdown>
+</template>