Merge branch 'master' into jivl-update-katex

app/assets/javascripts/lib/utils/http_status.js

@@ -6,4 +6,6 @@ export default {
   ABORTED: 0,
   NO_CONTENT: 204,
   OK: 200,
+  MULTIPLE_CHOICES: 300,
+  BAD_REQUEST: 400,
 };

app/assets/javascripts/lib/utils/text_utility.js

@@ -73,3 +73,10 @@ export function capitalizeFirstCharacter(text) {
  * @returns {String}
  */
 export const stripHtml = (string, replace = '') => string.replace(/<[^>]*>/g, replace);
+
+/**
+ * Converts snake_case string to camelCase
+ *
+ * @param {*} string
+ */
+export const convertToCamelCase = string => string.replace(/(_\w)/g, s => s[1].toUpperCase());

app/assets/javascripts/main.js

@@ -26,6 +26,7 @@ import './gl_dropdown';
 import initTodoToggle from './header';
 import initImporterStatus from './importer_status';
 import initLayoutNav from './layout_nav';
+import './feature_highlight/feature_highlight_options';
 import LazyLoader from './lazy_loader';
 import initLogoAnimation from './logo';
 import './milestone_select';

app/assets/javascripts/merge_conflicts/components/diff_file_editor.js

@@ -2,7 +2,9 @@
 /* global ace */
 import Vue from 'vue';
-import Flash from '../../flash';
+import axios from '~/lib/utils/axios_utils';
+import flash from '~/flash';
+import { __ } from '~/locale';
 ((global) => {
   global.mergeConflicts = global.mergeConflicts || {};
@@ -49,27 +51,26 @@ import Flash from '../../flash';
       loadEditor() {
         this.loading = true;
-        $.get(this.file.content_path)
-          .done((file) => {
+        axios.get(this.file.content_path)
+          .then(({ data }) => {
             const content = this.$el.querySelector('pre');
-            const fileContent = document.createTextNode(file.content);
+            const fileContent = document.createTextNode(data.content);
             content.textContent = fileContent.textContent;
-            this.originalContent = file.content;
+            this.originalContent = data.content;
             this.fileLoaded = true;
             this.editor = ace.edit(content);
             this.editor.$blockScrolling = Infinity; // Turn off annoying warning
-            this.editor.getSession().setMode(`ace/mode/${file.blob_ace_mode}`);
+            this.editor.getSession().setMode(`ace/mode/${data.blob_ace_mode}`);
             this.editor.on('change', () => {
               this.saveDiffResolution();
             });
             this.saveDiffResolution();
+            this.loading = false;
           })
-          .fail(() => {
-            new Flash('Failed to load the file, please try again.');
-          })
-          .always(() => {
+          .catch(() => {
+            flash(__('An error occurred while loading the file'));
             this.loading = false;
           });
       },

app/assets/javascripts/merge_request.js

 /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, quotes, no-underscore-dangle, one-var, one-var-declaration-per-line, consistent-return, dot-notation, quote-props, comma-dangle, object-shorthand, max-len, prefer-arrow-callback */
-
-import 'vendor/jquery.waitforimages';
 import { __ } from '~/locale';
 import TaskList from './task_list';
 import MergeRequestTabs from './merge_request_tabs';

app/assets/javascripts/monitoring/components/dashboard.vue

@@ -27,6 +27,7 @@
         hasMetrics: convertPermissionToBoolean(metricsData.hasMetrics),
         documentationPath: metricsData.documentationPath,
         settingsPath: metricsData.settingsPath,
+        clustersPath: metricsData.clustersPath,
         tagsPath: metricsData.tagsPath,
         projectPath: metricsData.projectPath,
         metricsEndpoint: metricsData.additionalMetrics,
@@ -132,6 +133,7 @@
     :selected-state="state"
     :documentation-path="documentationPath"
     :settings-path="settingsPath"
+    :clusters-path="clustersPath"
     :empty-getting-started-svg-path="emptyGettingStartedSvgPath"
     :empty-loading-svg-path="emptyLoadingSvgPath"
     :empty-unable-to-connect-svg-path="emptyUnableToConnectSvgPath"

app/assets/javascripts/monitoring/components/empty_state.vue

@@ -10,6 +10,11 @@
         required: false,
         default: '',
       },
+      clustersPath: {
+        type: String,
+        required: false,
+        default: '',
+      },
       selectedState: {
         type: String,
         required: true,
@@ -35,7 +40,10 @@
             title: 'Get started with performance monitoring',
             description: `Stay updated about the performance and health
               of your environment by configuring Prometheus to monitor your deployments.`,
-            buttonText: 'Configure Prometheus',
+            buttonText: 'Install Prometheus on clusters',
+            buttonPath: this.clustersPath,
+            secondaryButtonText: 'Configure existing Prometheus',
+            secondaryButtonPath: this.settingsPath,
           },
           loading: {
             svgUrl: this.emptyLoadingSvgPath,
@@ -43,6 +51,7 @@
             description: `Creating graphs uses the data from the Prometheus server.
               If this takes a long time, ensure that data is available.`,
             buttonText: 'View documentation',
+            buttonPath: this.documentationPath,
           },
           noData: {
             svgUrl: this.emptyUnableToConnectSvgPath,
@@ -50,12 +59,14 @@
             description: `You are connected to the Prometheus server, but there is currently
               no data to display.`,
             buttonText: 'Configure Prometheus',
+            buttonPath: this.settingsPath,
           },
           unableToConnect: {
             svgUrl: this.emptyUnableToConnectSvgPath,
             title: 'Unable to connect to Prometheus server',
             description: 'Ensure connectivity is available from the GitLab server to the ',
             buttonText: 'View documentation',
+            buttonPath: this.documentationPath,
           },
         },
       };
@@ -65,13 +76,6 @@
         return this.states[this.selectedState];
       },
-      buttonPath() {
-        if (this.selectedState === 'gettingStarted') {
-          return this.settingsPath;
-        }
-        return this.documentationPath;
-      },
-
       showButtonDescription() {
         if (this.selectedState === 'unableToConnect') return true;
         return false;
@@ -99,11 +103,21 @@
     </p>
     <div class="state-button">
       <a
+        v-if="currentState.buttonPath"
         class="btn btn-success"
-        :href="buttonPath"
+        :href="currentState.buttonPath"
       >
         {{ currentState.buttonText }}
       </a>
     </div>
+    <div class="state-button">
+      <a
+        v-if="currentState.secondaryButtonPath"
+        class="btn"
+        :href="currentState.secondaryButtonPath"
+      >
+        {{ currentState.secondaryButtonText }}
+      </a>
+    </div>
   </div>
 </template>

app/assets/javascripts/notes/components/noteable_note.vue

@@ -102,6 +102,7 @@
           .then(() => {
             this.isEditing = false;
             this.isRequesting = false;
+            this.oldContent = null;
             $(this.$refs.noteBody.$el).renderGFM();
             this.$refs.noteBody.resetAutoSave();
             callback();

app/assets/javascripts/pages/admin/projects/index/components/delete_project_modal.vue

+<script>
+  import _ from 'underscore';
+  import modal from '~/vue_shared/components/modal.vue';
+  import { s__, sprintf } from '~/locale';
+
+  export default {
+    components: {
+      modal,
+    },
+    props: {
+      deleteProjectUrl: {
+        type: String,
+        required: false,
+        default: '',
+      },
+      projectName: {
+        type: String,
+        required: false,
+        default: '',
+      },
+      csrfToken: {
+        type: String,
+        required: false,
+        default: '',
+      },
+    },
+    data() {
+      return {
+        enteredProjectName: '',
+      };
+    },
+    computed: {
+      title() {
+        return sprintf(s__('AdminProjects|Delete Project %{projectName}?'),
+          {
+            projectName: `'${_.escape(this.projectName)}'`,
+          },
+          false,
+        );
+      },
+      text() {
+        return sprintf(s__(`AdminProjects|
+          You’re about to permanently delete the project %{projectName}, its repository,
+          and all related resources including issues, merge requests, etc..  Once you confirm and press
+          %{strong_start}Delete project%{strong_end}, it cannot be undone or recovered.`),
+          {
+            projectName: `<strong>${_.escape(this.projectName)}</strong>`,
+            strong_start: '<strong>',
+            strong_end: '</strong>',
+          },
+          false,
+        );
+      },
+      confirmationTextLabel() {
+        return sprintf(s__('AdminUsers|To confirm, type %{projectName}'),
+          {
+            projectName: `<code>${_.escape(this.projectName)}</code>`,
+          },
+          false,
+        );
+      },
+      primaryButtonLabel() {
+        return s__('AdminProjects|Delete project');
+      },
+      canSubmit() {
+        return this.enteredProjectName === this.projectName;
+      },
+    },
+    methods: {
+      onCancel() {
+        this.enteredProjectName = '';
+      },
+      onSubmit() {
+        this.$refs.form.submit();
+        this.enteredProjectName = '';
+      },
+    },
+  };
+</script>
+
+<template>
+  <modal
+    id="delete-project-modal"
+    :title="title"
+    :text="text"
+    kind="danger"
+    :primary-button-label="primaryButtonLabel"
+    :submit-disabled="!canSubmit"
+    @submit="onSubmit"
+    @cancel="onCancel"
+  >
+    <template
+      slot="body"
+      slot-scope="props"
+    >
+      <p v-html="props.text"></p>
+      <p v-html="confirmationTextLabel"></p>
+      <form
+        ref="form"
+        :action="deleteProjectUrl"
+        method="post"
+      >
+        <input
+          ref="method"
+          type="hidden"
+          name="_method"
+          value="delete"
+        />
+        <input
+          type="hidden"
+          name="authenticity_token"
+          :value="csrfToken"
+        />
+        <input
+          name="projectName"
+          class="form-control"
+          type="text"
+          v-model="enteredProjectName"
+          aria-labelledby="input-label"
+          autocomplete="off"
+        />
+      </form>
+    </template>
+  </modal>
+</template>

app/assets/javascripts/pages/admin/projects/index/index.js

+import Vue from 'vue';
+
+import Translate from '~/vue_shared/translate';
+import csrf from '~/lib/utils/csrf';
+
+import deleteProjectModal from './components/delete_project_modal.vue';
+
+export default () => {
+  Vue.use(Translate);
+
+  const deleteProjectModalEl = document.getElementById('delete-project-modal');
+
+  const deleteModal = new Vue({
+    el: deleteProjectModalEl,
+    data: {
+      deleteProjectUrl: '',
+      projectName: '',
+    },
+    render(createElement) {
+      return createElement(deleteProjectModal, {
+        props: {
+          deleteProjectUrl: this.deleteProjectUrl,
+          projectName: this.projectName,
+          csrfToken: csrf.token,
+        },
+      });
+    },
+  });
+
+  $(document).on('shown.bs.modal', (event) => {
+    if (event.relatedTarget.classList.contains('delete-project-button')) {
+      const buttonProps = event.relatedTarget.dataset;
+      deleteModal.deleteProjectUrl = buttonProps.deleteProjectUrl;
+      deleteModal.projectName = buttonProps.projectName;
+    }
+  });
+};

app/assets/javascripts/pages/admin/users/shared/components/delete_user_modal.vue

+<script>
+  import _ from 'underscore';
+  import modal from '~/vue_shared/components/modal.vue';
+  import { s__, sprintf } from '~/locale';
+
+  export default {
+    components: {
+      modal,
+    },
+    props: {
+      deleteUserUrl: {
+        type: String,
+        required: false,
+        default: '',
+      },
+      blockUserUrl: {
+        type: String,
+        required: false,
+        default: '',
+      },
+      deleteContributions: {
+        type: Boolean,
+        required: false,
+        default: false,
+      },
+      username: {
+        type: String,
+        required: false,
+        default: '',
+      },
+      csrfToken: {
+        type: String,
+        required: false,
+        default: '',
+      },
+    },
+    data() {
+      return {
+        enteredUsername: '',
+      };
+    },
+    computed: {
+      title() {
+        const keepContributionsTitle = s__('AdminUsers|Delete User %{username}?');
+        const deleteContributionsTitle = s__('AdminUsers|Delete User %{username} and contributions?');
+
+        return sprintf(
+          this.deleteContributions ? deleteContributionsTitle : keepContributionsTitle, {
+            username: `'${_.escape(this.username)}'`,
+          }, false);
+      },
+      text() {
+        const keepContributionsText = s__(`AdminArea|
+          You are about to permanently delete the user %{username}.
+          This will delete all of the issues, merge requests, and groups linked to them.
+          To avoid data loss, consider using the %{strong_start}block user%{strong_end} feature instead.
+          Once you %{strong_start}Delete user%{strong_end}, it cannot be undone or recovered.`);
+
+        const deleteContributionsText = s__(`AdminArea|
+          You are about to permanently delete the user %{username}.
+          Issues, merge requests, and groups linked to them will be transferred to a system-wide "Ghost-user".
+          To avoid data loss, consider using the %{strong_start}block user%{strong_end} feature instead.
+          Once you %{strong_start}Delete user%{strong_end}, it cannot be undone or recovered.`);
+
+        return sprintf(this.deleteContributions ? deleteContributionsText : keepContributionsText,
+          {
+            username: `<strong>${_.escape(this.username)}</strong>`,
+            strong_start: '<strong>',
+            strong_end: '</strong>',
+          },
+          false,
+        );
+      },
+      confirmationTextLabel() {
+        return sprintf(s__('AdminUsers|To confirm, type %{username}'),
+          {
+            username: `<code>${_.escape(this.username)}</code>`,
+          },
+          false,
+        );
+      },
+      primaryButtonLabel() {
+        const keepContributionsLabel = s__('AdminUsers|Delete user');
+        const deleteContributionsLabel = s__('AdminUsers|Delete user and contributions');
+
+        return this.deleteContributions ? deleteContributionsLabel : keepContributionsLabel;
+      },
+      secondaryButtonLabel() {
+        return s__('AdminUsers|Block user');
+      },
+      canSubmit() {
+        return this.enteredUsername === this.username;
+      },
+    },
+    methods: {
+      onCancel() {
+        this.enteredUsername = '';
+      },
+      onSecondaryAction() {
+        const form = this.$refs.form;
+
+        form.action = this.blockUserUrl;
+        this.$refs.method.value = 'put';
+
+        form.submit();
+      },
+      onSubmit() {
+        this.$refs.form.submit();
+        this.enteredUsername = '';
+      },
+    },
+  };
+</script>
+
+<template>
+  <modal
+    id="delete-user-modal"
+    :title="title"
+    :text="text"
+    kind="danger"
+    :primary-button-label="primaryButtonLabel"
+    :secondary-button-label="secondaryButtonLabel"
+    :submit-disabled="!canSubmit"
+    @submit="onSubmit"
+    @cancel="onCancel"
+  >
+    <template
+      slot="body"
+      slot-scope="props"
+    >
+      <p v-html="props.text"></p>
+      <p v-html="confirmationTextLabel"></p>
+      <form
+        ref="form"
+        :action="deleteUserUrl"
+        method="post"
+      >
+        <input
+          ref="method"
+          type="hidden"
+          name="_method"
+          value="delete"
+        />
+        <input
+          type="hidden"
+          name="authenticity_token"
+          :value="csrfToken"
+        />
+        <input
+          type="text"
+          name="username"
+          class="form-control"
+          v-model="enteredUsername"
+          aria-labelledby="input-label"
+          autocomplete="off"
+        />
+      </form>
+    </template>
+    <template
+      slot="secondary-button"
+      slot-scope="props"
+    >
+      <button
+        type="button"
+        class="btn js-secondary-button btn-warning"
+        :disabled="!canSubmit"
+        @click="onSecondaryAction"
+        data-dismiss="modal"
+      >
+        {{ secondaryButtonLabel }}
+      </button>
+    </template>
+  </modal>
+</template>

app/assets/javascripts/pages/admin/users/shared/index.js

+import Vue from 'vue';
+
+import Translate from '~/vue_shared/translate';
+import csrf from '~/lib/utils/csrf';
+
+import deleteUserModal from './components/delete_user_modal.vue';
+
+export default () => {
+  Vue.use(Translate);
+
+  const deleteUserModalEl = document.getElementById('delete-user-modal');
+
+  const deleteModal = new Vue({
+    el: deleteUserModalEl,
+    data: {
+      deleteUserUrl: '',
+      blockUserUrl: '',
+      deleteContributions: '',
+      username: '',
+    },
+    render(createElement) {
+      return createElement(deleteUserModal, {
+        props: {
+          deleteUserUrl: this.deleteUserUrl,
+          blockUserUrl: this.blockUserUrl,
+          deleteContributions: this.deleteContributions,
+          username: this.username,
+          csrfToken: csrf.token,
+        },
+      });
+    },
+  });
+
+  $(document).on('shown.bs.modal', (event) => {
+    if (event.relatedTarget.classList.contains('delete-user-button')) {
+      const buttonProps = event.relatedTarget.dataset;
+      deleteModal.deleteUserUrl = buttonProps.deleteUserUrl;
+      deleteModal.blockUserUrl = buttonProps.blockUserUrl;
+      deleteModal.deleteContributions = event.relatedTarget.hasAttribute('data-delete-contributions');
+      deleteModal.username = buttonProps.username;
+    }
+  });
+};

app/assets/javascripts/pages/ci/lints/ci_lint_editor.js

@@ -2,11 +2,18 @@ export default class CILintEditor {
   constructor() {
     this.editor = window.ace.edit('ci-editor');
     this.textarea = document.querySelector('#content');
+    this.clearYml = document.querySelector('.clear-yml');
     this.editor.getSession().setMode('ace/mode/yaml');
     this.editor.on('input', () => {
       const content = this.editor.getSession().getValue();
       this.textarea.value = content;
     });
+
+    this.clearYml.addEventListener('click', this.clear.bind(this));
+  }
+
+  clear() {
+    this.editor.setValue('');
   }
 }

app/assets/javascripts/pages/groups/edit/index.js

 import groupAvatar from '~/group_avatar';
-export default groupAvatar;
+import TransferDropdown from '~/groups/transfer_dropdown';
+export default () => {
+  groupAvatar();
+  new TransferDropdown(); // eslint-disable-line no-new
+};

app/assets/javascripts/pages/groups/issues/index.js

@@ -3,6 +3,8 @@ import initFilteredSearch from '~/pages/search/init_filtered_search';
 import { FILTERED_SEARCH } from '~/pages/constants';
 export default () => {
-  initFilteredSearch(FILTERED_SEARCH.ISSUES);
+  initFilteredSearch({
+    page: FILTERED_SEARCH.ISSUES,
+  });
   projectSelect();
 };

app/assets/javascripts/pages/groups/merge_requests/index.js

@@ -3,6 +3,8 @@ import initFilteredSearch from '~/pages/search/init_filtered_search';
 import { FILTERED_SEARCH } from '~/pages/constants';
 export default () => {
-  initFilteredSearch(FILTERED_SEARCH.MERGE_REQUESTS);
+  initFilteredSearch({
+    page: FILTERED_SEARCH.MERGE_REQUESTS,
+  });
   projectSelect();
 };

app/assets/javascripts/pages/groups/settings/ci_cd/show/index.js

-import SecretValues from '~/behaviors/secret_values';
+import AjaxVariableList from '~/ci_variable_list/ajax_variable_list';
 export default () => {
-  const secretVariableTable = document.querySelector('.js-secret-variable-table');
-  if (secretVariableTable) {
-    const secretVariableTableValues = new SecretValues({
-      container: secretVariableTable,
-    });
-    secretVariableTableValues.init();
-  }
+  const variableListEl = document.querySelector('.js-ci-variable-list-section');
+  // eslint-disable-next-line no-new
+  new AjaxVariableList({
+    container: variableListEl,
+    saveButton: variableListEl.querySelector('.js-secret-variables-save-button'),
+    errorBox: variableListEl.querySelector('.js-ci-variable-error-box'),
+    saveEndpoint: variableListEl.dataset.saveEndpoint,
+  });
 };

app/assets/javascripts/pages/projects/issues/index/index.js

@@ -8,7 +8,9 @@ import { FILTERED_SEARCH } from '~/pages/constants';
 import { ISSUABLE_INDEX } from '~/pages/projects/constants';
 document.addEventListener('DOMContentLoaded', () => {
-  initFilteredSearch(FILTERED_SEARCH.ISSUES);
+  initFilteredSearch({
+    page: FILTERED_SEARCH.ISSUES,
+  });
   new IssuableIndex(ISSUABLE_INDEX.ISSUE);
   new ShortcutsNavigation();

app/assets/javascripts/pages/projects/merge_requests/index/index.js

@@ -6,7 +6,9 @@ import { FILTERED_SEARCH } from '~/pages/constants';
 import { ISSUABLE_INDEX } from '~/pages/projects/constants';
 document.addEventListener('DOMContentLoaded', () => {
-  initFilteredSearch(FILTERED_SEARCH.MERGE_REQUESTS);
+  initFilteredSearch({
+    page: FILTERED_SEARCH.MERGE_REQUESTS,
+  });
   new IssuableIndex(ISSUABLE_INDEX.MERGE_REQUEST); // eslint-disable-line no-new
   new ShortcutsNavigation(); // eslint-disable-line no-new
   new UsersSelect(); // eslint-disable-line no-new

app/assets/javascripts/pages/projects/merge_requests/show/index.js

+import MergeRequest from '~/merge_request';
+import ZenMode from '~/zen_mode';
+import initNotes from '~/init_notes';
+import initIssuableSidebar from '~/init_issuable_sidebar';
+import ShortcutsIssuable from '~/shortcuts_issuable';
+import Diff from '~/diff';
+import { handleLocationHash } from '~/lib/utils/common_utils';
+
+export default () => {
+  new Diff(); // eslint-disable-line no-new
+  new ZenMode(); // eslint-disable-line no-new
+
+  initIssuableSidebar(); // eslint-disable-line no-new
+  initNotes(); // eslint-disable-line no-new
+
+  const mrShowNode = document.querySelector('.merge-request');
+
+  window.mergeRequest = new MergeRequest({
+    action: mrShowNode.dataset.mrAction,
+  });
+
+  new ShortcutsIssuable(true); // eslint-disable-line no-new
+  handleLocationHash();
+};