Merge master to 11.8 stable for the feature freeze

.gitlab-ci.yml

@@ -388,11 +388,13 @@ flaky-examples-check:
 .assets-compile-cache: &assets-compile-cache
   cache:
-    key: "assets-compile:vendor_ruby:.yarn-cache:tmp_cache_assets_sprockets:v3"
+    key: "assets-compile:vendor_ruby:.yarn-cache:tmp_cache_assets_sprockets:v4"
     paths:
       - vendor/ruby/
       - .yarn-cache/
-      - tmp/cache/assets/sprockets
+      # We have disabled caching of sprockets for now, as it fails to pick up changes in SCSS:
+      # https://gitlab.com/gitlab-org/gitlab-ce/issues/57431
+      # - tmp/cache/assets/sprockets
 compile-assets:
   <<: *dedicated-runner
@@ -636,7 +638,6 @@ gitlab:assets:compile:
   image: dev.gitlab.org:5005/gitlab/gitlab-build-images:ruby-2.5.3-git-2.18-chrome-71.0-node-8.x-yarn-1.12-graphicsmagick-1.3.29-docker-18.06.1
   dependencies:
     - setup-test-env
-    - compile-assets
   services:
     - docker:stable-dind
   variables:

GITALY_SERVER_VERSION

-1.17.0
+1.19.0

Gemfile

@@ -422,7 +422,7 @@ group :ed25519 do
 end
 # Gitaly GRPC client
-gem 'gitaly-proto', '~> 1.5.0', require: 'gitaly'
+gem 'gitaly-proto', '~> 1.10.0', require: 'gitaly'
 gem 'grpc', '~> 1.15.0'
 gem 'google-protobuf', '~> 3.6'

Gemfile.lock

@@ -278,7 +278,7 @@ GEM
       gettext_i18n_rails (>= 0.7.1)
       po_to_json (>= 1.0.0)
       rails (>= 3.2.0)
-    gitaly-proto (1.5.0)
+    gitaly-proto (1.10.0)
       grpc (~> 1.0)
     github-markup (1.7.0)
     gitlab-default_value_for (3.1.1)
@@ -1020,7 +1020,7 @@ DEPENDENCIES
   gettext (~> 3.2.2)
   gettext_i18n_rails (~> 1.8.0)
   gettext_i18n_rails_js (~> 1.3)
-  gitaly-proto (~> 1.5.0)
+  gitaly-proto (~> 1.10.0)
   github-markup (~> 1.7.0)
   gitlab-default_value_for (~> 3.1.1)
   gitlab-markup (~> 1.6.5)

app/assets/javascripts/awards_handler.js

