feat(investigation-bias): Make button primary and change columns icon (…

…#59086)
getsentry · Oct 31, 2023 · b5747b6 · b5747b6
1 parent 8f67757
commit b5747b6
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 6 deletions.
diff --git a/static/app/components/discover/transactionsList.tsx b/static/app/components/discover/transactionsList.tsx
@@ -295,13 +295,13 @@ class _TransactionsList extends Component<Props> {
             onChange={opt => handleDropdownChange(opt.value)}
           />
         </div>
-        <div>
+        <InvestigationRuleWrapper>
           <InvestigationRuleCreation
             buttonProps={{size: 'xs'}}
             eventView={eventView}
             numSamples={totalNumSamples}
           />
-        </div>
+        </InvestigationRuleWrapper>
         {!this.isTrend() &&
           (handleOpenAllEventsClick ? (
             <GuideAnchor target="release_transactions_open_in_transaction_events">
@@ -481,6 +481,10 @@ const StyledPagination = styled(Pagination)`
   margin: 0 0 0 ${space(1)};
 `;
 
+const InvestigationRuleWrapper = styled('div')`
+  margin-right: ${space(1)};
+`;
+
 function TransactionsList(
   props: Omit<Props, 'cursorName' | 'limit'> & {
     cursorName?: Props['cursorName'];

diff --git a/static/app/components/dynamicSampling/investigationRule.tsx b/static/app/components/dynamicSampling/investigationRule.tsx
@@ -160,7 +160,6 @@ function useCreateInvestigationRuleMutation(vars: CreateCustomRuleVariables) {
 }
 
 const InvestigationInProgressNotification = styled('span')`
-  margin: ${space(1.5)};
   font-size: ${p => p.theme.fontSizeMedium};
   color: ${p => p.theme.subText};
   font-weight: 600;
@@ -236,7 +235,7 @@ function InvestigationRuleCreationInternal(props: PropsInternal) {
             }
           )}
         >
-          <IconQuestion size="xs" color="subText" />
+          <StyledIconQuestion size="sm" color="subText" />
         </Tooltip>
       </InvestigationInProgressNotification>
     );
@@ -255,6 +254,7 @@ function InvestigationRuleCreationInternal(props: PropsInternal) {
       )}
     >
       <Button
+        priority="primary"
         {...props.buttonProps}
         onClick={() => createInvestigationRule({organization, period, projects, query})}
         icon={<IconStack size="xs" />}
@@ -273,3 +273,8 @@ export function InvestigationRuleCreation(props: Props) {
     </Feature>
   );
 }
+
+const StyledIconQuestion = styled(IconQuestion)`
+  position: relative;
+  top: 2px;
+`;
diff --git a/static/app/views/discover/table/tableActions.tsx b/static/app/views/discover/table/tableActions.tsx
@@ -8,7 +8,7 @@ import {Button} from 'sentry/components/button';
 import DataExport, {ExportQueryType} from 'sentry/components/dataExport';
 import {InvestigationRuleCreation} from 'sentry/components/dynamicSampling/investigationRule';
 import {Hovercard} from 'sentry/components/hovercard';
-import {IconDownload, IconStack, IconTag} from 'sentry/icons';
+import {IconDownload, IconSliders, IconTag} from 'sentry/icons';
 import {t} from 'sentry/locale';
 import {OrganizationSummary} from 'sentry/types';
 import {trackAnalytics} from 'sentry/utils/analytics';
@@ -102,7 +102,7 @@ function renderEditButton(canEdit: boolean, props: Props) {
         disabled={!canEdit}
         onClick={onClick}
         data-test-id="grid-edit-enable"
-        icon={<IconStack size="xs" />}
+        icon={<IconSliders size="xs" />}
       >
         {t('Columns')}
       </Button>