1 files changed, 38 insertions, 0 deletions
diff --git a/app/assets/javascripts/packages_and_registries/package_registry/components/details/installation_title.vue b/app/assets/javascripts/packages_and_registries/package_registry/components/details/installation_title.vue
new file mode 100644
index 00000000000..43133bf7825
--- /dev/null
+++ b/app/assets/javascripts/packages_and_registries/package_registry/components/details/installation_title.vue
@@ -0,0 +1,38 @@
+<script>
+import PersistedDropdownSelection from '~/vue_shared/components/registry/persisted_dropdown_selection.vue';
+
+export default {
+  name: 'InstallationTitle',
+  components: {
+    PersistedDropdownSelection,
+  },
+  props: {
+    packageType: {
+      type: String,
+      required: true,
+    },
+    options: {
+      type: Array,
+      required: true,
+    },
+  },
+  computed: {
+    storageKey() {
+      return `package_${this.packageType}_installation_instructions`;
+    },
+  },
+};
+</script>
+
+<template>
+  <div class="gl-display-flex gl-justify-content-space-between gl-align-items-center">
+    <h3 class="gl-font-lg">{{ __('Installation') }}</h3>
+    <div>
+      <persisted-dropdown-selection
+        :storage-key="storageKey"
+        :options="options"
+        @change="$emit('change', $event)"
+      />
+    </div>
+  </div>
+</template>