Add latest changes from gitlab-org/gitlab@master

3 files changed, 115 insertions, 1 deletions

diff --git a/app/assets/javascripts/integrations/edit/components/integration_form.vue b/app/assets/javascripts/integrations/edit/components/integration_form.vue
index ef7a4d44b20..8d603e3ea44 100644
--- a/app/assets/javascripts/integrations/edit/components/integration_form.vue
+++ b/app/assets/javascripts/integrations/edit/components/integration_form.vue
@@ -1,6 +1,8 @@
 <script>
+import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import ActiveToggle from './active_toggle.vue';
 import JiraTriggerFields from './jira_trigger_fields.vue';
+import JiraIssuesFields from './jira_issues_fields.vue';
 import TriggerFields from './trigger_fields.vue';
 import DynamicField from './dynamic_field.vue';
 
@@ -9,9 +11,11 @@ export default {
   components: {
     ActiveToggle,
     JiraTriggerFields,
+    JiraIssuesFields,
     TriggerFields,
     DynamicField,
   },
+  mixins: [glFeatureFlagsMixin()],
   props: {
     activeToggleProps: {
       type: Object,
@@ -25,6 +29,10 @@ export default {
       type: Object,
       required: true,
     },
+    jiraIssuesProps: {
+      type: Object,
+      required: true,
+    },
     triggerEvents: {
       type: Array,
       required: false,
@@ -44,6 +52,9 @@ export default {
     isJira() {
       return this.type === 'jira';
     },
+    showJiraIssuesFields() {
+      return this.isJira && this.glFeatures.jiraIntegration;
+    },
   },
 };
 </script>
@@ -54,5 +65,6 @@ export default {
     <jira-trigger-fields v-if="isJira" v-bind="triggerFieldsProps" />
     <trigger-fields v-else-if="triggerEvents.length" :events="triggerEvents" :type="type" />
     <dynamic-field v-for="field in fields" :key="field.name" v-bind="field" />
+    <jira-issues-fields v-if="showJiraIssuesFields" v-bind="jiraIssuesProps" />
   </div>
 </template>
diff --git a/app/assets/javascripts/integrations/edit/components/jira_issues_fields.vue b/app/assets/javascripts/integrations/edit/components/jira_issues_fields.vue
new file mode 100644
index 00000000000..2a8e21b7fd6
--- /dev/null
+++ b/app/assets/javascripts/integrations/edit/components/jira_issues_fields.vue
@@ -0,0 +1,88 @@
+<script>
+import { GlFormGroup, GlFormCheckbox, GlFormInput, GlSprintf, GlLink } from '@gitlab/ui';
+
+export default {
+  name: 'JiraIssuesFields',
+  components: {
+    GlFormGroup,
+    GlFormCheckbox,
+    GlFormInput,
+    GlSprintf,
+    GlLink,
+  },
+  props: {
+    initialEnableJiraIssues: {
+      type: Boolean,
+      required: false,
+    },
+    initialProjectKey: {
+      type: String,
+      required: false,
+      default: null,
+    },
+    editProjectPath: {
+      type: String,
+      required: false,
+      default: null,
+    },
+  },
+  data() {
+    return {
+      enableJiraIssues: this.initialEnableJiraIssues,
+      projectKey: this.initialProjectKey,
+    };
+  },
+};
+</script>
+
+<template>
+  <div>
+    <gl-form-group
+      :label="s__('JiraService|View Jira issues in GitLab')"
+      label-for="jira-issue-settings"
+    >
+      <div id="jira-issue-settings">
+        <p>
+          {{
+            s__(
+              'JiraService|Work on Jira issues without leaving GitLab. Adds a Jira menu to access your list of issues and view any issue as read-only.',
+            )
+          }}
+        </p>
+        <input name="service[issues_enabled]" type="hidden" value="false" />
+        <gl-form-checkbox v-model="enableJiraIssues" name="service[issues_enabled]">
+          {{ s__('JiraService|Enable Jira issues') }}
+          <template #help>
+            {{
+              s__(
+                'JiraService|Warning: All GitLab users that have access to this GitLab project will be able to view all issues from the Jira project specified below.',
+              )
+            }}
+          </template>
+        </gl-form-checkbox>
+      </div>
+    </gl-form-group>
+    <gl-form-group :label="s__('JiraService|Jira project key')">
+      <gl-form-input
+        v-model="projectKey"
+        type="text"
+        name="service[project_key]"
+        :placeholder="s__('JiraService|e.g. AB')"
+        :disabled="!enableJiraIssues"
+      />
+    </gl-form-group>
+    <p>
+      <gl-sprintf
+        :message="
+          s__(
+            'JiraService|Displaying Jira issues while leaving the GitLab issue functionality enabled might be confusing. Consider %{linkStart}disabling GitLab issues%{linkEnd} if they won’t otherwise be used.',
+          )
+        "
+      >
+        <template #link="{ content }">
+          <gl-link :href="editProjectPath" target="_blank">{{ content }}</gl-link>
+        </template>
+      </gl-sprintf>
+    </p>
+  </div>
+</template>
diff --git a/app/assets/javascripts/integrations/edit/index.js b/app/assets/javascripts/integrations/edit/index.js
index 21b5ca17951..912abba9d7e 100644
--- a/app/assets/javascripts/integrations/edit/index.js
+++ b/app/assets/javascripts/integrations/edit/index.js
@@ -15,13 +15,22 @@ export default el => {
     return result;
   }
 
-  const { type, commentDetail, triggerEvents, fields, ...booleanAttributes } = el.dataset;
+  const {
+    type,
+    commentDetail,
+    projectKey,
+    editProjectPath,
+    triggerEvents,
+    fields,
+    ...booleanAttributes
+  } = el.dataset;
   const {
     showActive,
     activated,
     commitEvents,
     mergeRequestEvents,
     enableComments,
+    enableJiraIssues,
   } = parseBooleanInData(booleanAttributes);
 
   return new Vue({
@@ -40,6 +49,11 @@ export default el => {
             initialEnableComments: enableComments,
             initialCommentDetail: commentDetail,
           },
+          jiraIssuesProps: {
+            initialEnableJiraIssues: enableJiraIssues,
+            initialProjectKey: projectKey,
+            editProjectPath,
+          },
           triggerEvents: JSON.parse(triggerEvents),
           fields: JSON.parse(fields),
         },