add drawer open to more places, project slug

static/app/components/events/eventTagsAndScreenshot/tags.tsx

@@ -1,6 +1,7 @@
-import {forwardRef, useCallback, useMemo, useState} from 'react';
+import {forwardRef, useCallback, useMemo, useRef, useState} from 'react';
 import styled from '@emotion/styled';
 
+import {Button} from 'sentry/components/button';
 import ButtonBar from 'sentry/components/buttonBar';
 import {
  getSentryDefaultTags,
@@ -14,8 +15,10 @@ import {t, tct} from 'sentry/locale';
 import {space} from 'sentry/styles/space';
 import type {Event} from 'sentry/types/event';
 import type {Project} from 'sentry/types/project';
+import {useGroupTagsDrawer} from 'sentry/views/issueDetails/groupTags/groupTagsDrawer';
 import {SectionKey} from 'sentry/views/issueDetails/streamline/context';
 import {InterimSection} from 'sentry/views/issueDetails/streamline/interimSection';
+import {useHasStreamlinedUI} from 'sentry/views/issueDetails/utils';
 
 import {EventTags} from '../eventTags';
 
@@ -27,6 +30,13 @@ type Props = {
 export const EventTagsDataSection = forwardRef<HTMLElement, Props>(
  function EventTagsDataSection({event, projectSlug}: Props, ref) {
  const sentryTags = getSentryDefaultTags();
+ const hasStreamlinedUI = useHasStreamlinedUI();
+ const openButtonRef = useRef<HTMLButtonElement>(null);
+ const {openTagsDrawer} = useGroupTagsDrawer({
+ projectSlug: projectSlug,
+ groupId: event.groupID!,
+ openButtonRef: openButtonRef,
+ });
 
  const [tagFilter, setTagFilter] = useState<TagFilter>(TagFilter.ALL);
  const handleTagFilterChange = useCallback((value: TagFilter) => {
@@ -51,6 +61,11 @@ export const EventTagsDataSection = forwardRef<HTMLElement, Props>(
 
  const actions = (
  <ButtonBar gap={1}>
+ {hasStreamlinedUI && (
+ <Button onClick={openTagsDrawer} size="xs">
+ {t('View All Issue Tags')}
+ </Button>
+ )}
  <SegmentedControl
  size="xs"
  aria-label={t('Filter tags')}

static/app/components/events/highlights/highlightsDataSection.spec.tsx

@@ -1,4 +1,5 @@
 import {EventFixture} from 'sentry-fixture/event';
+import {GroupFixture} from 'sentry-fixture/group';
 import {OrganizationFixture} from 'sentry-fixture/organization';
 import {ProjectFixture} from 'sentry-fixture/project';
 
@@ -16,6 +17,7 @@ import * as analytics from 'sentry/utils/analytics';
 describe('HighlightsDataSection', function () {
  const organization = OrganizationFixture();
  const project = ProjectFixture();
+ const group = GroupFixture();
  const event = EventFixture({
  contexts: TEST_EVENT_CONTEXTS,
  tags: TEST_EVENT_TAGS,
@@ -53,6 +55,7 @@ describe('HighlightsDataSection', function () {
  event={event}
  project={project}
  viewAllRef={{current: null}}
+ groupId={group.id}
  />,
  {organization}
  );
@@ -87,7 +90,7 @@ describe('HighlightsDataSection', function () {
  body: {},
  });
 
- render(<HighlightsDataSection event={event} project={project} />, {
+ render(<HighlightsDataSection event={event} project={project} groupId={group.id} />, {
  organization,
  });
  expect(screen.getByText('Event Highlights')).toBeInTheDocument();

static/app/components/events/highlights/highlightsDataSection.tsx

@@ -261,7 +261,11 @@ export default function HighlightsDataSection({
  const organization = useOrganization();
  const hasStreamlinedUI = useHasStreamlinedUI();
  const openButtonRef = useRef<HTMLButtonElement>(null);
- const {openTagsDrawer} = useGroupTagsDrawer({groupId, openButtonRef, project});
+ const {openTagsDrawer} = useGroupTagsDrawer({
+ groupId,
+ openButtonRef,
+ projectSlug: project.slug,
+ });
 
  const viewAllButton = hasStreamlinedUI ? (
  // Streamline details ui has "Jump to" feature, instead we'll show the drawer button