Add ability to create new issue from sentry error detail page

app/assets/javascripts/error_tracking/components/error_details.vue

@@ -32,6 +32,10 @@ export default {
       type: String,
       required: true,
     },
+    issueProjectPath: {
+      type: String,
+      required: true,
+    },
   },
   computed: {
     ...mapState('details', ['error', 'loading', 'loadingStacktrace', 'stacktraceData']),
@@ -82,9 +86,9 @@ export default {
     <div v-else-if="showDetails" class="error-details">
       <div class="top-area align-items-center justify-content-between py-3">
         <span v-if="!loadingStacktrace && stacktrace" v-html="reported"></span>
-        <!--   <gl-button class="my-3 ml-auto" variant="success">
-             {{ __('Create Issue') }}
-           </gl-button>-->
+        <gl-button variant="success" :href="issueProjectPath">
+          {{ __('Create issue') }}
+        </gl-button>
       </div>
       <div>
         <tooltip-on-truncate :title="error.title" truncate-target="child" placement="top">

app/assets/javascripts/error_tracking/details.js

@@ -12,12 +12,13 @@ export default () => {
     store,
     render(createElement) {
       const domEl = document.querySelector(this.$options.el);
-      const { issueDetailsPath, issueStackTracePath } = domEl.dataset;
+      const { issueDetailsPath, issueStackTracePath, issueProjectPath } = domEl.dataset;
 
       return createElement('error-details', {
         props: {
           issueDetailsPath,
           issueStackTracePath,
+          issueProjectPath,
         },
       });
     },

app/helpers/projects/error_tracking_helper.rb

@@ -18,6 +18,7 @@ module Projects::ErrorTrackingHelper
     opts = [project, issue_id, { format: :json }]
 
     {
+      'issue-project-path' => new_project_issue_path(project),
       'issue-details-path' => details_project_error_tracking_index_path(*opts),
       'issue-stack-trace-path' => stack_trace_project_error_tracking_index_path(*opts)
     }

changelogs/unreleased/lm-create-new-issue-from-sentry.yml

+---
+title: Add ability to create new issue from sentry error detail page
+merge_request: 20337
+author:
+type: added

locale/gitlab.pot

@@ -4892,6 +4892,9 @@ msgstr ""
 msgid "Create group label"
 msgstr ""
 
+msgid "Create issue"
+msgstr ""
+
 msgid "Create lists from labels. Issues with that label appear in that list."
 msgstr ""
 

spec/frontend/error_tracking/components/error_details_spec.js

 import { createLocalVue, shallowMount } from '@vue/test-utils';
 import Vuex from 'vuex';
-import { GlLoadingIcon, GlLink } from '@gitlab/ui';
+import { GlButton, GlLoadingIcon, GlLink } from '@gitlab/ui';
 import Stacktrace from '~/error_tracking/components/stacktrace.vue';
 import ErrorDetails from '~/error_tracking/components/error_details.vue';
 
@@ -20,6 +20,7 @@ describe('ErrorDetails', () => {
       propsData: {
         issueDetailsPath: '/123/details',
         issueStackTracePath: '/stacktrace',
+        issueProjectPath: '/test-project/issues/new',
       },
     });
   }
@@ -82,6 +83,15 @@ describe('ErrorDetails', () => {
       expect(wrapper.find(Stacktrace).exists()).toBe(false);
     });
 
+    it('should allow a blank issue to be created', () => {
+      store.state.details.loading = false;
+      store.state.details.error.id = 1;
+      mountComponent();
+      const button = wrapper.find(GlButton);
+      expect(button.exists()).toBe(true);
+      expect(button.attributes().href).toBe(wrapper.props().issueProjectPath);
+    });
+
     describe('Stacktrace', () => {
       it('should show stacktrace', () => {
         store.state.details.loading = false;

spec/helpers/projects/error_tracking_helper_spec.rb

@@ -81,6 +81,7 @@ describe Projects::ErrorTrackingHelper do
     let(:route_params) { [project.owner, project, issue_id, { format: :json }] }
     let(:details_path) { details_namespace_project_error_tracking_index_path(*route_params) }
     let(:stack_trace_path) { stack_trace_namespace_project_error_tracking_index_path(*route_params) }
+    let(:issue_project_path) { new_project_issue_path(project) }
 
     let(:result) { helper.error_details_data(project, issue_id) }
 
@@ -91,5 +92,9 @@ describe Projects::ErrorTrackingHelper do
     it 'returns the correct stack trace path' do
       expect(result['issue-stack-trace-path']).to eq stack_trace_path
     end
+
+    it 'returns the correct path for creating a new issue' do
+      expect(result['issue-project-path']).to eq issue_project_path
+    end
   end
 end