♻️ pr comments 1

Author: michellewzhang

static/app/views/issueDetails/groupFeatureFlags/flagDetailsDrawerContent.spec.tsx

@@ -112,7 +112,7 @@ describe('FlagDetailsDrawerContent', () => {
     render(<FlagDetailsDrawerContent />, {router});
 
     expect(
-      await screen.findByText('No audit log events were found for this flag.')
+      await screen.findByText('No audit logs were found for this featureflag.')
     ).toBeInTheDocument();
   });
 });

static/app/views/issueDetails/groupFeatureFlags/flagDetailsDrawerContent.tsx

@@ -76,7 +76,7 @@ export function FlagDetailsDrawerContent() {
   if (!flagLog.data.length) {
     return (
       <EmptyStateWarning withIcon={false} small>
-        {t('No audit log events were found for this flag.')}
+        {t('No audit logs were found for this feature flag.')}
       </EmptyStateWarning>
     );
   }

static/app/views/issueDetails/groupTags/groupTagsDrawer.tsx

@@ -173,6 +173,7 @@ export function GroupTagsDrawer({
   const location = useLocation();
   const organization = useOrganization();
   const environments = useEnvironmentsFromUrl();
+  // XXX: tagKey param is re-used for feature flag details drawer
   const {tagKey} = useParams<{tagKey: string}>();
   const drawerRef = useRef<HTMLDivElement>(null);
   const {projects} = useProjects();
@@ -346,7 +347,7 @@ export function GroupTagsDrawer({
                       to: tagKey
                         ? {
                             pathname: `${baseUrl}${TabPaths[Tab.TAGS]}`,
-                            query: {tab: FEATURE_FLAGS_TAB, ...location.query},
+                            query: {...location.query, tab: FEATURE_FLAGS_TAB},
                           }
                         : undefined,
                     },

static/app/views/issueDetails/streamline/featureFlagUtils.tsx

@@ -1,3 +1,5 @@
+import styled from '@emotion/styled';
+
 import {Tag} from 'sentry/components/core/badge/tag';
 
 export type RawFlag = {
@@ -45,11 +47,15 @@ export function getFlagActionLabel(action: string) {
   const labelType =
     action === 'created' ? 'info' : action === 'deleted' ? 'error' : undefined;
 
-  const capitalized = action.toUpperCase();
+  const capitalized = action.charAt(0).toUpperCase() + action.slice(1);
 
   return (
-    <div style={{alignSelf: 'flex-start'}}>
+    <ActionLabel>
       <Tag type={labelType}>{capitalized}</Tag>
-    </div>
+    </ActionLabel>
   );
 }
+
+const ActionLabel = styled('div')`
+  align-self: flex-start;
+`;