chore(lint): Enable & Auto-fix native-coercion-functions

eslint.config.mjs

@@ -654,7 +654,7 @@ export default typescript.config([
       'unicorn/prefer-export-from': 'off', // TODO(ryan953): Fix violations and enable this rule
       'unicorn/prefer-includes': 'error',
       'unicorn/prefer-logical-operator-over-ternary': 'off', // TODO(ryan953): Fix violations and enable this rule
-      'unicorn/prefer-native-coercion-functions': 'off', // TODO(ryan953): Fix violations and enable this rule
+      'unicorn/prefer-native-coercion-functions': 'error',
       'unicorn/prefer-negative-index': 'error',
       'unicorn/prefer-node-protocol': 'error',
       'unicorn/prefer-object-from-entries': 'off', // TODO(ryan953): Fix violations and enable this rule

static/app/actionCreators/performance.tsx

@@ -84,7 +84,7 @@ export function toggleKeyTransaction(
     {
       method: isKeyTransaction ? 'DELETE' : 'POST',
       query: {
-        project: projects.map(id => String(id)),
+        project: projects.map(String),
       },
       data: {
         transaction: transactionName,

static/app/components/events/autofix/autofixInsightCards.tsx

@@ -355,7 +355,7 @@ function AutofixInsightCards({
     setIsCollapsed(!isCollapsed);
   };
 
-  const validInsightCount = insights.filter(insight => insight).length;
+  const validInsightCount = insights.filter(Boolean).length;
 
   return (
     <InsightsContainer>

static/app/components/events/interfaces/spans/waterfallModel.tsx

@@ -157,7 +157,7 @@ class WaterfallModel {
 
         const basicValues: string[] = Object.values(pickedSpan)
           .filter(value => !!value)
-          .map(value => String(value));
+          .map(String);
 
         indexed.push(...basicValues);
 

static/app/utils/discover/eventView.tsx

@@ -607,7 +607,7 @@ class EventView {
       id: this.id,
       name: this.name || '',
       fields: this.getFields(),
-      widths: this.getWidths().map(w => String(w)),
+      widths: this.getWidths().map(String),
       orderby,
       query: this.query || '',
       projects: this.project,
@@ -1186,8 +1186,8 @@ class EventView {
           ? encodeSorts(this.sorts)
           : encodeSort(this.sorts[0]!);
     const fields = this.getFields();
-    const team = this.team.map(proj => String(proj));
-    const project = this.project.map(proj => String(proj));
+    const team = this.team.map(String);
+    const project = this.project.map(String);
     const environment = this.environment as string[];
 
     let queryString = this.getQueryWithAdditionalConditions();

static/app/utils/discover/fields.tsx

@@ -1095,7 +1095,7 @@ export function generateFieldAsString(value: QueryFieldValue): string {
   }
 
   const aggregation = value.function[0];
-  const parameters = value.function.slice(1).filter(i => i);
+  const parameters = value.function.slice(1).filter(Boolean);
   return `${aggregation}(${parameters.join(',')})`;
 }
 

static/app/views/alerts/rules/metric/details/metricChart.tsx

@@ -595,7 +595,7 @@ export function getMetricChartTooltipFormatter({
       `</div>`,
       '<div class="tooltip-arrow"></div>',
     ]
-      .filter(e => e)
+      .filter(Boolean)
       .join('');
   }
 

static/app/views/alerts/rules/metric/incompatibleAlertQuery.tsx

@@ -105,7 +105,7 @@ interface IncompatibleAlertQueryProps {
 export function IncompatibleAlertQuery(props: IncompatibleAlertQueryProps) {
   const [isOpen, setIsOpen] = useState(true);
   const incompatibleQuery = checkMetricAlertCompatiablity(props.eventView);
-  const totalErrors = Object.values(incompatibleQuery).filter(val => val).length;
+  const totalErrors = Object.values(incompatibleQuery).filter(Boolean).length;
 
   if (!totalErrors || !isOpen) {
     return null;

static/app/views/alerts/rules/metric/ruleForm.tsx

@@ -660,7 +660,7 @@ class RuleFormContainer extends DeprecatedAsyncComponent<Props, State> {
         !validRule && t('name'),
         !validRule && !validTriggers && t('and'),
         !validTriggers && t('critical threshold'),
-      ].filter(x => x);
+      ].filter(Boolean);
 
       addErrorMessage(t('Alert not valid: missing %s', missingFields.join(' ')));
       return false;

static/app/views/dashboards/dashboard.tsx

@@ -202,11 +202,7 @@ class Dashboard extends Component<Props, State> {
   fetchMemberList() {
     const {api, selection} = this.props;
     // Stores MemberList in MemberListStore for use in modals and sets state for use is child components
-    fetchOrgMembers(
-      api,
-      this.props.organization.slug,
-      selection.projects?.map(projectId => String(projectId))
-    );
+    fetchOrgMembers(api, this.props.organization.slug, selection.projects?.map(String));
   }
 
   async addNewWidget() {

static/app/views/dashboards/editAccessSelector.tsx

@@ -83,12 +83,7 @@ function EditAccessSelector({
     const selectedOptionsFromDashboard =
       !defined(dashboard.permissions) || dashboard.permissions.isEditableByEveryone
         ? ['_creator', '_allUsers', ...teamIdsList]
-        : [
-            '_creator',
-            ...(dashboard.permissions.teamsWithEditAccess?.map(teamId =>
-              String(teamId)
-            ) ?? []),
-          ];
+        : ['_creator', ...(dashboard.permissions.teamsWithEditAccess?.map(String) ?? [])];
     setSelectedOptions(selectedOptionsFromDashboard);
   }, [dashboard, teamsToRender, isMenuOpen]); // isMenuOpen dependency ensures perms are 'refreshed'
 

static/app/views/dashboards/widgetBuilder/components/queryFilterBuilder.tsx

@@ -96,7 +96,7 @@ function WidgetBuilderQueryFilterBuilder({
         const nextQueryConditionValidity = cloneDeep(queryConditionValidity);
         nextQueryConditionValidity[queryIndex] = validSearch;
         setQueryConditionValidity(nextQueryConditionValidity);
-        onQueryConditionChange(nextQueryConditionValidity.every(validity => validity));
+        onQueryConditionChange(nextQueryConditionValidity.every(Boolean));
         dispatch({
           type: BuilderStateAction.SET_QUERY,
           payload: state.query?.map((q, i) => (i === queryIndex ? field : q)) ?? [],
@@ -110,7 +110,7 @@ function WidgetBuilderQueryFilterBuilder({
     (queryIndex: number) => () => {
       queryConditionValidity.splice(queryIndex, 1);
       setQueryConditionValidity(queryConditionValidity);
-      onQueryConditionChange(queryConditionValidity.every(validity => validity));
+      onQueryConditionChange(queryConditionValidity.every(Boolean));
       dispatch({
         type: BuilderStateAction.SET_QUERY,
         payload: state.query?.filter((_, i) => i !== queryIndex) ?? [],

static/app/views/discover/queryList.tsx

@@ -100,7 +100,7 @@ class QueryList extends Component<Props> {
     }
     cards = cards.concat(this.renderSavedQueries());
 
-    if (cards.filter(x => x).length === 0) {
+    if (cards.filter(Boolean).length === 0) {
       return (
         <StyledEmptyStateWarning>
           <p>{t('No saved queries match that filter')}</p>

static/app/views/insights/common/queries/useSpanSamples.tsx

@@ -85,9 +85,7 @@ export const useSpanSamples = (options: Options) => {
     {
       search: MutableSearch.fromQueryObject({'span.group': groupId, ...filters}),
       yAxis: [`avg(${SPAN_SELF_TIME})`],
-      enabled: Object.values({'span.group': groupId, ...filters}).every(value =>
-        Boolean(value)
-      ),
+      enabled: Object.values({'span.group': groupId, ...filters}).every(Boolean),
     },
     'api.starfish.sidebar-span-metrics'
   );

static/app/views/insights/common/views/spanSummaryPage/sampleList/durationChart/index.tsx

@@ -90,9 +90,7 @@ function DurationChart({
     {
       search: MutableSearch.fromQueryObject({...filters, ...additionalFilters}),
       yAxis: [`avg(${SPAN_SELF_TIME})`],
-      enabled: Object.values({...filters, ...additionalFilters}).every(value =>
-        Boolean(value)
-      ),
+      enabled: Object.values({...filters, ...additionalFilters}).every(Boolean),
     },
     'api.starfish.sidebar-span-metrics-chart'
   );
@@ -101,7 +99,7 @@ function DurationChart({
     {
       search: MutableSearch.fromQueryObject(filters),
       fields: [`avg(${SPAN_SELF_TIME})`, SPAN_OP],
-      enabled: Object.values(filters).every(value => Boolean(value)),
+      enabled: Object.values(filters).every(Boolean),
     },
     'api.starfish.span-summary-panel-samples-table-avg'
   );

static/app/views/insights/common/views/spanSummaryPage/sampleList/sampleInfo/index.tsx

@@ -51,7 +51,7 @@ function SampleInfo(props: Props) {
         `avg(${SpanMetricsField.SPAN_SELF_TIME})`,
         'time_spent_percentage()',
       ],
-      enabled: Object.values(ribbonFilters).every(value => Boolean(value)),
+      enabled: Object.values(ribbonFilters).every(Boolean),
     },
     'api.starfish.span-summary-panel-metrics'
   );

static/app/views/insights/common/views/spanSummaryPage/sampleList/sampleTable/sampleTable.tsx

@@ -81,9 +81,7 @@ function SampleTable({
     {
       search: MutableSearch.fromQueryObject({...filters, ...additionalFilters}),
       fields: [`avg(${SPAN_SELF_TIME})`, SPAN_OP],
-      enabled: Object.values({...filters, ...additionalFilters}).every(value =>
-        Boolean(value)
-      ),
+      enabled: Object.values({...filters, ...additionalFilters}).every(Boolean),
     },
     'api.starfish.span-summary-panel-samples-table-avg'
   );

static/app/views/insights/database/queries/useDenylistedProjects.tsx

@@ -27,7 +27,7 @@ export function useDenylistedProjects(options: Options = {}) {
     .filter(project => {
       return !project.features.includes('span-metrics-extraction');
     })
-    .filter((item): item is NonNullable<typeof item> => Boolean(item));
+    .filter(Boolean);
 
   return {
     projects: denylistedProjects,

static/app/views/insights/database/queries/useOutdatedSDKProjects.tsx

@@ -39,7 +39,7 @@ export function useOutdatedSDKProjects(options?: Options) {
     .map(projectId => {
       return ProjectsStore.getById(projectId);
     })
-    .filter((item): item is NonNullable<typeof item> => Boolean(item));
+    .filter(Boolean);
 
   return {
     ...response,

static/app/views/integrationPipeline/awsLambdaFunctionSelect.tsx

@@ -70,7 +70,7 @@ export default class AwsLambdaFunctionSelect extends Component<Props, State> {
   get allStatesToggled() {
     // check if any of the lambda functions have a falsy value
     // no falsy values means everything is enabled
-    return Object.values(this.model.getData()).every(val => val);
+    return Object.values(this.model.getData()).every(Boolean);
   }
 
   get formFields() {

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

@@ -61,7 +61,7 @@ function ActionSet({
 
   const selectedIssues = [...issues]
     .map(issueId => GroupStore.get(issueId))
-    .filter(issue => issue) as BaseGroup[];
+    .filter(Boolean) as BaseGroup[];
 
   // Merges require multiple issues of a single project type
   const multipleIssueProjectsSelected = multiSelected && !selectedProjectSlug;

static/app/views/issueList/overview.tsx

@@ -688,7 +688,7 @@ function IssueListOverview({router}: Props) {
 
   // Fetch members on mount
   useEffect(() => {
-    const projectIds = selection.projects.map(projectId => String(projectId));
+    const projectIds = selection.projects.map(String);
 
     fetchOrgMembers(api, organization.slug, projectIds).then(members => {
       setMemberList(indexMembersByProject(members));
@@ -703,7 +703,7 @@ function IssueListOverview({router}: Props) {
       return;
     }
 
-    const projectIds = selection.projects.map(projectId => String(projectId));
+    const projectIds = selection.projects.map(String);
 
     fetchOrgMembers(api, organization.slug, projectIds).then(members => {
       setMemberList(indexMembersByProject(members));

static/app/views/projectDetail/charts/projectBaseEventsChart.tsx

@@ -53,7 +53,7 @@ class ProjectBaseEventsChart extends Component<Props> {
         query,
         dataset,
         environment: environments,
-        project: projects.map(proj => String(proj)),
+        project: projects.map(String),
         ...normalizeDateTimeParams(datetime),
       });
       onTotalValuesChange(totals);

static/app/views/projectDetail/projectScoreCards/projectApdexScoreCard.tsx

@@ -47,7 +47,7 @@ const useApdex = (props: Props) => {
 
   const commonQuery = {
     environment: environments,
-    project: projects.map(proj => String(proj)),
+    project: projects.map(String),
     field: ['apdex()'],
     query: ['event.type:transaction count():>0', query].join(' ').trim(),
   };

static/app/views/projectInstall/createProject.tsx

@@ -301,7 +301,7 @@ function CreateProject() {
     isMissingProjectName,
     isMissingAlertThreshold,
     isMissingMessagingIntegrationChannel,
-  ].filter(value => value).length;
+  ].filter(Boolean).length;
 
   const canSubmitForm = !inFlight && canUserCreateProject && formErrorCount === 0;
 

static/app/views/settings/organizationAuth/providerItem.tsx

@@ -87,7 +87,7 @@ function ProviderItem({provider, active, onConfigure}: Props) {
   return (
     <Feature
       {...featureProps}
-      features={[featureKey].filter(f => f)}
+      features={[featureKey].filter(Boolean)}
       renderDisabled={({children, ...props}) =>
         typeof children === 'function' &&
         // TODO(ts): the Feature component isn't correctly templatized to allow

static/app/views/settings/project/projectOwnership/modal.tsx

@@ -95,7 +95,7 @@ function OwnershipSuggestions({
       # {t('Here’s some suggestions based on this issue')}
       <br />
       {[pathSuggestion, urlSuggestion, transactionSuggestion]
-        .filter(x => x)
+        .filter(Boolean)
         .map(suggestion => (
           <Fragment key={suggestion}>
             {suggestion}

static/app/views/settings/project/projectOwnership/ownerInput.tsx

@@ -97,8 +97,8 @@ class OwnerInput extends Component<Props, State> {
           page,
           organization,
           net_change:
-            (text?.split('\n').filter(x => x).length ?? 0) -
-            initialText.split('\n').filter(x => x).length,
+            (text?.split('\n').filter(Boolean).length ?? 0) -
+            initialText.split('\n').filter(Boolean).length,
         });
       })
       .catch(error => {

static/gsAdmin/components/customers/customerOverview.tsx

@@ -81,7 +81,7 @@ function SoftCapTypeDetail({
       }
       return null;
     })
-    .filter(i => i);
+    .filter(Boolean);
   return <Fragment>{softCapTypes.length ? softCapTypes : <span>None</span>}</Fragment>;
 }
 

static/gsAdmin/components/debounceSearch.tsx

@@ -58,7 +58,7 @@ function DebounceSearch({
       if (value) {
         try {
           const queryParams = {
-            query: [queryParam, value].filter(v => v).join(':'),
+            query: [queryParam, value].filter(Boolean).join(':'),
             per_page: 10,
           };
           const results = await api.requestPromise(path, {

static/gsApp/components/gsBanner.tsx

@@ -893,11 +893,11 @@ class GSBanner extends Component<Props, State> {
     if (!subscription.canSelfServe) {
       return null;
     }
-    if (Object.values(this.overageAlertActive).some(a => a)) {
+    if (Object.values(this.overageAlertActive).some(Boolean)) {
       return 'critical';
     }
 
-    if (Object.values(this.overageWarningActive).some(a => a)) {
+    if (Object.values(this.overageWarningActive).some(Boolean)) {
       return 'warning';
     }
     return null;
@@ -1354,7 +1354,7 @@ class GSBanner extends Component<Props, State> {
           />
         ) : null;
       })
-      .filter((node: any) => node);
+      .filter(Boolean);
   }
 
   render() {