Add latest changes from gitlab-org/gitlab@master

iweb3dev · Aug 13, 2020 · c787c15 · c787c15
1 parent 6df7943
commit c787c15
Show file tree

Hide file tree

Showing 163 changed files with 1,685 additions and 560 deletions.
diff --git a/.rubocop_todo.yml b/.rubocop_todo.yml
@@ -862,7 +862,6 @@ Rails/SaveBang:
     - 'ee/spec/services/todo_service_spec.rb'
     - 'ee/spec/services/update_build_minutes_service_spec.rb'
     - 'ee/spec/services/vulnerability_feedback/create_service_spec.rb'
-    - 'ee/spec/support/helpers/ee/geo_helpers.rb'
     - 'ee/spec/support/protected_tags/access_control_shared_examples.rb'
     - 'ee/spec/support/shared_examples/features/protected_branches_access_control_shared_examples.rb'
     - 'ee/spec/support/shared_examples/finders/geo/framework_registry_finder_shared_examples.rb'
@@ -1306,12 +1305,6 @@ Rails/SaveBang:
     - 'spec/services/users/repair_ldap_blocked_service_spec.rb'
     - 'spec/services/verify_pages_domain_service_spec.rb'
     - 'spec/sidekiq/cron/job_gem_dependency_spec.rb'
-    - 'spec/support/helpers/cycle_analytics_helpers.rb'
-    - 'spec/support/helpers/design_management_test_helpers.rb'
-    - 'spec/support/helpers/jira_service_helper.rb'
-    - 'spec/support/helpers/login_helpers.rb'
-    - 'spec/support/helpers/notification_helpers.rb'
-    - 'spec/support/helpers/stub_object_storage.rb'
     - 'spec/support/migrations_helpers/cluster_helpers.rb'
     - 'spec/support/migrations_helpers/namespaces_helper.rb'
     - 'spec/support/shared_contexts/email_shared_context.rb'

