ref(tsc) fix no implicit any (#82825)

Fixes a couple instances where we were relying on implicit any

static/app/__mocks__/react-lazyload.tsx

@@ -4,7 +4,7 @@
  * These mocks are simple no-ops to make testing lazy-loaded components simpler.
  */
 
-const LazyLoad = ({children}) => children;
+const LazyLoad = ({children}: {children: React.ReactNode}) => children;
 
 export const forceCheck = jest.fn();
 

static/app/actionCreators/modal.tsx

@@ -1,12 +1,15 @@
 import type {Location} from 'history';
 
 import type {ModalTypes} from 'sentry/components/globalModal';
+import type {AddToDashboardModalProps as CreateDashboardFromMetricsModalProps} from 'sentry/components/modals/createDashboardFromMetricsModal';
 import type {CreateNewIntegrationModalOptions} from 'sentry/components/modals/createNewIntegrationModal';
 import type {CreateReleaseIntegrationModalOptions} from 'sentry/components/modals/createReleaseIntegrationModal';
 import type {DashboardWidgetQuerySelectorModalOptions} from 'sentry/components/modals/dashboardWidgetQuerySelectorModal';
+import type {ImportDashboardFromFileModalProps} from 'sentry/components/modals/importDashboardFromFileModal';
 import type {InsightChartModalOptions} from 'sentry/components/modals/insightChartModal';
 import type {InviteRow} from 'sentry/components/modals/inviteMembersModal/types';
 import type {ReprocessEventModalOptions} from 'sentry/components/modals/reprocessEventModal';
+import type {AddToDashboardModalProps} from 'sentry/components/modals/widgetBuilder/addToDashboardModal';
 import type {OverwriteWidgetModalProps} from 'sentry/components/modals/widgetBuilder/overwriteWidgetModal';
 import type {WidgetViewerModalOptions} from 'sentry/components/modals/widgetViewerModal';
 import type {Category} from 'sentry/components/platformPicker';
@@ -245,7 +248,7 @@ export async function openWidgetBuilderOverwriteModal(
   });
 }
 
-export async function openAddToDashboardModal(options) {
+export async function openAddToDashboardModal(options: AddToDashboardModalProps) {
   const mod = await import('sentry/components/modals/widgetBuilder/addToDashboardModal');
   const {default: Modal, modalCss} = mod;
 
@@ -255,7 +258,9 @@ export async function openAddToDashboardModal(options) {
   });
 }
 
-export async function openImportDashboardFromFileModal(options) {
+export async function openImportDashboardFromFileModal(
+  options: ImportDashboardFromFileModalProps
+) {
   const mod = await import('sentry/components/modals/importDashboardFromFileModal');
   const {default: Modal, modalCss} = mod;
 
@@ -265,7 +270,9 @@ export async function openImportDashboardFromFileModal(options) {
   });
 }
 