@@ -437,7 +437,7 @@ export class AwardsHandler {
   createAwardButtonForVotesBlock(votesBlock, emojiName) {
     const buttonHtml = `
-      <button class="btn award-control js-emoji-btn has-tooltip active" title="You" data-placement="bottom">
+      <button class="btn award-control js-emoji-btn has-tooltip active" title="You">
         ${this.emoji.glEmojiTag(emojiName)}
         <span class="award-control-text js-counter">1</span>
       </button>

app/assets/javascripts/clusters/clusters_bundle.js

@@ -6,7 +6,13 @@ import Flash from '../flash';
 import Poll from '../lib/utils/poll';
 import initSettingsPanels from '../settings_panels';
 import eventHub from './event_hub';
-import { APPLICATION_STATUS, REQUEST_SUBMITTED, REQUEST_FAILURE } from './constants';
+import {
+  APPLICATION_STATUS,
+  REQUEST_SUBMITTED,
+  REQUEST_FAILURE,
+  UPGRADE_REQUESTED,
+  UPGRADE_REQUEST_FAILURE,
+} from './constants';
 import ClustersService from './services/clusters_service';
 import ClustersStore from './stores/clusters_store';
 import Applications from './components/applications.vue';
@@ -120,11 +126,17 @@ export default class Clusters {
   addListeners() {
     if (this.showTokenButton) this.showTokenButton.addEventListener('click', this.showToken);
     eventHub.$on('installApplication', this.installApplication);
+    eventHub.$on('upgradeApplication', data => this.upgradeApplication(data));
+    eventHub.$on('upgradeFailed', appId => this.upgradeFailed(appId));
+    eventHub.$on('dismissUpgradeSuccess', appId => this.dismissUpgradeSuccess(appId));
   }
   removeListeners() {
     if (this.showTokenButton) this.showTokenButton.removeEventListener('click', this.showToken);
     eventHub.$off('installApplication', this.installApplication);
+    eventHub.$off('upgradeApplication', this.upgradeApplication);
+    eventHub.$off('upgradeFailed', this.upgradeFailed);
+    eventHub.$off('dismissUpgradeSuccess', this.dismissUpgradeSuccess);
   }
   initPolling() {
@@ -245,6 +257,21 @@ export default class Clusters {
     });
   }
+  upgradeApplication(data) {
+    const appId = data.id;
+    this.store.updateAppProperty(appId, 'requestStatus', UPGRADE_REQUESTED);
+    this.store.updateAppProperty(appId, 'status', APPLICATION_STATUS.UPDATING);
+    this.service.installApplication(appId, data.params).catch(() => this.upgradeFailed(appId));
+  }
+
+  upgradeFailed(appId) {
+    this.store.updateAppProperty(appId, 'requestStatus', UPGRADE_REQUEST_FAILURE);
+  }
+
+  dismissUpgradeSuccess(appId) {
+    this.store.updateAppProperty(appId, 'requestStatus', null);
+  }
+
   destroy() {
     this.destroyed = true;

app/assets/javascripts/clusters/components/application_row.vue

 <script>
 /* eslint-disable vue/require-default-prop */
+import { GlLink } from '@gitlab/ui';
+import TimeagoTooltip from '../../vue_shared/components/time_ago_tooltip.vue';
 import { s__, sprintf } from '../../locale';
 import eventHub from '../event_hub';
 import identicon from '../../vue_shared/components/identicon.vue';
 import loadingButton from '../../vue_shared/components/loading_button.vue';
-import { APPLICATION_STATUS, REQUEST_SUBMITTED, REQUEST_FAILURE } from '../constants';
+import {
+  APPLICATION_STATUS,
+  REQUEST_SUBMITTED,
+  REQUEST_FAILURE,
+  UPGRADE_REQUESTED,
+} from '../constants';
 export default {
   components: {
     loadingButton,
     identicon,
+    TimeagoTooltip,
+    GlLink,
   },
   props: {
     id: {
@@ -54,6 +63,18 @@ export default {
       type: String,
       required: false,
     },
+    version: {
+      type: String,
+      required: false,
+    },
+    chartRepo: {
+      type: String,
+      required: false,
+    },
+    upgradeAvailable: {
+      type: Boolean,
+      required: false,
+    },
     installApplicationRequestParams: {
       type: Object,
       required: false,
@@ -78,7 +99,8 @@ export default {
       return (
         this.status === APPLICATION_STATUS.INSTALLED ||
         this.status === APPLICATION_STATUS.UPDATED ||
-        this.status === APPLICATION_STATUS.UPDATING
+        this.status === APPLICATION_STATUS.UPDATING ||
+        this.status === APPLICATION_STATUS.UPDATE_ERRORED
       );
     },
     canInstall() {
@@ -146,6 +168,69 @@ export default {
         title: this.title,
       });
     },
+    versionLabel() {
+      if (this.upgradeFailed) {
+        return s__('ClusterIntegration|Upgrade failed');
+      } else if (this.isUpgrading) {
+        return s__('ClusterIntegration|Upgrading');
+      }
+
+      return s__('ClusterIntegration|Upgraded');
+    },
+    upgradeRequested() {
+      return this.requestStatus === UPGRADE_REQUESTED;
+    },
+    upgradeSuccessful() {
+      return this.status === APPLICATION_STATUS.UPDATED;
+    },
+    upgradeFailed() {
+      if (this.isUpgrading) {
+        return false;
+      }
+
+      return this.status === APPLICATION_STATUS.UPDATE_ERRORED;
+    },
+    upgradeFailureDescription() {
+      return sprintf(
+        s__(
+          'ClusterIntegration|Something went wrong when upgrading %{title}. Please check the logs and try again.',
+        ),
+        {
+          title: this.title,
+        },
+      );
+    },
+    upgradeSuccessDescription() {
+      return sprintf(s__('ClusterIntegration|%{title} upgraded successfully.'), {
+        title: this.title,
+      });
+    },
+    upgradeButtonLabel() {
+      let label;
+      if (this.upgradeAvailable && !this.upgradeFailed && !this.isUpgrading) {
+        label = s__('ClusterIntegration|Upgrade');
+      } else if (this.isUpgrading) {
+        label = s__('ClusterIntegration|Upgrading');
+      } else if (this.upgradeFailed) {
+        label = s__('ClusterIntegration|Retry upgrade');
+      }
+
+      return label;
+    },
+    isUpgrading() {
+      // Since upgrading is handled asynchronously on the backend we need this check to prevent any delay on the frontend
+      return (
+        this.status === APPLICATION_STATUS.UPDATING ||
+        (this.upgradeRequested && !this.upgradeSuccessful)
+      );
+    },
+  },
+  watch: {
+    status() {
+      if (this.status === APPLICATION_STATUS.UPDATE_ERRORED) {
+        eventHub.$emit('upgradeFailed', this.id);
+      }
+    },
   },
   methods: {
     installClicked() {
@@ -154,6 +239,15 @@ export default {
         params: this.installApplicationRequestParams,
       });
     },
+    upgradeClicked() {
+      eventHub.$emit('upgradeApplication', {
+        id: this.id,
+        params: this.installApplicationRequestParams,
+      });
+    },
+    dismissUpgradeSuccess() {
+      eventHub.$emit('dismissUpgradeSuccess', this.id);
+    },
   },
 };
 </script>
@@ -207,6 +301,51 @@ export default {
             </li>
           </ul>
         </div>
+
+        <div
+          v-if="(upgradeSuccessful || upgradeFailed) && !upgradeAvailable"
+          class="form-text text-muted label p-0 js-cluster-application-upgrade-details"
+        >
+          {{ versionLabel }}
+
+          <span v-if="upgradeSuccessful"> to</span>
+
+          <gl-link
+            v-if="upgradeSuccessful"
+            :href="chartRepo"
+            target="_blank"
+            class="js-cluster-application-upgrade-version"
+          >
+            chart v{{ version }}
+          </gl-link>
+        </div>
+
+        <div
+          v-if="upgradeFailed && !isUpgrading"
+          class="bs-callout bs-callout-danger cluster-application-banner mt-2 mb-0 js-cluster-application-upgrade-failure-message"
+        >
+          {{ upgradeFailureDescription }}
+        </div>
+
+        <div
+          v-if="upgradeRequested && upgradeSuccessful"
+          class="bs-callout bs-callout-success cluster-application-banner mt-2 mb-0 p-0 pl-3"
+        >
+          {{ upgradeSuccessDescription }}
+
+          <button class="close cluster-application-banner-close" @click="dismissUpgradeSuccess">
+            &times;
+          </button>
+        </div>
+
+        <loading-button
+          v-if="upgradeAvailable || upgradeFailed || isUpgrading"
+          class="btn btn-primary js-cluster-application-upgrade-button mt-2"
+          :loading="isUpgrading"
+          :disabled="isUpgrading"
+          :label="upgradeButtonLabel"
+          @click="upgradeClicked"
+        />
       </div>
       <div
         :class="{ 'section-25': showManageButton, 'section-15': !showManageButton }"

app/assets/javascripts/clusters/components/applications.vue

@@ -362,6 +362,9 @@ export default {
         :status-reason="applications.runner.statusReason"
         :request-status="applications.runner.requestStatus"
         :request-reason="applications.runner.requestReason"
+        :version="applications.runner.version"
+        :chart-repo="applications.runner.chartRepo"
+        :upgrade-available="applications.runner.upgradeAvailable"
         :disabled="!helmInstalled"
         title-link="https://docs.gitlab.com/runner/"
       >

app/assets/javascripts/clusters/constants.js

@@ -12,15 +12,19 @@ export const APPLICATION_STATUS = {
   SCHEDULED: 'scheduled',
   INSTALLING: 'installing',
   INSTALLED: 'installed',
-  UPDATED: 'updated',
   UPDATING: 'updating',
+  UPDATED: 'updated',
+  UPDATE_ERRORED: 'update_errored',
   ERROR: 'errored',
 };
 // These are only used client-side
 export const REQUEST_SUBMITTED = 'request-submitted';
 export const REQUEST_FAILURE = 'request-failure';
+export const UPGRADE_REQUESTED = 'upgrade-requested';
+export const UPGRADE_REQUEST_FAILURE = 'upgrade-request-failure';
 export const INGRESS = 'ingress';
 export const JUPYTER = 'jupyter';
 export const KNATIVE = 'knative';
+export const RUNNER = 'runner';
 export const CERT_MANAGER = 'cert_manager';

app/assets/javascripts/clusters/stores/clusters_store.js

 import { s__ } from '../../locale';
 import { parseBoolean } from '../../lib/utils/common_utils';
-import { INGRESS, JUPYTER, KNATIVE, CERT_MANAGER } from '../constants';
+import { INGRESS, JUPYTER, KNATIVE, CERT_MANAGER, RUNNER } from '../constants';
 export default class ClusterStore {
   constructor() {
@@ -40,6 +40,9 @@ export default class ClusterStore {
           statusReason: null,
           requestStatus: null,
           requestReason: null,
+          version: null,
+          chartRepo: 'https://gitlab.com/charts/gitlab-runner',
+          upgradeAvailable: null,
         },
         prometheus: {
           title: s__('ClusterIntegration|Prometheus'),
@@ -100,7 +103,13 @@ export default class ClusterStore {
     this.state.statusReason = serverState.status_reason;
     serverState.applications.forEach(serverAppEntry => {
-      const { name: appId, status, status_reason: statusReason } = serverAppEntry;
+      const {
+        name: appId,
+        status,
+        status_reason: statusReason,
+        version,
+        update_available: upgradeAvailable,
+      } = serverAppEntry;
       this.state.applications[appId] = {
         ...(this.state.applications[appId] || {}),
@@ -124,6 +133,9 @@ export default class ClusterStore {
           serverAppEntry.hostname || this.state.applications.knative.hostname;
         this.state.applications.knative.externalIp =
           serverAppEntry.external_ip || this.state.applications.knative.externalIp;
+      } else if (appId === RUNNER) {
+        this.state.applications.runner.version = version;
+        this.state.applications.runner.upgradeAvailable = upgradeAvailable;
       }
     });
   }

app/assets/javascripts/diffs/components/compare_versions.vue

@@ -6,6 +6,7 @@ import { polyfillSticky } from '~/lib/utils/sticky';
 import Icon from '~/vue_shared/components/icon.vue';
 import CompareVersionsDropdown from './compare_versions_dropdown.vue';
 import SettingsDropdown from './settings_dropdown.vue';
+import DiffStats from './diff_stats.vue';
 export default {
   components: {
@@ -14,6 +15,7 @@ export default {
     GlLink,
     GlButton,
     SettingsDropdown,
+    DiffStats,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
@@ -35,8 +37,15 @@ export default {
     },
   },
   computed: {
-    ...mapState('diffs', ['commit', 'showTreeList', 'startVersion', 'latestVersionPath']),
-    ...mapGetters('diffs', ['hasCollapsedFile']),
+    ...mapGetters('diffs', ['hasCollapsedFile', 'diffFilesLength']),
+    ...mapState('diffs', [
+      'commit',
+      'showTreeList',
+      'startVersion',
+      'latestVersionPath',
+      'addedLines',
+      'removedLines',
+    ]),
     comparableDiffs() {
       return this.mergeRequestDiffs.slice(1);
     },
@@ -104,6 +113,11 @@ export default {
         <gl-link :href="commit.commit_url" class="monospace">{{ commit.short_id }}</gl-link>
       </div>
       <div class="inline-parallel-buttons d-none d-md-flex ml-auto">
+        <diff-stats
+          :diff-files-length="diffFilesLength"
+          :added-lines="addedLines"
+          :removed-lines="removedLines"
+        />
         <gl-button
           v-if="commit || startVersion"
           :href="latestVersionPath"

app/assets/javascripts/diffs/components/diff_file_header.vue

@@ -9,6 +9,7 @@ import { GlTooltipDirective } from '@gitlab/ui';
 import { truncateSha } from '~/lib/utils/text_utility';
 import { __, s__, sprintf } from '~/locale';
 import EditButton from './edit_button.vue';
+import DiffStats from './diff_stats.vue';
 export default {
   components: {
@@ -16,6 +17,7 @@ export default {
     EditButton,
     Icon,
     FileIcon,
+    DiffStats,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
@@ -202,6 +204,7 @@ export default {
       v-if="!diffFile.submodule && addMergeRequestButtons"
       class="file-actions d-none d-sm-block"
     >
+      <diff-stats :added-lines="diffFile.added_lines" :removed-lines="diffFile.removed_lines" />
       <template v-if="diffFile.blob && diffFile.blob.readable_text">
         <button
           :disabled="!diffHasDiscussions(diffFile)"

app/assets/javascripts/diffs/components/diff_stats.vue

+<script>
+import Icon from '~/vue_shared/components/icon.vue';
+import { n__ } from '~/locale';
+
+export default {
+  components: { Icon },
+  props: {
+    addedLines: {
+      type: Number,
+      required: true,
+    },
+    removedLines: {
+      type: Number,
+      required: true,
+    },
+    diffFilesLength: {
+      type: Number,
+      required: false,
+      default: null,
+    },
+  },
+  computed: {
+    filesText() {
+      return n__('File', 'Files', this.diffFilesLength);
+    },
+    isCompareVersionsHeader() {
+      return Boolean(this.diffFilesLength);
+    },
+  },
+};
+</script>
+
+<template>
+  <div
+    class="diff-stats"
+    :class="{
+      'is-compare-versions-header d-none d-lg-inline-flex': isCompareVersionsHeader,
+      'd-inline-flex': !isCompareVersionsHeader,
+    }"
+  >
+    <div v-if="diffFilesLength !== null" class="diff-stats-group">
+      <icon name="doc-code" class="diff-stats-icon text-secondary" />
+      <strong>{{ diffFilesLength }} {{ filesText }}</strong>
+    </div>
+    <div class="diff-stats-group cgreen">
+      <icon name="file-addition" class="diff-stats-icon" /> <strong>{{ addedLines }}</strong>
+    </div>
+    <div class="diff-stats-group cred">
+      <icon name="file-deletion" class="diff-stats-icon" /> <strong>{{ removedLines }}</strong>
+    </div>
+  </div>
+</template>

app/assets/javascripts/diffs/components/tree_list.vue

@@ -14,8 +14,8 @@ export default {
     FileRow,
   },
   computed: {
-    ...mapState('diffs', ['tree', 'addedLines', 'removedLines', 'renderTreeList']),
-    ...mapGetters('diffs', ['allBlobs', 'diffFilesLength']),
+    ...mapState('diffs', ['tree', 'renderTreeList']),
+    ...mapGetters('diffs', ['allBlobs']),
     filteredTreeList() {
       return this.renderTreeList ? this.tree : this.allBlobs;
     },
@@ -64,13 +64,6 @@ export default {
         {{ s__('MergeRequest|No files found') }}
       </p>
     </div>
-    <div v-once class="pt-3 pb-3 text-center">
-      {{ n__('%d changed file', '%d changed files', diffFilesLength) }}
-      <div>
-        <span class="cgreen"> {{ n__('%d addition', '%d additions', addedLines) }} </span>
-        <span class="cred"> {{ n__('%d deleted', '%d deletions', removedLines) }} </span>
-      </div>
-    </div>
   </div>
 </template>

app/assets/javascripts/diffs/store/modules/diff_state.js

@@ -11,6 +11,8 @@ const storedTreeShow = localStorage.getItem(MR_TREE_SHOW_KEY);
 export default () => ({
   isLoading: true,
+  addedLines: null,
+  removedLines: null,
   endpoint: '',
   basePath: '',
   commit: null,

app/assets/javascripts/due_date_select.js

@@ -64,6 +64,7 @@ class DueDateSelect {
           this.saveDueDate(true);
         }
       },
+      firstDay: gon.first_day_of_week,
     });
     calendar.setDate(parsePikadayDate($dueDateInput.val()));
@@ -183,6 +184,7 @@ export default class DueDateSelectors {
         onSelect(dateText) {
           $datePicker.val(calendar.toString(dateText));
         },
+        firstDay: gon.first_day_of_week,
       });
       calendar.setDate(parsePikadayDate(datePickerVal));

app/assets/javascripts/environments/components/container.vue

@@ -22,10 +22,6 @@ export default {
       type: Object,
       required: true,
     },
-    canCreateDeployment: {
-      type: Boolean,
-      required: true,
-    },
     canReadEnvironment: {
       type: Boolean,
       required: true,
@@ -51,11 +47,7 @@ export default {
     <slot name="emptyState"></slot>
     <div v-if="!isLoading && environments.length > 0" class="table-holder">
-      <environment-table
-        :environments="environments"
-        :can-create-deployment="canCreateDeployment"
-        :can-read-environment="canReadEnvironment"
-      />
+      <environment-table :environments="environments" :can-read-environment="canReadEnvironment" />
       <table-pagination
         v-if="pagination && pagination.totalPages > 1"

app/assets/javascripts/environments/components/environment_item.vue

@@ -47,12 +47,6 @@ export default {
       default: () => ({}),
     },
-    canCreateDeployment: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
-
     canReadEnvironment: {
       type: Boolean,
       required: false,
@@ -151,7 +145,7 @@ export default {
     },
     actions() {
-      if (!this.model || !this.model.last_deployment || !this.canCreateDeployment) {
+      if (!this.model || !this.model.last_deployment) {
         return [];
       }
@@ -561,7 +555,7 @@ export default {
         />
         <rollback-component
-          v-if="canRetry && canCreateDeployment"
+          v-if="canRetry"
           :is-last-deployment="isLastDeployment"
           :retry-url="retryUrl"
         />

app/assets/javascripts/environments/components/environments_app.vue

@@ -24,10 +24,6 @@ export default {
       type: Boolean,
       required: true,
     },
-    canCreateDeployment: {
-      type: Boolean,
-      required: true,
-    },
     canReadEnvironment: {
       type: Boolean,
       required: true,
@@ -106,7 +102,6 @@ export default {
       :is-loading="isLoading"
       :environments="state.environments"
       :pagination="state.paginationInformation"
-      :can-create-deployment="canCreateDeployment"
       :can-read-environment="canReadEnvironment"
       @onChangePage="onChangePage"
     >

app/assets/javascripts/environments/components/environments_table.vue

@@ -23,12 +23,6 @@ export default {
       required: false,
       default: false,
     },
-
-    canCreateDeployment: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
   },
   methods: {
     folderUrl(model) {
@@ -64,7 +58,6 @@ export default {
         is="environment-item"
         :key="`environment-item-${i}`"
         :model="model"
-        :can-create-deployment="canCreateDeployment"
         :can-read-environment="canReadEnvironment"
       />
@@ -79,7 +72,6 @@ export default {
             v-for="(children, index) in model.children"
             :key="`env-item-${i}-${index}`"
             :model="children"
-            :can-create-deployment="canCreateDeployment"
             :can-read-environment="canReadEnvironment"
           />