From f64a639bcfa1fc2bc89ca7db268f594306edfd7c Mon Sep 17 00:00:00 2001
From: GitLab Bot <gitlab-bot@gitlab.com>
Date: Tue, 16 Mar 2021 18:18:33 +0000
Subject: Add latest changes from gitlab-org/gitlab@13-10-stable-ee

---
 .../releases/components/app_edit_new.vue           | 11 ++--
 .../releases/components/asset_links_form.vue       |  3 +
 .../releases/components/tag_field_new.vue          | 70 ++++++++++++++++++----
 3 files changed, 67 insertions(+), 17 deletions(-)

(limited to 'app/assets/javascripts/releases')

diff --git a/app/assets/javascripts/releases/components/app_edit_new.vue b/app/assets/javascripts/releases/components/app_edit_new.vue
index b16bb76c305..a8c7b7c857a 100644
--- a/app/assets/javascripts/releases/components/app_edit_new.vue
+++ b/app/assets/javascripts/releases/components/app_edit_new.vue
@@ -86,12 +86,11 @@ export default {
       ];
     },
   },
-  mounted() {
-    // eslint-disable-next-line promise/catch-or-return
-    this.initializeRelease().then(() => {
-      // Focus the first non-disabled input element
-      this.$el.querySelector('input:enabled').focus();
-    });
+  async mounted() {
+    await this.initializeRelease();
+
+    // Focus the first non-disabled input or button element
+    this.$el.querySelector('input:enabled, button:enabled').focus();
   },
   methods: {
     ...mapActions('detail', [
diff --git a/app/assets/javascripts/releases/components/asset_links_form.vue b/app/assets/javascripts/releases/components/asset_links_form.vue
index 9e095c8a9c2..cfcb9f6978d 100644
--- a/app/assets/javascripts/releases/components/asset_links_form.vue
+++ b/app/assets/javascripts/releases/components/asset_links_form.vue
@@ -141,6 +141,7 @@ export default {
           :value="link.url"
           type="text"
           class="form-control"
+          name="asset-url"
           :state="isUrlValid(link)"
           @change="updateUrl(link, $event)"
           @keydown.ctrl.enter="updateUrl(link, $event.target.value)"
@@ -180,6 +181,7 @@ export default {
           :value="link.name"
           type="text"
           class="form-control"
+          name="asset-link-name"
           :state="isNameValid(link)"
           @change="updateName(link, $event)"
           @keydown.ctrl.enter="updateName(link, $event.target.value)"
@@ -202,6 +204,7 @@ export default {
           ref="typeSelect"
           :value="link.linkType || $options.defaultTypeOptionValue"
           class="form-control pr-4"
+          name="asset-type"
           :options="$options.typeOptions"
           @change="updateAssetLinkType({ linkIdToUpdate: link.id, newType: $event })"
         />
diff --git a/app/assets/javascripts/releases/components/tag_field_new.vue b/app/assets/javascripts/releases/components/tag_field_new.vue
index 660fd7ac950..21360a5c6cb 100644
--- a/app/assets/javascripts/releases/components/tag_field_new.vue
+++ b/app/assets/javascripts/releases/components/tag_field_new.vue
@@ -1,20 +1,29 @@
 <script>
-import { GlFormGroup, GlFormInput } from '@gitlab/ui';
+import { GlFormGroup, GlDropdownItem, GlSprintf } from '@gitlab/ui';
 import { uniqueId } from 'lodash';
 import { mapState, mapActions, mapGetters } from 'vuex';
 import { __ } from '~/locale';
 import RefSelector from '~/ref/components/ref_selector.vue';
+import { REF_TYPE_TAGS } from '~/ref/constants';
 import FormFieldContainer from './form_field_container.vue';
 
 export default {
   name: 'TagFieldNew',
-  components: { GlFormGroup, GlFormInput, RefSelector, FormFieldContainer },
+  components: {
+    GlFormGroup,
+    RefSelector,
+    FormFieldContainer,
+    GlDropdownItem,
+    GlSprintf,
+  },
   data() {
     return {
       // Keeps track of whether or not the user has interacted with
       // the input field. This is used to avoid showing validation
       // errors immediately when the page loads.
       isInputDirty: false,
+
+      showCreateFrom: true,
     };
   },
   computed: {
@@ -26,6 +35,12 @@ export default {
       },
       set(tagName) {
         this.updateReleaseTagName(tagName);
+
+        // This setter is used by the `v-model` on the `RefSelector`.
+        // When this is called, the selection originated from the
+        // dropdown list of existing tag names, so we know the tag
+        // already exists and don't need to show the "create from" input
+        this.showCreateFrom = false;
       },
     },
     createFromModel: {
@@ -51,12 +66,28 @@ export default {
     markInputAsDirty() {
       this.isInputDirty = true;
     },
+    createTagClicked(newTagName) {
+      this.updateReleaseTagName(newTagName);
+
+      // This method is called when the user selects the "create tag"
+      // option, so the tag does not already exist. Because of this,
+      // we need to show the "create from" input.
+      this.showCreateFrom = true;
+    },
   },
   translations: {
-    noRefSelected: __('No source selected'),
-    searchPlaceholder: __('Search branches, tags, and commits'),
-    dropdownHeader: __('Select source'),
+    tagName: {
+      noRefSelected: __('No tag selected'),
+      dropdownHeader: __('Tag name'),
+      searchPlaceholder: __('Search or create tag'),
+    },
+    createFrom: {
+      noRefSelected: __('No source selected'),
+      searchPlaceholder: __('Search branches, tags, and commits'),
+      dropdownHeader: __('Select source'),
+    },
   },
+  tagNameEnabledRefTypes: [REF_TYPE_TAGS],
 };
 </script>
 <template>
@@ -69,17 +100,34 @@ export default {
       :invalid-feedback="__('Tag name is required')"
     >
       <form-field-container>
-        <gl-form-input
+        <ref-selector
           :id="tagNameInputId"
           v-model="tagName"
+          :project-id="projectId"
+          :translations="$options.translations.tagName"
+          :enabled-ref-types="$options.tagNameEnabledRefTypes"
           :state="!showTagNameValidationError"
-          type="text"
-          class="form-control"
-          @blur.once="markInputAsDirty"
-        />
+          @hide.once="markInputAsDirty"
+        >
+          <template #footer="{ isLoading, matches, query }">
+            <gl-dropdown-item
+              v-if="!isLoading && matches && matches.tags.totalCount === 0"
+              is-check-item
+              :is-checked="tagName === query"
+              @click="createTagClicked(query)"
+            >
+              <gl-sprintf :message="__('Create tag %{tagName}')">
+                <template #tagName>
+                  <b>{{ query }}</b>
+                </template>
+              </gl-sprintf>
+            </gl-dropdown-item>
+          </template>
+        </ref-selector>
       </form-field-container>
     </gl-form-group>
     <gl-form-group
+      v-if="showCreateFrom"
       :label="__('Create from')"
       :label-for="createFromSelectorId"
       data-testid="create-from-field"
@@ -89,7 +137,7 @@ export default {
           :id="createFromSelectorId"
           v-model="createFromModel"
           :project-id="projectId"
-          :translations="$options.translations"
+          :translations="$options.translations.createFrom"
         />
       </form-field-container>
       <template #description>
-- 
cgit v1.2.3