-export async function openCreateDashboardFromMetrics(options) {
+export async function openCreateDashboardFromMetrics(
+  options: CreateDashboardFromMetricsModalProps
+) {
   const mod = await import('sentry/components/modals/createDashboardFromMetricsModal');
   const {default: Modal, modalCss} = mod;
 

static/app/actionCreators/organization.tsx

@@ -21,6 +21,7 @@ import {
 } from 'sentry/utils/featureFlags';
 import {getPreloadedDataPromise} from 'sentry/utils/getPreloadedData';
 import parseLinkHeader from 'sentry/utils/parseLinkHeader';
+import type RequestError from 'sentry/utils/requestError/requestError';
 
 async function fetchOrg(
   api: Client,
@@ -143,7 +144,7 @@ export function fetchOrganizationDetails(
     PageFiltersStore.onReset();
   }
 
-  const getErrorMessage = err => {
+  const getErrorMessage = (err: RequestError) => {
     if (typeof err.responseJSON?.detail === 'string') {
       return err.responseJSON?.detail;
     }

static/app/actionCreators/repositories.spec.tsx

@@ -7,7 +7,7 @@ describe('RepositoryActionCreator', function () {
 
   const api = new MockApiClient();
   const mockData = [{id: '1'}];
-  let mockResponse;
+  let mockResponse: jest.Mock;
 
   beforeEach(() => {
     MockApiClient.clearMockResponses();

static/app/api.spec.tsx

@@ -1,5 +1,6 @@
 import {OrganizationFixture} from 'sentry-fixture/organization';
 
+import type {Client, ResponseMeta} from 'sentry/api';
 import {isSimilarOrigin, Request, resolveHostname} from 'sentry/api';
 import {PROJECT_MOVED} from 'sentry/constants/apiErrorCodes';
 
@@ -9,7 +10,7 @@ import OrganizationStore from './stores/organizationStore';
 jest.unmock('sentry/api');
 
 describe('api', function () {
-  let api;
+  let api: Client;
 
   beforeEach(function () {
     api = new MockApiClient();
@@ -41,7 +42,9 @@ describe('api', function () {
 
   it('does not call success callback if 302 was returned because of a project slug change', function () {
     const successCb = jest.fn();
-    api.activeRequests = {id: {alive: true}};
+    api.activeRequests = {
+      id: {alive: true, requestPromise: new Promise(() => null), cancel: jest.fn()},
+    };
     api.wrapCallback(
       'id',
       successCb
@@ -60,9 +63,9 @@ describe('api', function () {
   });
 
   it('handles error callback', function () {
-    jest.spyOn(api, 'wrapCallback').mockImplementation((_id, func) => func);
+    jest.spyOn(api, 'wrapCallback').mockImplementation((_id: string, func: any) => func);
     const errorCb = jest.fn();
-    const args = ['test', true, 1];
+    const args = ['test', true, 1] as unknown as [ResponseMeta, string, string];
     api.handleRequestError(
       {
         id: 'test',
@@ -83,15 +86,18 @@ describe('api', function () {
           path: 'test',
           requestOptions: {},
         },
-        {},
-        {}
+        {} as ResponseMeta,
+        '',
+        'test'
       )
     ).not.toThrow();
   });
 });
 
 describe('resolveHostname', function () {
-  let devUi, location, configstate;
+  let devUi: boolean | undefined;
+  let location: Location;
+  let configstate: ReturnType<typeof ConfigStore.getState>;
 
   const controlPath = '/api/0/broadcasts/';
   const regionPath = '/api/0/organizations/slug/issues/';
@@ -103,7 +109,7 @@ describe('resolveHostname', function () {
 
     ConfigStore.loadInitialData({
       ...configstate,
-      features: ['system:multi-region'],
+      features: new Set(['system:multi-region']),
       links: {
         organizationUrl: 'https://acme.sentry.io',
         sentryUrl: 'https://sentry.io',
@@ -122,7 +128,7 @@ describe('resolveHostname', function () {
     ConfigStore.loadInitialData({
       ...configstate,
       // Remove the feature flag
-      features: [],
+      features: new Set(),
     });
 
     let result = resolveHostname(controlPath);

static/app/bootstrap/exportGlobals.tsx

@@ -5,7 +5,7 @@ import moment from 'moment-timezone';
 
 import plugins from 'sentry/plugins';
 
-const globals = {
+const globals: Record<string, any> = {
   // The following globals are used in sentry-plugins webpack externals
   // configuration.
   React,
@@ -43,6 +43,11 @@ const SentryApp = {
 };
 
 globals.SentryApp = SentryApp;
-Object.keys(globals).forEach(name => (window[name] = globals[name]));
+Object.keys(globals).forEach(name => {
+  Object.defineProperty(window, name, {
+    value: globals[name],
+    writable: true,
+  });
+});
 
 export {globals as exportedGlobals};

static/app/bootstrap/initializeSdk.spec.tsx

@@ -9,7 +9,7 @@ import {
   isFilteredRequestErrorEvent,
 } from './initializeSdk';
 
-const ERROR_MAP = {
+const ERROR_MAP: Record<number, string | undefined> = {
   ...origErrorMap,
   // remove `UndefinedResponseBodyError` since we don't filter those
   200: undefined,

static/app/chartcuterie/discover.tsx

@@ -60,10 +60,12 @@ discoverCharts.push({
         AreaSeries({
           name: s.key,
           stack: 'area',
-          data: s.data.map(([timestamp, countsForTimestamp]) => [
-            timestamp * 1000,
-            countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
-          ]),
+          data: s.data.map(
+            ([timestamp, countsForTimestamp]: [number, {count: number}[]]) => [
+              timestamp * 1000,
+              countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
+            ]
+          ),
           lineStyle: {color: color?.[i], opacity: 1, width: 0.4},
           areaStyle: {color: color?.[i], opacity: 1},
         })
@@ -121,12 +123,14 @@ discoverCharts.push({
         BarSeries({
           name: s.key,
           stack: 'area',
-          data: s.data.map(([timestamp, countsForTimestamp]) => ({
-            value: [
-              timestamp * 1000,
-              countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
-            ],
-          })),
+          data: s.data.map(
+            ([timestamp, countsForTimestamp]: [number, {count: number}[]]) => ({
+              value: [
+                timestamp * 1000,
+                countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
+              ],
+            })
+          ),
           itemStyle: {color: color?.[i], opacity: 1},
         })
       );
@@ -179,10 +183,12 @@ discoverCharts.push({
       .map((topSeries, i) =>
         AreaSeries({
           stack: 'area',
-          data: topSeries.data.map(([timestamp, countsForTimestamp]) => [
-            timestamp * 1000,
-            countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
-          ]),
+          data: topSeries.data.map(
+            ([timestamp, countsForTimestamp]: [number, {count: number}[]]) => [
+              timestamp * 1000,
+              countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
+            ]
+          ),
           lineStyle: {color: color?.[i], opacity: 1, width: 0.4},
           areaStyle: {color: color?.[i], opacity: 1},
         })
@@ -235,10 +241,12 @@ discoverCharts.push({
       .sort((a, b) => (a.order ?? 0) - (b.order ?? 0))
       .map((topSeries, i) =>
         LineSeries({
-          data: topSeries.data.map(([timestamp, countsForTimestamp]) => [
-            timestamp * 1000,
-            countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
-          ]),
+          data: topSeries.data.map(
+            ([timestamp, countsForTimestamp]: [number, {count: number}[]]) => [
+              timestamp * 1000,
+              countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
+            ]
+          ),
           lineStyle: {color: color?.[i], opacity: 1},
           itemStyle: {color: color?.[i]},
         })
@@ -292,10 +300,12 @@ discoverCharts.push({
       .map((topSeries, i) =>
         BarSeries({
           stack: 'area',
-          data: topSeries.data.map(([timestamp, countsForTimestamp]) => [
-            timestamp * 1000,
-            countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
-          ]),
+          data: topSeries.data.map(
+            ([timestamp, countsForTimestamp]: [number, {count: number}[]]) => [
+              timestamp * 1000,
+              countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
+            ]
+          ),
           itemStyle: {color: color?.[i], opacity: 1},
         })
       );
@@ -372,7 +382,7 @@ discoverCharts.push({
             stack: 'area',
             data: s.data
               .slice(dataMiddleIndex)
-              .map(([timestamp, countsForTimestamp]) => [
+              .map(([timestamp, countsForTimestamp]: [number, {count: number}[]]) => [
                 timestamp * 1000,
                 countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
               ]),
@@ -384,10 +394,12 @@ discoverCharts.push({
           LineSeries({
             name: t('previous %s', s.key),
             stack: 'previous',
-            data: previous.map(([_, countsForTimestamp], index) => [
-              current[index][0] * 1000,
-              countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
-            ]),
+            data: previous.map(
+              ([_, countsForTimestamp]: [number, {count: number}[]], index: number) => [
+                current[index][0] * 1000,
+                countsForTimestamp.reduce((acc, {count}) => acc + count, 0),
+              ]
+            ),
             lineStyle: {color: previousPeriodColor?.[i], type: 'dotted'},
             itemStyle: {color: previousPeriodColor?.[i]},
           })

static/app/components/acl/feature.spec.tsx

@@ -285,7 +285,7 @@ describe('Feature', function () {
   });
 
   describe('using HookStore for renderDisabled', function () {
-    let hookFn;
+    let hookFn: jest.Mock;
 
     beforeEach(function () {
       hookFn = jest.fn(() => null);

static/app/components/acl/featureDisabledModal.spec.tsx

@@ -1,4 +1,4 @@
-import type {ComponentProps} from 'react';
+import type {ComponentProps, PropsWithChildren} from 'react';
 import styled from '@emotion/styled';
 
 import {render, screen} from 'sentry-test/reactTestingLibrary';
@@ -8,7 +8,7 @@ import ModalStore from 'sentry/stores/modalStore';
 
 describe('FeatureTourModal', function () {
   const onCloseModal = jest.fn();
-  const styledWrapper = styled(c => c.children);
+  const styledWrapper = styled((c: PropsWithChildren) => c.children);
   const renderComponent = (
     props: Partial<ComponentProps<typeof FeatureDisabledModal>> = {}
   ) =>

static/app/components/activity/note/input.tsx

@@ -132,15 +132,15 @@ function NoteInput({
   );
 
   const handleChange: MentionsInputProps['onChange'] = useCallback(
-    e => {
+    (e: MentionChangeEvent) => {
       setValue(e.target.value);
       onChange?.(e, {updating: existingItem});
     },
     [existingItem, onChange]
   );
 
   const handleKeyDown: MentionsInputProps['onKeyDown'] = useCallback(
-    e => {
+    (e: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {
       // Auto submit the form on [meta,ctrl] + Enter
       if (e.key === 'Enter' && (e.metaKey || e.ctrlKey) && canSubmit) {
         submitForm();

static/app/components/avatarUploader.tsx

@@ -219,7 +219,7 @@ class AvatarUploader extends Component<Props, State> {
 
     // Normalize diff across dimensions so that negative diffs are always making
     // the cropper smaller and positive ones are making the cropper larger
-    const helpers = {
+    const helpers: Record<string, (yDiff: number, xDiff: number) => number> = {
       getDiffNE,
       getDiffNW,
       getDiffSE,

static/app/components/charts/barChartZoom.tsx

@@ -3,7 +3,11 @@ import type {Location} from 'history';
 
 import DataZoomInside from 'sentry/components/charts/components/dataZoomInside';
 import ToolBox from 'sentry/components/charts/components/toolBox';
-import type {EChartChartReadyHandler, EChartDataZoomHandler} from 'sentry/types/echarts';
+import type {
+  EChartChartReadyHandler,
+  EChartDataZoomHandler,
+  ECharts,
+} from 'sentry/types/echarts';
 import {browserHistory} from 'sentry/utils/browserHistory';
 
 type RenderProps = {
@@ -69,7 +73,7 @@ class BarChartZoom extends Component<Props> {
   /**
    * Enable zoom immediately instead of having to toggle to zoom
    */
-  handleChartReady = chart => {
+  handleChartReady = (chart: ECharts) => {
     this.props.onChartReady?.(chart);
   };