diff --git a/app/assets/javascripts/ci_variable_list/components/ci_variable_modal.vue b/app/assets/javascripts/ci_variable_list/components/ci_variable_modal.vue
@@ -3,7 +3,6 @@ import {
   GlAlert,
   GlButton,
   GlCollapse,
-  GlDeprecatedButton,
   GlFormCheckbox,
   GlFormCombobox,
   GlFormGroup,
@@ -39,7 +38,6 @@ export default {
     GlAlert,
     GlButton,
     GlCollapse,
-    GlDeprecatedButton,
     GlFormCheckbox,
     GlFormCombobox,
     GlFormGroup,
@@ -340,24 +338,25 @@ export default {
       </gl-alert>
     </gl-collapse>
     <template #modal-footer>
-      <gl-deprecated-button @click="hideModal">{{ __('Cancel') }}</gl-deprecated-button>
-      <gl-deprecated-button
+      <gl-button @click="hideModal">{{ __('Cancel') }}</gl-button>
+      <gl-button
         v-if="variableBeingEdited"
         ref="deleteCiVariable"
-        category="secondary"
         variant="danger"
+        category="secondary"
         data-qa-selector="ci_variable_delete_button"
         @click="deleteVarAndClose"
-        >{{ __('Delete variable') }}</gl-deprecated-button
+        >{{ __('Delete variable') }}</gl-button
       >
-      <gl-deprecated-button
+      <gl-button
         ref="updateOrAddVariable"
         :disabled="!canSubmit"
         variant="success"
+        category="primary"
         data-qa-selector="ci_variable_save_button"
         @click="updateOrAddVariable"
         >{{ modalActionText }}
-      </gl-deprecated-button>
+      </gl-button>
     </template>
   </gl-modal>
 </template>
diff --git a/app/assets/javascripts/frequent_items/utils.js b/app/assets/javascripts/frequent_items/utils.js
@@ -1,6 +1,6 @@
 import { take } from 'lodash';
 import { GlBreakpointInstance as bp } from '@gitlab/ui/dist/utils';
-import sanitize from 'sanitize-html';
+import { sanitize } from 'dompurify';
 import { FREQUENT_ITEMS, HOUR_IN_MS } from './constants';
 
 export const isMobile = () => ['md', 'sm', 'xs'].includes(bp.getBreakpointSize());
@@ -52,7 +52,7 @@ export const sanitizeItem = item => {
       return {};
     }
 
-    return { [key]: sanitize(item[key].toString(), { allowedTags: [] }) };
+    return { [key]: sanitize(item[key].toString(), { ALLOWED_TAGS: [] }) };
   };
 
   return {

diff --git a/app/assets/javascripts/incidents/components/incidents_list.vue b/app/assets/javascripts/incidents/components/incidents_list.vue
@@ -13,14 +13,16 @@ import {
   GlPagination,
   GlTabs,
   GlTab,
+  GlBadge,
 } from '@gitlab/ui';
 import { debounce } from 'lodash';
 import TimeAgoTooltip from '~/vue_shared/components/time_ago_tooltip.vue';
 import { convertToSnakeCase } from '~/lib/utils/text_utility';
 import { s__ } from '~/locale';
 import { mergeUrlParams, joinPaths, visitUrl } from '~/lib/utils/url_utility';
 import getIncidents from '../graphql/queries/get_incidents.query.graphql';
-import { I18N, DEFAULT_PAGE_SIZE, INCIDENT_SEARCH_DELAY, INCIDENT_STATE_TABS } from '../constants';
+import getIncidentsCountByStatus from '../graphql/queries/get_count_by_status.query.graphql';
+import { I18N, DEFAULT_PAGE_SIZE, INCIDENT_SEARCH_DELAY, INCIDENT_STATUS_TABS } from '../constants';
 
 const TH_TEST_ID = { 'data-testid': 'incident-management-created-at-sort' };
 const tdClass =
@@ -39,7 +41,7 @@ const initialPaginationState = {
 
 export default {
   i18n: I18N,
-  stateTabs: INCIDENT_STATE_TABS,
+  statusTabs: INCIDENT_STATUS_TABS,
   fields: [
     {
       key: 'title',
@@ -77,6 +79,7 @@ export default {
     GlTabs,
     GlTab,
     PublishedCell: () => import('ee_component/incidents/components/published_cell.vue'),
+    GlBadge,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
@@ -94,7 +97,7 @@ export default {
       variables() {
         return {
           searchTerm: this.searchTerm,
-          state: this.stateFilter,
+          status: this.statusFilter,
           projectPath: this.projectPath,
           issueTypes: ['INCIDENT'],
           sort: this.sort,
@@ -114,6 +117,19 @@ export default {
         this.errored = true;
       },
     },
+    incidentsCount: {
+      query: getIncidentsCountByStatus,
+      variables() {
+        return {
+          searchTerm: this.searchTerm,
+          projectPath: this.projectPath,
+          issueTypes: ['INCIDENT'],
+        };
+      },
+      update(data) {
+        return data.project?.issueStatusCounts;
+      },
+    },
   },
   data() {
     return {
@@ -123,22 +139,26 @@ export default {
       searchTerm: '',
       pagination: initialPaginationState,
       incidents: {},
-      stateFilter: '',
       sort: 'created_desc',
       sortBy: 'createdAt',
       sortDesc: true,
+      statusFilter: '',
+      filteredByStatus: '',
     };
   },
   computed: {
     showErrorMsg() {
-      return this.errored && !this.isErrorAlertDismissed && !this.searchTerm;
+      return this.errored && !this.isErrorAlertDismissed && this.incidentsCount?.all === 0;
     },
     loading() {
       return this.$apollo.queries.incidents.loading;
     },
     hasIncidents() {
       return this.incidents?.list?.length;
     },
+    incidentsForCurrentTab() {
+      return this.incidentsCount?.[this.filteredByStatus.toLowerCase()] ?? 0;
+    },
     showPaginationControls() {
       return Boolean(
         this.incidents?.pageInfo?.hasNextPage || this.incidents?.pageInfo?.hasPreviousPage,
@@ -149,7 +169,9 @@ export default {
     },
     nextPage() {
       const nextPage = this.pagination.currentPage + 1;
-      return this.incidents?.list?.length < DEFAULT_PAGE_SIZE ? null : nextPage;
+      return nextPage > Math.ceil(this.incidentsForCurrentTab / DEFAULT_PAGE_SIZE)
+        ? null
+        : nextPage;
     },
     tbodyTrClass() {
       return {
@@ -181,9 +203,10 @@ export default {
         this.searchTerm = trimmedInput;
       }
     }, INCIDENT_SEARCH_DELAY),
-    filterIncidentsByState(tabIndex) {
-      const { filters } = this.$options.stateTabs[tabIndex];
-      this.stateFilter = filters;
+    filterIncidentsByStatus(tabIndex) {
+      const { filters, status } = this.$options.statusTabs[tabIndex];
+      this.statusFilter = filters;
+      this.filteredByStatus = status;
     },
     hasAssignees(assignees) {
       return Boolean(assignees.nodes?.length);
@@ -231,10 +254,13 @@ export default {
     <div
       class="incident-management-list-header gl-display-flex gl-justify-content-space-between gl-border-b-solid gl-border-b-1 gl-border-gray-100"
     >
-      <gl-tabs content-class="gl-p-0" @input="filterIncidentsByState">
-        <gl-tab v-for="tab in $options.stateTabs" :key="tab.state" :data-testid="tab.state">
+      <gl-tabs content-class="gl-p-0" @input="filterIncidentsByStatus">
+        <gl-tab v-for="tab in $options.statusTabs" :key="tab.status" :data-testid="tab.status">
           <template #title>
             <span>{{ tab.title }}</span>
+            <gl-badge v-if="incidentsCount" pill size="sm" class="gl-tab-counter-badge">
+              {{ incidentsCount[tab.status.toLowerCase()] }}
+            </gl-badge>
           </template>
         </gl-tab>
       </gl-tabs>

diff --git a/app/assets/javascripts/incidents/constants.js b/app/assets/javascripts/incidents/constants.js
@@ -9,20 +9,20 @@ export const I18N = {
   searchPlaceholder: __('Search results…'),
 };
 
-export const INCIDENT_STATE_TABS = [
+export const INCIDENT_STATUS_TABS = [
   {
     title: s__('IncidentManagement|Open'),
-    state: 'OPENED',
+    status: 'OPENED',
     filters: 'opened',
   },
   {
     title: s__('IncidentManagement|Closed'),
-    state: 'CLOSED',
+    status: 'CLOSED',
     filters: 'closed',
   },
   {
     title: s__('IncidentManagement|All'),
-    state: 'ALL',
+    status: 'ALL',
     filters: 'all',
   },
 ];

diff --git a/app/assets/javascripts/incidents/graphql/queries/get_count_by_status.query.graphql b/app/assets/javascripts/incidents/graphql/queries/get_count_by_status.query.graphql
@@ -0,0 +1,9 @@
+query getIncidentsCountByStatus($searchTerm: String, $projectPath: ID!, $issueTypes: [IssueType!]) {
+  project(fullPath: $projectPath) {
+    issueStatusCounts(search: $searchTerm, types: $issueTypes) {
+      all
+      opened
+      closed
+    }
+  }
+}
diff --git a/app/assets/javascripts/incidents/graphql/queries/get_incidents.query.graphql b/app/assets/javascripts/incidents/graphql/queries/get_incidents.query.graphql
@@ -2,7 +2,7 @@ query getIncidents(
   $projectPath: ID!
   $issueTypes: [IssueType!]
   $sort: IssueSort
-  $state: IssuableState
+  $status: IssuableState
   $firstPageSize: Int
   $lastPageSize: Int
   $prevPageCursor: String = ""
@@ -12,9 +12,9 @@ query getIncidents(
   project(fullPath: $projectPath) {
     issues(
       search: $searchTerm
-      state: $state
       types: $issueTypes
       sort: $sort
+      state: $status
       first: $firstPageSize
       last: $lastPageSize
       after: $nextPageCursor

diff --git a/app/assets/javascripts/issue_show/utils/parse_data.js b/app/assets/javascripts/issue_show/utils/parse_data.js
@@ -1,4 +1,4 @@
-import sanitize from 'sanitize-html';
+import { sanitize } from 'dompurify';
 
 export const parseIssuableData = () => {
   try {

diff --git a/app/assets/javascripts/lib/utils/datetime_utility.js b/app/assets/javascripts/lib/utils/datetime_utility.js
@@ -710,3 +710,16 @@ export const dateFromParams = (year, month, day) => {
 
   return date;
 };
+
+/**
+ * A utility function which computes the difference in seconds
+ * between 2 dates.
+ *
+ * @param {Date} startDate the start sate
+ * @param {Date} endDate the end date
+ *
+ * @return {Int} the difference in seconds
+ */
+export const differenceInSeconds = (startDate, endDate) => {
+  return (endDate.getTime() - startDate.getTime()) / 1000;
+};
diff --git a/app/assets/javascripts/lib/utils/highlight.js b/app/assets/javascripts/lib/utils/highlight.js
@@ -1,5 +1,5 @@
 import fuzzaldrinPlus from 'fuzzaldrin-plus';
-import sanitize from 'sanitize-html';
+import { sanitize } from 'dompurify';
 
 /**
  * Wraps substring matches with HTML `<span>` elements.
@@ -24,7 +24,7 @@ export default function highlight(string, match = '', matchPrefix = '<b>', match
     return string;
   }
 
-  const sanitizedValue = sanitize(string.toString(), { allowedTags: [] });
+  const sanitizedValue = sanitize(string.toString(), { ALLOWED_TAGS: [] });
 
   // occurrences is an array of character indices that should be
   // highlighted in the original string, i.e. [3, 4, 5, 7]