fix(ui): Remove unnecessary brackets in jsx (#63372)

Author: scttcper

static/app/components/alert.stories.tsx

@@ -34,14 +34,8 @@ export default storyBook(Alert, story => {
           alert:
         </p>
         <Alert>
-          {
-            <Fragment>
-              Sentry is cool!{' '}
-              <ExternalLink href="https://sentry.io/welcome/">
-                Learn more here.
-              </ExternalLink>
-            </Fragment>
-          }
+          Sentry is cool!{' '}
+          <ExternalLink href="https://sentry.io/welcome/">Learn more here.</ExternalLink>
         </Alert>
       </Fragment>
     );

static/app/components/events/interfaces/threads.tsx

@@ -267,7 +267,7 @@ export function Threads({
                       title={getThreadStateHelpText(threadStateDisplay)}
                     />
                   )}
-                  {<LockReason>{getLockReason(activeThread?.heldLocks)}</LockReason>}
+                  <LockReason>{getLockReason(activeThread?.heldLocks)}</LockReason>
                 </ThreadStateWrapper>
               </EventDataSection>
             )}

static/app/components/feedback/list/feedbackListItem.tsx

@@ -133,7 +133,7 @@ const FeedbackListItem = forwardRef<HTMLDivElement, Props>(
 
                 {hasReplayId && (
                   <Tooltip title={t('Linked Replay')} containerDisplayMode="flex">
-                    {<IconPlay size="xs" />}
+                    <IconPlay size="xs" />
                   </Tooltip>
                 )}
 

static/app/components/group/tagFacets/tagFacetsDistributionMeter.tsx

@@ -181,7 +181,7 @@ function TagFacetsDistributionMeter({
                     {segment.name ?? <NotApplicableLabel>{t('n/a')}</NotApplicableLabel>}
                   </LegendText>
                 </Tooltip>
-                {<LegendPercent>{`${pctLabel}%`}</LegendPercent>}
+                <LegendPercent>{`${pctLabel}%`}</LegendPercent>
               </LegendRow>
             );
 

static/app/components/onboardingWizard/modalTask.tsx

@@ -10,7 +10,7 @@ export default function ModalTask({title}: Props) {
   return (
     <TaskCard>
       <Title>
-        {<IconCheckmark isCircled color="successText" />}
+        <IconCheckmark isCircled color="successText" />
         {title}
       </Title>
     </TaskCard>

static/app/views/issueDetails/actions/index.tsx

@@ -495,18 +495,16 @@ export function Actions(props: Props) {
         </ActionButton>
       ) : (
         <Fragment>
-          {
-            <GuideAnchor target="issue_details_archive_button" position="bottom">
-              <ArchiveActions
-                className="hidden-xs"
-                size="sm"
-                isArchived={isIgnored}
-                onUpdate={onUpdate}
-                disabled={disabled}
-                disableArchiveUntilOccurrence={!archiveUntilOccurrenceCap.enabled}
-              />
-            </GuideAnchor>
-          }
+          <GuideAnchor target="issue_details_archive_button" position="bottom">
+            <ArchiveActions
+              className="hidden-xs"
+              size="sm"
+              isArchived={isIgnored}
+              onUpdate={onUpdate}
+              disabled={disabled}
+              disableArchiveUntilOccurrence={!archiveUntilOccurrenceCap.enabled}
+            />
+          </GuideAnchor>
           <GuideAnchor target="resolve" position="bottom" offset={20}>
             <ResolveActions
               disableResolveInRelease={!resolveInReleaseCap.enabled}

static/app/views/issueDetails/groupEventDetails/groupEventDetails.tsx

@@ -122,13 +122,11 @@ function GroupEventDetails(props: GroupEventDetailsProps) {
     if (group.status === 'ignored') {
       return (
         <GroupStatusBannerWrapper>
-          {
-            <ArchivedBox
-              substatus={group.substatus}
-              statusDetails={group.statusDetails}
-              organization={organization}
-            />
-          }
+          <ArchivedBox
+            substatus={group.substatus}
+            statusDetails={group.statusDetails}
+            organization={organization}
+          />
         </GroupStatusBannerWrapper>
       );
     }

static/app/views/issueDetails/header.tsx

@@ -264,13 +264,11 @@ function GroupHeader({
               <h3>
                 <StyledEventOrGroupTitle data={group} />
               </h3>
-              {
-                <GroupStatusBadge
-                  status={group.status}
-                  substatus={group.substatus}
-                  fontSize="md"
-                />
-              }
+              <GroupStatusBadge
+                status={group.status}
+                substatus={group.substatus}
+                fontSize="md"
+              />
             </TitleHeading>
             <StyledTagAndMessageWrapper>
               {group.level && <ErrorLevel level={group.level} size="11px" />}

static/app/views/issueList/actions/actionSet.tsx

@@ -246,23 +246,21 @@ function ActionSet({
           }}
         />
       )}
-      {
-        <GuideAnchor
-          target="issue_stream_archive_button"
-          position="bottom"
+      <GuideAnchor
+        target="issue_stream_archive_button"
+        position="bottom"
+        disabled={ignoreDisabled}
+      >
+        <ArchiveActions
+          onUpdate={onUpdate}
+          shouldConfirm={onShouldConfirm(ConfirmAction.IGNORE)}
+          confirmMessage={() =>
+            confirm({action: ConfirmAction.IGNORE, canBeUndone: true})
+          }
+          confirmLabel={label('archive')}
           disabled={ignoreDisabled}
-        >
-          <ArchiveActions
-            onUpdate={onUpdate}
-            shouldConfirm={onShouldConfirm(ConfirmAction.IGNORE)}
-            confirmMessage={() =>
-              confirm({action: ConfirmAction.IGNORE, canBeUndone: true})
-            }
-            confirmLabel={label('archive')}
-            disabled={ignoreDisabled}
-          />
-        </GuideAnchor>
-      }
+        />
+      </GuideAnchor>
       {!nestMergeAndReview && (
         <ReviewAction disabled={!canMarkReviewed} onUpdate={onUpdate} />
       )}

static/app/views/monitors/components/monitorCheckIns.tsx

@@ -133,7 +133,7 @@ function MonitorCheckIns({monitor, monitorEnvs, orgSlug}: Props) {
                         />
                       }
                     >
-                      {<DateTime date={checkIn.dateCreated} timeZone seconds />}
+                      <DateTime date={checkIn.dateCreated} timeZone seconds />
                     </Tooltip>
                   </div>
                 ) : (
@@ -156,19 +156,17 @@ function MonitorCheckIns({monitor, monitorEnvs, orgSlug}: Props) {
                         organization={organization}
                         key={id}
                       >
-                        {
-                          <StyledShortId
-                            shortId={shortId}
-                            avatar={
-                              <ProjectBadge
-                                project={monitor.project}
-                                hideName
-                                avatarSize={12}
-                              />
-                            }
-                            to={`/issues/${id}`}
-                          />
-                        }
+                        <StyledShortId
+                          shortId={shortId}
+                          avatar={
+                            <ProjectBadge
+                              project={monitor.project}
+                              hideName
+                              avatarSize={12}
+                            />
+                          }
+                          to={`/issues/${id}`}
+                        />
                       </QuickContextHovercard>
                     ))}
                   </IssuesContainer>