Add latest changes from gitlab-org/gitlab@master

2 files changed, 69 insertions, 26 deletions

diff --git a/app/assets/javascripts/boards/components/board_card_inner.vue b/app/assets/javascripts/boards/components/board_card_inner.vue
index fef6f8653ab..05b64ddc773 100644
--- a/app/assets/javascripts/boards/components/board_card_inner.vue
+++ b/app/assets/javascripts/boards/components/board_card_inner.vue
@@ -1,5 +1,12 @@
 <script>
-import { GlLabel, GlTooltip, GlTooltipDirective, GlIcon, GlLoadingIcon } from '@gitlab/ui';
+import {
+  GlLabel,
+  GlTooltip,
+  GlTooltipDirective,
+  GlIcon,
+  GlLoadingIcon,
+  GlSprintf,
+} from '@gitlab/ui';
 import { sortBy } from 'lodash';
 import { mapActions, mapGetters, mapState } from 'vuex';
 import boardCardInner from 'ee_else_ce/boards/mixins/board_card_inner';
@@ -26,6 +33,7 @@ export default {
     IssueTimeEstimate,
     IssueCardWeight: () => import('ee_component/boards/components/issue_card_weight.vue'),
     BoardBlockedIcon,
+    GlSprintf,
   },
   directives: {
     GlTooltip: GlTooltipDirective,
@@ -103,6 +111,9 @@ export default {
     shouldRenderEpicCountables() {
       return this.isEpicBoard && this.item.hasIssues;
     },
+    shouldRenderEpicProgress() {
+      return this.totalWeight > 0;
+    },
     showLabelFooter() {
       return this.isShowingLabels && this.item.labels.find(this.showLabel);
     },
@@ -130,6 +141,9 @@ export default {
         this.item.descendantWeightSum.openedIssues + this.item.descendantWeightSum.closedIssues
       );
     },
+    totalProgress() {
+      return Math.round((this.item.descendantWeightSum.closedIssues / this.totalWeight) * 100);
+    },
   },
   methods: {
     ...mapActions(['performSearch', 'setError']),
@@ -246,40 +260,51 @@ export default {
             <gl-tooltip :target="() => $refs.countBadge" data-testid="epic-countables-tooltip">
               <p v-if="allowSubEpics" class="gl-font-weight-bold gl-m-0">
                 {{ __('Epics') }} &#8226;
-                <span class="gl-font-weight-normal"
-                  >{{
-                    sprintf(__('%{openedEpics} open, %{closedEpics} closed'), {
-                      openedEpics: item.descendantCounts.openedEpics,
-                      closedEpics: item.descendantCounts.closedEpics,
-                    })
-                  }}
+                <span class="gl-font-weight-normal">
+                  <gl-sprintf :message="__('%{openedEpics} open, %{closedEpics} closed')">
+                    <template #openedEpics>{{ item.descendantCounts.openedEpics }}</template>
+                    <template #closedEpics>{{ item.descendantCounts.closedEpics }}</template>
+                  </gl-sprintf>
                 </span>
               </p>
               <p class="gl-font-weight-bold gl-m-0">
                 {{ __('Issues') }} &#8226;
-                <span class="gl-font-weight-normal"
-                  >{{
-                    sprintf(__('%{openedIssues} open, %{closedIssues} closed'), {
-                      openedIssues: item.descendantCounts.openedIssues,
-                      closedIssues: item.descendantCounts.closedIssues,
-                    })
-                  }}
+                <span class="gl-font-weight-normal">
+                  <gl-sprintf :message="__('%{openedIssues} open, %{closedIssues} closed')">
+                    <template #openedIssues>{{ item.descendantCounts.openedIssues }}</template>
+                    <template #closedIssues>{{ item.descendantCounts.closedIssues }}</template>
+                  </gl-sprintf>
+                </span>
+              </p>
+              <p class="gl-font-weight-bold gl-m-0">
+                {{ __('Total weight') }} &#8226;
+                <span class="gl-font-weight-normal" data-testid="epic-countables-total-weight">
+                  {{ totalWeight }}
                 </span>
               </p>
+            </gl-tooltip>
+
+            <gl-tooltip
+              v-if="shouldRenderEpicProgress"
+              :target="() => $refs.progressBadge"
+              data-testid="epic-progress-tooltip"
+            >
               <p class="gl-font-weight-bold gl-m-0">
-                {{ __('Weight') }} &#8226;
-                <span class="gl-font-weight-normal" data-testid="epic-countables-total-weight"
-                  >{{
-                    sprintf(__('%{closedWeight} complete, %{openWeight} incomplete'), {
-                      openWeight: item.descendantWeightSum.openedIssues,
-                      closedWeight: item.descendantWeightSum.closedIssues,
-                    })
-                  }}
+                {{ __('Progress') }} &#8226;
+                <span class="gl-font-weight-normal" data-testid="epic-progress-tooltip-content">
+                  <gl-sprintf
+                    :message="__('%{completedWeight} of %{totalWeight} weight completed')"
+                  >
+                    <template #completedWeight>{{
+                      item.descendantWeightSum.closedIssues
+                    }}</template>
+                    <template #totalWeight>{{ totalWeight }}</template>
+                  </gl-sprintf>
                 </span>
               </p>
             </gl-tooltip>
 
-            <span ref="countBadge" class="issue-count-badge board-card-info">
+            <span ref="countBadge" class="issue-count-badge board-card-info gl-mr-0 gl-pr-0">
               <span v-if="allowSubEpics" class="gl-mr-3">
                 <gl-icon name="epic" />
                 {{ totalEpicsCount }}
@@ -293,6 +318,17 @@ export default {
                 {{ totalWeight }}
               </span>
             </span>
+
+            <span
+              v-if="shouldRenderEpicProgress"
+              ref="progressBadge"
+              class="issue-count-badge board-card-info gl-pl-0"
+            >
+              <span class="gl-mr-3" data-testid="epic-progress">
+                <gl-icon name="progress" />
+                {{ totalProgress }}%
+              </span>
+            </span>
           </span>
           <span v-if="!isEpicBoard">
             <issue-due-date
diff --git a/app/assets/javascripts/boards/components/board_list_header.vue b/app/assets/javascripts/boards/components/board_list_header.vue
index 0c6de18529c..8d5f0f7eb89 100644
--- a/app/assets/javascripts/boards/components/board_list_header.vue
+++ b/app/assets/javascripts/boards/components/board_list_header.vue
@@ -73,7 +73,7 @@ export default {
   },
   computed: {
     ...mapState(['activeId']),
-    ...mapGetters(['isEpicBoard']),
+    ...mapGetters(['isEpicBoard', 'isSwimlanesOn']),
     isLoggedIn() {
       return Boolean(this.currentUserId);
     },
@@ -169,7 +169,14 @@ export default {
     },
 
     showNewIssueForm() {
-      eventHub.$emit(`${toggleFormEventPrefix.issue}${this.list.id}`);
+      if (this.isSwimlanesOn) {
+        eventHub.$emit('open-unassigned-lane');
+        this.$nextTick(() => {
+          eventHub.$emit(`${toggleFormEventPrefix.issue}${this.list.id}`);
+        });
+      } else {
+        eventHub.$emit(`${toggleFormEventPrefix.issue}${this.list.id}`);
+      }
     },
     showNewEpicForm() {
       eventHub.$emit(`${toggleFormEventPrefix.epic}${this.list.id}`);