Automatic merge of gitlab-org/gitlab-ce master

app/assets/javascripts/issue_show/components/app.vue

@@ -11,6 +11,7 @@ import titleComponent from './title.vue';
 import descriptionComponent from './description.vue';
 import editedComponent from './edited.vue';
 import formComponent from './form.vue';
+import PinnedLinks from './pinned_links.vue';
 import recaptchaModalImplementor from '../../vue_shared/mixins/recaptcha_modal_implementor';
 
 export default {
@@ -19,6 +20,7 @@ export default {
     titleComponent,
     editedComponent,
     formComponent,
+    PinnedLinks,
   },
   mixins: [recaptchaModalImplementor],
   props: {
@@ -340,6 +342,7 @@ export default {
         :title-text="state.titleText"
         :show-inline-edit-button="showInlineEditButton"
       />
+      <pinned-links :description-html="state.descriptionHtml" />
       <description-component
         v-if="state.descriptionHtml"
         :can-update="canUpdate"

app/assets/javascripts/issue_show/components/pinned_links.vue

+<script>
+import { GlLink } from '@gitlab/ui';
+import Icon from '~/vue_shared/components/icon.vue';
+
+export default {
+  components: {
+    Icon,
+    GlLink,
+  },
+  props: {
+    descriptionHtml: {
+      type: String,
+      required: true,
+    },
+  },
+  computed: {
+    linksInDescription() {
+      const el = document.createElement('div');
+      el.innerHTML = this.descriptionHtml;
+      return [...el.querySelectorAll('a')].map(a => a.href);
+    },
+    // Detect links matching the following formats:
+    // Zoom Start links: https://zoom.us/s/<meeting-id>
+    // Zoom Join links: https://zoom.us/j/<meeting-id>
+    // Personal Zoom links: https://zoom.us/my/<meeting-id>
+    // Vanity Zoom links: https://gitlab.zoom.us/j/<meeting-id> (also /s and /my)
+    zoomHref() {
+      const zoomRegex = /^https:\/\/([\w\d-]+\.)?zoom\.us\/(s|j|my)\/.+/;
+      return this.linksInDescription.reduce((acc, currentLink) => {
+        let lastLink = acc;
+        if (zoomRegex.test(currentLink)) {
+          lastLink = currentLink;
+        }
+        return lastLink;
+      }, '');
+    },
+  },
+};
+</script>
+
+<template>
+  <div v-if="zoomHref" class="border-bottom mb-3 mt-n2">
+    <gl-link
+      :href="zoomHref"
+      target="_blank"
+      class="btn btn-inverted btn-secondary btn-sm text-dark mb-3"
+    >
+      <icon name="brand-zoom" :size="14" />
+      <strong class="vertical-align-top">{{ __('Join Zoom meeting') }}</strong>
+    </gl-link>
+  </div>
+</template>

app/assets/stylesheets/framework/common.scss

@@ -416,6 +416,7 @@ img.emoji {
 .center { text-align: center; }
 .block { display: block; }
 .flex { display: flex; }
+.vertical-align-top { vertical-align: top; }
 .vertical-align-middle { vertical-align: middle; }
 .vertical-align-sub { vertical-align: sub; }
 .flex-align-self-center { align-self: center; }

changelogs/unreleased/62966-embed-zoom-call-in-issue-mvc.yml

+---
+title: Add Join meeting button to issues with Zoom links
+merge_request: 29454
+author:
+type: added

lib/gitlab/metrics/dashboard/project_dashboard_service.rb

@@ -13,12 +13,23 @@ module Gitlab
           def all_dashboard_paths(project)
             file_finder(project)
               .list_files_for(DASHBOARD_ROOT)
-              .map { |filepath| { path: filepath, default: false } }
+              .map do |filepath|
+                {
+                  path: filepath,
+                  display_name: name_for_path(filepath),
+                  default: false
+                }
+              end
           end
 
           def file_finder(project)
             Gitlab::Template::Finders::RepoTemplateFinder.new(project, DASHBOARD_ROOT, '.yml')
           end
+
+          # Grabs the filepath after the base directory.
+          def name_for_path(filepath)
+            filepath.delete_prefix("#{DASHBOARD_ROOT}/")
+          end
         end
 
         private

lib/gitlab/metrics/dashboard/system_dashboard_service.rb

@@ -7,11 +7,13 @@ module Gitlab
     module Dashboard
       class SystemDashboardService < Gitlab::Metrics::Dashboard::BaseService
         SYSTEM_DASHBOARD_PATH = 'config/prometheus/common_metrics.yml'
+        SYSTEM_DASHBOARD_NAME = 'Default'
 
         class << self
           def all_dashboard_paths(_project)
             [{
               path: SYSTEM_DASHBOARD_PATH,
+              display_name: SYSTEM_DASHBOARD_NAME,
               default: true
             }]
           end

package.json

@@ -37,7 +37,7 @@
     "@babel/plugin-syntax-import-meta": "^7.2.0",
     "@babel/preset-env": "^7.4.4",
     "@gitlab/csslab": "^1.9.0",
-    "@gitlab/svgs": "^1.63.0",
+    "@gitlab/svgs": "^1.64.0",
     "@gitlab/ui": "^4.0.0",
     "apollo-cache-inmemory": "^1.5.1",
     "apollo-client": "^2.5.1",

spec/features/issues/user_creates_issue_spec.rb

@@ -92,6 +92,19 @@ describe "User creates issue" do
           .and have_content(label_titles.first)
       end
     end
+
+    context "with Zoom link" do
+      it "adds Zoom button" do
+        issue_title = "Issue containing Zoom meeting link"
+        zoom_url = "https://gitlab.zoom.us/j/123456789"
+
+        fill_in("Title", with: issue_title)
+        fill_in("Description", with: zoom_url)
+        click_button("Submit issue")
+
+        expect(page).to have_link('Join Zoom meeting', href: zoom_url)
+      end
+    end
   end
 
   context "when signed in as user with special characters in their name" do

spec/frontend/issue_show/components/pinned_links_spec.js

+import { shallowMount, createLocalVue } from '@vue/test-utils';
+import { GlLink } from '@gitlab/ui';
+import PinnedLinks from '~/issue_show/components/pinned_links.vue';
+
+const localVue = createLocalVue();
+
+const plainZoomUrl = 'https://zoom.us/j/123456789';
+const vanityZoomUrl = 'https://gitlab.zoom.us/j/123456789';
+const startZoomUrl = 'https://zoom.us/s/123456789';
+const personalZoomUrl = 'https://zoom.us/my/hunter-zoloman';
+const randomUrl = 'https://zoom.us.com';
+
+describe('PinnedLinks', () => {
+  let wrapper;
+
+  const link = {
+    get text() {
+      return wrapper.find(GlLink).text();
+    },
+    get href() {
+      return wrapper.find(GlLink).attributes('href');
+    },
+  };
+
+  const createComponent = props => {
+    wrapper = shallowMount(localVue.extend(PinnedLinks), {
+      localVue,
+      sync: false,
+      propsData: {
+        descriptionHtml: '',
+        ...props,
+      },
+    });
+  };
+
+  it('displays Zoom link', () => {
+    createComponent({
+      descriptionHtml: `<a href="${plainZoomUrl}">Zoom</a>`,
+    });
+
+    expect(link.text).toBe('Join Zoom meeting');
+  });
+
+  it('detects plain Zoom link', () => {
+    createComponent({
+      descriptionHtml: `<a href="${plainZoomUrl}">Zoom</a>`,
+    });
+
+    expect(link.href).toBe(plainZoomUrl);
+  });
+
+  it('detects vanity Zoom link', () => {
+    createComponent({
+      descriptionHtml: `<a href="${vanityZoomUrl}">Zoom</a>`,
+    });
+
+    expect(link.href).toBe(vanityZoomUrl);
+  });
+
+  it('detects Zoom start meeting link', () => {
+    createComponent({
+      descriptionHtml: `<a href="${startZoomUrl}">Zoom</a>`,
+    });
+
+    expect(link.href).toBe(startZoomUrl);
+  });
+
+  it('detects personal Zoom room link', () => {
+    createComponent({
+      descriptionHtml: `<a href="${personalZoomUrl}">Zoom</a>`,
+    });
+
+    expect(link.href).toBe(personalZoomUrl);
+  });
+
+  it('only renders final Zoom link in description', () => {
+    createComponent({
+      descriptionHtml: `<a href="${plainZoomUrl}">Zoom</a><a href="${vanityZoomUrl}">Zoom</a>`,
+    });
+
+    expect(link.href).toBe(vanityZoomUrl);
+  });
+
+  it('does not render for other links', () => {
+    createComponent({
+      descriptionHtml: `<a href="${randomUrl}">Some other link</a>`,
+    });
+
+    expect(wrapper.find(GlLink).exists()).toBe(false);
+  });
+});

spec/lib/gitlab/metrics/dashboard/finder_spec.rb

@@ -49,7 +49,7 @@ describe Gitlab::Metrics::Dashboard::Finder, :use_clean_rails_memory_store_cachi
 
   describe '.find_all_paths' do
     let(:all_dashboard_paths) { described_class.find_all_paths(project) }
-    let(:system_dashboard) { { path: system_dashboard_path, default: true } }
+    let(:system_dashboard) { { path: system_dashboard_path, display_name: 'Default', default: true } }
 
     it 'includes only the system dashboard by default' do
       expect(all_dashboard_paths).to eq([system_dashboard])
@@ -60,7 +60,7 @@ describe Gitlab::Metrics::Dashboard::Finder, :use_clean_rails_memory_store_cachi
       let(:project) { project_with_dashboard(dashboard_path) }
 
       it 'includes system and project dashboards' do
-        project_dashboard = { path: dashboard_path, default: false }
+        project_dashboard = { path: dashboard_path, display_name: 'test.yml', default: false }
 
         expect(all_dashboard_paths).to contain_exactly(system_dashboard, project_dashboard)
       end

spec/lib/gitlab/metrics/dashboard/project_dashboard_service_spec.rb

@@ -59,4 +59,29 @@ describe Gitlab::Metrics::Dashboard::ProjectDashboardService, :use_clean_rails_m
       it_behaves_like 'misconfigured dashboard service response', :unprocessable_entity
     end
   end
+
+  describe '::all_dashboard_paths' do
+    let(:all_dashboards) { described_class.all_dashboard_paths(project) }
+
+    context 'when there are no project dashboards' do
+      it 'returns an empty array' do
+        expect(all_dashboards).to be_empty
+      end
+    end
+
+    context 'when there are project dashboards available' do
+      let(:dashboard_path) { '.gitlab/dashboards/test.yml' }
+      let(:project) { project_with_dashboard(dashboard_path) }
+
+      it 'returns the dashboard attributes' do
+        expect(all_dashboards).to eq(
+          [{
+            path: dashboard_path,
+            display_name: 'test.yml',
+            default: false
+          }]
+        )
+      end
+    end
+  end
 end

spec/lib/gitlab/metrics/dashboard/system_dashboard_service_spec.rb

@@ -29,4 +29,18 @@ describe Gitlab::Metrics::Dashboard::SystemDashboardService, :use_clean_rails_me
       it_behaves_like 'valid dashboard service response'
     end
   end
+
+  describe '::all_dashboard_paths' do
+    it 'returns the dashboard attributes' do
+      all_dashboards = described_class.all_dashboard_paths(project)
+
+      expect(all_dashboards).to eq(
+        [{
+          path: described_class::SYSTEM_DASHBOARD_PATH,
+          display_name: described_class::SYSTEM_DASHBOARD_NAME,
+          default: true
+        }]
+      )
+    end
+  end
 end

yarn.lock

@@ -700,10 +700,10 @@
   dependencies:
     requireindex "~1.1.0"
 
-"@gitlab/svgs@^1.63.0":
-  version "1.63.0"
-  resolved "https://registry.yarnpkg.com/@gitlab/svgs/-/svgs-1.63.0.tgz#9dd544026d203e4ce6efed72b05db68f710c4d49"
-  integrity sha512-YztrReFTg31B7v5wtUC5j15KHNcMebtW+kACytEU42XomMaIwk4USIbygqWlq0VRHA2VHJrHApfJHIjxiCCQcA==
+"@gitlab/svgs@^1.64.0":
+  version "1.64.0"
+  resolved "https://registry.yarnpkg.com/@gitlab/svgs/-/svgs-1.64.0.tgz#1370bcbe9ca0ecc9fb919956cd4241bea090ddd3"
+  integrity sha512-y9p73NGDnQJc18Dtk0oJfgxedancBT6UceATcnZMceLV6iWylzdMbQWxCl4O2aBXwsAoCrLUJQ9jhRkbNicYNA==
 
 "@gitlab/ui@^4.0.0":
   version "4.0.0"