ref(suspect-commits): Add hook (#14057)

Author: maheskett

src/sentry/static/sentry/app/components/events/eventCauseEmpty.jsx

@@ -128,7 +128,7 @@ class EventCauseEmpty extends React.Component {
               <p>{t('Identify which commit caused this issue')}</p>
             </Description>
             <ButtonList>
-              <Button
+              <DocsButton
                 size="small"
                 priority="primary"
                 href="https://docs.sentry.io/workflow/releases/#create-release"
@@ -141,7 +141,7 @@ class EventCauseEmpty extends React.Component {
                 data-test-id="read-the-docs"
               >
                 {t('Read the docs')}
-              </Button>
+              </DocsButton>
 
               <div>
                 <Tooltip title={t('Remind me next week')}>
@@ -225,6 +225,12 @@ const ButtonList = styled('div')`
   margin-bottom: 16px;
 `;
 
+const DocsButton = styled(Button)`
+  &:focus {
+    color: ${p => p.theme.white};
+  }
+`;
+
 const SnoozeButton = styled(Button)`
   border-right: 0;
   border-top-right-radius: 0;

src/sentry/static/sentry/app/components/events/eventEntries.jsx

@@ -7,12 +7,10 @@ import {logException} from 'app/utils/logging';
 import {objectIsEmpty} from 'app/utils';
 import {t} from 'app/locale';
 import BreadcrumbsInterface from 'app/components/events/interfaces/breadcrumbs';
-import ConfigStore from 'app/stores/configStore';
 import CspInterface from 'app/components/events/interfaces/csp';
 import DebugMetaInterface from 'app/components/events/interfaces/debugmeta';
 import EventAttachments from 'app/components/events/eventAttachments';
 import EventCause from 'app/components/events/eventCause';
-import EventCauseEmpty from 'app/components/events/eventCauseEmpty';
 import EventContextSummary from 'app/components/events/contextSummary';
 import EventContexts from 'app/components/events/contexts';
 import EventDataSection from 'app/components/events/eventDataSection';
@@ -27,6 +25,7 @@ import EventTags from 'app/components/events/eventTags';
 import EventUserFeedback from 'app/components/events/userFeedback';
 import ExceptionInterface from 'app/components/events/interfaces/exception';
 import GenericInterface from 'app/components/events/interfaces/generic';
+import Hook from 'app/components/hook';
 import MessageInterface from 'app/components/events/interfaces/message';
 import RequestInterface from 'app/components/events/interfaces/request';
 import SentryTypes from 'app/sentryTypes';
@@ -100,11 +99,6 @@ class EventEntries extends React.Component {
     });
   }
 
-  get isSuperUser() {
-    const user = ConfigStore.get('user');
-    return user && user.isSuperuser;
-  }
-
   renderEntries() {
     const {event, project, isShare} = this.props;
 
@@ -173,9 +167,11 @@ class EventEntries extends React.Component {
         {!objectIsEmpty(event.errors) && <EventErrors event={event} />}{' '}
         {!isShare &&
           (showExampleCommit ? (
-            this.isSuperUser && (
-              <EventCauseEmpty organization={organization} project={project} />
-            )
+            <Hook
+              name="component:event-cause-empty"
+              organization={organization}
+              project={project}
+            />
           ) : (
             <EventCause event={event} orgId={orgId} projectId={project.slug} />
           ))}

src/sentry/static/sentry/app/stores/hookStore.jsx

@@ -26,6 +26,7 @@ const validHookNames = new Set([
   'component:org-members-view',
   'component:header-date-range',
   'component:header-selector-items',
+  'component:event-cause-empty',
 
   // Additional settings
   'settings:organization-navigation',

tests/js/spec/views/organizationGroupDetails/groupEventDetails.spec.jsx

@@ -3,7 +3,6 @@ import {mount} from 'enzyme';
 import {browserHistory} from 'react-router';
 
 import {initializeOrg} from 'app-test/helpers/initializeOrg';
-import ConfigStore from 'app/stores/configStore';
 import {GroupEventDetails} from 'app/views/organizationGroupDetails/groupEventDetails';
 
 describe('groupEventDetails', () => {
@@ -243,37 +242,6 @@ describe('groupEventDetails', () => {
     expect(wrapper.find('EventCause').exists()).toBe(false);
   });
 
-  it('renders suspect commit empty state for super users', async function() {
-    ConfigStore.set('user', TestStubs.User({isSuperuser: true}));
-    MockApiClient.addMockResponse({
-      url: `/projects/${org.slug}/${project.slug}/releases/completion/`,
-      body: [
-        {
-          step: 'commit',
-          complete: false,
-        },
-      ],
-    });
-
-    const wrapper = mount(
-      <GroupEventDetails
-        api={new MockApiClient()}
-        group={group}
-        project={project}
-        organization={org}
-        environments={[{id: '1', name: 'dev', displayName: 'Dev'}]}
-        params={{orgId: org.slug, groupId: group.id, eventId: '1'}}
-        location={{query: {environment: 'dev'}}}
-      />,
-      routerContext
-    );
-    await tick();
-    wrapper.update();
-
-    expect(wrapper.find('EventCauseEmpty').exists()).toBe(true);
-    expect(wrapper.find('EventCause').exists()).toBe(false);
-  });
-
   it('renders suspect commit', async function() {
     MockApiClient.addMockResponse({
       url: `/projects/${org.slug}/${project.slug}/releases/completion/`,