diff --git a/build-utils/sentry-instrumentation.ts b/build-utils/sentry-instrumentation.ts index b680f98a34b263..ae502acd76f044 100644 --- a/build-utils/sentry-instrumentation.ts +++ b/build-utils/sentry-instrumentation.ts @@ -71,7 +71,7 @@ class SentryInstrumentation { sentry.setTag('arch', os.arch()); sentry.setTag( 'cpu', - cpus?.length ? `${cpus[0].model} (cores: ${cpus.length})}` : 'N/A' + cpus?.length ? `${cpus[0]!.model} (cores: ${cpus.length})}` : 'N/A' ); this.Sentry = sentry; @@ -96,7 +96,7 @@ class SentryInstrumentation { .filter(assetName => !assetName.endsWith('.map')) .forEach(assetName => { const asset = compilation.assets[assetName]; - const size = asset.size(); + const size = asset!.size(); const file = assetName; const body = JSON.stringify({ file, diff --git a/eslint.config.mjs b/eslint.config.mjs index cb696a686f424b..21e227016f2ced 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -779,6 +779,7 @@ export default typescript.config([ // corresponding configuration object where the plugin is initially included plugins: { ...react.configs.flat.plugins, + // @ts-ignore noUncheckedIndexedAccess ...react.configs.flat['jsx-runtime'].plugins, '@typescript-eslint': typescript.plugin, 'react-hooks': fixupPluginRules(reactHooks), diff --git a/static/app/actionCreators/dashboards.tsx b/static/app/actionCreators/dashboards.tsx index 846145e26b331c..3c7a6c902bde9b 100644 --- a/static/app/actionCreators/dashboards.tsx +++ b/static/app/actionCreators/dashboards.tsx @@ -27,7 +27,7 @@ export function fetchDashboards(api: Client, orgSlug: string) { if (errorResponse) { const errors = flattenErrors(errorResponse, {}); - addErrorMessage(errors[Object.keys(errors)[0]] as string); + addErrorMessage(errors[Object.keys(errors)[0]!] as string); } else { addErrorMessage(t('Unable to fetch dashboards')); } @@ -73,7 +73,7 @@ export function createDashboard( if (errorResponse) { const errors = flattenErrors(errorResponse, {}); - addErrorMessage(errors[Object.keys(errors)[0]] as string); + addErrorMessage(errors[Object.keys(errors)[0]!] as string); } else { addErrorMessage(t('Unable to create dashboard')); } @@ -118,7 +118,7 @@ export async function updateDashboardFavorite( const errorResponse = response?.responseJSON ?? null; if (errorResponse) { const errors = flattenErrors(errorResponse, {}); - addErrorMessage(errors[Object.keys(errors)[0]] as string); + addErrorMessage(errors[Object.keys(errors)[0]!]! as string); } else if (isFavorited) { addErrorMessage(t('Unable to favorite dashboard')); } else { @@ -145,7 +145,7 @@ export function fetchDashboard( if (errorResponse) { const errors = flattenErrors(errorResponse, {}); - addErrorMessage(errors[Object.keys(errors)[0]] as string); + addErrorMessage(errors[Object.keys(errors)[0]!] as string); } else { addErrorMessage(t('Unable to load dashboard')); } @@ -192,7 +192,7 @@ export function updateDashboard( if (errorResponse) { const errors = flattenErrors(errorResponse, {}); - addErrorMessage(errors[Object.keys(errors)[0]] as string); + addErrorMessage(errors[Object.keys(errors)[0]!] as string); } else { addErrorMessage(t('Unable to update dashboard')); } @@ -218,7 +218,7 @@ export function deleteDashboard( if (errorResponse) { const errors = flattenErrors(errorResponse, {}); - addErrorMessage(errors[Object.keys(errors)[0]] as string); + addErrorMessage(errors[Object.keys(errors)[0]!] as string); } else { addErrorMessage(t('Unable to delete dashboard')); } @@ -270,7 +270,7 @@ export function updateDashboardPermissions( if (errorResponse) { const errors = flattenErrors(errorResponse, {}); - addErrorMessage(errors[Object.keys(errors)[0]] as string); + addErrorMessage(errors[Object.keys(errors)[0]!]! as string); } else { addErrorMessage(t('Unable to update dashboard permissions')); } diff --git a/static/app/actionCreators/members.tsx b/static/app/actionCreators/members.tsx index 61bf7ef0ff92ed..27b48e37389a9e 100644 --- a/static/app/actionCreators/members.tsx +++ b/static/app/actionCreators/members.tsx @@ -67,7 +67,7 @@ export function indexMembersByProject(members: Member[]): IndexedMembersByProjec acc[project] = []; } if (member.user) { - acc[project].push(member.user); + acc[project]!.push(member.user); } } return acc; diff --git a/static/app/actionCreators/monitors.tsx b/static/app/actionCreators/monitors.tsx index 400dcaa98654c7..0a98c36450abad 100644 --- a/static/app/actionCreators/monitors.tsx +++ b/static/app/actionCreators/monitors.tsx @@ -70,7 +70,7 @@ export async function updateMonitor( // If we are updating a single value in the monitor we can read the // validation error for that key, otherwise fallback to the default error const validationError = - updateKeys.length === 1 ? respError.responseJSON?.[updateKeys[0]]?.[0] : undefined; + updateKeys.length === 1 ? respError.responseJSON?.[updateKeys[0]!]?.[0] : undefined; logException(err); addErrorMessage(validationError ?? t('Unable to update monitor.')); diff --git a/static/app/actionCreators/organizations.tsx b/static/app/actionCreators/organizations.tsx index b26bec04438edf..49e6b9d2f15758 100644 --- a/static/app/actionCreators/organizations.tsx +++ b/static/app/actionCreators/organizations.tsx @@ -45,7 +45,7 @@ export function redirectToRemainingOrganization({ } // Let's be smart and select the best org to redirect to - const firstRemainingOrg = allOrgs[0]; + const firstRemainingOrg = allOrgs[0]!; const route = `/organizations/${firstRemainingOrg.slug}/issues/`; if (USING_CUSTOMER_DOMAIN) { diff --git a/static/app/actionCreators/pageFilters.tsx b/static/app/actionCreators/pageFilters.tsx index 54783e899fcbb2..ecd873d685661f 100644 --- a/static/app/actionCreators/pageFilters.tsx +++ b/static/app/actionCreators/pageFilters.tsx @@ -319,7 +319,7 @@ export function initializeUrlState({ if (projects && projects.length > 0) { // If there is a list of projects from URL params, select first project // from that list - newProject = typeof projects === 'string' ? [Number(projects)] : [projects[0]]; + newProject = typeof projects === 'string' ? [Number(projects)] : [projects[0]!]; } else { // When we have finished loading the organization into the props, i.e. // the organization slug is consistent with the URL param--Sentry will diff --git a/static/app/actionCreators/projects.spec.tsx b/static/app/actionCreators/projects.spec.tsx index 6b3f3e3cb79b1f..c7eef90e1537de 100644 --- a/static/app/actionCreators/projects.spec.tsx +++ b/static/app/actionCreators/projects.spec.tsx @@ -14,7 +14,7 @@ describe('Projects ActionCreators', function () { expect(mock).not.toHaveBeenCalled(); _debouncedLoadStats(api, new Set([...Array(50)].map((_, i) => String(i))), { - projectId: project.id, + projectId: project!.id, orgId: organization.slug, }); @@ -38,7 +38,7 @@ describe('Projects ActionCreators', function () { expect(mock).not.toHaveBeenCalled(); _debouncedLoadStats(api, new Set(['1', '2', '3']), { - projectId: project.id, + projectId: project!.id, orgId: organization.slug, query: {transactionStats: '1'}, }); diff --git a/static/app/bootstrap/initializeSdk.tsx b/static/app/bootstrap/initializeSdk.tsx index f51a4b58835f36..222fda527d0715 100644 --- a/static/app/bootstrap/initializeSdk.tsx +++ b/static/app/bootstrap/initializeSdk.tsx @@ -217,7 +217,7 @@ export function initializeSdk(config: Config) { images.push({ type: 'sourcemap', code_file: filename, - debug_id: debugIdMap[filename], + debug_id: debugIdMap[filename]!, }); }); } catch (e) { @@ -310,7 +310,7 @@ function handlePossibleUndefinedResponseBodyErrors(event: Event): void { const causeErrorIsURBE = causeError?.type === 'UndefinedResponseBodyError'; if (mainErrorIsURBE || causeErrorIsURBE) { - mainError.type = 'UndefinedResponseBodyError'; + mainError!.type = 'UndefinedResponseBodyError'; event.tags = {...event.tags, undefinedResponseBody: true}; event.fingerprint = mainErrorIsURBE ? ['UndefinedResponseBodyError as main error'] @@ -319,7 +319,7 @@ function handlePossibleUndefinedResponseBodyErrors(event: Event): void { } export function addEndpointTagToRequestError(event: Event): void { - const errorMessage = event.exception?.values?.[0].value || ''; + const errorMessage = event.exception?.values?.[0]!.value || ''; // The capturing group here turns `GET /dogs/are/great 500` into just `GET /dogs/are/great` const requestErrorRegex = new RegExp('^([A-Za-z]+ (/[^/]+)+/) \\d+$'); diff --git a/static/app/chartcuterie/discover.tsx b/static/app/chartcuterie/discover.tsx index 50959c108139fa..13ec672ac75ad9 100644 --- a/static/app/chartcuterie/discover.tsx +++ b/static/app/chartcuterie/discover.tsx @@ -336,7 +336,7 @@ discoverCharts.push({ const previousPeriod = LineSeries({ name: t('previous %s', data.seriesName), data: previous.map(([_, countsForTimestamp], i) => [ - current[i][0] * 1000, + current[i]![0] * 1000, countsForTimestamp.reduce((acc, {count}) => acc + count, 0), ]), lineStyle: {color: theme.gray200, type: 'dotted'}, diff --git a/static/app/components/acl/feature.tsx b/static/app/components/acl/feature.tsx index 83547b2d78acbe..77a3f5b91061a0 100644 --- a/static/app/components/acl/feature.tsx +++ b/static/app/components/acl/feature.tsx @@ -141,12 +141,12 @@ class Feature extends Component { const shouldMatchOnlyProject = feature.match(/^projects:(.+)/); if (shouldMatchOnlyProject) { - return project.includes(shouldMatchOnlyProject[1]); + return project.includes(shouldMatchOnlyProject[1]!); } const shouldMatchOnlyOrg = feature.match(/^organizations:(.+)/); if (shouldMatchOnlyOrg) { - return organization.includes(shouldMatchOnlyOrg[1]); + return organization.includes(shouldMatchOnlyOrg[1]!); } // default, check all feature arrays @@ -186,7 +186,7 @@ class Feature extends Component { const hooks = HookStore.get(hookName); if (hooks.length > 0) { - customDisabledRender = hooks[0]; + customDisabledRender = hooks[0]!; } } const renderProps = { diff --git a/static/app/components/arithmeticInput/parser.tsx b/static/app/components/arithmeticInput/parser.tsx index 1c22966f4837ba..c73635d051f99f 100644 --- a/static/app/components/arithmeticInput/parser.tsx +++ b/static/app/components/arithmeticInput/parser.tsx @@ -54,7 +54,7 @@ export class TokenConverter { tokenTerm = (maybeFactor: Expression, remainingAdds: Array): Expression => { if (remainingAdds.length > 0) { - remainingAdds[0].lhs = maybeFactor; + remainingAdds[0]!.lhs = maybeFactor; return flatten(remainingAdds); } return maybeFactor; @@ -75,7 +75,7 @@ export class TokenConverter { }; tokenFactor = (primary: Expression, remaining: Array): Operation => { - remaining[0].lhs = primary; + remaining[0]!.lhs = primary; return flatten(remaining); }; diff --git a/static/app/components/assigneeBadge.stories.tsx b/static/app/components/assigneeBadge.stories.tsx index 3786ba961aaf48..d087d6e37455f4 100644 --- a/static/app/components/assigneeBadge.stories.tsx +++ b/static/app/components/assigneeBadge.stories.tsx @@ -42,7 +42,7 @@ export default storyBook('AssigneeBadge', story => { const [chevron2Toggle, setChevron2Toggle] = useState<'up' | 'down'>('down'); const team: Team = teams.length - ? teams[0] + ? teams[0]! : { id: '1', slug: 'team-slug', diff --git a/static/app/components/assigneeSelectorDropdown.spec.tsx b/static/app/components/assigneeSelectorDropdown.spec.tsx index 675aef098928c5..8c28fb3c99255b 100644 --- a/static/app/components/assigneeSelectorDropdown.spec.tsx +++ b/static/app/components/assigneeSelectorDropdown.spec.tsx @@ -572,7 +572,7 @@ describe('AssigneeSelectorDropdown', () => { // Suggested assignee initials expect(options[0]).toHaveTextContent('AB'); - await userEvent.click(options[0]); + await userEvent.click(options[0]!); await waitFor(() => expect(assignGroup2Mock).toHaveBeenCalledWith( diff --git a/static/app/components/assigneeSelectorDropdown.tsx b/static/app/components/assigneeSelectorDropdown.tsx index 3198df4a31a9d7..0615ae973d26e7 100644 --- a/static/app/components/assigneeSelectorDropdown.tsx +++ b/static/app/components/assigneeSelectorDropdown.tsx @@ -155,6 +155,7 @@ export function AssigneeAvatar({ } if (suggestedActors.length > 0) { + const actor = suggestedActors[0]!; return (
{tct('Suggestion: [name]', { - name: - suggestedActors[0].type === 'team' - ? `#${suggestedActors[0].name}` - : suggestedActors[0].name, + name: actor.type === 'team' ? `#${actor.name}` : actor.name, })} {suggestedActors.length > 1 && tn(' + %s other', ' + %s others', suggestedActors.length - 1)}
- - {suggestedReasons[suggestedActors[0].suggestedReason]} - + {suggestedReasons[actor.suggestedReason]} } /> @@ -265,7 +261,10 @@ export default function AssigneeSelectorDropdown({ const uniqueSuggestions = uniqBy(suggestedOwners, owner => owner.owner); return uniqueSuggestions .map(suggestion => { - const [suggestionType, suggestionId] = suggestion.owner.split(':'); + const [suggestionType, suggestionId] = suggestion.owner.split(':') as [ + string, + string, + ]; const suggestedReasonText = suggestedReasonTable[suggestion.type]; if (suggestionType === 'user') { const member = currentMemberList.find(user => user.id === suggestionId); @@ -322,7 +321,7 @@ export default function AssigneeSelectorDropdown({ } // See makeMemberOption and makeTeamOption for how the value is formatted const type = selectedOption.value.startsWith('user:') ? 'user' : 'team'; - const assigneeId = selectedOption.value.split(':')[1]; + const assigneeId = selectedOption.value.split(':')[1]!; let assignee: User | Actor; if (type === 'user') { diff --git a/static/app/components/assistant/guideAnchor.tsx b/static/app/components/assistant/guideAnchor.tsx index f5b9900c65c25d..efbd244f529460 100644 --- a/static/app/components/assistant/guideAnchor.tsx +++ b/static/app/components/assistant/guideAnchor.tsx @@ -155,7 +155,7 @@ class BaseGuideAnchor extends Component { const totalStepCount = currentGuide.steps.length; const currentStepCount = step + 1; - const currentStep = currentGuide.steps[step]; + const currentStep = currentGuide.steps[step]!; const lastStep = currentStepCount === totalStepCount; const hasManySteps = totalStepCount > 1; diff --git a/static/app/components/autoComplete.spec.tsx b/static/app/components/autoComplete.spec.tsx index b92558de4ae0d2..fb87a2fe581697 100644 --- a/static/app/components/autoComplete.spec.tsx +++ b/static/app/components/autoComplete.spec.tsx @@ -216,7 +216,7 @@ describe('AutoComplete', function () { expect(screen.getByTestId('test-autocomplete')).toBeInTheDocument(); expect(screen.getAllByRole('option')).toHaveLength(3); - fireEvent.click(screen.getByText(items[1].name)); + fireEvent.click(screen.getByText(items[1]!.name)); expect(mocks.onSelect).toHaveBeenCalledWith( items[1], expect.objectContaining({inputValue: '', highlightedIndex: 0}), @@ -419,7 +419,7 @@ describe('AutoComplete', function () { createWrapper({isOpen: true}); expect(screen.getAllByRole('option')).toHaveLength(3); - fireEvent.click(screen.getByText(items[1].name)); + fireEvent.click(screen.getByText(items[1]!.name)); expect(mocks.onSelect).toHaveBeenCalledWith( items[1], expect.objectContaining({inputValue: '', highlightedIndex: 0}), diff --git a/static/app/components/avatar/avatarList.spec.tsx b/static/app/components/avatar/avatarList.spec.tsx index 9d8046e23da216..3e6adb97006c43 100644 --- a/static/app/components/avatar/avatarList.spec.tsx +++ b/static/app/components/avatar/avatarList.spec.tsx @@ -42,12 +42,12 @@ describe('AvatarList', () => { ]; renderComponent({users}); - expect(screen.getByText(users[0].name.charAt(0))).toBeInTheDocument(); - expect(screen.getByText(users[1].name.charAt(0))).toBeInTheDocument(); - expect(screen.getByText(users[2].name.charAt(0))).toBeInTheDocument(); - expect(screen.getByText(users[3].name.charAt(0))).toBeInTheDocument(); - expect(screen.getByText(users[4].name.charAt(0))).toBeInTheDocument(); - expect(screen.getByText(users[5].name.charAt(0))).toBeInTheDocument(); + expect(screen.getByText(users[0]!.name.charAt(0))).toBeInTheDocument(); + expect(screen.getByText(users[1]!.name.charAt(0))).toBeInTheDocument(); + expect(screen.getByText(users[2]!.name.charAt(0))).toBeInTheDocument(); + expect(screen.getByText(users[3]!.name.charAt(0))).toBeInTheDocument(); + expect(screen.getByText(users[4]!.name.charAt(0))).toBeInTheDocument(); + expect(screen.getByText(users[5]!.name.charAt(0))).toBeInTheDocument(); expect(screen.queryByTestId('avatarList-collapsedavatars')).not.toBeInTheDocument(); }); @@ -63,12 +63,12 @@ describe('AvatarList', () => { ]; renderComponent({users}); - expect(screen.getByText(users[0].name.charAt(0))).toBeInTheDocument(); - expect(screen.getByText(users[1].name.charAt(0))).toBeInTheDocument(); - expect(screen.getByText(users[2].name.charAt(0))).toBeInTheDocument(); - expect(screen.getByText(users[3].name.charAt(0))).toBeInTheDocument(); - expect(screen.getByText(users[4].name.charAt(0))).toBeInTheDocument(); - expect(screen.queryByText(users[5].name.charAt(0))).not.toBeInTheDocument(); + expect(screen.getByText(users[0]!.name.charAt(0))).toBeInTheDocument(); + expect(screen.getByText(users[1]!.name.charAt(0))).toBeInTheDocument(); + expect(screen.getByText(users[2]!.name.charAt(0))).toBeInTheDocument(); + expect(screen.getByText(users[3]!.name.charAt(0))).toBeInTheDocument(); + expect(screen.getByText(users[4]!.name.charAt(0))).toBeInTheDocument(); + expect(screen.queryByText(users[5]!.name.charAt(0))).not.toBeInTheDocument(); expect(screen.getByTestId('avatarList-collapsedavatars')).toBeInTheDocument(); }); diff --git a/static/app/components/avatar/avatarList.tsx b/static/app/components/avatar/avatarList.tsx index df9932016668b3..e6234e62fd611f 100644 --- a/static/app/components/avatar/avatarList.tsx +++ b/static/app/components/avatar/avatarList.tsx @@ -69,9 +69,9 @@ function AvatarList({ if (numCollapsedAvatars === 1) { if (visibleTeamAvatars.length < teams.length) { - visibleTeamAvatars.unshift(teams[teams.length - 1]); + visibleTeamAvatars.unshift(teams[teams.length - 1]!); } else if (visibleUserAvatars.length < users.length) { - visibleUserAvatars.unshift(users[users.length - 1]); + visibleUserAvatars.unshift(users[users.length - 1]!); } numCollapsedAvatars = 0; } diff --git a/static/app/components/avatar/index.spec.tsx b/static/app/components/avatar/index.spec.tsx index 4959b79988bfad..e26f04fe0ccb10 100644 --- a/static/app/components/avatar/index.spec.tsx +++ b/static/app/components/avatar/index.spec.tsx @@ -293,7 +293,7 @@ describe('Avatar', function () { avatar2.unmount(); // avatarType of `default` - sentryApp.avatars![0].avatarType = 'default'; + sentryApp.avatars![0]!.avatarType = 'default'; render(); expect(screen.getByTestId('default-sentry-app-avatar')).toBeInTheDocument(); }); diff --git a/static/app/components/avatar/suggestedAvatarStack.tsx b/static/app/components/avatar/suggestedAvatarStack.tsx index ee03cdb641d307..cd869de11fd4ff 100644 --- a/static/app/components/avatar/suggestedAvatarStack.tsx +++ b/static/app/components/avatar/suggestedAvatarStack.tsx @@ -29,7 +29,7 @@ function SuggestedAvatarStack({ {suggestedOwners.slice(0, numAvatars - 1).map((owner, i) => ( ))} - childrenEls[visibility.findIndex(Boolean) - 1].scrollIntoView({ + childrenEls[visibility.findIndex(Boolean) - 1]!.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'start', @@ -46,7 +46,7 @@ function Carousel({children, visibleRatio = 0.8}: CarouselProps) { const scrollRight = useCallback( () => - childrenEls[visibility.findLastIndex(Boolean) + 1].scrollIntoView({ + childrenEls[visibility.findLastIndex(Boolean) + 1]!.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'end', diff --git a/static/app/components/charts/barChartZoom.tsx b/static/app/components/charts/barChartZoom.tsx index a02995129bbd13..ece184c3faa10b 100644 --- a/static/app/components/charts/barChartZoom.tsx +++ b/static/app/components/charts/barChartZoom.tsx @@ -108,8 +108,8 @@ class BarChartZoom extends Component { if (startValue !== null && endValue !== null) { const {buckets, location, paramStart, paramEnd, minZoomWidth, onHistoryPush} = this.props; - const {start} = buckets[startValue]; - const {end} = buckets[endValue]; + const {start} = buckets[startValue]!; + const {end} = buckets[endValue]!; if (minZoomWidth === undefined || end - start > minZoomWidth) { const target = { diff --git a/static/app/components/charts/baseChart.tsx b/static/app/components/charts/baseChart.tsx index a98c80419dcafd..99a7d8e5d901c6 100644 --- a/static/app/components/charts/baseChart.tsx +++ b/static/app/components/charts/baseChart.tsx @@ -398,7 +398,7 @@ function BaseChartUnwrapped({ const resolvedSeries = useMemo(() => { const previousPeriodColors = - (previousPeriod?.length ?? 0) > 1 ? lightenHexToRgb(color) : undefined; + (previousPeriod?.length ?? 0) > 1 ? lightenHexToRgb(color as string[]) : undefined; const hasSinglePoints = (series as LineSeriesOption[] | undefined)?.every( s => Array.isArray(s.data) && s.data.length <= 1 diff --git a/static/app/components/charts/chartZoom.tsx b/static/app/components/charts/chartZoom.tsx index 160d0e43c6a0a5..01b85ba6bcf89a 100644 --- a/static/app/components/charts/chartZoom.tsx +++ b/static/app/components/charts/chartZoom.tsx @@ -243,7 +243,7 @@ class ChartZoom extends Component { return; } - this.setPeriod(this.history[0]); + this.setPeriod(this.history[0]!); // reset history this.history = []; diff --git a/static/app/components/charts/eventsAreaChart.spec.tsx b/static/app/components/charts/eventsAreaChart.spec.tsx index 38d4b6069775e8..d0113ed85c4141 100644 --- a/static/app/components/charts/eventsAreaChart.spec.tsx +++ b/static/app/components/charts/eventsAreaChart.spec.tsx @@ -52,6 +52,6 @@ describe('EventsChart with legend', function () { /> ); expect(await screen.findByTestId('area-chart')).toBeInTheDocument(); - expect(jest.mocked(BaseChart).mock.calls[0][0].legend).toHaveProperty('data'); + expect(jest.mocked(BaseChart).mock.calls[0]![0].legend).toHaveProperty('data'); }); }); diff --git a/static/app/components/charts/eventsChart.tsx b/static/app/components/charts/eventsChart.tsx index 07fd7b641dfb9c..2fd37ac0b1b9f2 100644 --- a/static/app/components/charts/eventsChart.tsx +++ b/static/app/components/charts/eventsChart.tsx @@ -314,7 +314,7 @@ class Chart extends Component { // Check to see if all series output types are the same. If not, then default to number. const outputType = new Set(Object.values(timeseriesResultsTypes)).size === 1 - ? timeseriesResultsTypes[yAxis] + ? timeseriesResultsTypes[yAxis]! : 'number'; return axisLabelFormatterUsingAggregateOutputType(value, outputType); } @@ -607,7 +607,7 @@ class EventsChart extends Component { additionalSeries={additionalSeries} previousSeriesTransformer={previousSeriesTransformer} stacked={this.isStacked()} - yAxis={yAxisArray[0]} + yAxis={yAxisArray[0]!} showDaily={showDaily} colors={colors} legendOptions={legendOptions} diff --git a/static/app/components/charts/eventsRequest.tsx b/static/app/components/charts/eventsRequest.tsx index 2462b5251c5793..f5f119ed5340ab 100644 --- a/static/app/components/charts/eventsRequest.tsx +++ b/static/app/components/charts/eventsRequest.tsx @@ -425,7 +425,7 @@ class EventsRequest extends PureComponent current[i][0] * 1000 + (_timestamp, _countArray, i) => current[i]![0] * 1000 ), stack: 'previous', }; @@ -573,7 +573,7 @@ class EventsRequest extends PureComponent { - const seriesData: EventsStats = timeseriesData[seriesName]; + const seriesData: EventsStats = timeseriesData[seriesName]!; const processedData = this.processData( seriesData, index, @@ -589,7 +589,7 @@ class EventsRequest extends PureComponent a[0] - b[0]); const timeseriesResultsTypes: Record = {}; Object.keys(timeseriesData).forEach(key => { - const fieldsMeta = timeseriesData[key].meta?.fields[getAggregateAlias(key)]; + const fieldsMeta = timeseriesData[key]!.meta?.fields[getAggregateAlias(key)]; if (fieldsMeta) { timeseriesResultsTypes[key] = fieldsMeta; } diff --git a/static/app/components/charts/intervalSelector.tsx b/static/app/components/charts/intervalSelector.tsx index 7a39386164b68e..34c35c8e2a0b71 100644 --- a/static/app/components/charts/intervalSelector.tsx +++ b/static/app/components/charts/intervalSelector.tsx @@ -123,12 +123,12 @@ function formatHoursToInterval(hours: number): [number, IntervalUnits] { function getIntervalOption(rangeHours: number): IntervalOption { for (const index in INTERVAL_OPTIONS) { - const currentOption = INTERVAL_OPTIONS[index]; + const currentOption = INTERVAL_OPTIONS[index]!; if (currentOption.rangeStart <= rangeHours) { return currentOption; } } - return INTERVAL_OPTIONS[0]; + return INTERVAL_OPTIONS[0]!; } function bindInterval( @@ -196,7 +196,7 @@ export default function IntervalSelector({ makeItem( amount, unit, - SUPPORTED_RELATIVE_PERIOD_UNITS[unit].label, + SUPPORTED_RELATIVE_PERIOD_UNITS[unit]!.label, results.length + 1 ) ); diff --git a/static/app/components/charts/miniBarChart.tsx b/static/app/components/charts/miniBarChart.tsx index 86549632b8a681..5125390e7724da 100644 --- a/static/app/components/charts/miniBarChart.tsx +++ b/static/app/components/charts/miniBarChart.tsx @@ -256,7 +256,7 @@ function MiniBarChart({ : [theme.gray200, theme.purple300, theme.purple300]; for (let i = 0; i < series.length; i++) { - const original = series[i]; + const original = series[i]!; const updated: BarChartSeries = { ...original, cursor: 'normal', diff --git a/static/app/components/charts/percentageAreaChart.tsx b/static/app/components/charts/percentageAreaChart.tsx index ac9916724a8eab..3697f14be07cfd 100644 --- a/static/app/components/charts/percentageAreaChart.tsx +++ b/static/app/components/charts/percentageAreaChart.tsx @@ -43,9 +43,9 @@ export default class PercentageAreaChart extends Component { const {series, getDataItemName, getValue} = this.props; const totalsArray: [string | number, number][] = series.length - ? series[0].data.map(({name}, i) => [ + ? series[0]!.data.map(({name}, i) => [ name, - series.reduce((sum, {data}) => sum + data[i].value, 0), + series.reduce((sum, {data}) => sum + data[i]!.value, 0), ]) : []; const totals = new Map(totalsArray); diff --git a/static/app/components/charts/pieChart.tsx b/static/app/components/charts/pieChart.tsx index 94dd202b984b56..0d80739112e579 100644 --- a/static/app/components/charts/pieChart.tsx +++ b/static/app/components/charts/pieChart.tsx @@ -77,7 +77,7 @@ class PieChart extends Component { .reduce( (acc, [name, value]) => ({ ...acc, - [name]: value, + [name!]: value, }), {} ); @@ -95,7 +95,7 @@ class PieChart extends Component { // Note, we only take the first series unit! const [firstSeries] = series; - const seriesPercentages = this.getSeriesPercentages(firstSeries); + const seriesPercentages = this.getSeriesPercentages(firstSeries!); return ( { if ( !this.isInitialSelected || !name || - firstSeries.data[this.selected].name === name + firstSeries!.data[this.selected]!.name === name ) { return; } @@ -159,8 +159,8 @@ class PieChart extends Component { }} series={[ PieSeries({ - name: firstSeries.seriesName, - data: firstSeries.data, + name: firstSeries!.seriesName, + data: firstSeries!.data, avoidLabelOverlap: false, label: { formatter: ({name, percent}) => `${name}\n${percent}%`, diff --git a/static/app/components/charts/releaseSeries.tsx b/static/app/components/charts/releaseSeries.tsx index b126c57ee68cc4..9fc3285d9acaf5 100644 --- a/static/app/components/charts/releaseSeries.tsx +++ b/static/app/components/charts/releaseSeries.tsx @@ -175,7 +175,7 @@ class ReleaseSeries extends Component { if (pageLinks) { const paginationObject = parseLinkHeader(pageLinks); hasMore = paginationObject?.next?.results ?? false; - conditions.cursor = paginationObject.next.cursor; + conditions.cursor = paginationObject.next!.cursor; } else { hasMore = false; } diff --git a/static/app/components/charts/utils.tsx b/static/app/components/charts/utils.tsx index ac03e159a78a1c..66c3c3b5461718 100644 --- a/static/app/components/charts/utils.tsx +++ b/static/app/components/charts/utils.tsx @@ -273,7 +273,7 @@ export const getDimensionValue = (dimension?: number | string | null) => { }; const RGB_LIGHTEN_VALUE = 30; -export const lightenHexToRgb = (colors: string[]) => +export const lightenHexToRgb = (colors: ReadonlyArray) => colors.map(hex => { const rgb = [ Math.min(parseInt(hex.slice(1, 3), 16) + RGB_LIGHTEN_VALUE, 255), @@ -292,7 +292,7 @@ export const processTableResults = (tableResults?: TableDataWithTitle[]) => { return DEFAULT_GEO_DATA; } - const tableResult = tableResults[0]; + const tableResult = tableResults[0]!; const {data} = tableResult; @@ -300,7 +300,7 @@ export const processTableResults = (tableResults?: TableDataWithTitle[]) => { return DEFAULT_GEO_DATA; } - const preAggregate = Object.keys(data[0]).find(column => { + const preAggregate = Object.keys(data[0]!).find(column => { return column !== 'geo.country_code'; }); @@ -309,7 +309,7 @@ export const processTableResults = (tableResults?: TableDataWithTitle[]) => { } return { - title: tableResult.title ?? '', + title: tableResult!.title ?? '', data: data.map(row => { return { name: row['geo.country_code'] as string, diff --git a/static/app/components/chevron.tsx b/static/app/components/chevron.tsx index d80b62050d3e22..dfa9f19cfae203 100644 --- a/static/app/components/chevron.tsx +++ b/static/app/components/chevron.tsx @@ -34,7 +34,7 @@ function getPath(direction: NonNullable) { [3.5, 5.5], [7, 9], [10.5, 5.5], - ]; + ] as const; switch (direction) { case 'right': diff --git a/static/app/components/collapsible.spec.tsx b/static/app/components/collapsible.spec.tsx index 5abc539696c81a..80ab6db5a0864f 100644 --- a/static/app/components/collapsible.spec.tsx +++ b/static/app/components/collapsible.spec.tsx @@ -10,7 +10,7 @@ describe('Collapsible', function () { render({items}); expect(screen.getAllByText(/Item/)).toHaveLength(5); - expect(screen.getAllByText(/Item/)[2].innerHTML).toBe('Item 3'); + expect(screen.getAllByText(/Item/)[2]!.innerHTML).toBe('Item 3'); expect(screen.getByLabelText('Show 2 hidden items')).toBeInTheDocument(); expect(screen.queryByLabelText('Collapse')).not.toBeInTheDocument(); diff --git a/static/app/components/compactSelect/control.tsx b/static/app/components/compactSelect/control.tsx index 141d148d7a4f77..77423cf6ee32d8 100644 --- a/static/app/components/compactSelect/control.tsx +++ b/static/app/components/compactSelect/control.tsx @@ -524,9 +524,9 @@ export function Control({ > ({ disallowEmptySelection: disallowEmptySelection ?? true, allowDuplicateSelectionEvents: true, onSelectionChange: selection => { - const selectedOption = getSelectedOptions(items, selection)[0] ?? null; + const selectedOption = getSelectedOptions(items, selection)[0]! ?? null; // Save selected options in SelectContext, to update the trigger label saveSelectedOptions(compositeIndex, selectedOption); onChange?.(selectedOption); diff --git a/static/app/components/compactSelect/utils.tsx b/static/app/components/compactSelect/utils.tsx index 768080ccf0f88a..b5f80ae9c6ec67 100644 --- a/static/app/components/compactSelect/utils.tsx +++ b/static/app/components/compactSelect/utils.tsx @@ -152,7 +152,7 @@ export function getHiddenOptions( let currentIndex = 0; while (currentIndex < remainingItems.length) { - const item = remainingItems[currentIndex]; + const item = remainingItems[currentIndex]!; const delta = 'options' in item ? item.options.length : 1; if (accumulator + delta > limit) { @@ -164,12 +164,12 @@ export function getHiddenOptions( currentIndex += 1; } - for (let i = threshold[0]; i < remainingItems.length; i++) { - const item = remainingItems[i]; + for (let i = threshold[0]!; i < remainingItems.length; i++) { + const item = remainingItems[i]!; if ('options' in item) { - const startingIndex = i === threshold[0] ? threshold[1] : 0; + const startingIndex = i === threshold[0] ? threshold[1]! : 0; for (let j = startingIndex; j < item.options.length; j++) { - hiddenOptionsSet.add(item.options[j].key); + hiddenOptionsSet.add(item.options[j]!.key); } } else { hiddenOptionsSet.add(item.key); diff --git a/static/app/components/contextPickerModal.spec.tsx b/static/app/components/contextPickerModal.spec.tsx index 942db40f2d41ee..3fc5eddd801c7f 100644 --- a/static/app/components/contextPickerModal.spec.tsx +++ b/static/app/components/contextPickerModal.spec.tsx @@ -166,7 +166,7 @@ describe('ContextPickerModal', function () { ]; const fetchProjectsForOrg = MockApiClient.addMockResponse({ url: `/organizations/${org2.slug}/projects/`, - body: organizations[1].projects, + body: organizations[1]!.projects, }); OrganizationsStore.load(organizations); diff --git a/static/app/components/contextPickerModal.tsx b/static/app/components/contextPickerModal.tsx index 7955357540a144..bb52bad7ba9363 100644 --- a/static/app/components/contextPickerModal.tsx +++ b/static/app/components/contextPickerModal.tsx @@ -147,7 +147,7 @@ class ContextPickerModal extends Component { // If there is only one org and we don't need a project slug, then call finish callback if (!needProject) { const newPathname = replaceRouterParams(pathname, { - orgId: organizations[0].slug, + orgId: organizations[0]!.slug, }); this.onFinishTimeout = onFinish( @@ -161,13 +161,13 @@ class ContextPickerModal extends Component { // Use latest org or if only 1 org, use that let org = latestOrg; if (!org && organizations.length === 1) { - org = organizations[0].slug; + org = organizations[0]!.slug; } const newPathname = replaceRouterParams(pathname, { orgId: org, - projectId: projects[0].slug, - project: this.props.projects.find(p => p.slug === projects[0].slug)?.id, + projectId: projects[0]!.slug, + project: this.props.projects.find(p => p.slug === projects[0]!.slug)?.id, }); this.onFinishTimeout = onFinish( @@ -268,7 +268,7 @@ class ContextPickerModal extends Component { const projectOptions = [ { label: t('My Projects'), - options: memberProjects.map(p => ({ + options: memberProjects!.map(p => ({ value: p.slug, label: p.slug, disabled: false, @@ -276,7 +276,7 @@ class ContextPickerModal extends Component { }, { label: t('All Projects'), - options: nonMemberProjects.map(p => ({ + options: nonMemberProjects!.map(p => ({ value: p.slug, label: p.slug, disabled: allowAllProjectsSelection ? false : !isSuperuser, @@ -317,7 +317,7 @@ class ContextPickerModal extends Component { const options = [ { label: tct('[providerName] Configurations', { - providerName: integrationConfigs[0].provider.name, + providerName: integrationConfigs[0]!.provider.name, }), options: integrationConfigs.map(config => ({ value: config.id, diff --git a/static/app/components/deprecatedAssigneeSelector.spec.tsx b/static/app/components/deprecatedAssigneeSelector.spec.tsx index c11f5d77679d8b..ad359ce728da1d 100644 --- a/static/app/components/deprecatedAssigneeSelector.spec.tsx +++ b/static/app/components/deprecatedAssigneeSelector.spec.tsx @@ -349,7 +349,7 @@ describe('DeprecatedAssigneeSelector', () => { const options = screen.getAllByTestId('assignee-option'); expect(options[5]).toHaveTextContent('JD'); - await userEvent.click(options[4]); + await userEvent.click(options[4]!); await waitFor(() => { expect(addMessageSpy).toHaveBeenCalledWith( @@ -379,7 +379,7 @@ describe('DeprecatedAssigneeSelector', () => { const options = screen.getAllByTestId('assignee-option'); // Suggested assignee initials expect(options[0]).toHaveTextContent('JB'); - await userEvent.click(options[0]); + await userEvent.click(options[0]!); await waitFor(() => expect(assignGroup2Mock).toHaveBeenCalledWith( diff --git a/static/app/components/deprecatedAssigneeSelector.tsx b/static/app/components/deprecatedAssigneeSelector.tsx index 4a9f9427693b60..029ec7ae6ce8e6 100644 --- a/static/app/components/deprecatedAssigneeSelector.tsx +++ b/static/app/components/deprecatedAssigneeSelector.tsx @@ -72,6 +72,7 @@ export function AssigneeAvatar({ } if (suggestedActors.length > 0) { + const firstActor = suggestedActors[0]!; return ( {tct('Suggestion: [name]', { name: - suggestedActors[0].type === 'team' - ? `#${suggestedActors[0].name}` - : suggestedActors[0].name, + firstActor.type === 'team' ? `#${firstActor.name}` : firstActor.name, })} {suggestedActors.length > 1 && tn(' + %s other', ' + %s others', suggestedActors.length - 1)} - {suggestedReasons[suggestedActors[0].suggestedReason]} + {suggestedReasons[firstActor.suggestedReason]} } diff --git a/static/app/components/deprecatedAssigneeSelectorDropdown.tsx b/static/app/components/deprecatedAssigneeSelectorDropdown.tsx index 0e2b351b38343e..66f34f86fe65d8 100644 --- a/static/app/components/deprecatedAssigneeSelectorDropdown.tsx +++ b/static/app/components/deprecatedAssigneeSelectorDropdown.tsx @@ -370,7 +370,7 @@ export class DeprecatedAssigneeSelectorDropdown extends Component< )[] = []; for (let i = 0; i < suggestedAssignees.length; i++) { - const assignee = suggestedAssignees[i]; + const assignee = suggestedAssignees[i]!; if (assignee.type !== 'user' && assignee.type !== 'team') { continue; } @@ -514,7 +514,7 @@ export class DeprecatedAssigneeSelectorDropdown extends Component< const member = memberList.find(user => user.id === id); if (member) { return { - id, + id: id!, type: 'user', name: member.name, suggestedReason: owner.type, @@ -528,7 +528,7 @@ export class DeprecatedAssigneeSelectorDropdown extends Component< ); if (matchingTeam) { return { - id, + id: id!, type: 'team', name: matchingTeam.team.name, suggestedReason: owner.type, @@ -606,7 +606,7 @@ export function putSessionUserFirst(members: User[] | undefined): User[] { return members; } - const arrangedMembers = [members[sessionUserIndex]].concat( + const arrangedMembers = [members[sessionUserIndex]!].concat( members.slice(0, sessionUserIndex), members.slice(sessionUserIndex + 1) ); diff --git a/static/app/components/deprecatedSmartSearchBar/index.tsx b/static/app/components/deprecatedSmartSearchBar/index.tsx index f3774f3784bf7b..4f3d3c024cc958 100644 --- a/static/app/components/deprecatedSmartSearchBar/index.tsx +++ b/static/app/components/deprecatedSmartSearchBar/index.tsx @@ -560,7 +560,7 @@ class DeprecatedSmartSearchBar extends Component { return; } - const entry = entries[0]; + const entry = entries[0]!; const {width} = entry.contentRect; const actionCount = this.props.actionBarItems?.length ?? 0; @@ -649,11 +649,11 @@ class DeprecatedSmartSearchBar extends Component { if (this.searchInput.current && filterTokens.length > 0) { maybeFocusInput(this.searchInput.current); - let offset = filterTokens[0].location.end.offset; + let offset = filterTokens[0]!.location.end.offset; if (token) { const tokenIndex = filterTokens.findIndex(tok => tok === token); if (tokenIndex !== -1 && tokenIndex + 1 < filterTokens.length) { - offset = filterTokens[tokenIndex + 1].location.end.offset; + offset = filterTokens[tokenIndex + 1]!.location.end.offset; } } @@ -958,12 +958,12 @@ class DeprecatedSmartSearchBar extends Component { : 0; // Clear previous selection - const prevItem = flatSearchItems[currIndex]; + const prevItem = flatSearchItems[currIndex]!; searchGroups = getSearchGroupWithItemMarkedActive(searchGroups, prevItem, false); // Set new selection const activeItem = flatSearchItems[nextActiveSearchItem]; - searchGroups = getSearchGroupWithItemMarkedActive(searchGroups, activeItem, true); + searchGroups = getSearchGroupWithItemMarkedActive(searchGroups, activeItem!, true); this.setState({searchGroups, activeSearchItem: nextActiveSearchItem}); } @@ -1055,7 +1055,7 @@ class DeprecatedSmartSearchBar extends Component { if (isSelectingDropdownItems) { searchGroups = getSearchGroupWithItemMarkedActive( searchGroups, - flatSearchItems[activeSearchItem], + flatSearchItems[activeSearchItem]!, false ); } @@ -1203,13 +1203,13 @@ class DeprecatedSmartSearchBar extends Component { const innerStart = cursorPosition - cursorToken.location.start.offset; let tokenStart = innerStart; - while (tokenStart > 0 && !LIMITER_CHARS.includes(cursorToken.text[tokenStart - 1])) { + while (tokenStart > 0 && !LIMITER_CHARS.includes(cursorToken.text[tokenStart - 1]!)) { tokenStart--; } let tokenEnd = innerStart; while ( tokenEnd < cursorToken.text.length && - !LIMITER_CHARS.includes(cursorToken.text[tokenEnd]) + !LIMITER_CHARS.includes(cursorToken.text[tokenEnd]!) ) { tokenEnd++; } diff --git a/static/app/components/deprecatedSmartSearchBar/searchDropdown.tsx b/static/app/components/deprecatedSmartSearchBar/searchDropdown.tsx index 12c04d9ce380e9..7361ad146242a0 100644 --- a/static/app/components/deprecatedSmartSearchBar/searchDropdown.tsx +++ b/static/app/components/deprecatedSmartSearchBar/searchDropdown.tsx @@ -22,7 +22,7 @@ import {invalidTypes, ItemType} from './types'; const getDropdownItemKey = (item: SearchItem) => `${item.value || item.desc || item.title}-${ - item.children && item.children.length > 0 ? getDropdownItemKey(item.children[0]) : '' + item.children && item.children.length > 0 ? getDropdownItemKey(item.children[0]!) : '' }`; type Props = { @@ -244,7 +244,7 @@ function ItemTitle({item, searchSubstring, isChild}: ItemTitleProps) { if (searchSubstring) { const idx = restWords.length === 0 - ? fullWord.toLowerCase().indexOf(searchSubstring.split('.')[0]) + ? fullWord.toLowerCase().indexOf(searchSubstring.split('.')[0]!) : fullWord.toLowerCase().indexOf(searchSubstring); // Below is the logic to make the current query bold inside the result. @@ -253,14 +253,14 @@ function ItemTitle({item, searchSubstring, isChild}: ItemTitleProps) { {!isFirstWordHidden && ( - {firstWord.slice(0, idx)} - {firstWord.slice(idx, idx + searchSubstring.length)} - {firstWord.slice(idx + searchSubstring.length)} + {firstWord!.slice(0, idx)} + {firstWord!.slice(idx, idx + searchSubstring.length)} + {firstWord!.slice(idx + searchSubstring.length)} )} {combinedRestWords && ( {names?.map(name => ( - + ))} diff --git a/static/app/components/devtoolbar/components/infiniteListItems.tsx b/static/app/components/devtoolbar/components/infiniteListItems.tsx index 772c1372c2a9d4..c025eb230ec3ca 100644 --- a/static/app/components/devtoolbar/components/infiniteListItems.tsx +++ b/static/app/components/devtoolbar/components/infiniteListItems.tsx @@ -79,7 +79,7 @@ export default function InfiniteListItems({ ? hasNextPage ? loadingMoreMessage() : loadingCompleteMessage() - : itemRenderer({item})} + : itemRenderer({item: item!})} ); })} diff --git a/static/app/components/devtoolbar/components/releases/releasesPanel.tsx b/static/app/components/devtoolbar/components/releases/releasesPanel.tsx index 5215f1b341846e..6bc3ad5067c1a6 100644 --- a/static/app/components/devtoolbar/components/releases/releasesPanel.tsx +++ b/static/app/components/devtoolbar/components/releases/releasesPanel.tsx @@ -53,7 +53,7 @@ function getCrashFreeRate(data: ApiResult): number { // assume it is 100%. // round to 2 decimal points return parseFloat( - ((data?.json.groups[0].totals['crash_free_rate(session)'] ?? 1) * 100).toFixed(2) + ((data?.json.groups[0]!.totals['crash_free_rate(session)'] ?? 1) * 100).toFixed(2) ); } @@ -101,7 +101,7 @@ function ReleaseSummary({orgSlug, release}: {orgSlug: string; release: Release}) {formatVersion(release.version)} @@ -244,14 +244,14 @@ export default function ReleasesPanel() { ) : (
- + 1 ? releaseData.json[1].version : undefined + releaseData.json.length > 1 ? releaseData.json[1]!.version : undefined } /> - +
)} diff --git a/static/app/components/discover/transactionsTable.tsx b/static/app/components/discover/transactionsTable.tsx index 87fc301df2ba96..7fbd410dde4174 100644 --- a/static/app/components/discover/transactionsTable.tsx +++ b/static/app/components/discover/transactionsTable.tsx @@ -76,7 +76,7 @@ function TransactionsTable(props: Props) { const tableTitles = getTitles(); const headers = tableTitles.map((title, index) => { - const column = columnOrder[index]; + const column = columnOrder[index]!; const align: Alignments = fieldAlignment(column.name, column.type, tableMeta); if (column.key === 'span_ops_breakdown.relative') { @@ -163,7 +163,7 @@ function TransactionsTable(props: Props) { } else if (target && !isEmptyObject(target)) { if (fields[index] === 'replayId') { rendered = ( - + {rendered} ); diff --git a/static/app/components/draggableTabs/draggableTabList.tsx b/static/app/components/draggableTabs/draggableTabList.tsx index 31df02af17428e..c921768f2d4d5e 100644 --- a/static/app/components/draggableTabs/draggableTabList.tsx +++ b/static/app/components/draggableTabs/draggableTabList.tsx @@ -62,9 +62,9 @@ function useOverflowingTabs({state}: {state: TabListState[] = []; for (let i = 0; i < tabsDimensions.length; i++) { - totalWidth += tabsDimensions[i].width + 1; // 1 extra pixel for the divider + totalWidth += tabsDimensions[i]!.width + 1; // 1 extra pixel for the divider if (totalWidth > availableWidth + 1) { - overflowing.push(persistentTabs[i]); + overflowing.push(persistentTabs[i]!); } } diff --git a/static/app/components/dropdownAutoComplete/list.tsx b/static/app/components/dropdownAutoComplete/list.tsx index 275762171ec8b8..37e43b5342fdb3 100644 --- a/static/app/components/dropdownAutoComplete/list.tsx +++ b/static/app/components/dropdownAutoComplete/list.tsx @@ -82,7 +82,7 @@ function List({ onScroll={onScroll} rowCount={items.length} rowHeight={({index}) => - items[index].groupLabel && virtualizedLabelHeight + items[index]!.groupLabel && virtualizedLabelHeight ? virtualizedLabelHeight : virtualizedHeight } @@ -90,8 +90,8 @@ function List({ )} diff --git a/static/app/components/events/autofix/autofixDiff.tsx b/static/app/components/events/autofix/autofixDiff.tsx index c076e645adeed3..d69b92e88c56e8 100644 --- a/static/app/components/events/autofix/autofixDiff.tsx +++ b/static/app/components/events/autofix/autofixDiff.tsx @@ -43,7 +43,7 @@ function makeTestIdFromLineType(lineType: DiffLineType) { function addChangesToDiffLines(lines: DiffLineWithChanges[]): DiffLineWithChanges[] { for (let i = 0; i < lines.length; i++) { - const line = lines[i]; + const line = lines[i]!; if (line.line_type === DiffLineType.CONTEXT) { continue; } @@ -293,7 +293,7 @@ function DiffHunkContent({ // Update diff_line_no for all lines after the insertion for (let i = insertionIndex + newAddedLines.length; i < updatedLines.length; i++) { - updatedLines[i].diff_line_no = ++lastDiffLineNo; + updatedLines[i]!.diff_line_no = ++lastDiffLineNo; } updateHunk.mutate({hunkIndex, lines: updatedLines, repoId, fileName}); @@ -332,15 +332,15 @@ function DiffHunkContent({ }; const getStartLineNumber = (index: number, lineType: DiffLineType) => { - const line = linesWithChanges[index]; + const line = linesWithChanges[index]!; if (lineType === DiffLineType.REMOVED) { return line.source_line_no; } if (lineType === DiffLineType.ADDED) { // Find the first non-null target_line_no for (let i = index; i < linesWithChanges.length; i++) { - if (linesWithChanges[i].target_line_no !== null) { - return linesWithChanges[i].target_line_no; + if (linesWithChanges[i]!.target_line_no !== null) { + return linesWithChanges[i]!.target_line_no; } } } diff --git a/static/app/components/events/autofix/autofixMessageBox.analytics.spec.tsx b/static/app/components/events/autofix/autofixMessageBox.analytics.spec.tsx index 15c20464c7bb15..90c0902494c002 100644 --- a/static/app/components/events/autofix/autofixMessageBox.analytics.spec.tsx +++ b/static/app/components/events/autofix/autofixMessageBox.analytics.spec.tsx @@ -98,7 +98,7 @@ describe('AutofixMessageBox Analytics', () => { ); - await userEvent.click(screen.getAllByText('Propose your own root cause')[0]); + await userEvent.click(screen.getAllByText('Propose your own root cause')[0]!); const customInput = screen.getByPlaceholderText('Propose your own root cause...'); await userEvent.type(customInput, 'Custom root cause'); diff --git a/static/app/components/events/autofix/autofixRootCause.tsx b/static/app/components/events/autofix/autofixRootCause.tsx index d0a95855274952..53ff3ca1b014a1 100644 --- a/static/app/components/events/autofix/autofixRootCause.tsx +++ b/static/app/components/events/autofix/autofixRootCause.tsx @@ -383,7 +383,7 @@ function AutofixRootCauseDisplay({ rootCauseSelection, repos, }: AutofixRootCauseProps) { - const [selectedId, setSelectedId] = useState(() => causes[0].id); + const [selectedId, setSelectedId] = useState(() => causes[0]!.id); const {isPending, mutate: handleSelectFix} = useSelectCause({groupId, runId}); if (rootCauseSelection) { diff --git a/static/app/components/events/autofix/autofixSteps.tsx b/static/app/components/events/autofix/autofixSteps.tsx index d6e7d10b3b389f..490b02474edab4 100644 --- a/static/app/components/events/autofix/autofixSteps.tsx +++ b/static/app/components/events/autofix/autofixSteps.tsx @@ -136,11 +136,11 @@ export function AutofixSteps({data, groupId, runId}: AutofixStepsProps) { if (!steps) { return; } - const step = steps[steps.length - 1]; + const step = steps[steps.length - 1]!; if (step.type !== AutofixStepType.ROOT_CAUSE_ANALYSIS) { return; } - const cause = step.causes[0]; + const cause = step.causes[0]!; const id = cause.id; handleSelectFix({causeId: id, instruction: text}); } @@ -164,8 +164,8 @@ export function AutofixSteps({data, groupId, runId}: AutofixStepsProps) { useEffect(() => { const observer = new IntersectionObserver( ([entry]) => { - setIsBottomVisible(entry.isIntersecting); - if (entry.isIntersecting) { + setIsBottomVisible(entry!.isIntersecting); + if (entry!.isIntersecting) { setHasSeenBottom(true); } }, @@ -194,7 +194,7 @@ export function AutofixSteps({data, groupId, runId}: AutofixStepsProps) { const hasNewSteps = currentStepsLength > prevStepsLengthRef.current && - steps[currentStepsLength - 1].type !== AutofixStepType.DEFAULT; + steps[currentStepsLength - 1]!.type !== AutofixStepType.DEFAULT; const hasNewInsights = currentInsightsCount > prevInsightsCountRef.current; if (hasNewSteps || hasNewInsights) { @@ -217,16 +217,18 @@ export function AutofixSteps({data, groupId, runId}: AutofixStepsProps) { } const lastStep = steps[steps.length - 1]; - const logs: AutofixProgressItem[] = lastStep.progress?.filter(isProgressLog) ?? []; + const logs: AutofixProgressItem[] = lastStep!.progress?.filter(isProgressLog) ?? []; const activeLog = - lastStep.completedMessage ?? replaceHeadersWithBold(logs.at(-1)?.message ?? '') ?? ''; + lastStep!.completedMessage ?? + replaceHeadersWithBold(logs.at(-1)?.message ?? '') ?? + ''; const isRootCauseSelectionStep = - lastStep.type === AutofixStepType.ROOT_CAUSE_ANALYSIS && - lastStep.status === 'COMPLETED'; + lastStep!.type === AutofixStepType.ROOT_CAUSE_ANALYSIS && + lastStep!.status === 'COMPLETED'; const isChangesStep = - lastStep.type === AutofixStepType.CHANGES && lastStep.status === 'COMPLETED'; + lastStep!.type === AutofixStepType.CHANGES && lastStep!.status === 'COMPLETED'; return (
@@ -281,15 +283,15 @@ export function AutofixSteps({data, groupId, runId}: AutofixStepsProps) {
); })} - {lastStep.output_stream && ( - + {lastStep!.output_stream && ( + )} { const {breadcrumb, raw, title, meta, iconComponent, colorConfig, levelComponent} = - breadcrumbs[virtualizedRow.index]; + breadcrumbs[virtualizedRow.index]!; const isVirtualCrumb = !defined(raw); const timeDate = new Date(breadcrumb.timestamp ?? ''); diff --git a/static/app/components/events/breadcrumbs/testUtils.tsx b/static/app/components/events/breadcrumbs/testUtils.tsx index 677cebb470a448..6a5ea4a70fc3ed 100644 --- a/static/app/components/events/breadcrumbs/testUtils.tsx +++ b/static/app/components/events/breadcrumbs/testUtils.tsx @@ -49,7 +49,7 @@ export const MOCK_BREADCRUMBS = [ type: BreadcrumbType.DEFAULT, timestamp: oneMinuteBeforeEventFixture, }, -]; +] as const; const MOCK_BREADCRUMB_ENTRY = { type: EntryType.BREADCRUMBS, data: { diff --git a/static/app/components/events/breadcrumbs/utils.tsx b/static/app/components/events/breadcrumbs/utils.tsx index d14345302ef1e6..641b82e68d9ea5 100644 --- a/static/app/components/events/breadcrumbs/utils.tsx +++ b/static/app/components/events/breadcrumbs/utils.tsx @@ -143,9 +143,9 @@ export function useBreadcrumbFilters(crumbs: EnhancedCrumb[]) { options.forEach(optionValue => { const [indicator, value] = optionValue.split('-'); if (indicator === 'type') { - typeFilterSet.add(value); + typeFilterSet.add(value!); } else if (indicator === 'level') { - levelFilterSet.add(value); + levelFilterSet.add(value!); } }); diff --git a/static/app/components/events/contexts/contextCard.spec.tsx b/static/app/components/events/contexts/contextCard.spec.tsx index fa6e0fd93280c6..c716b4652f0e19 100644 --- a/static/app/components/events/contexts/contextCard.spec.tsx +++ b/static/app/components/events/contexts/contextCard.spec.tsx @@ -76,7 +76,7 @@ describe('ContextCard', function () { project={project} /> ); - expect(iconSpy.mock.calls[0][0]).toBe(browserContext.name); + expect(iconSpy.mock.calls[0]![0]).toBe(browserContext.name); expect(screen.getByRole('img')).toBeInTheDocument(); iconSpy.mockReset(); diff --git a/static/app/components/events/contexts/utils.spec.tsx b/static/app/components/events/contexts/utils.spec.tsx index 968d5ae8eb6a74..a5a93cb9222225 100644 --- a/static/app/components/events/contexts/utils.spec.tsx +++ b/static/app/components/events/contexts/utils.spec.tsx @@ -154,10 +154,10 @@ describe('contexts utils', function () { }; const knownStructuredData = getKnownStructuredData(knownData, errMeta); - expect(knownData[0].key).toEqual(knownStructuredData[0].key); - expect(knownData[0].subject).toEqual(knownStructuredData[0].subject); - render({knownStructuredData[0].value as React.ReactNode}); - expect(screen.getByText(`${knownData[0].value}`)).toBeInTheDocument(); + expect(knownData[0]!.key).toEqual(knownStructuredData[0]!.key); + expect(knownData[0]!.subject).toEqual(knownStructuredData[0]!.subject); + render({knownStructuredData[0]!.value as React.ReactNode}); + expect(screen.getByText(`${knownData[0]!.value}`)).toBeInTheDocument(); expect(screen.getByTestId('annotated-text-error-icon')).toBeInTheDocument(); }); }); diff --git a/static/app/components/events/contexts/utils.tsx b/static/app/components/events/contexts/utils.tsx index 8ad210103a7935..8d79c598b8f066 100644 --- a/static/app/components/events/contexts/utils.tsx +++ b/static/app/components/events/contexts/utils.tsx @@ -80,21 +80,21 @@ export function generateIconName( } const formattedName = name - .split(/\d/)[0] + .split(/\d/)[0]! .toLowerCase() .replace(/[^a-z0-9\-]+/g, '-') .replace(/\-+$/, '') .replace(/^\-+/, ''); if (formattedName === 'edge' && version) { - const majorVersion = version.split('.')[0]; + const majorVersion = version.split('.')[0]!; const isLegacyEdge = majorVersion >= '12' && majorVersion <= '18'; return isLegacyEdge ? 'legacy-edge' : 'edge'; } if (formattedName.endsWith('-mobile')) { - return formattedName.split('-')[0]; + return formattedName.split('-')[0]!; } return formattedName; diff --git a/static/app/components/events/errorItem.spec.tsx b/static/app/components/events/errorItem.spec.tsx index c3d2b89bf85bcf..d4a39b7a205bce 100644 --- a/static/app/components/events/errorItem.spec.tsx +++ b/static/app/components/events/errorItem.spec.tsx @@ -50,7 +50,7 @@ describe('Issue error item', function () { expect(screen.getByText('File Path')).toBeInTheDocument(); expect(screen.getAllByText(/redacted/)).toHaveLength(2); - await userEvent.hover(screen.getAllByText(/redacted/)[0]); + await userEvent.hover(screen.getAllByText(/redacted/)[0]!); expect( await screen.findByText( diff --git a/static/app/components/events/eventAttachments.spec.tsx b/static/app/components/events/eventAttachments.spec.tsx index 3f0a772cb3368c..113d9d8d350ced 100644 --- a/static/app/components/events/eventAttachments.spec.tsx +++ b/static/app/components/events/eventAttachments.spec.tsx @@ -27,11 +27,11 @@ describe('EventAttachments', function () { const props = { group: undefined, - project, + project: project!, event, }; - const attachmentsUrl = `/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/`; + const attachmentsUrl = `/projects/${organization.slug}/${project!.slug}/events/${event.id}/attachments/`; beforeEach(() => { ConfigStore.loadInitialData(ConfigFixture()); @@ -60,7 +60,7 @@ describe('EventAttachments', function () { expect(screen.getByRole('link', {name: 'configure limit'})).toHaveAttribute( 'href', - `/settings/org-slug/projects/${project.slug}/security-and-privacy/` + `/settings/org-slug/projects/${project!.slug}/security-and-privacy/` ); expect( @@ -144,7 +144,7 @@ describe('EventAttachments', function () { }); MockApiClient.addMockResponse({ - url: `/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/1/?download`, + url: `/projects/${organization.slug}/${project!.slug}/events/${event.id}/attachments/1/?download`, body: 'file contents', }); @@ -180,7 +180,7 @@ describe('EventAttachments', function () { expect(await screen.findByText('Attachments (2)')).toBeInTheDocument(); - await userEvent.click(screen.getAllByRole('button', {name: 'Delete'})[0]); + await userEvent.click(screen.getAllByRole('button', {name: 'Delete'})[0]!); await userEvent.click( within(screen.getByRole('dialog')).getByRole('button', {name: /delete/i}) ); diff --git a/static/app/components/events/eventEntries.tsx b/static/app/components/events/eventEntries.tsx index 41283b321143d7..bdc4d64addcafa 100644 --- a/static/app/components/events/eventEntries.tsx +++ b/static/app/components/events/eventEntries.tsx @@ -195,12 +195,12 @@ export function Entries({ return ( {!hideBeforeReplayEntries && - beforeReplayEntries.map((entry, entryIdx) => ( + beforeReplayEntries!.map((entry, entryIdx) => ( ))} {!isShare && } {!isShare && } - {afterReplayEntries.map((entry, entryIdx) => { + {afterReplayEntries!.map((entry, entryIdx) => { if (hideBreadCrumbs && entry.type === EntryType.BREADCRUMBS) { return null; } diff --git a/static/app/components/events/eventExtraData/index.spec.tsx b/static/app/components/events/eventExtraData/index.spec.tsx index 0038ce1445fa49..1dd2c9d9bc429e 100644 --- a/static/app/components/events/eventExtraData/index.spec.tsx +++ b/static/app/components/events/eventExtraData/index.spec.tsx @@ -181,7 +181,7 @@ describe('EventExtraData', function () { await userEvent.click(screen.getByRole('button', {name: 'Expand'})); expect(await screen.findAllByText(/redacted/)).toHaveLength(10); - await userEvent.hover(screen.getAllByText(/redacted/)[0]); + await userEvent.hover(screen.getAllByText(/redacted/)[0]!); expect( await screen.findByText( diff --git a/static/app/components/events/eventStatisticalDetector/aggregateSpanDiff.tsx b/static/app/components/events/eventStatisticalDetector/aggregateSpanDiff.tsx index 90d06bf3cc21d9..e1013e44ebdc8b 100644 --- a/static/app/components/events/eventStatisticalDetector/aggregateSpanDiff.tsx +++ b/static/app/components/events/eventStatisticalDetector/aggregateSpanDiff.tsx @@ -149,8 +149,8 @@ function AggregateSpanDiff({event, project}: AggregateSpanDiffProps) { }; if (causeType === 'throughput') { - const throughputBefore = row[`epm_by_timestamp(less,${breakpoint})`]; - const throughputAfter = row[`epm_by_timestamp(greater,${breakpoint})`]; + const throughputBefore = row[`epm_by_timestamp(less,${breakpoint})`]!; + const throughputAfter = row[`epm_by_timestamp(greater,${breakpoint})`]!; return { ...commonProps, throughputBefore, @@ -160,9 +160,9 @@ function AggregateSpanDiff({event, project}: AggregateSpanDiffProps) { } const durationBefore = - row[`avg_by_timestamp(span.self_time,less,${breakpoint})`] / 1e3; + row[`avg_by_timestamp(span.self_time,less,${breakpoint})`]! / 1e3; const durationAfter = - row[`avg_by_timestamp(span.self_time,greater,${breakpoint})`] / 1e3; + row[`avg_by_timestamp(span.self_time,greater,${breakpoint})`]! / 1e3; return { ...commonProps, durationBefore, diff --git a/static/app/components/events/eventStatisticalDetector/eventComparison/eventDisplay.tsx b/static/app/components/events/eventStatisticalDetector/eventComparison/eventDisplay.tsx index 37a80abb359873..a4af44ae8ccc73 100644 --- a/static/app/components/events/eventStatisticalDetector/eventComparison/eventDisplay.tsx +++ b/static/app/components/events/eventStatisticalDetector/eventComparison/eventDisplay.tsx @@ -163,7 +163,7 @@ function EventDisplay({ useEffect(() => { if (defined(eventIds) && eventIds.length > 0 && !selectedEventId) { - setSelectedEventId(eventIds[0]); + setSelectedEventId(eventIds[0]!); } }, [eventIds, selectedEventId]); @@ -242,7 +242,7 @@ function EventDisplay({ icon={} onPaginate={() => { if (hasPrev) { - setSelectedEventId(eventIds[eventIdIndex - 1]); + setSelectedEventId(eventIds[eventIdIndex - 1]!); } }} /> @@ -252,7 +252,7 @@ function EventDisplay({ icon={} onPaginate={() => { if (hasNext) { - setSelectedEventId(eventIds[eventIdIndex + 1]); + setSelectedEventId(eventIds[eventIdIndex + 1]!); } }} /> diff --git a/static/app/components/events/eventStatisticalDetector/eventThroughput.tsx b/static/app/components/events/eventStatisticalDetector/eventThroughput.tsx index 40c86132577dc4..438b82d19ab8d0 100644 --- a/static/app/components/events/eventStatisticalDetector/eventThroughput.tsx +++ b/static/app/components/events/eventStatisticalDetector/eventThroughput.tsx @@ -100,7 +100,7 @@ function EventThroughputInner({event, group}: EventThroughputProps) { const result = transformEventStats( stats.series.map(item => [item.timestamp, [{count: item.value / item.interval}]]), 'throughput()' - )[0]; + )[0]!; result.markLine = { data: [ @@ -293,7 +293,7 @@ function useThroughputStats({datetime, event, group}: UseThroughputStatsOptions) if (data.length < 2) { return null; } - return data[1][0] - data[0][0]; + return data[1]![0] - data[0]![0]; }, [transactionStats?.data]); const transactionData = useMemo(() => { @@ -305,7 +305,7 @@ function useThroughputStats({datetime, event, group}: UseThroughputStatsOptions) const timestamp = curr[0]; const bucket = Math.floor(timestamp / BUCKET_SIZE) * BUCKET_SIZE; const prev = acc[acc.length - 1]; - const value = curr[1][0].count; + const value = curr[1]![0]!.count; if (prev?.timestamp === bucket) { prev.value += value; diff --git a/static/app/components/events/eventStatisticalDetector/spanOpBreakdown.tsx b/static/app/components/events/eventStatisticalDetector/spanOpBreakdown.tsx index 2b84d78ec6405b..d61515d196f450 100644 --- a/static/app/components/events/eventStatisticalDetector/spanOpBreakdown.tsx +++ b/static/app/components/events/eventStatisticalDetector/spanOpBreakdown.tsx @@ -121,13 +121,13 @@ function EventSpanOpBreakdown({event}: {event: Event}) { const spanOpDiffs: SpanOpDiff[] = SPAN_OPS.map(op => { const preBreakpointValue = - (preBreakpointData?.data[0][`p95(spans.${op})`] as string) || undefined; + (preBreakpointData?.data[0]![`p95(spans.${op})`] as string) || undefined; const preBreakpointValueAsNumber = preBreakpointValue ? parseInt(preBreakpointValue, 10) : 0; const postBreakpointValue = - (postBreakpointData?.data[0][`p95(spans.${op})`] as string) || undefined; + (postBreakpointData?.data[0]![`p95(spans.${op})`] as string) || undefined; const postBreakpointValueAsNumber = postBreakpointValue ? parseInt(postBreakpointValue, 10) : 0; diff --git a/static/app/components/events/eventTags/eventTagsTree.tsx b/static/app/components/events/eventTags/eventTagsTree.tsx index bad50071e54f91..d607b2c0fd1679 100644 --- a/static/app/components/events/eventTags/eventTagsTree.tsx +++ b/static/app/components/events/eventTags/eventTagsTree.tsx @@ -100,7 +100,7 @@ function getTagTreeRows({ const branchRows = getTagTreeRows({ ...props, tagKey: tag, - content: content.subtree[tag], + content: content.subtree[tag]!, spacerCount: spacerCount + 1, isLast: i === subtreeTags.length - 1, // Encoding the trunk index with the branch index ensures uniqueness for the key diff --git a/static/app/components/events/eventTagsAndScreenshot/index.spec.tsx b/static/app/components/events/eventTagsAndScreenshot/index.spec.tsx index 2e1911efa54670..e33c346f48b647 100644 --- a/static/app/components/events/eventTagsAndScreenshot/index.spec.tsx +++ b/static/app/components/events/eventTagsAndScreenshot/index.spec.tsx @@ -311,7 +311,7 @@ describe('EventTagsAndScreenshot', function () { expect(screen.getByText('View screenshot')).toBeInTheDocument(); expect(screen.getByTestId('image-viewer')).toHaveAttribute( 'src', - `/api/0/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/${attachments[1].id}/?download` + `/api/0/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/${attachments[1]!.id}/?download` ); // Display help text when hovering question element @@ -354,7 +354,7 @@ describe('EventTagsAndScreenshot', function () { expect(await screen.findByText('View screenshot')).toBeInTheDocument(); expect(screen.getByTestId('image-viewer')).toHaveAttribute( 'src', - `/api/0/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/${attachments[1].id}/?download` + `/api/0/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/${attachments[1]!.id}/?download` ); expect(screen.getByTestId('screenshot-data-section')?.textContent).toContain( @@ -403,7 +403,7 @@ describe('EventTagsAndScreenshot', function () { expect(screen.getByText('View screenshot')).toBeInTheDocument(); expect(screen.getByTestId('image-viewer')).toHaveAttribute( 'src', - `/api/0/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/${moreAttachments[1].id}/?download` + `/api/0/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/${moreAttachments[1]!.id}/?download` ); await userEvent.click(screen.getByRole('button', {name: 'Next Screenshot'})); @@ -415,7 +415,7 @@ describe('EventTagsAndScreenshot', function () { expect(screen.getByText('View screenshot')).toBeInTheDocument(); expect(screen.getByTestId('image-viewer')).toHaveAttribute( 'src', - `/api/0/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/${moreAttachments[2].id}/?download` + `/api/0/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/${moreAttachments[2]!.id}/?download` ); }); @@ -473,7 +473,7 @@ describe('EventTagsAndScreenshot', function () { expect(screen.getByText('View screenshot')).toBeInTheDocument(); expect(screen.getByTestId('image-viewer')).toHaveAttribute( 'src', - `/api/0/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/${attachments[1].id}/?download` + `/api/0/projects/${organization.slug}/${project.slug}/events/${event.id}/attachments/${attachments[1]!.id}/?download` ); }); }); diff --git a/static/app/components/events/eventTagsAndScreenshot/screenshot/modal.tsx b/static/app/components/events/eventTagsAndScreenshot/screenshot/modal.tsx index 7fd8a8e250f2e9..a301859b702c01 100644 --- a/static/app/components/events/eventTagsAndScreenshot/screenshot/modal.tsx +++ b/static/app/components/events/eventTagsAndScreenshot/screenshot/modal.tsx @@ -65,7 +65,7 @@ export default function ScreenshotModal({ if (attachments.length) { const newIndex = currentAttachmentIndex + delta; if (newIndex >= 0 && newIndex < attachments.length) { - setCurrentAttachment(attachments[newIndex]); + setCurrentAttachment(attachments[newIndex]!); } } }, diff --git a/static/app/components/events/eventTagsAndScreenshot/screenshot/screenshotDataSection.tsx b/static/app/components/events/eventTagsAndScreenshot/screenshot/screenshotDataSection.tsx index d19b2301cdfc56..6527ad69a9ff0f 100644 --- a/static/app/components/events/eventTagsAndScreenshot/screenshot/screenshotDataSection.tsx +++ b/static/app/components/events/eventTagsAndScreenshot/screenshot/screenshotDataSection.tsx @@ -63,7 +63,7 @@ export function ScreenshotDataSection({ const [screenshotInFocus, setScreenshotInFocus] = useState(0); const showScreenshot = !isShare && !!screenshots.length; - const screenshot = screenshots[screenshotInFocus]; + const screenshot = screenshots[screenshotInFocus]!; const handleDeleteScreenshot = (attachmentId: string) => { deleteAttachment({ diff --git a/static/app/components/events/eventVitals.tsx b/static/app/components/events/eventVitals.tsx index 05c335b22a1961..91b7501fec1849 100644 --- a/static/app/components/events/eventVitals.tsx +++ b/static/app/components/events/eventVitals.tsx @@ -119,7 +119,7 @@ interface EventVitalProps extends Props { } function EventVital({event, name, vital}: EventVitalProps) { - const value = event.measurements?.[name].value ?? null; + const value = event.measurements?.[name]!.value ?? null; if (value === null || !vital) { return null; } diff --git a/static/app/components/events/featureFlags/eventFeatureFlagList.spec.tsx b/static/app/components/events/featureFlags/eventFeatureFlagList.spec.tsx index 67663d1c778136..0e8c82b5ccd04f 100644 --- a/static/app/components/events/featureFlags/eventFeatureFlagList.spec.tsx +++ b/static/app/components/events/featureFlags/eventFeatureFlagList.spec.tsx @@ -176,8 +176,8 @@ describe('EventFeatureFlagList', function () { // expect enableReplay to be preceding webVitalsFlag expect( screen - .getByText(webVitalsFlag.flag) - .compareDocumentPosition(screen.getByText(enableReplay.flag)) + .getByText(webVitalsFlag!.flag) + .compareDocumentPosition(screen.getByText(enableReplay!.flag)) ).toBe(document.DOCUMENT_POSITION_PRECEDING); const sortControl = screen.getByRole('button', { @@ -189,8 +189,8 @@ describe('EventFeatureFlagList', function () { // expect enableReplay to be following webVitalsFlag expect( screen - .getByText(webVitalsFlag.flag) - .compareDocumentPosition(screen.getByText(enableReplay.flag)) + .getByText(webVitalsFlag!.flag) + .compareDocumentPosition(screen.getByText(enableReplay!.flag)) ).toBe(document.DOCUMENT_POSITION_FOLLOWING); await userEvent.click(sortControl); @@ -199,8 +199,8 @@ describe('EventFeatureFlagList', function () { // expect enableReplay to be preceding webVitalsFlag, A-Z sort by default expect( screen - .getByText(webVitalsFlag.flag) - .compareDocumentPosition(screen.getByText(enableReplay.flag)) + .getByText(webVitalsFlag!.flag) + .compareDocumentPosition(screen.getByText(enableReplay!.flag)) ).toBe(document.DOCUMENT_POSITION_PRECEDING); await userEvent.click(sortControl); @@ -209,8 +209,8 @@ describe('EventFeatureFlagList', function () { // expect enableReplay to be following webVitalsFlag expect( screen - .getByText(webVitalsFlag.flag) - .compareDocumentPosition(screen.getByText(enableReplay.flag)) + .getByText(webVitalsFlag!.flag) + .compareDocumentPosition(screen.getByText(enableReplay!.flag)) ).toBe(document.DOCUMENT_POSITION_FOLLOWING); }); diff --git a/static/app/components/events/featureFlags/featureFlagDrawer.spec.tsx b/static/app/components/events/featureFlags/featureFlagDrawer.spec.tsx index fe7d03a9646203..cff3ed55b90c33 100644 --- a/static/app/components/events/featureFlags/featureFlagDrawer.spec.tsx +++ b/static/app/components/events/featureFlags/featureFlagDrawer.spec.tsx @@ -79,16 +79,16 @@ describe('FeatureFlagDrawer', function () { const drawerScreen = await renderFlagDrawer(); const [webVitalsFlag, enableReplay] = MOCK_FLAGS.filter(f => f.result === true); - expect(within(drawerScreen).getByText(webVitalsFlag.flag)).toBeInTheDocument(); - expect(within(drawerScreen).getByText(enableReplay.flag)).toBeInTheDocument(); + expect(within(drawerScreen).getByText(webVitalsFlag!.flag)).toBeInTheDocument(); + expect(within(drawerScreen).getByText(enableReplay!.flag)).toBeInTheDocument(); const searchInput = within(drawerScreen).getByRole('textbox', { name: 'Search Flags', }); - await userEvent.type(searchInput, webVitalsFlag.flag); + await userEvent.type(searchInput, webVitalsFlag!.flag); - expect(within(drawerScreen).getByText(webVitalsFlag.flag)).toBeInTheDocument(); - expect(within(drawerScreen).queryByText(enableReplay.flag)).not.toBeInTheDocument(); + expect(within(drawerScreen).getByText(webVitalsFlag!.flag)).toBeInTheDocument(); + expect(within(drawerScreen).queryByText(enableReplay!.flag)).not.toBeInTheDocument(); }); it('allows sort dropdown to affect displayed flags', async function () { @@ -99,8 +99,8 @@ describe('FeatureFlagDrawer', function () { // the flags are reversed by default, so webVitalsFlag should be following enableReplay expect( within(drawerScreen) - .getByText(enableReplay.flag) - .compareDocumentPosition(within(drawerScreen).getByText(webVitalsFlag.flag)) + .getByText(enableReplay!.flag) + .compareDocumentPosition(within(drawerScreen).getByText(webVitalsFlag!.flag)) ).toBe(document.DOCUMENT_POSITION_FOLLOWING); const sortControl = within(drawerScreen).getByRole('button', { @@ -114,8 +114,8 @@ describe('FeatureFlagDrawer', function () { // expect webVitalsFlag to be preceding enableReplay expect( within(drawerScreen) - .getByText(enableReplay.flag) - .compareDocumentPosition(within(drawerScreen).getByText(webVitalsFlag.flag)) + .getByText(enableReplay!.flag) + .compareDocumentPosition(within(drawerScreen).getByText(webVitalsFlag!.flag)) ).toBe(document.DOCUMENT_POSITION_PRECEDING); await userEvent.click(sortControl); @@ -128,8 +128,8 @@ describe('FeatureFlagDrawer', function () { // enableReplay follows webVitalsFlag in Z-A sort expect( within(drawerScreen) - .getByText(webVitalsFlag.flag) - .compareDocumentPosition(within(drawerScreen).getByText(enableReplay.flag)) + .getByText(webVitalsFlag!.flag) + .compareDocumentPosition(within(drawerScreen).getByText(enableReplay!.flag)) ).toBe(document.DOCUMENT_POSITION_FOLLOWING); }); diff --git a/static/app/components/events/featureFlags/featureFlagOnboardingSidebar.tsx b/static/app/components/events/featureFlags/featureFlagOnboardingSidebar.tsx index ea3a6dbd5551ad..8f1eca42a7dbc7 100644 --- a/static/app/components/events/featureFlags/featureFlagOnboardingSidebar.tsx +++ b/static/app/components/events/featureFlags/featureFlagOnboardingSidebar.tsx @@ -173,7 +173,7 @@ function OnboardingContent({ value: string; label?: ReactNode; textValue?: string; - }>(openFeatureProviderOptions[0]); + }>(openFeatureProviderOptions[0]!); // Second dropdown: other SDK providers const sdkProviderOptions = sdkProviders.map(provider => { @@ -188,7 +188,7 @@ function OnboardingContent({ value: string; label?: ReactNode; textValue?: string; - }>(sdkProviderOptions[0]); + }>(sdkProviderOptions[0]!); const defaultTab: string = 'openFeature'; const {getParamValue: setupMode, setParamValue: setSetupMode} = useUrlParams( diff --git a/static/app/components/events/groupingInfo/groupingInfoSection.spec.tsx b/static/app/components/events/groupingInfo/groupingInfoSection.spec.tsx index 7b29d7e8e30b77..3e9094272447cd 100644 --- a/static/app/components/events/groupingInfo/groupingInfoSection.spec.tsx +++ b/static/app/components/events/groupingInfo/groupingInfoSection.spec.tsx @@ -106,7 +106,7 @@ describe('EventGroupingInfo', function () { }, }); - await userEvent.click(screen.getAllByRole('button', {name: 'default:XXXX'})[0]); + await userEvent.click(screen.getAllByRole('button', {name: 'default:XXXX'})[0]!); await userEvent.click(screen.getByRole('option', {name: 'new:XXXX'})); // Should show new hash diff --git a/static/app/components/events/highlights/editHighlightsModal.spec.tsx b/static/app/components/events/highlights/editHighlightsModal.spec.tsx index fa50b3b3d16269..4b6c7b874fadbe 100644 --- a/static/app/components/events/highlights/editHighlightsModal.spec.tsx +++ b/static/app/components/events/highlights/editHighlightsModal.spec.tsx @@ -152,7 +152,7 @@ describe('EditHighlightsModal', function () { const previewCtxButtons = screen.queryAllByTestId('highlights-remove-ctx'); expect(previewCtxButtons).toHaveLength(highlightContextTitles.length); - await userEvent.click(previewTagButtons[0]); + await userEvent.click(previewTagButtons[0]!); expect(analyticsSpy).toHaveBeenCalledWith( 'highlights.edit_modal.remove_tag', expect.anything() @@ -161,7 +161,7 @@ describe('EditHighlightsModal', function () { previewTagButtons.length - 1 ); - await userEvent.click(previewCtxButtons[0]); + await userEvent.click(previewCtxButtons[0]!); expect(analyticsSpy).toHaveBeenCalledWith( 'highlights.edit_modal.remove_context_key', expect.anything() diff --git a/static/app/components/events/highlights/highlightsDataSection.spec.tsx b/static/app/components/events/highlights/highlightsDataSection.spec.tsx index 2f56f466900287..e4f93f1b117d08 100644 --- a/static/app/components/events/highlights/highlightsDataSection.spec.tsx +++ b/static/app/components/events/highlights/highlightsDataSection.spec.tsx @@ -98,7 +98,7 @@ describe('HighlightsDataSection', function () { .closest('div[data-test-id=highlight-tag-row]') as HTMLElement; // If highlight is present on the event... if (eventTagMap.hasOwnProperty(tagKey)) { - expect(within(row).getByText(eventTagMap[tagKey])).toBeInTheDocument(); + expect(within(row).getByText(eventTagMap[tagKey]!)).toBeInTheDocument(); const highlightTagDropdown = within(row).getByLabelText('Tag Actions Menu'); expect(highlightTagDropdown).toBeInTheDocument(); await userEvent.click(highlightTagDropdown); diff --git a/static/app/components/events/highlights/highlightsDataSection.tsx b/static/app/components/events/highlights/highlightsDataSection.tsx index 72c9d75af74639..524e96fd436faa 100644 --- a/static/app/components/events/highlights/highlightsDataSection.tsx +++ b/static/app/components/events/highlights/highlightsDataSection.tsx @@ -151,7 +151,7 @@ function HighlightsData({ // find the replayId from either context or tags, if it exists const contextReplayItem = highlightContextDataItems.find( - e => e.data.length && e.data[0].key === 'replay_id' + e => e.data.length && e.data[0]!.key === 'replay_id' ); const contextReplayId = contextReplayItem?.value ?? EMPTY_HIGHLIGHT_DEFAULT; diff --git a/static/app/components/events/highlights/util.spec.tsx b/static/app/components/events/highlights/util.spec.tsx index e46784cf47bed7..0ce2af90019dd6 100644 --- a/static/app/components/events/highlights/util.spec.tsx +++ b/static/app/components/events/highlights/util.spec.tsx @@ -29,14 +29,14 @@ describe('getHighlightContextData', function () { location: {query: {}} as Location, }); expect(highlightCtxData).toHaveLength(1); - expect(highlightCtxData[0].alias).toBe('keyboard'); - expect(highlightCtxData[0].type).toBe('default'); - expect(highlightCtxData[0].data).toHaveLength(highlightContext.keyboard.length); - const highlightCtxDataKeys = new Set(highlightCtxData[0].data.map(({key}) => key)); + expect(highlightCtxData[0]!.alias).toBe('keyboard'); + expect(highlightCtxData[0]!.type).toBe('default'); + expect(highlightCtxData[0]!.data).toHaveLength(highlightContext.keyboard.length); + const highlightCtxDataKeys = new Set(highlightCtxData[0]!.data.map(({key}) => key)); for (const ctxKey of highlightContext.keyboard) { expect(highlightCtxDataKeys.has(ctxKey)).toBe(true); } - const missingCtxHighlightFromEvent = highlightCtxData[0].data?.find( + const missingCtxHighlightFromEvent = highlightCtxData[0]!.data?.find( d => d.key === missingContextKey ); expect(missingCtxHighlightFromEvent?.value).toBe(EMPTY_HIGHLIGHT_DEFAULT); @@ -59,7 +59,7 @@ describe('getHighlightContextData', function () { location: {query: {}} as Location, }); expect(highlightCtxData).toHaveLength(1); - expect(highlightCtxData[0].type).toBe('os'); + expect(highlightCtxData[0]!.type).toBe('os'); }); }); diff --git a/static/app/components/events/highlights/util.tsx b/static/app/components/events/highlights/util.tsx index 233ba463aeb5bc..f952127f7869d5 100644 --- a/static/app/components/events/highlights/util.tsx +++ b/static/app/components/events/highlights/util.tsx @@ -61,7 +61,7 @@ function getFuzzyHighlightContext( }; } - const highlightContextKeys = highlightContextSets[highlightKey]; + const highlightContextKeys = highlightContextSets[highlightKey]!; const highlightItems: KeyValueListData = data.filter( ({key, subject}) => // We match on key (e.g. 'trace_id') and subject (e.g. 'Trace ID') diff --git a/static/app/components/events/interfaces/analyzeFrames.tsx b/static/app/components/events/interfaces/analyzeFrames.tsx index 60d6a2eb90e337..bc784f0b76b79e 100644 --- a/static/app/components/events/interfaces/analyzeFrames.tsx +++ b/static/app/components/events/interfaces/analyzeFrames.tsx @@ -171,7 +171,7 @@ function satisfiesFunctionCondition(frame: Frame, suspect: SuspectFrame) { return false; } for (let index = 0; index < suspect.functions.length; index++) { - const matchFuction = suspect.functions[index]; + const matchFuction = suspect.functions[index]!; const match = typeof matchFuction === 'string' ? frame.function === matchFuction @@ -219,7 +219,7 @@ export function analyzeFramesForRootCause(event: Event): { // iterating the frames in reverse order, because the topmost frames most like the root cause for (let index = exceptionFrames.length - 1; index >= 0; index--) { - const frame = exceptionFrames[index]; + const frame = exceptionFrames[index]!; const rootCause = analyzeFrameForRootCause(frame, currentThread); if (defined(rootCause)) { return rootCause; diff --git a/static/app/components/events/interfaces/breadcrumbs/breadcrumbs.tsx b/static/app/components/events/interfaces/breadcrumbs/breadcrumbs.tsx index 516b532fdf0e17..4945d94132178c 100644 --- a/static/app/components/events/interfaces/breadcrumbs/breadcrumbs.tsx +++ b/static/app/components/events/interfaces/breadcrumbs/breadcrumbs.tsx @@ -67,15 +67,15 @@ function renderBreadCrumbRow({index, key, parent, style}: RenderBreadCrumbRowPro > f.value === `type-${breadcrumb.type}` + f => f.value === `type-${breadcrumb!.type}` ); if (foundFilterType === -1) { filterTypes.push({ - value: `type-${breadcrumb.type}`, - leadingItems: , - label: breadcrumb.description, - levels: breadcrumb?.level ? [breadcrumb.level] : [], + value: `type-${breadcrumb!.type}`, + leadingItems: , + label: breadcrumb!.description, + levels: breadcrumb!.level ? [breadcrumb!.level] : [], }); continue; } if ( breadcrumb?.level && - !filterTypes[foundFilterType].levels?.includes(breadcrumb.level) + !filterTypes[foundFilterType]!.levels?.includes(breadcrumb.level) ) { - filterTypes[foundFilterType].levels?.push(breadcrumb.level); + filterTypes[foundFilterType]!.levels?.push(breadcrumb!.level); } } @@ -176,8 +176,8 @@ function BreadcrumbsContainer({data, event, organization, hideTitle = false}: Pr const filterLevels: SelectOption[] = []; for (const indexType in types) { - for (const indexLevel in types[indexType].levels) { - const level = types[indexType].levels?.[indexLevel]; + for (const indexLevel in types[indexType]!.levels) { + const level = types[indexType]!.levels?.[indexLevel]; if (filterLevels.some(f => f.value === `level-${level}`)) { continue; diff --git a/static/app/components/events/interfaces/crashContent/exception/actionableItems.tsx b/static/app/components/events/interfaces/crashContent/exception/actionableItems.tsx index f6efae0defeff5..586eee6fd10fa1 100644 --- a/static/app/components/events/interfaces/crashContent/exception/actionableItems.tsx +++ b/static/app/components/events/interfaces/crashContent/exception/actionableItems.tsx @@ -246,7 +246,7 @@ interface ExpandableErrorListProps { function ExpandableErrorList({handleExpandClick, errorList}: ExpandableErrorListProps) { const [expanded, setExpanded] = useState(false); - const firstError = errorList[0]; + const firstError = errorList[0]!; const {title, desc, type} = firstError; const numErrors = errorList.length; const errorDataList = errorList.map(error => error.data ?? {}); diff --git a/static/app/components/events/interfaces/crashContent/exception/content.spec.tsx b/static/app/components/events/interfaces/crashContent/exception/content.spec.tsx index f4fc56d43c2b0e..5d05cd9e9a904b 100644 --- a/static/app/components/events/interfaces/crashContent/exception/content.spec.tsx +++ b/static/app/components/events/interfaces/crashContent/exception/content.spec.tsx @@ -136,7 +136,7 @@ describe('Exception Content', function () { newestFirst stackView={StackView.APP} event={event} - values={event.entries[0].data.values} + values={event.entries[0]!.data.values} meta={event._meta!.entries[0].data.values} projectSlug={project.slug} />, @@ -145,7 +145,7 @@ describe('Exception Content', function () { expect(screen.getAllByText(/redacted/)).toHaveLength(2); - await userEvent.hover(screen.getAllByText(/redacted/)[0]); + await userEvent.hover(screen.getAllByText(/redacted/)[0]!); expect( await screen.findByText( @@ -200,7 +200,7 @@ describe('Exception Content', function () { type={StackType.ORIGINAL} stackView={StackView.APP} event={event} - values={event.entries[0].data.values} + values={event.entries[0]!.data.values} projectSlug={project.slug} /> ); @@ -242,7 +242,7 @@ describe('Exception Content', function () { platform: 'python' as const, stackView: StackView.APP, event, - values: event.entries[0].data.values, + values: event.entries[0]!.data.values, projectSlug: project.slug, }; @@ -252,9 +252,9 @@ describe('Exception Content', function () { const exceptions = screen.getAllByTestId('exception-value'); // First exception should be the parent ExceptionGroup - expect(within(exceptions[0]).getByText('ExceptionGroup 1')).toBeInTheDocument(); + expect(within(exceptions[0]!).getByText('ExceptionGroup 1')).toBeInTheDocument(); expect( - within(exceptions[0]).getByRole('heading', {name: 'ExceptionGroup 1'}) + within(exceptions[0]!).getByRole('heading', {name: 'ExceptionGroup 1'}) ).toBeInTheDocument(); }); @@ -263,7 +263,7 @@ describe('Exception Content', function () { const exceptions = screen.getAllByTestId('exception-value'); - const exceptionGroupWithNoContext = exceptions[2]; + const exceptionGroupWithNoContext = exceptions[2]!; expect( within(exceptionGroupWithNoContext).getByText('Related Exceptions') ).toBeInTheDocument(); diff --git a/static/app/components/events/interfaces/crashContent/exception/content.tsx b/static/app/components/events/interfaces/crashContent/exception/content.tsx index 7ba4654d88c7bf..b98f29252e5517 100644 --- a/static/app/components/events/interfaces/crashContent/exception/content.tsx +++ b/static/app/components/events/interfaces/crashContent/exception/content.tsx @@ -151,7 +151,7 @@ export function Content({ const frameSourceMapDebuggerData = sourceMapDebuggerData?.exceptions[ excIdx - ].frames.map(debuggerFrame => + ]!.frames.map(debuggerFrame => prepareSourceMapDebuggerFrameInformation( sourceMapDebuggerData, debuggerFrame, diff --git a/static/app/components/events/interfaces/crashContent/exception/relatedExceptions.spec.tsx b/static/app/components/events/interfaces/crashContent/exception/relatedExceptions.spec.tsx index 1f261acefc8570..986fb9fc2a042e 100644 --- a/static/app/components/events/interfaces/crashContent/exception/relatedExceptions.spec.tsx +++ b/static/app/components/events/interfaces/crashContent/exception/relatedExceptions.spec.tsx @@ -31,14 +31,14 @@ describe('ExceptionGroupContext', function () { expect(items).toHaveLength(3); // ExceptionGroup should not link to itself - expect(within(items[0]).getByText('ExceptionGroup 1: parent')).toBeInTheDocument(); + expect(within(items[0]!).getByText('ExceptionGroup 1: parent')).toBeInTheDocument(); // Should have a link to TypeError exception expect( - within(items[1]).getByRole('button', {name: 'TypeError: nested'}) + within(items[1]!).getByRole('button', {name: 'TypeError: nested'}) ).toBeInTheDocument(); // Should have a link to child exception group expect( - within(items[2]).getByRole('button', {name: 'ExceptionGroup 2: child'}) + within(items[2]!).getByRole('button', {name: 'ExceptionGroup 2: child'}) ).toBeInTheDocument(); }); @@ -54,8 +54,8 @@ describe('ExceptionGroupContext', function () { const children = screen.getAllByRole('button'); // Order should be oldest to newest, opposite fo the previous test - expect(within(children[0]).getByText(/ExceptionGroup 2/i)).toBeInTheDocument(); - expect(within(children[1]).getByText(/TypeError/i)).toBeInTheDocument(); + expect(within(children[0]!).getByText(/ExceptionGroup 2/i)).toBeInTheDocument(); + expect(within(children[1]!).getByText(/TypeError/i)).toBeInTheDocument(); }); it('renders tree with child exception group', function () { @@ -66,13 +66,13 @@ describe('ExceptionGroupContext', function () { // Should show and link to parent exception group expect( - within(items[0]).getByRole('button', {name: 'ExceptionGroup 1: parent'}) + within(items[0]!).getByRole('button', {name: 'ExceptionGroup 1: parent'}) ).toBeInTheDocument(); // Should have a link to child exception group - expect(within(items[1]).getByText('ExceptionGroup 2: child')).toBeInTheDocument(); + expect(within(items[1]!).getByText('ExceptionGroup 2: child')).toBeInTheDocument(); // Show show and link to child exception expect( - within(items[2]).getByRole('button', {name: 'ValueError: test'}) + within(items[2]!).getByRole('button', {name: 'ValueError: test'}) ).toBeInTheDocument(); }); diff --git a/static/app/components/events/interfaces/crashContent/exception/sourceMapDebug.spec.tsx b/static/app/components/events/interfaces/crashContent/exception/sourceMapDebug.spec.tsx index 7b2e52c3e70652..b9c6c3a3cd5bad 100644 --- a/static/app/components/events/interfaces/crashContent/exception/sourceMapDebug.spec.tsx +++ b/static/app/components/events/interfaces/crashContent/exception/sourceMapDebug.spec.tsx @@ -76,7 +76,7 @@ describe('SourceMapDebug', () => { it('should use unqiue in app frames', () => { expect(debugFrames).toHaveLength(1); - expect(debugFrames[0].filename).toBe( + expect(debugFrames[0]!.filename).toBe( './app/views/organizationStats/teamInsights/controls.tsx' ); }); diff --git a/static/app/components/events/interfaces/crashContent/exception/stackTrace.spec.tsx b/static/app/components/events/interfaces/crashContent/exception/stackTrace.spec.tsx index 089dc288dc3362..124ff840ccc95a 100644 --- a/static/app/components/events/interfaces/crashContent/exception/stackTrace.spec.tsx +++ b/static/app/components/events/interfaces/crashContent/exception/stackTrace.spec.tsx @@ -121,7 +121,7 @@ describe('ExceptionStacktraceContent', function () { render( ); expect( @@ -143,7 +143,7 @@ describe('ExceptionStacktraceContent', function () { render( ); @@ -153,9 +153,9 @@ describe('ExceptionStacktraceContent', function () { expect(screen.getAllByRole('listitem')).toHaveLength(2); // inApp === true - expect(screen.getAllByRole('listitem')[1]).toHaveTextContent(frames[0].filename); + expect(screen.getAllByRole('listitem')[1]).toHaveTextContent(frames[0]!.filename); // inApp === false - expect(screen.getAllByRole('listitem')[0]).toHaveTextContent(frames[1].filename); + expect(screen.getAllByRole('listitem')[0]).toHaveTextContent(frames[1]!.filename); }); }); diff --git a/static/app/components/events/interfaces/crashContent/exception/useSourceMapDebug.spec.tsx b/static/app/components/events/interfaces/crashContent/exception/useSourceMapDebug.spec.tsx index c8177decf18622..952fcd60e859a6 100644 --- a/static/app/components/events/interfaces/crashContent/exception/useSourceMapDebug.spec.tsx +++ b/static/app/components/events/interfaces/crashContent/exception/useSourceMapDebug.spec.tsx @@ -7,8 +7,8 @@ import {getUniqueFilesFromException} from './useSourceMapDebug'; function modifyEventFrames(event: Event, modify: any): Event { const modifiedEvent = cloneDeep(event); - modifiedEvent.entries[0].data.values[0].stacktrace.frames = - event.entries[0].data.values[0].stacktrace.frames.map(frame => ({ + modifiedEvent.entries[0]!.data.values[0].stacktrace.frames = + event.entries[0]!.data.values[0].stacktrace.frames.map(frame => ({ ...frame, ...modify, })); @@ -23,7 +23,7 @@ describe('getUniqueFilesFromException', () => { platform: 'javascript', }); const result = getUniqueFilesFromException( - (event.entries as EntryException[])[0].data.values!, + (event.entries as EntryException[])[0]!.data.values!, props ); @@ -48,7 +48,7 @@ describe('getUniqueFilesFromException', () => { {filename: ''} ); const result = getUniqueFilesFromException( - (event.entries as EntryException[])[0].data.values!, + (event.entries as EntryException[])[0]!.data.values!, props ); @@ -63,7 +63,7 @@ describe('getUniqueFilesFromException', () => { {absPath: '~/myfile.js', filename: '~/myfile.js'} ); const result = getUniqueFilesFromException( - (event.entries as EntryException[])[0].data.values!, + (event.entries as EntryException[])[0]!.data.values!, props ); diff --git a/static/app/components/events/interfaces/crashContent/exception/utils.tsx b/static/app/components/events/interfaces/crashContent/exception/utils.tsx index 7ed48748022b8b..c661baa6d43e32 100644 --- a/static/app/components/events/interfaces/crashContent/exception/utils.tsx +++ b/static/app/components/events/interfaces/crashContent/exception/utils.tsx @@ -16,7 +16,7 @@ export function isFrameFilenamePathlike(frame: Frame): boolean { const parsedURL = safeURL(filename); if (parsedURL) { - filename = parsedURL.pathname.split('/').reverse()[0]; + filename = parsedURL.pathname.split('/').reverse()[0]!; } return ( @@ -58,7 +58,7 @@ export const renderLinksInText = ({ const urls = exceptionText.match(urlRegex) || []; const elements = parts.flatMap((part, index) => { - const url = urls[index]; + const url = urls[index]!; const isUrlValid = isUrl(url); let link: ReactElement | undefined; diff --git a/static/app/components/events/interfaces/crashContent/stackTrace/content.spec.tsx b/static/app/components/events/interfaces/crashContent/stackTrace/content.spec.tsx index b93c928f79b8a2..082149b0f3f85b 100644 --- a/static/app/components/events/interfaces/crashContent/stackTrace/content.spec.tsx +++ b/static/app/components/events/interfaces/crashContent/stackTrace/content.spec.tsx @@ -116,15 +116,15 @@ describe('StackTrace', function () { const frameTitles = screen.getAllByTestId('title'); // collapse the expanded frame (by default) - await userEvent.click(frameTitles[0]); + await userEvent.click(frameTitles[0]!); // all frames are now collapsed expect(screen.queryByTestId('toggle-button-expanded')).not.toBeInTheDocument(); expect(screen.getAllByTestId('toggle-button-collapsed')).toHaveLength(5); // expand penultimate and last frame - await userEvent.click(frameTitles[frameTitles.length - 2]); - await userEvent.click(frameTitles[frameTitles.length - 1]); + await userEvent.click(frameTitles[frameTitles.length - 2]!); + await userEvent.click(frameTitles[frameTitles.length - 1]!); // two frames are now collapsed expect(screen.getAllByTestId('toggle-button-expanded')).toHaveLength(2); @@ -154,8 +154,8 @@ describe('StackTrace', function () { const collapsedToggleButtons = screen.getAllByTestId('toggle-button-collapsed'); // expand penultimate and last frame - await userEvent.click(collapsedToggleButtons[collapsedToggleButtons.length - 2]); - await userEvent.click(collapsedToggleButtons[collapsedToggleButtons.length - 1]); + await userEvent.click(collapsedToggleButtons[collapsedToggleButtons.length - 2]!); + await userEvent.click(collapsedToggleButtons[collapsedToggleButtons.length - 1]!); // two frames are now collapsed expect(screen.getAllByTestId('toggle-button-expanded')).toHaveLength(2); @@ -188,7 +188,7 @@ describe('StackTrace', function () { it('does not render non in app tags', function () { const dataFrames = [...data.frames]; - dataFrames[0] = {...dataFrames[0], inApp: false}; + dataFrames[0] = {...dataFrames[0]!, inApp: false}; const newData = { ...data, @@ -204,7 +204,7 @@ describe('StackTrace', function () { it('displays a toggle button when there is more than one non-inapp frame', function () { const dataFrames = [...data.frames]; - dataFrames[0] = {...dataFrames[0], inApp: true}; + dataFrames[0] = {...dataFrames[0]!, inApp: true}; const newData = { ...data, @@ -221,11 +221,11 @@ describe('StackTrace', function () { it('shows/hides frames when toggle button clicked', async function () { const dataFrames = [...data.frames]; - dataFrames[0] = {...dataFrames[0], inApp: true}; - dataFrames[1] = {...dataFrames[1], function: 'non-in-app-frame'}; - dataFrames[2] = {...dataFrames[2], function: 'non-in-app-frame'}; - dataFrames[3] = {...dataFrames[3], function: 'non-in-app-frame'}; - dataFrames[4] = {...dataFrames[4], function: 'non-in-app-frame'}; + dataFrames[0] = {...dataFrames[0]!, inApp: true}; + dataFrames[1] = {...dataFrames[1]!, function: 'non-in-app-frame'}; + dataFrames[2] = {...dataFrames[2]!, function: 'non-in-app-frame'}; + dataFrames[3] = {...dataFrames[3]!, function: 'non-in-app-frame'}; + dataFrames[4] = {...dataFrames[4]!, function: 'non-in-app-frame'}; const newData = { ...data, @@ -244,9 +244,9 @@ describe('StackTrace', function () { it('does not display a toggle button when there is only one non-inapp frame', function () { const dataFrames = [...data.frames]; - dataFrames[0] = {...dataFrames[0], inApp: true}; - dataFrames[2] = {...dataFrames[2], inApp: true}; - dataFrames[4] = {...dataFrames[4], inApp: true}; + dataFrames[0] = {...dataFrames[0]!, inApp: true}; + dataFrames[2] = {...dataFrames[2]!, inApp: true}; + dataFrames[4] = {...dataFrames[4]!, inApp: true}; const newData = { ...data, @@ -269,7 +269,7 @@ describe('StackTrace', function () { ...data, hasSystemFrames: true, frames: [ - {...dataFrames[0], inApp: true}, + {...dataFrames[0]!, inApp: true}, ...dataFrames.splice(1, dataFrames.length), ], }; @@ -304,7 +304,7 @@ describe('StackTrace', function () { registers: {}, frames: [ ...dataFrames.splice(0, dataFrames.length - 1), - {...dataFrames[dataFrames.length - 1], inApp: true}, + {...dataFrames[dataFrames.length - 1]!, inApp: true}, ], }; @@ -339,7 +339,7 @@ describe('StackTrace', function () { hasSystemFrames: true, frames: [ ...dataFrames.slice(0, 1), - {...dataFrames[1], inApp: true}, + {...dataFrames[1]!, inApp: true}, ...dataFrames.slice(2, dataFrames.length), ], }; @@ -375,7 +375,7 @@ describe('StackTrace', function () { ...data, hasSystemFrames: true, frames: [ - {...dataFrames[0], inApp: true}, + {...dataFrames[0]!, inApp: true}, ...dataFrames.splice(1, dataFrames.length), ], }; @@ -409,7 +409,7 @@ describe('StackTrace', function () { ...data, hasSystemFrames: true, frames: [ - {...dataFrames[0], inApp: true}, + {...dataFrames[0]!, inApp: true}, ...dataFrames.splice(1, dataFrames.length), ], }; diff --git a/static/app/components/events/interfaces/crashContent/stackTrace/content.tsx b/static/app/components/events/interfaces/crashContent/stackTrace/content.tsx index f3cc30ca29ba0e..620e727d8635b0 100644 --- a/static/app/components/events/interfaces/crashContent/stackTrace/content.tsx +++ b/static/app/components/events/interfaces/crashContent/stackTrace/content.tsx @@ -86,7 +86,7 @@ function Content({ function setInitialFrameMap(): {[frameIndex: number]: boolean} { const indexMap: Record = {}; (data.frames ?? []).forEach((frame, frameIdx) => { - const nextFrame = (data.frames ?? [])[frameIdx + 1]; + const nextFrame = (data.frames ?? [])[frameIdx + 1]!; const repeatedFrame = isRepeatedFrame(frame, nextFrame); if (frameIsVisible(frame, nextFrame) && !repeatedFrame && !frame.inApp) { indexMap[frameIdx] = false; @@ -99,7 +99,7 @@ function Content({ let count = 0; const countMap: Record = {}; (data.frames ?? []).forEach((frame, frameIdx) => { - const nextFrame = (data.frames ?? [])[frameIdx + 1]; + const nextFrame = (data.frames ?? [])[frameIdx + 1]!; const repeatedFrame = isRepeatedFrame(frame, nextFrame); if (frameIsVisible(frame, nextFrame) && !repeatedFrame && !frame.inApp) { countMap[frameIdx] = count; @@ -118,8 +118,8 @@ function Content({ return false; } - const lastFrame = frames[frames.length - 1]; - const penultimateFrame = frames[frames.length - 2]; + const lastFrame = frames[frames.length - 1]!; + const penultimateFrame = frames[frames.length - 2]!; return penultimateFrame.inApp && !lastFrame.inApp; } @@ -205,7 +205,7 @@ function Content({ let convertedFrames = frames .map((frame, frameIndex) => { const prevFrame = frames[frameIndex - 1]; - const nextFrame = frames[frameIndex + 1]; + const nextFrame = frames[frameIndex + 1]!; const repeatedFrame = isRepeatedFrame(frame, nextFrame); if (repeatedFrame) { @@ -284,7 +284,7 @@ function Content({ if (convertedFrames.length > 0 && registers) { const lastFrame = convertedFrames.length - 1; - convertedFrames[lastFrame] = cloneElement(convertedFrames[lastFrame], { + convertedFrames[lastFrame] = cloneElement(convertedFrames[lastFrame]!, { registers, }); } diff --git a/static/app/components/events/interfaces/crashContent/stackTrace/nativeContent.spec.tsx b/static/app/components/events/interfaces/crashContent/stackTrace/nativeContent.spec.tsx index 8b35b2cca3a923..ee730e66b6d972 100644 --- a/static/app/components/events/interfaces/crashContent/stackTrace/nativeContent.spec.tsx +++ b/static/app/components/events/interfaces/crashContent/stackTrace/nativeContent.spec.tsx @@ -67,7 +67,7 @@ describe('Native StackTrace', function () { }); it('does not render non in app tags', function () { const dataFrames = [...data.frames]; - dataFrames[0] = {...dataFrames[0], inApp: false}; + dataFrames[0] = {...dataFrames[0]!, inApp: false}; const newData = { ...data, @@ -83,7 +83,7 @@ describe('Native StackTrace', function () { it('displays a toggle button when there is more than one non-inapp frame', function () { const dataFrames = [...data.frames]; - dataFrames[0] = {...dataFrames[0], inApp: true}; + dataFrames[0] = {...dataFrames[0]!, inApp: true}; const newData = { ...data, @@ -100,11 +100,11 @@ describe('Native StackTrace', function () { it('shows/hides frames when toggle button clicked', async function () { const dataFrames = [...data.frames]; - dataFrames[0] = {...dataFrames[0], inApp: true}; - dataFrames[1] = {...dataFrames[1], function: 'non-in-app-frame'}; - dataFrames[2] = {...dataFrames[2], function: 'non-in-app-frame'}; - dataFrames[3] = {...dataFrames[3], function: 'non-in-app-frame'}; - dataFrames[4] = {...dataFrames[4], function: 'non-in-app-frame'}; + dataFrames[0] = {...dataFrames[0]!, inApp: true}; + dataFrames[1] = {...dataFrames[1]!, function: 'non-in-app-frame'}; + dataFrames[2] = {...dataFrames[2]!, function: 'non-in-app-frame'}; + dataFrames[3] = {...dataFrames[3]!, function: 'non-in-app-frame'}; + dataFrames[4] = {...dataFrames[4]!, function: 'non-in-app-frame'}; const newData = { ...data, @@ -123,9 +123,9 @@ describe('Native StackTrace', function () { it('does not display a toggle button when there is only one non-inapp frame', function () { const dataFrames = [...data.frames]; - dataFrames[0] = {...dataFrames[0], inApp: true}; - dataFrames[2] = {...dataFrames[2], inApp: true}; - dataFrames[4] = {...dataFrames[4], inApp: true}; + dataFrames[0] = {...dataFrames[0]!, inApp: true}; + dataFrames[2] = {...dataFrames[2]!, inApp: true}; + dataFrames[4] = {...dataFrames[4]!, inApp: true}; const newData = { ...data, @@ -165,10 +165,12 @@ describe('Native StackTrace', function () { const frames = screen.getAllByTestId('stack-trace-frame'); - expect(within(frames[0]).getByTestId('symbolication-error-icon')).toBeInTheDocument(); expect( - within(frames[1]).getByTestId('symbolication-warning-icon') + within(frames[0]!).getByTestId('symbolication-error-icon') ).toBeInTheDocument(); - expect(within(frames[2]).queryByTestId(/symbolication/)).not.toBeInTheDocument(); + expect( + within(frames[1]!).getByTestId('symbolication-warning-icon') + ).toBeInTheDocument(); + expect(within(frames[2]!).queryByTestId(/symbolication/)).not.toBeInTheDocument(); }); }); diff --git a/static/app/components/events/interfaces/crashContent/stackTrace/nativeContent.tsx b/static/app/components/events/interfaces/crashContent/stackTrace/nativeContent.tsx index 53becef22c7c10..b6032c1ff7bdb4 100644 --- a/static/app/components/events/interfaces/crashContent/stackTrace/nativeContent.tsx +++ b/static/app/components/events/interfaces/crashContent/stackTrace/nativeContent.tsx @@ -74,7 +74,7 @@ export function NativeContent({ function setInitialFrameMap(): {[frameIndex: number]: boolean} { const indexMap = {}; (data.frames ?? []).forEach((frame, frameIdx) => { - const nextFrame = (data.frames ?? [])[frameIdx + 1]; + const nextFrame = (data.frames ?? [])[frameIdx + 1]!; const repeatedFrame = isRepeatedFrame(frame, nextFrame); if (frameIsVisible(frame, nextFrame) && !repeatedFrame && !frame.inApp) { indexMap[frameIdx] = false; @@ -87,7 +87,7 @@ export function NativeContent({ let count = 0; const countMap = {}; (data.frames ?? []).forEach((frame, frameIdx) => { - const nextFrame = (data.frames ?? [])[frameIdx + 1]; + const nextFrame = (data.frames ?? [])[frameIdx + 1]!; const repeatedFrame = isRepeatedFrame(frame, nextFrame); if (frameIsVisible(frame, nextFrame) && !repeatedFrame && !frame.inApp) { countMap[frameIdx] = count; @@ -180,7 +180,7 @@ export function NativeContent({ let convertedFrames = frames .map((frame, frameIndex) => { const prevFrame = frames[frameIndex - 1]; - const nextFrame = frames[frameIndex + 1]; + const nextFrame = frames[frameIndex + 1]!; const repeatedFrame = isRepeatedFrame(frame, nextFrame); if (repeatedFrame) { @@ -260,7 +260,7 @@ export function NativeContent({ if (convertedFrames.length > 0 && registers) { const lastFrame = convertedFrames.length - 1; - convertedFrames[lastFrame] = cloneElement(convertedFrames[lastFrame], { + convertedFrames[lastFrame] = cloneElement(convertedFrames[lastFrame]!, { registers, }); } diff --git a/static/app/components/events/interfaces/crons/cronTimelineSection.tsx b/static/app/components/events/interfaces/crons/cronTimelineSection.tsx index 53bd9bc1d4eab7..de2d12be6c5446 100644 --- a/static/app/components/events/interfaces/crons/cronTimelineSection.tsx +++ b/static/app/components/events/interfaces/crons/cronTimelineSection.tsx @@ -120,7 +120,7 @@ export function CronTimelineSection({event, organization, project}: Props) { diff --git a/static/app/components/events/interfaces/csp/index.spec.tsx b/static/app/components/events/interfaces/csp/index.spec.tsx index 4d7b1efc0d91df..048f83cd478626 100644 --- a/static/app/components/events/interfaces/csp/index.spec.tsx +++ b/static/app/components/events/interfaces/csp/index.spec.tsx @@ -21,7 +21,7 @@ describe('Csp report entry', function () { }, }, }); - render(, { + render(, { organization: { relayPiiConfig: JSON.stringify(DataScrubbingRelayPiiConfigFixture()), }, diff --git a/static/app/components/events/interfaces/debugMeta/index.tsx b/static/app/components/events/interfaces/debugMeta/index.tsx index 9ee105aa9b2231..d48bec86431180 100644 --- a/static/app/components/events/interfaces/debugMeta/index.tsx +++ b/static/app/components/events/interfaces/debugMeta/index.tsx @@ -82,8 +82,8 @@ function applyImageFilters( if (term.indexOf('0x') === 0) { const needle = parseAddress(term); if (needle > 0 && image.image_addr !== '0x0') { - const [startAddress, endAddress] = getImageRange(image as any); // TODO(PRISCILA): remove any - return needle >= startAddress && needle < endAddress; + const [startAddress, endAddress] = getImageRange(image); + return needle >= startAddress! && needle < endAddress!; } } @@ -184,7 +184,7 @@ export function DebugMeta({data, projectSlug, groupId, event}: DebugMetaProps) { ]; const defaultFilterSelections = ( - 'options' in filterOptions[0] ? filterOptions[0].options : [] + 'options' in filterOptions[0]! ? filterOptions[0].options : [] ).filter(opt => opt.value !== ImageStatus.UNUSED); setFilterState({ @@ -320,7 +320,7 @@ export function DebugMeta({data, projectSlug, groupId, event}: DebugMetaProps) { > diff --git a/static/app/components/events/interfaces/frame/context.tsx b/static/app/components/events/interfaces/frame/context.tsx index 41c1d465915525..b536195bb65d65 100644 --- a/static/app/components/events/interfaces/frame/context.tsx +++ b/static/app/components/events/interfaces/frame/context.tsx @@ -141,7 +141,7 @@ function Context({ ) : null; } - const startLineNo = hasContextSource ? frame.context[0][0] : 0; + const startLineNo = hasContextSource ? frame.context[0]![0] : 0; const prismClassName = fileExtension ? `language-${fileExtension}` : ''; @@ -157,14 +157,14 @@ function Context({ 
             
               {lines.map((line, i) => {
-                const contextLine = contextLines[i];
-                const isActive = activeLineNumber === contextLine[0];
+                const contextLine = contextLines[i]!;
+                const isActive = activeLineNumber === contextLine[0]!;
 
                 return (
                   
                     
                       
diff --git a/static/app/components/events/interfaces/frame/contextLine.tsx b/static/app/components/events/interfaces/frame/contextLine.tsx
index 728f36bca89365..0173962dfd3ef4 100644
--- a/static/app/components/events/interfaces/frame/contextLine.tsx
+++ b/static/app/components/events/interfaces/frame/contextLine.tsx
@@ -30,7 +30,7 @@ function ContextLine({line, isActive, children, coverage = ''}: Props) {
   let lineWs = '';
   let lineCode = '';
   if (typeof line[1] === 'string') {
-    [, lineWs, lineCode] = line[1].match(/^(\s*)(.*?)$/m)!;
+    [, lineWs, lineCode] = line[1].match(/^(\s*)(.*?)$/m)! as [string, string, string];
   }
 
   return (
diff --git a/static/app/components/events/interfaces/frame/frameVariables.spec.tsx b/static/app/components/events/interfaces/frame/frameVariables.spec.tsx
index e173bf7c25e1df..4bfd5660fffce9 100644
--- a/static/app/components/events/interfaces/frame/frameVariables.spec.tsx
+++ b/static/app/components/events/interfaces/frame/frameVariables.spec.tsx
@@ -75,7 +75,7 @@ describe('Frame Variables', function () {
 
     expect(screen.getAllByText(/redacted/)).toHaveLength(2);
 
-    await userEvent.hover(screen.getAllByText(/redacted/)[0]);
+    await userEvent.hover(screen.getAllByText(/redacted/)[0]!);
 
     expect(
       await screen.findByText(
@@ -147,8 +147,8 @@ describe('Frame Variables', function () {
 
     const nullValues = screen.getAllByTestId('value-null');
 
-    expect(within(nullValues[0]).getByText('null')).toBeInTheDocument();
-    expect(within(nullValues[1]).getByText('undefined')).toBeInTheDocument();
+    expect(within(nullValues[0]!).getByText('null')).toBeInTheDocument();
+    expect(within(nullValues[1]!).getByText('undefined')).toBeInTheDocument();
     expect(
       within(screen.getByTestId('value-boolean')).getByText('true')
     ).toBeInTheDocument();
diff --git a/static/app/components/events/interfaces/frame/stacktraceLink.tsx b/static/app/components/events/interfaces/frame/stacktraceLink.tsx
index de9c0abf74cfc3..89ec41f2e1795a 100644
--- a/static/app/components/events/interfaces/frame/stacktraceLink.tsx
+++ b/static/app/components/events/interfaces/frame/stacktraceLink.tsx
@@ -200,7 +200,7 @@ export function StacktraceLink({frame, event, line}: StacktraceLinkProps) {
       const url = new URL(sourceLink);
       const hostname = url.hostname;
       const parts = hostname.split('.');
-      const domain = parts.length > 1 ? parts[1] : '';
+      const domain = parts.length > 1 ? parts[1]! : '';
       trackAnalytics(
         'integrations.non_inapp_stacktrace_link_clicked',
         {
@@ -340,7 +340,7 @@ export function StacktraceLink({frame, event, line}: StacktraceLinkProps) {
           priority="link"
           icon={
             sourceCodeProviders.length === 1
-              ? getIntegrationIcon(sourceCodeProviders[0].provider.key, 'sm')
+              ? getIntegrationIcon(sourceCodeProviders[0]!.provider.key, 'sm')
               : undefined
           }
           onClick={() => {
@@ -349,7 +349,7 @@ export function StacktraceLink({frame, event, line}: StacktraceLinkProps) {
               {
                 view: 'stacktrace_issue_details',
                 platform: event.platform,
-                provider: sourceCodeProviders[0]?.provider.key,
+                provider: sourceCodeProviders[0]?.provider.key!,
                 setup_type: 'automatic',
                 organization,
                 ...getAnalyticsDataForEvent(event),
diff --git a/static/app/components/events/interfaces/frame/stacktraceLinkModal.tsx b/static/app/components/events/interfaces/frame/stacktraceLinkModal.tsx
index c4ef2bc695c8ba..b1cf126d46a630 100644
--- a/static/app/components/events/interfaces/frame/stacktraceLinkModal.tsx
+++ b/static/app/components/events/interfaces/frame/stacktraceLinkModal.tsx
@@ -87,10 +87,10 @@ function StacktraceLinkModal({
   // If they have more than one, they'll have to navigate themselves
   const hasOneSourceCodeIntegration = sourceCodeProviders.length === 1;
   const sourceUrl = hasOneSourceCodeIntegration
-    ? `https://${sourceCodeProviders[0].domainName}`
+    ? `https://${sourceCodeProviders[0]!.domainName}`
     : undefined;
   const providerName = hasOneSourceCodeIntegration
-    ? sourceCodeProviders[0].name
+    ? sourceCodeProviders[0]!.name
     : t('source code');
 
   const onManualSetup = () => {
@@ -99,7 +99,7 @@ function StacktraceLinkModal({
       setup_type: 'manual',
       provider:
         sourceCodeProviders.length === 1
-          ? sourceCodeProviders[0].provider.name
+          ? sourceCodeProviders[0]!.provider.name
           : 'unknown',
       organization,
     });
@@ -171,7 +171,7 @@ function StacktraceLinkModal({
                           onClick={onManualSetup}
                           to={
                             hasOneSourceCodeIntegration
-                              ? `/settings/${organization.slug}/integrations/${sourceCodeProviders[0].provider.key}/${sourceCodeProviders[0].id}/`
+                              ? `/settings/${organization.slug}/integrations/${sourceCodeProviders[0]!.provider.key}/${sourceCodeProviders[0]!.id}/`
                               : `/settings/${organization.slug}/integrations/`
                           }
                         />
@@ -200,7 +200,7 @@ function StacktraceLinkModal({
                     ? tct('Go to [link]', {
                         link: (
                           
-                            {sourceCodeProviders[0].provider.name}
+                            {sourceCodeProviders[0]!.provider.name}
                           
                         ),
                       })
diff --git a/static/app/components/events/interfaces/frame/usePrismTokensSourceContext.tsx b/static/app/components/events/interfaces/frame/usePrismTokensSourceContext.tsx
index 7fc3e56077d458..f82ece58927308 100644
--- a/static/app/components/events/interfaces/frame/usePrismTokensSourceContext.tsx
+++ b/static/app/components/events/interfaces/frame/usePrismTokensSourceContext.tsx
@@ -253,7 +253,7 @@ export const usePrismTokensSourceContext = ({
 }) => {
   const organization = useOrganization({allowNull: true});
 
-  const fullLanguage = getPrismLanguage(fileExtension);
+  const fullLanguage = getPrismLanguage(fileExtension)!;
   const {preCode, executedCode, postCode} = convertContextLines(contextLines, lineNo);
   const code = preCode + executedCode + postCode;
 
diff --git a/static/app/components/events/interfaces/keyValueList/index.spec.tsx b/static/app/components/events/interfaces/keyValueList/index.spec.tsx
index 22f4670cac552e..f0e24cbc5b440d 100644
--- a/static/app/components/events/interfaces/keyValueList/index.spec.tsx
+++ b/static/app/components/events/interfaces/keyValueList/index.spec.tsx
@@ -14,11 +14,11 @@ describe('KeyValueList', function () {
     const rows = screen.getAllByRole('row');
     expect(rows).toHaveLength(2);
 
-    const firstColumn = within(rows[0]).getAllByRole('cell');
+    const firstColumn = within(rows[0]!).getAllByRole('cell');
     expect(firstColumn[0]).toHaveTextContent('a');
     expect(firstColumn[1]).toHaveTextContent('x');
 
-    const secondColumn = within(rows[1]).getAllByRole('cell');
+    const secondColumn = within(rows[1]!).getAllByRole('cell');
     expect(secondColumn[0]).toHaveTextContent('b');
     expect(secondColumn[1]).toHaveTextContent('y');
   });
@@ -33,11 +33,11 @@ describe('KeyValueList', function () {
 
     const rows = screen.getAllByRole('row');
 
-    const firstColumn = within(rows[0]).getAllByRole('cell');
+    const firstColumn = within(rows[0]!).getAllByRole('cell');
     expect(firstColumn[0]).toHaveTextContent('a');
     expect(firstColumn[1]).toHaveTextContent('x');
 
-    const secondColumn = within(rows[1]).getAllByRole('cell');
+    const secondColumn = within(rows[1]!).getAllByRole('cell');
     expect(secondColumn[0]).toHaveTextContent('b');
     expect(secondColumn[1]).toHaveTextContent('y');
   });
@@ -52,11 +52,11 @@ describe('KeyValueList', function () {
 
     const rows = screen.getAllByRole('row');
 
-    const firstColumn = within(rows[0]).getAllByRole('cell');
+    const firstColumn = within(rows[0]!).getAllByRole('cell');
     expect(firstColumn[0]).toHaveTextContent('a');
     expect(firstColumn[1]).toHaveTextContent(''); // empty string
 
-    const secondColumn = within(rows[1]).getAllByRole('cell');
+    const secondColumn = within(rows[1]!).getAllByRole('cell');
     expect(secondColumn[0]).toHaveTextContent('b');
     expect(secondColumn[1]).toHaveTextContent('y');
   });
@@ -72,10 +72,10 @@ describe('KeyValueList', function () {
     const rows = screen.getAllByRole('row');
 
     // Ignore values, more interested in if keys rendered + are sorted
-    const firstColumn = within(rows[0]).getAllByRole('cell');
+    const firstColumn = within(rows[0]!).getAllByRole('cell');
     expect(firstColumn[0]).toHaveTextContent('a');
 
-    const secondColumn = within(rows[1]).getAllByRole('cell');
+    const secondColumn = within(rows[1]!).getAllByRole('cell');
     expect(secondColumn[0]).toHaveTextContent('b');
   });
 
diff --git a/static/app/components/events/interfaces/performance/spanEvidenceKeyValueList.tsx b/static/app/components/events/interfaces/performance/spanEvidenceKeyValueList.tsx
index 59502e75f3b180..edde63cbac628b 100644
--- a/static/app/components/events/interfaces/performance/spanEvidenceKeyValueList.tsx
+++ b/static/app/components/events/interfaces/performance/spanEvidenceKeyValueList.tsx
@@ -74,7 +74,7 @@ function ConsecutiveDBQueriesSpanEvidence({
         [
           makeTransactionNameRow(event, organization, location, projectSlug),
           causeSpans
-            ? makeRow(t('Starting Span'), getSpanEvidenceValue(causeSpans[0]))
+            ? makeRow(t('Starting Span'), getSpanEvidenceValue(causeSpans[0]!))
             : null,
           makeRow('Parallelizable Spans', offendingSpans.map(getSpanEvidenceValue)),
           makeRow(
@@ -124,11 +124,11 @@ function LargeHTTPPayloadSpanEvidence({
       data={
         [
           makeTransactionNameRow(event, organization, location, projectSlug),
-          makeRow(t('Large HTTP Payload Span'), getSpanEvidenceValue(offendingSpans[0])),
+          makeRow(t('Large HTTP Payload Span'), getSpanEvidenceValue(offendingSpans[0]!)),
           makeRow(
             t('Payload Size'),
-            getSpanFieldBytes(offendingSpans[0], 'http.response_content_length') ??
-              getSpanFieldBytes(offendingSpans[0], 'Encoded Body Size')
+            getSpanFieldBytes(offendingSpans[0]!, 'http.response_content_length') ??
+              getSpanFieldBytes(offendingSpans[0]!, 'Encoded Body Size')
           ),
         ].filter(Boolean) as KeyValueListData
       }
@@ -182,7 +182,7 @@ function NPlusOneDBQueriesSpanEvidence({
           makeTransactionNameRow(event, organization, location, projectSlug),
           parentSpan ? makeRow(t('Parent Span'), getSpanEvidenceValue(parentSpan)) : null,
           causeSpans.length > 0
-            ? makeRow(t('Preceding Span'), getSpanEvidenceValue(causeSpans[0]))
+            ? makeRow(t('Preceding Span'), getSpanEvidenceValue(causeSpans[0]!))
             : null,
           ...repeatingSpanRows,
         ].filter(Boolean) as KeyValueListData
@@ -202,7 +202,7 @@ function NPlusOneAPICallsSpanEvidence({
   const baseURL = requestEntry?.data?.url;
 
   const problemParameters = formatChangingQueryParameters(offendingSpans, baseURL);
-  const commonPathPrefix = formatBasePath(offendingSpans[0], baseURL);
+  const commonPathPrefix = formatBasePath(offendingSpans[0]!, baseURL);
 
   return (
     
@@ -394,12 +394,15 @@ function RenderBlockingAssetSpanEvidence({
     
   );
@@ -416,15 +419,15 @@ function UncompressedAssetSpanEvidence({
     
@@ -444,7 +447,7 @@ function DefaultSpanEvidence({
         [
           makeTransactionNameRow(event, organization, location, projectSlug),
           offendingSpans.length > 0
-            ? makeRow(t('Offending Span'), getSpanEvidenceValue(offendingSpans[0]))
+            ? makeRow(t('Offending Span'), getSpanEvidenceValue(offendingSpans[0]!))
             : null,
         ].filter(Boolean) as KeyValueListData
       }
@@ -658,7 +661,7 @@ function formatChangingQueryParameters(spans: Span[], baseURL?: string): string[
 
   const pairs: string[] = [];
   for (const key in allQueryParameters) {
-    const values = allQueryParameters[key];
+    const values = allQueryParameters[key]!;
 
     // By definition, if the parameter only has one value that means it's not
     // changing between calls, so omit it!
@@ -690,7 +693,7 @@ export const extractSpanURLString = (span: Span, baseURL?: string): URL | null =
     }
   }
 
-  const [_method, _url] = (span?.description ?? '').split(' ', 2);
+  const [_method, _url] = (span?.description ?? '').split(' ', 2) as [string, string];
 
   return safeURL(_url, baseURL) ?? null;
 };
diff --git a/static/app/components/events/interfaces/request/index.spec.tsx b/static/app/components/events/interfaces/request/index.spec.tsx
index 2ee61131f256e3..030807ee837cad 100644
--- a/static/app/components/events/interfaces/request/index.spec.tsx
+++ b/static/app/components/events/interfaces/request/index.spec.tsx
@@ -172,7 +172,7 @@ describe('Request entry', function () {
       },
     });
 
-    render(, {
+    render(, {
       organization: {
         relayPiiConfig: JSON.stringify(DataScrubbingRelayPiiConfigFixture()),
       },
@@ -186,7 +186,7 @@ describe('Request entry', function () {
 
     expect(screen.getAllByText(/redacted/)).toHaveLength(7);
 
-    await userEvent.hover(screen.getAllByText(/redacted/)[0]);
+    await userEvent.hover(screen.getAllByText(/redacted/)[0]!);
 
     expect(
       await screen.findByText(
@@ -221,7 +221,7 @@ describe('Request entry', function () {
         ],
       });
 
-      render(, {
+      render(, {
         organization: {
           relayPiiConfig: JSON.stringify(DataScrubbingRelayPiiConfigFixture()),
         },
@@ -255,7 +255,7 @@ describe('Request entry', function () {
         ],
       });
 
-      render(, {
+      render(, {
         organization: {
           relayPiiConfig: JSON.stringify(DataScrubbingRelayPiiConfigFixture()),
         },
@@ -289,7 +289,7 @@ describe('Request entry', function () {
         ],
       });
 
-      render(, {
+      render(, {
         organization: {
           relayPiiConfig: JSON.stringify(DataScrubbingRelayPiiConfigFixture()),
         },
@@ -325,7 +325,7 @@ describe('Request entry', function () {
       });
 
       expect(() =>
-        render(, {
+        render(, {
           organization: {
             relayPiiConfig: JSON.stringify(DataScrubbingRelayPiiConfigFixture()),
           },
@@ -357,7 +357,7 @@ describe('Request entry', function () {
         ],
       });
       expect(() =>
-        render(, {
+        render(, {
           organization: {
             relayPiiConfig: JSON.stringify(DataScrubbingRelayPiiConfigFixture()),
           },
@@ -388,7 +388,7 @@ describe('Request entry', function () {
       });
 
       expect(() =>
-        render(, {
+        render(, {
           organization: {
             relayPiiConfig: JSON.stringify(DataScrubbingRelayPiiConfigFixture()),
           },
@@ -418,7 +418,7 @@ describe('Request entry', function () {
           ],
         });
 
-        render();
+        render();
 
         expect(screen.getByText('query Test { test }')).toBeInTheDocument();
         expect(screen.getByRole('row', {name: 'operationName Test'})).toBeInTheDocument();
@@ -456,7 +456,7 @@ describe('Request entry', function () {
         });
 
         const {container} = render(
-          
+          
         );
 
         expect(container.querySelector('.line-highlight')).toBeInTheDocument();
diff --git a/static/app/components/events/interfaces/searchBarAction.spec.tsx b/static/app/components/events/interfaces/searchBarAction.spec.tsx
index b1af6870ff031f..dbf5f58e269a99 100644
--- a/static/app/components/events/interfaces/searchBarAction.spec.tsx
+++ b/static/app/components/events/interfaces/searchBarAction.spec.tsx
@@ -115,7 +115,7 @@ describe('SearchBarAction', () => {
   });
 
   it('With Option Type only', async () => {
-    const typeOptions = options[0];
+    const typeOptions = options[0]!;
     render(
        {
   });
 
   it('With Option Level only', async () => {
-    const levelOptions = options[1];
+    const levelOptions = options[1]!;
     render(
       
       {Array.from(measurements.values()).map(verticalMark => {
-        const mark = Object.values(verticalMark.marks)[0];
+        const mark = Object.values(verticalMark.marks)[0]!;
         const {timestamp} = mark;
         const bounds = getMeasurementBounds(timestamp, generateBounds);
 
@@ -45,7 +45,7 @@ function MeasurementsPanel(props: Props) {
 
         const vitalLabels: VitalLabel[] = Object.keys(verticalMark.marks).map(name => ({
           vital: VITAL_DETAILS[`measurements.${name}`],
-          isPoorValue: verticalMark.marks[name].failedThreshold,
+          isPoorValue: verticalMark.marks[name]!.failedThreshold,
         }));
 
         if (vitalLabels.length > 1) {
@@ -62,7 +62,7 @@ function MeasurementsPanel(props: Props) {
           
         );
       })}
diff --git a/static/app/components/events/interfaces/spans/newTraceDetailsSpanBar.tsx b/static/app/components/events/interfaces/spans/newTraceDetailsSpanBar.tsx
index 1aa192657fe6d4..97c38dccfdd1c3 100644
--- a/static/app/components/events/interfaces/spans/newTraceDetailsSpanBar.tsx
+++ b/static/app/components/events/interfaces/spans/newTraceDetailsSpanBar.tsx
@@ -329,7 +329,7 @@ export class NewTraceDetailsSpanBar extends Component<
     return (
       
         {Array.from(spanMeasurements.values()).map(verticalMark => {
-          const mark = Object.values(verticalMark.marks)[0];
+          const mark = Object.values(verticalMark.marks)[0]!;
           const {timestamp} = mark;
           const bounds = getMeasurementBounds(timestamp, generateBounds);
 
@@ -573,7 +573,7 @@ export class NewTraceDetailsSpanBar extends Component<
 
   connectObservers() {
     const observer = new IntersectionObserver(([entry]) =>
-      this.setState({isIntersecting: entry.isIntersecting}, () => {
+      this.setState({isIntersecting: entry!.isIntersecting}, () => {
         // Scrolls the next(invisible) bar from the virtualized list,
         // by its height. Allows us to look for anchored span bars occuring
         // at the bottom of the span tree.
diff --git a/static/app/components/events/interfaces/spans/newTraceDetailsSpanDetails.tsx b/static/app/components/events/interfaces/spans/newTraceDetailsSpanDetails.tsx
index a5e17c31216a18..3d870014281e6e 100644
--- a/static/app/components/events/interfaces/spans/newTraceDetailsSpanDetails.tsx
+++ b/static/app/components/events/interfaces/spans/newTraceDetailsSpanDetails.tsx
@@ -599,7 +599,7 @@ function NewTraceDetailsSpanDetail(props: SpanDetailProps) {
 
 function SpanHTTPInfo({span}: {span: RawSpanType}) {
   if (span.op === 'http.client' && span.description) {
-    const [method, url] = span.description.split(' ');
+    const [method, url] = span.description.split(' ') as [string, string];
 
     const parsedURL = safeURL(url);
     const queryString = qs.parse(parsedURL?.search ?? '');
diff --git a/static/app/components/events/interfaces/spans/newTraceDetailsSpanTree.tsx b/static/app/components/events/interfaces/spans/newTraceDetailsSpanTree.tsx
index 0a626eb2ee50cf..3ae9bc742a86f6 100644
--- a/static/app/components/events/interfaces/spans/newTraceDetailsSpanTree.tsx
+++ b/static/app/components/events/interfaces/spans/newTraceDetailsSpanTree.tsx
@@ -309,7 +309,7 @@ class NewTraceDetailsSpanTree extends Component {
     const showHiddenSpansMessage = !isCurrentSpanHidden && numOfSpansOutOfViewAbove > 0;
 
     if (showHiddenSpansMessage) {
-      firstHiddenSpanId = getSpanID(outOfViewSpansAbove[0].span);
+      firstHiddenSpanId = getSpanID(outOfViewSpansAbove[0]!.span);
       messages.push(
         
           {numOfSpansOutOfViewAbove} {t('spans out of view')}
@@ -322,7 +322,7 @@ class NewTraceDetailsSpanTree extends Component {
       !isCurrentSpanFilteredOut && numOfFilteredSpansAbove > 0;
 
     if (showFilteredSpansMessage) {
-      firstHiddenSpanId = getSpanID(filteredSpansAbove[0].span);
+      firstHiddenSpanId = getSpanID(filteredSpansAbove[0]!.span);
       if (!isCurrentSpanHidden) {
         if (numOfFilteredSpansAbove === 1) {
           messages.push(
@@ -499,7 +499,7 @@ class NewTraceDetailsSpanTree extends Component {
           // and it's a last child.
           const generationOffset =
             parentContinuingDepths.length === 1 &&
-            parentContinuingDepths[0].depth === 0 &&
+            parentContinuingDepths[0]!.depth === 0 &&
             parentGeneration > 2
               ? 2
               : 1;
@@ -864,7 +864,7 @@ function SpanRow(props: SpanRowProps) {
   } = props;
 
   const rowRef = useRef(null);
-  const spanNode = spanTree[index];
+  const spanNode = spanTree[index]!;
 
   useEffect(() => {
     // Gap spans do not have IDs, so we can't really store them. This should not be a big deal, since
diff --git a/static/app/components/events/interfaces/spans/spanBar.tsx b/static/app/components/events/interfaces/spans/spanBar.tsx
index 7754f40a2a64f1..535c0c8834a60e 100644
--- a/static/app/components/events/interfaces/spans/spanBar.tsx
+++ b/static/app/components/events/interfaces/spans/spanBar.tsx
@@ -425,7 +425,7 @@ export class SpanBar extends Component {
     return (
       
         {Array.from(measurements.values()).map(verticalMark => {
-          const mark = Object.values(verticalMark.marks)[0];
+          const mark = Object.values(verticalMark.marks)[0]!;
           const {timestamp} = mark;
           const bounds = getMeasurementBounds(timestamp, generateBounds);
 
diff --git a/static/app/components/events/interfaces/spans/spanDetail.tsx b/static/app/components/events/interfaces/spans/spanDetail.tsx
index 1fd175e17b2873..f0a1b3d99912a8 100644
--- a/static/app/components/events/interfaces/spans/spanDetail.tsx
+++ b/static/app/components/events/interfaces/spans/spanDetail.tsx
@@ -196,7 +196,7 @@ function SpanDetail(props: Props) {
       return null;
     }
 
-    const childTransaction = childTransactions[0];
+    const childTransaction = childTransactions[0]!;
 
     const transactionResult: TransactionResult = {
       'project.name': childTransaction.project_slug,
diff --git a/static/app/components/events/interfaces/spans/spanProfileDetails.tsx b/static/app/components/events/interfaces/spans/spanProfileDetails.tsx
index 22f63b9582b4ca..197d5df1220176 100644
--- a/static/app/components/events/interfaces/spans/spanProfileDetails.tsx
+++ b/static/app/components/events/interfaces/spans/spanProfileDetails.tsx
@@ -107,7 +107,7 @@ export function useSpanProfileDetails(event, span) {
     // find the number of nodes with the minimum number of samples
     let hasMinCount = 0;
     for (let i = 0; i < nodes.length; i++) {
-      if (nodes[i].count >= TOP_NODE_MIN_COUNT) {
+      if (nodes[i]!.count >= TOP_NODE_MIN_COUNT) {
         hasMinCount += 1;
       } else {
         break;
@@ -125,7 +125,7 @@ export function useSpanProfileDetails(event, span) {
     }
 
     return {
-      frames: extractFrames(nodes[index], event.platform || 'other'),
+      frames: extractFrames(nodes[index]!, event.platform || 'other'),
       hasPrevious: index > 0,
       hasNext: index + 1 < maxNodes,
     };
@@ -195,7 +195,7 @@ export function SpanProfileDetails({
     return null;
   }
 
-  const percentage = formatPercentage(nodes[index].count / totalWeight);
+  const percentage = formatPercentage(nodes[index]!.count / totalWeight);
 
   return (
     
@@ -217,7 +217,7 @@ export function SpanProfileDetails({
           size="xs"
           title={t(
             '%s out of %s (%s) of the call stacks collected during this span',
-            nodes[index].count,
+            nodes[index]!.count,
             totalWeight,
             percentage
           )}
@@ -274,11 +274,11 @@ function getTopNodes(profile: Profile, startTimestamp, stopTimestamp): CallTreeN
   const callTree: CallTreeNode = new CallTreeNode(ProfilingFrame.Root, null);
 
   for (let i = 0; i < profile.samples.length; i++) {
-    const sample = profile.samples[i];
+    const sample = profile.samples[i]!;
     // TODO: should this take self times into consideration?
     const inRange = startTimestamp <= duration && duration < stopTimestamp;
 
-    duration += profile.weights[i];
+    duration += profile.weights[i]!;
 
     if (sample.isRoot || !inRange) {
       continue;
diff --git a/static/app/components/events/interfaces/spans/spanSiblingGroupBar.tsx b/static/app/components/events/interfaces/spans/spanSiblingGroupBar.tsx
index c65f4b88d04776..75fb10f64bf148 100644
--- a/static/app/components/events/interfaces/spans/spanSiblingGroupBar.tsx
+++ b/static/app/components/events/interfaces/spans/spanSiblingGroupBar.tsx
@@ -72,8 +72,8 @@ export default function SpanSiblingGroupBar(props: SpanSiblingGroupBarProps) {
       return '';
     }
 
-    const operation = spanGrouping[0].span.op;
-    const description = spanGrouping[0].span.description;
+    const operation = spanGrouping[0]!.span.op;
+    const description = spanGrouping[0]!.span.description;
 
     if (!description || !operation) {
       if (description) {
@@ -132,7 +132,7 @@ export default function SpanSiblingGroupBar(props: SpanSiblingGroupBarProps) {
           
         ))}
@@ -155,7 +155,7 @@ export default function SpanSiblingGroupBar(props: SpanSiblingGroupBarProps) {
       spanNumber={spanNumber}
       generateBounds={generateBounds}
       toggleSpanGroup={() => {
-        toggleSiblingSpanGroup?.(spanGrouping[0].span, occurrence);
+        toggleSiblingSpanGroup?.(spanGrouping[0]!.span, occurrence);
         isEmbeddedSpanTree &&
           trackAnalytics('issue_details.performance.autogrouped_siblings_toggle', {
             organization,
diff --git a/static/app/components/events/interfaces/spans/spanTree.tsx b/static/app/components/events/interfaces/spans/spanTree.tsx
index 41f653483eae9b..03960067aeba25 100644
--- a/static/app/components/events/interfaces/spans/spanTree.tsx
+++ b/static/app/components/events/interfaces/spans/spanTree.tsx
@@ -305,7 +305,7 @@ class SpanTree extends Component {
     const showHiddenSpansMessage = !isCurrentSpanHidden && numOfSpansOutOfViewAbove > 0;
 
     if (showHiddenSpansMessage) {
-      firstHiddenSpanId = getSpanID(outOfViewSpansAbove[0].span);
+      firstHiddenSpanId = getSpanID(outOfViewSpansAbove[0]!.span);
       messages.push(
         
           {numOfSpansOutOfViewAbove} {t('spans out of view')}
@@ -318,7 +318,7 @@ class SpanTree extends Component {
       !isCurrentSpanFilteredOut && numOfFilteredSpansAbove > 0;
 
     if (showFilteredSpansMessage) {
-      firstHiddenSpanId = getSpanID(filteredSpansAbove[0].span);
+      firstHiddenSpanId = getSpanID(filteredSpansAbove[0]!.span);
       if (!isCurrentSpanHidden) {
         if (numOfFilteredSpansAbove === 1) {
           messages.push(
@@ -816,7 +816,7 @@ function SpanRow(props: SpanRowProps) {
   } = props;
 
   const rowRef = useRef(null);
-  const spanNode = spanTree[index];
+  const spanNode = spanTree[index]!;
 
   useEffect(() => {
     // Gap spans do not have IDs, so we can't really store them. This should not be a big deal, since
diff --git a/static/app/components/events/interfaces/spans/spanTreeModel.spec.tsx b/static/app/components/events/interfaces/spans/spanTreeModel.spec.tsx
index e536a47efb7b76..1096d6022a3b5d 100644
--- a/static/app/components/events/interfaces/spans/spanTreeModel.spec.tsx
+++ b/static/app/components/events/interfaces/spans/spanTreeModel.spec.tsx
@@ -455,11 +455,11 @@ describe('SpanTreeModel', () => {
     );
 
     fullWaterfallExpected[0] = {
-      ...fullWaterfallExpected[0],
+      ...fullWaterfallExpected[0]!,
     };
-    assert(fullWaterfallExpected[0].type === 'span');
-    fullWaterfallExpected[0].numOfSpanChildren += 1;
-    fullWaterfallExpected[0].showEmbeddedChildren = true;
+    assert(fullWaterfallExpected[0]!.type === 'span');
+    fullWaterfallExpected[0]!.numOfSpanChildren += 1;
+    fullWaterfallExpected[0]!.showEmbeddedChildren = true;
 
     expect(spans).toEqual(fullWaterfallExpected);
 
@@ -559,11 +559,11 @@ describe('SpanTreeModel', () => {
       },
     };
 
-    if (!Array.isArray(event2.entries[0].data)) {
+    if (!Array.isArray(event2.entries[0]!.data)) {
       throw new Error('event2.entries[0].data is not an array');
     }
 
-    const data = event2.entries[0].data as RawSpanType[];
+    const data = event2.entries[0]!.data as RawSpanType[];
     for (let i = 0; i < 5; i++) {
       data.push(spanTemplate);
     }
@@ -603,11 +603,11 @@ describe('SpanTreeModel', () => {
     });
 
     expect(spans.length).toEqual(2);
-    expect(spans[1].type).toEqual('span_group_siblings');
+    expect(spans[1]!.type).toEqual('span_group_siblings');
 
     // If statement here is required to avoid TS linting issues
-    if (spans[1].type === 'span_group_siblings') {
-      expect(spans[1].spanSiblingGrouping!.length).toEqual(5);
+    if (spans[1]!.type === 'span_group_siblings') {
+      expect(spans[1]!.spanSiblingGrouping!.length).toEqual(5);
     }
   });
 
@@ -641,11 +641,11 @@ describe('SpanTreeModel', () => {
       },
     };
 
-    if (!Array.isArray(event2.entries[0].data)) {
+    if (!Array.isArray(event2.entries[0]!.data)) {
       throw new Error('event2.entries[0].data is not an array');
     }
 
-    const data = event2.entries[0].data as RawSpanType[];
+    const data = event2.entries[0]!.data as RawSpanType[];
     for (let i = 0; i < 4; i++) {
       data.push(spanTemplate);
     }
@@ -737,11 +737,11 @@ describe('SpanTreeModel', () => {
       },
     };
 
-    if (!Array.isArray(event2.entries[0].data)) {
+    if (!Array.isArray(event2.entries[0]!.data)) {
       throw new Error('event2.entries[0].data is not an array');
     }
 
-    const data = event2.entries[0].data as RawSpanType[];
+    const data = event2.entries[0]!.data as RawSpanType[];
     for (let i = 0; i < 7; i++) {
       data.push(groupableSpanTemplate);
     }
@@ -788,8 +788,8 @@ describe('SpanTreeModel', () => {
     });
 
     expect(spans.length).toEqual(4);
-    expect(spans[1].type).toEqual('span_group_siblings');
-    expect(spans[2].type).toEqual('span');
-    expect(spans[3].type).toEqual('span_group_siblings');
+    expect(spans[1]!.type).toEqual('span_group_siblings');
+    expect(spans[2]!.type).toEqual('span');
+    expect(spans[3]!.type).toEqual('span_group_siblings');
   });
 });
diff --git a/static/app/components/events/interfaces/spans/spanTreeModel.tsx b/static/app/components/events/interfaces/spans/spanTreeModel.tsx
index 7de0a6c3ceaf99..41fd73af6d5898 100644
--- a/static/app/components/events/interfaces/spans/spanTreeModel.tsx
+++ b/static/app/components/events/interfaces/spans/spanTreeModel.tsx
@@ -262,11 +262,11 @@ class SpanTreeModel {
       // we will need to reconstruct the tree depth information. This is only neccessary
       // when the span group chain is hidden/collapsed.
       if (spanNestedGrouping.length === 1) {
-        const treeDepthEntry = isOrphanSpan(spanNestedGrouping[0].span)
-          ? ({type: 'orphan', depth: spanNestedGrouping[0].treeDepth} as OrphanTreeDepth)
-          : spanNestedGrouping[0].treeDepth;
+        const treeDepthEntry = isOrphanSpan(spanNestedGrouping[0]!.span)
+          ? ({type: 'orphan', depth: spanNestedGrouping[0]!.treeDepth} as OrphanTreeDepth)
+          : spanNestedGrouping[0]!.treeDepth;
 
-        if (!spanNestedGrouping[0].isLastSibling) {
+        if (!spanNestedGrouping[0]!.isLastSibling) {
           continuingTreeDepths = [...continuingTreeDepths, treeDepthEntry];
         }
       }
@@ -352,11 +352,11 @@ class SpanTreeModel {
     };
 
     if (descendantsSource?.length >= MIN_SIBLING_GROUP_SIZE) {
-      let prevSpanModel = descendantsSource[0];
+      let prevSpanModel = descendantsSource[0]!;
       let currentGroup = [prevSpanModel];
 
       for (let i = 1; i < descendantsSource.length; i++) {
-        const currSpanModel = descendantsSource[i];
+        const currSpanModel = descendantsSource[i]!;
 
         // We want to group siblings only if they share the same op and description, and if they have no children
         if (
@@ -438,7 +438,7 @@ class SpanTreeModel {
           return acc;
         }
 
-        const key = getSiblingGroupKey(group[0].span, occurrence);
+        const key = getSiblingGroupKey(group[0]!.span, occurrence);
         if (this.expandedSiblingGroups.has(key)) {
           // This check is needed here, since it is possible that a user could be filtering for a specific span ID.
           // In this case, we must add only the specified span into the accumulator's descendants
@@ -482,7 +482,7 @@ class SpanTreeModel {
               });
 
               const gapSpan = this.generateSpanGap(
-                group[0].span,
+                group[0]!.span,
                 event,
                 acc.previousSiblingEndTimestamp,
                 treeDepth + 1,
@@ -512,7 +512,7 @@ class SpanTreeModel {
         // if the spans are filtered or out of bounds here
 
         if (
-          this.isSpanFilteredOut(props, group[0]) ||
+          this.isSpanFilteredOut(props, group[0]!) ||
           groupShouldBeHidden(group, focusedSpanIds)
         ) {
           group.forEach(spanModel => {
@@ -525,8 +525,8 @@ class SpanTreeModel {
         }
 
         const bounds = generateBounds({
-          startTimestamp: group[0].span.start_timestamp,
-          endTimestamp: group[group.length - 1].span.timestamp,
+          startTimestamp: group[0]!.span.start_timestamp,
+          endTimestamp: group[group.length - 1]!.span.timestamp,
         });
 
         if (!bounds.isSpanVisibleInView) {
@@ -540,7 +540,7 @@ class SpanTreeModel {
         }
 
         const gapSpan = this.generateSpanGap(
-          group[0].span,
+          group[0]!.span,
           event,
           acc.previousSiblingEndTimestamp,
           treeDepth + 1,
@@ -590,7 +590,7 @@ class SpanTreeModel {
         };
 
         acc.previousSiblingEndTimestamp =
-          wrappedSiblings[wrappedSiblings.length - 1].span.timestamp;
+          wrappedSiblings[wrappedSiblings.length - 1]!.span.timestamp;
 
         acc.descendants.push(groupedSiblingsSpan);
         return acc;
@@ -678,14 +678,14 @@ class SpanTreeModel {
       spanNestedGrouping.length === 1
     ) {
       if (!isNestedSpanGroupExpanded) {
-        const parentSpan = spanNestedGrouping[0].span;
+        const parentSpan = spanNestedGrouping[0]!.span;
         const parentSpanBounds = generateBounds({
           startTimestamp: parentSpan.start_timestamp,
           endTimestamp: parentSpan.timestamp,
         });
         const isParentSpanOutOfView = !parentSpanBounds.isSpanVisibleInView;
         if (!isParentSpanOutOfView) {
-          return [spanNestedGrouping[0], wrappedSpan, ...descendants];
+          return [spanNestedGrouping[0]!, wrappedSpan, ...descendants];
         }
       }
 
diff --git a/static/app/components/events/interfaces/spans/traceView.spec.tsx b/static/app/components/events/interfaces/spans/traceView.spec.tsx
index 6e08acbbbea14f..5285505fa72cce 100644
--- a/static/app/components/events/interfaces/spans/traceView.spec.tsx
+++ b/static/app/components/events/interfaces/spans/traceView.spec.tsx
@@ -202,7 +202,7 @@ describe('TraceView', () => {
 
       expect(screen.queryAllByText('group me')).toHaveLength(2);
 
-      const firstGroup = screen.queryAllByText('Autogrouped — http —')[0];
+      const firstGroup = screen.queryAllByText('Autogrouped — http —')[0]!;
       await userEvent.click(firstGroup);
       expect(await screen.findAllByText('group me')).toHaveLength(6);
 
@@ -210,7 +210,7 @@ describe('TraceView', () => {
       await userEvent.click(secondGroup);
       expect(await screen.findAllByText('group me')).toHaveLength(10);
 
-      const firstRegroup = screen.queryAllByText('Regroup')[0];
+      const firstRegroup = screen.queryAllByText('Regroup')[0]!;
       await userEvent.click(firstRegroup);
       expect(await screen.findAllByText('group me')).toHaveLength(6);
 
diff --git a/static/app/components/events/interfaces/spans/utils.tsx b/static/app/components/events/interfaces/spans/utils.tsx
index b3d25167f9212d..e5cade8519816b 100644
--- a/static/app/components/events/interfaces/spans/utils.tsx
+++ b/static/app/components/events/interfaces/spans/utils.tsx
@@ -700,7 +700,7 @@ function hasFailedThreshold(marks: Measurements): boolean {
   );
 
   return records.some(record => {
-    const {value} = marks[record.slug];
+    const {value} = marks[record.slug]!;
     if (typeof value === 'number' && typeof record.poorThreshold === 'number') {
       return value >= record.poorThreshold;
     }
@@ -733,7 +733,7 @@ export function getMeasurements(
   const measurements = Object.keys(event.measurements)
     .filter(name => allowedVitals.has(`measurements.${name}`))
     .map(name => {
-      const associatedMeasurement = event.measurements![name];
+      const associatedMeasurement = event.measurements![name]!;
       return {
         name,
         // Time timestamp is in seconds, but the measurement value is given in ms so convert it here
@@ -947,8 +947,8 @@ export function getSpanGroupTimestamps(spanGroup: EnhancedSpan[]) {
       };
     },
     {
-      startTimestamp: spanGroup[0].span.start_timestamp,
-      endTimestamp: spanGroup[0].span.timestamp,
+      startTimestamp: spanGroup[0]!.span.start_timestamp,
+      endTimestamp: spanGroup[0]!.span.timestamp,
     }
   );
 }
@@ -1065,22 +1065,22 @@ export function getFormattedTimeRangeWithLeadingAndTrailingZero(
     start: string[];
   }>(
     (acc, startString, index) => {
-      if (startString.length > endStrings[index].length) {
+      if (startString.length > endStrings[index]!.length) {
         acc.start.push(startString);
         acc.end.push(
           index === 0
-            ? endStrings[index].padStart(startString.length, '0')
-            : endStrings[index].padEnd(startString.length, '0')
+            ? endStrings[index]!.padStart(startString.length, '0')
+            : endStrings[index]!.padEnd(startString.length, '0')
         );
         return acc;
       }
 
       acc.start.push(
         index === 0
-          ? startString.padStart(endStrings[index].length, '0')
-          : startString.padEnd(endStrings[index].length, '0')
+          ? startString.padStart(endStrings[index]!.length, '0')
+          : startString.padEnd(endStrings[index]!.length, '0')
       );
-      acc.end.push(endStrings[index]);
+      acc.end.push(endStrings[index]!);
       return acc;
     },
     {start: [], end: []}
diff --git a/static/app/components/events/interfaces/spans/waterfallModel.spec.tsx b/static/app/components/events/interfaces/spans/waterfallModel.spec.tsx
index 6b2f210ab39afd..7ed9ae02119337 100644
--- a/static/app/components/events/interfaces/spans/waterfallModel.spec.tsx
+++ b/static/app/components/events/interfaces/spans/waterfallModel.spec.tsx
@@ -668,12 +668,12 @@ describe('WaterfallModel', () => {
 
     expected[1] = {
       type: 'out_of_view',
-      span: fullWaterfall[1].span,
+      span: fullWaterfall[1]!!.span,
     } as EnhancedProcessedSpanType;
 
     expected[4] = {
       type: 'out_of_view',
-      span: fullWaterfall[4].span,
+      span: fullWaterfall[4]!.span,
     } as EnhancedProcessedSpanType;
 
     expect(spans).toEqual(expected);
@@ -686,51 +686,51 @@ describe('WaterfallModel', () => {
     });
 
     assert(
-      fullWaterfall[10].type === 'span_group_chain' &&
-        fullWaterfall[10].spanNestedGrouping
+      fullWaterfall[10]!.type === 'span_group_chain' &&
+        fullWaterfall[10]!.spanNestedGrouping
     );
     expected = [
       {
         type: 'filtered_out',
-        span: fullWaterfall[0].span,
+        span: fullWaterfall[0]!.span,
       },
       {
         type: 'out_of_view',
-        span: fullWaterfall[1].span,
+        span: fullWaterfall[1]!!.span,
       },
       fullWaterfall[2],
       fullWaterfall[3],
       {
         type: 'filtered_out',
-        span: fullWaterfall[4].span,
+        span: fullWaterfall[4]!.span,
       },
       {
         type: 'filtered_out',
-        span: fullWaterfall[5].span,
+        span: fullWaterfall[5]!.span,
       },
       {
         type: 'filtered_out',
-        span: fullWaterfall[6].span,
+        span: fullWaterfall[6]!.span,
       },
       {
         type: 'filtered_out',
-        span: fullWaterfall[7].span,
+        span: fullWaterfall[7]!.span,
       },
       {
         type: 'filtered_out',
-        span: fullWaterfall[9].span,
+        span: fullWaterfall[9]!.span,
       },
       {
         type: 'filtered_out',
-        span: fullWaterfall[10].spanNestedGrouping[0].span,
+        span: fullWaterfall[10]!.spanNestedGrouping![0]!.span,
       },
       {
         type: 'filtered_out',
-        span: fullWaterfall[10].spanNestedGrouping[1].span,
+        span: fullWaterfall[10]!.spanNestedGrouping![1]!.span,
       },
       {
         type: 'filtered_out',
-        span: fullWaterfall[11].span,
+        span: fullWaterfall[11]!.span,
       },
     ] as EnhancedProcessedSpanType[];
 
@@ -746,7 +746,7 @@ describe('WaterfallModel', () => {
       viewEnd: 0.65,
     });
 
-    expected[1].type = 'filtered_out';
+    expected[1]!.type = 'filtered_out';
 
     expect(spans).toEqual(expected);
   });
@@ -814,7 +814,7 @@ describe('WaterfallModel', () => {
       ...event,
       entries: [
         {
-          data: [event.entries[0].data[0]],
+          data: [event.entries[0]!.data[0]],
           type: EntryType.SPANS,
         },
       ],
@@ -834,7 +834,7 @@ describe('WaterfallModel', () => {
         toggleNestedSpanGroup: undefined,
       },
       {
-        ...fullWaterfall[1],
+        ...fullWaterfall[1]!,
         isLastSibling: true,
         numOfSpanChildren: 0,
         toggleNestedSpanGroup: undefined,
@@ -848,10 +848,10 @@ describe('WaterfallModel', () => {
       entries: [
         {
           data: [
-            event.entries[0].data[0],
+            event.entries[0]!.data[0],
             {
-              ...event.entries[0].data[0],
-              parent_span_id: event.entries[0].data[0].span_id,
+              ...event.entries[0]!.data[0],
+              parent_span_id: event.entries[0]!.data[0].span_id,
               span_id: 'foo',
             },
           ],
@@ -875,17 +875,17 @@ describe('WaterfallModel', () => {
         toggleNestedSpanGroup: undefined,
       },
       {
-        ...fullWaterfall[1],
+        ...fullWaterfall[1]!,
         treeDepth: 1,
         isLastSibling: true,
         numOfSpanChildren: 1,
         toggleNestedSpanGroup: undefined,
       },
       {
-        ...fullWaterfall[1],
+        ...fullWaterfall[1]!,
         span: {
-          ...fullWaterfall[1].span,
-          parent_span_id: event.entries[0].data[0].span_id,
+          ...fullWaterfall[1]!!.span,
+          parent_span_id: event.entries[0]!.data[0]!.span_id,
           span_id: 'foo',
         },
         treeDepth: 2,
@@ -902,14 +902,14 @@ describe('WaterfallModel', () => {
       entries: [
         {
           data: [
-            event.entries[0].data[0],
+            event.entries[0]!.data[0],
             {
-              ...event.entries[0].data[0],
-              parent_span_id: event.entries[0].data[0].span_id,
+              ...event.entries[0]!.data[0],
+              parent_span_id: event.entries[0]!.data[0]!.span_id,
               span_id: 'foo',
             },
             {
-              ...event.entries[0].data[0],
+              ...event.entries[0]!.data[0],
               parent_span_id: 'foo',
               span_id: 'bar',
             },
@@ -928,7 +928,7 @@ describe('WaterfallModel', () => {
     // expect 1 or more spans are grouped
     expect(spans).toHaveLength(3);
 
-    assert(fullWaterfall[1].type === 'span');
+    assert(fullWaterfall[1]!.type === 'span');
     const collapsedWaterfallExpected = [
       {
         ...fullWaterfall[0],
@@ -938,24 +938,24 @@ describe('WaterfallModel', () => {
       {
         type: 'span_group_chain',
         treeDepth: 1,
-        continuingTreeDepths: fullWaterfall[1].continuingTreeDepths,
+        continuingTreeDepths: fullWaterfall[1]!.continuingTreeDepths,
         span: {
-          ...fullWaterfall[1].span,
+          ...fullWaterfall[1]!.span,
           parent_span_id: 'foo',
           span_id: 'bar',
         },
         spanNestedGrouping: [
           {
-            ...fullWaterfall[1],
+            ...fullWaterfall[1]!,
             isLastSibling: true,
             numOfSpanChildren: 1,
             toggleNestedSpanGroup: undefined,
           },
           {
-            ...fullWaterfall[1],
+            ...fullWaterfall[1]!,
             span: {
-              ...fullWaterfall[1].span,
-              parent_span_id: event.entries[0].data[0].span_id,
+              ...fullWaterfall[1]!.span,
+              parent_span_id: event.entries[0]!.data[0].span_id,
               span_id: 'foo',
             },
             isLastSibling: true,
@@ -967,9 +967,9 @@ describe('WaterfallModel', () => {
         toggleNestedSpanGroup: expect.anything(),
       },
       {
-        ...fullWaterfall[1],
+        ...fullWaterfall[1]!,
         span: {
-          ...fullWaterfall[1].span,
+          ...fullWaterfall[1]!.span,
           parent_span_id: 'foo',
           span_id: 'bar',
         },
@@ -983,8 +983,8 @@ describe('WaterfallModel', () => {
     expect(spans).toEqual(collapsedWaterfallExpected);
 
     // Expand span group
-    assert(spans[1].type === 'span' && spans[1].toggleNestedSpanGroup);
-    spans[1].toggleNestedSpanGroup();
+    assert(spans[1]!.type === 'span' && spans[1]!.toggleNestedSpanGroup);
+    spans[1]!.toggleNestedSpanGroup();
 
     spans = waterfallModel.getWaterfall({
       viewStart: 0,
@@ -1002,17 +1002,17 @@ describe('WaterfallModel', () => {
         toggleNestedSpanGroup: undefined,
       },
       {
-        ...fullWaterfall[1],
+        ...fullWaterfall[1]!,
         isLastSibling: true,
         numOfSpanChildren: 1,
         treeDepth: 1,
         toggleNestedSpanGroup: expect.anything(),
       },
       {
-        ...fullWaterfall[1],
+        ...fullWaterfall[1]!,
         span: {
-          ...fullWaterfall[1].span,
-          parent_span_id: event.entries[0].data[0].span_id,
+          ...fullWaterfall[1]!.span,
+          parent_span_id: event.entries[0]!.data[0].span_id,
           span_id: 'foo',
         },
         isLastSibling: true,
@@ -1021,9 +1021,9 @@ describe('WaterfallModel', () => {
         toggleNestedSpanGroup: undefined,
       },
       {
-        ...fullWaterfall[1],
+        ...fullWaterfall[1]!,
         span: {
-          ...fullWaterfall[1].span,
+          ...fullWaterfall[1]!.span,
           parent_span_id: 'foo',
           span_id: 'bar',
         },
@@ -1035,8 +1035,8 @@ describe('WaterfallModel', () => {
     ]);
 
     // Collapse span group
-    assert(spans[1].type === 'span' && spans[1].toggleNestedSpanGroup);
-    spans[1].toggleNestedSpanGroup();
+    assert(spans[1]!.type === 'span' && spans[1]!.toggleNestedSpanGroup);
+    spans[1]!.toggleNestedSpanGroup();
 
     spans = waterfallModel.getWaterfall({
       viewStart: 0,
diff --git a/static/app/components/events/interfaces/spans/waterfallModel.tsx b/static/app/components/events/interfaces/spans/waterfallModel.tsx
index a77d4c2d0d719c..2b0b446cbbb03a 100644
--- a/static/app/components/events/interfaces/spans/waterfallModel.tsx
+++ b/static/app/components/events/interfaces/spans/waterfallModel.tsx
@@ -283,8 +283,8 @@ class WaterfallModel {
         };
       },
       {
-        traceStartTimestamp: this.traceBounds[0].traceStartTimestamp,
-        traceEndTimestamp: this.traceBounds[0].traceEndTimestamp,
+        traceStartTimestamp: this.traceBounds[0]!.traceStartTimestamp,
+        traceEndTimestamp: this.traceBounds[0]!.traceEndTimestamp,
       }
     );
   };
diff --git a/static/app/components/events/interfaces/threads.spec.tsx b/static/app/components/events/interfaces/threads.spec.tsx
index 44d1f1cbd18730..f96be912bf81cd 100644
--- a/static/app/components/events/interfaces/threads.spec.tsx
+++ b/static/app/components/events/interfaces/threads.spec.tsx
@@ -218,7 +218,7 @@ describe('Threads', function () {
       };
 
       const props: React.ComponentProps = {
-        data: event.entries[1].data as React.ComponentProps['data'],
+        data: event.entries[1]!.data as React.ComponentProps['data'],
         event,
         groupingCurrentLevel: 0,
         projectSlug: project.slug,
@@ -268,7 +268,7 @@ describe('Threads', function () {
         render(, {organization});
 
         expect(
-          within(screen.getAllByTestId('line')[0]).getByText(
+          within(screen.getAllByTestId('line')[0]!).getByText(
             'sentry/controllers/welcome_controller.rb'
           )
         ).toBeInTheDocument();
@@ -287,7 +287,7 @@ describe('Threads', function () {
 
         // Last frame is the first on the list
         expect(
-          within(screen.getAllByTestId('line')[0]).getByText(
+          within(screen.getAllByTestId('line')[0]!).getByText(
             'puma (3.12.6) lib/puma/server.rb'
           )
         ).toBeInTheDocument();
@@ -298,7 +298,7 @@ describe('Threads', function () {
 
         // First frame is the first on the list
         expect(
-          within(screen.getAllByTestId('line')[0]).getByText(
+          within(screen.getAllByTestId('line')[0]!).getByText(
             'sentry/controllers/welcome_controller.rb'
           )
         ).toBeInTheDocument();
@@ -896,7 +896,7 @@ describe('Threads', function () {
       };
 
       const props: React.ComponentProps = {
-        data: event.entries[1].data as React.ComponentProps['data'],
+        data: event.entries[1]!.data as React.ComponentProps['data'],
         event,
         groupingCurrentLevel: 0,
         projectSlug: project.slug,
@@ -1013,7 +1013,7 @@ describe('Threads', function () {
 
       it('maps android vm states to java vm states', async function () {
         const newEvent = {...event};
-        const threadsEntry = newEvent.entries[1].data as React.ComponentProps<
+        const threadsEntry = newEvent.entries[1]!.data as React.ComponentProps<
           typeof Threads
         >['data'];
         const thread = {
@@ -1089,7 +1089,7 @@ describe('Threads', function () {
         render(, {organization});
 
         expect(
-          within(screen.getAllByTestId('stack-trace-frame')[0]).getByText(
+          within(screen.getAllByTestId('stack-trace-frame')[0]!).getByText(
             '-[SentryClient crash]'
           )
         ).toBeInTheDocument();
@@ -1115,7 +1115,7 @@ describe('Threads', function () {
 
         // Last frame is the first on the list
         expect(
-          within(screen.getAllByTestId('stack-trace-frame')[0]).getByText('UIKit')
+          within(screen.getAllByTestId('stack-trace-frame')[0]!).getByText('UIKit')
         ).toBeInTheDocument();
 
         // Switch back to recent first
@@ -1124,7 +1124,7 @@ describe('Threads', function () {
 
         // First frame is the first on the list
         expect(
-          within(screen.getAllByTestId('stack-trace-frame')[0]).getByText(
+          within(screen.getAllByTestId('stack-trace-frame')[0]!).getByText(
             '-[SentryClient crash]'
           )
         ).toBeInTheDocument();
@@ -1159,7 +1159,7 @@ describe('Threads', function () {
 
         // Function name is not verbose
         expect(
-          within(screen.getAllByTestId('stack-trace-frame')[1]).getByText(
+          within(screen.getAllByTestId('stack-trace-frame')[1]!).getByText(
             'ViewController.causeCrash'
           )
         ).toBeInTheDocument();
@@ -1169,14 +1169,14 @@ describe('Threads', function () {
 
         // Function name is now verbose
         expect(
-          within(screen.getAllByTestId('stack-trace-frame')[1]).getByText(
+          within(screen.getAllByTestId('stack-trace-frame')[1]!).getByText(
             'ViewController.causeCrash(Any) -> ()'
           )
         ).toBeInTheDocument();
 
         // Address is not absolute
         expect(
-          within(screen.getAllByTestId('stack-trace-frame')[1]).getByText('+0x085ac')
+          within(screen.getAllByTestId('stack-trace-frame')[1]!).getByText('+0x085ac')
         ).toBeInTheDocument();
 
         // Click on absolute file paths option
@@ -1184,7 +1184,7 @@ describe('Threads', function () {
 
         // Address is now absolute
         expect(
-          within(screen.getAllByTestId('stack-trace-frame')[1]).getByText('0x10008c5ac')
+          within(screen.getAllByTestId('stack-trace-frame')[1]!).getByText('0x10008c5ac')
         ).toBeInTheDocument();
 
         MockApiClient.addMockResponse({
@@ -1215,7 +1215,7 @@ describe('Threads', function () {
 
       it('uses thread label in selector if name not available', async function () {
         const newEvent = {...event};
-        const threadsEntry = newEvent.entries[1].data as React.ComponentProps<
+        const threadsEntry = newEvent.entries[1]!.data as React.ComponentProps<
           typeof Threads
         >['data'];
         const thread = {
diff --git a/static/app/components/events/interfaces/threads/threadSelector/getThreadException.tsx b/static/app/components/events/interfaces/threads/threadSelector/getThreadException.tsx
index 23e490792c9033..c113527cda8533 100644
--- a/static/app/components/events/interfaces/threads/threadSelector/getThreadException.tsx
+++ b/static/app/components/events/interfaces/threads/threadSelector/getThreadException.tsx
@@ -6,12 +6,12 @@ function getException(
   exceptionDataValues: ExceptionValue[],
   thread: Thread
 ) {
-  if (exceptionDataValues.length === 1 && !exceptionDataValues[0].stacktrace) {
+  if (exceptionDataValues.length === 1 && !exceptionDataValues[0]!.stacktrace) {
     return {
       ...exceptionData,
       values: [
         {
-          ...exceptionDataValues[0],
+          ...exceptionDataValues[0]!,
           stacktrace: thread.stacktrace,
           rawStacktrace: thread.rawStacktrace,
         },
diff --git a/static/app/components/events/interfaces/utils.tsx b/static/app/components/events/interfaces/utils.tsx
index 5020068be07e2b..62b175a4c10aa3 100644
--- a/static/app/components/events/interfaces/utils.tsx
+++ b/static/app/components/events/interfaces/utils.tsx
@@ -89,7 +89,7 @@ export function getHiddenFrameIndices({
       const index = parseInt(indexString, 10);
       const indicesToBeAdded: number[] = [];
       let i = 1;
-      let numHidden = frameCountMap[index];
+      let numHidden = frameCountMap[index]!;
       while (numHidden > 0) {
         if (!repeatedIndeces.includes(index - i)) {
           indicesToBeAdded.push(index - i);
@@ -305,7 +305,7 @@ export function parseAssembly(assembly: string | null) {
   }
 
   for (let i = 1; i < pieces.length; i++) {
-    const [key, value] = pieces[i].trim().split('=');
+    const [key, value] = pieces[i]!.trim().split('=');
 
     // eslint-disable-next-line default-case
     switch (key) {
diff --git a/static/app/components/events/opsBreakdown.tsx b/static/app/components/events/opsBreakdown.tsx
index d4fd56bc1e9cd8..e489c0edfa9ba1 100644
--- a/static/app/components/events/opsBreakdown.tsx
+++ b/static/app/components/events/opsBreakdown.tsx
@@ -373,7 +373,7 @@ function mergeInterval(intervals: TimeWindowSpan[]): TimeWindowSpan[] {
       continue;
     }
 
-    const lastInterval = merged[merged.length - 1];
+    const lastInterval = merged[merged.length - 1]!;
     const lastIntervalEnd = lastInterval[1];
 
     const [currentIntervalStart, currentIntervalEnd] = currentInterval;
diff --git a/static/app/components/events/searchBar.tsx b/static/app/components/events/searchBar.tsx
index a990c611bbc047..dbfac9253a5b46 100644
--- a/static/app/components/events/searchBar.tsx
+++ b/static/app/components/events/searchBar.tsx
@@ -98,19 +98,19 @@ const getSearchConfigFromCustomPerformanceMetrics = (
     numericKeys: [...defaultConfig.numericKeys],
   };
   Object.keys(customPerformanceMetrics).forEach(metricName => {
-    const {fieldType} = customPerformanceMetrics[metricName];
+    const {fieldType} = customPerformanceMetrics[metricName]!;
     switch (fieldType) {
       case 'size':
-        searchConfigMap.sizeKeys.push(metricName);
+        searchConfigMap.sizeKeys!.push(metricName);
         break;
       case 'duration':
-        searchConfigMap.durationKeys.push(metricName);
+        searchConfigMap.durationKeys!.push(metricName);
         break;
       case 'percentage':
-        searchConfigMap.percentageKeys.push(metricName);
+        searchConfigMap.percentageKeys!.push(metricName);
         break;
       default:
-        searchConfigMap.numericKeys.push(metricName);
+        searchConfigMap.numericKeys!.push(metricName);
     }
   });
   const searchConfig = {
diff --git a/static/app/components/events/viewHierarchy/index.spec.tsx b/static/app/components/events/viewHierarchy/index.spec.tsx
index 7ecfdd3c2321ed..a34df368f49bea 100644
--- a/static/app/components/events/viewHierarchy/index.spec.tsx
+++ b/static/app/components/events/viewHierarchy/index.spec.tsx
@@ -96,7 +96,7 @@ describe('View Hierarchy', function () {
   it('can navigate with keyboard shortcuts after a selection', async function () {
     render();
 
-    await userEvent.click(screen.getAllByText('Container - test_identifier')[0]);
+    await userEvent.click(screen.getAllByText('Container - test_identifier')[0]!);
 
     await userEvent.keyboard('{ArrowDown}');
 
@@ -107,7 +107,7 @@ describe('View Hierarchy', function () {
   it('can expand/collapse with the keyboard', async function () {
     render();
 
-    await userEvent.click(screen.getAllByText('Nested Container - nested')[0]);
+    await userEvent.click(screen.getAllByText('Nested Container - nested')[0]!);
 
     await userEvent.keyboard('{Enter}');
 
diff --git a/static/app/components/events/viewHierarchy/utils.tsx b/static/app/components/events/viewHierarchy/utils.tsx
index 6de7bd4aecdf3a..92a1017aafec52 100644
--- a/static/app/components/events/viewHierarchy/utils.tsx
+++ b/static/app/components/events/viewHierarchy/utils.tsx
@@ -21,7 +21,7 @@ export function useResizeCanvasObserver(canvases: (HTMLCanvasElement | null)[]):
 
     const observer = watchForResize(canvases as HTMLCanvasElement[], entries => {
       const contentRect =
-        entries[0].contentRect ?? entries[0].target.getBoundingClientRect();
+        entries[0]!.contentRect ?? entries[0]!.target.getBoundingClientRect();
 
       setCanvasBounds(
         new Rect(
@@ -52,7 +52,7 @@ export function getHierarchyDimensions(
   const nodes: ViewNode[] = [];
   const queue: [Rect | null, ViewHierarchyWindow][] = [];
   for (let i = hierarchies.length - 1; i >= 0; i--) {
-    queue.push([null, hierarchies[i]]);
+    queue.push([null, hierarchies[i]!]);
   }
 
   let maxWidth = Number.MIN_SAFE_INTEGER;
@@ -77,7 +77,7 @@ export function getHierarchyDimensions(
       // output nodes should have early children before later children
       // i.e. we need to pop() off early children before ones that come after
       for (let i = child.children.length - 1; i >= 0; i--) {
-        queue.push([node.rect, child.children[i]]);
+        queue.push([node.rect, child.children[i]!]);
       }
     }
 
@@ -114,8 +114,8 @@ export function getDeepestNodeAtPoint(
   vec2.scale(point, point, scale);
   const transformedPoint = vec2.transformMat3(vec2.create(), point, inverseMatrix);
   for (let i = 0; i < nodes.length; i++) {
-    const node = nodes[i];
-    if (node.rect.contains(transformedPoint)) {
+    const node = nodes[i]!;
+    if (node!.rect.contains(transformedPoint)) {
       clickedNode = node;
     }
   }
diff --git a/static/app/components/events/viewHierarchy/wireframe.tsx b/static/app/components/events/viewHierarchy/wireframe.tsx
index 9877dad5a743b5..26d32e686837df 100644
--- a/static/app/components/events/viewHierarchy/wireframe.tsx
+++ b/static/app/components/events/viewHierarchy/wireframe.tsx
@@ -144,16 +144,16 @@ function Wireframe({hierarchy, selectedNode, onNodeSelect, project}: WireframePr
 
         for (let i = 0; i < hierarchyData.nodes.length; i++) {
           canvas.strokeRect(
-            hierarchyData.nodes[i].rect.x,
-            hierarchyData.nodes[i].rect.y,
-            hierarchyData.nodes[i].rect.width,
-            hierarchyData.nodes[i].rect.height
+            hierarchyData.nodes[i]!.rect.x,
+            hierarchyData.nodes[i]!.rect.y,
+            hierarchyData.nodes[i]!.rect.width,
+            hierarchyData.nodes[i]!.rect.height
           );
           canvas.fillRect(
-            hierarchyData.nodes[i].rect.x,
-            hierarchyData.nodes[i].rect.y,
-            hierarchyData.nodes[i].rect.width,
-            hierarchyData.nodes[i].rect.height
+            hierarchyData.nodes[i]!.rect.x,
+            hierarchyData.nodes[i]!.rect.y,
+            hierarchyData.nodes[i]!.rect.width,
+            hierarchyData.nodes[i]!.rect.height
           );
         }
       }
diff --git a/static/app/components/feedback/feedbackOnboarding/sidebar.tsx b/static/app/components/feedback/feedbackOnboarding/sidebar.tsx
index d2171d9a7d1ad7..caf622399b91d3 100644
--- a/static/app/components/feedback/feedbackOnboarding/sidebar.tsx
+++ b/static/app/components/feedback/feedbackOnboarding/sidebar.tsx
@@ -163,7 +163,7 @@ function OnboardingContent({currentProject}: {currentProject: Project}) {
     value: PlatformKey;
     label?: ReactNode;
     textValue?: string;
-  }>(jsFrameworkSelectOptions[0]);
+  }>(jsFrameworkSelectOptions[0]!);
 
   const defaultTab = 'npm';
   const location = useLocation();
@@ -195,7 +195,7 @@ function OnboardingContent({currentProject}: {currentProject: Project}) {
 
   const jsFrameworkPlatform =
     replayJsFrameworkOptions().find(p => p.id === jsFramework.value) ??
-    replayJsFrameworkOptions()[0];
+    replayJsFrameworkOptions()[0]!;
 
   const {
     isLoading,
diff --git a/static/app/components/feedback/feedbackSearch.tsx b/static/app/components/feedback/feedbackSearch.tsx
index 9d8e003dd37dc9..5a39973f83e02d 100644
--- a/static/app/components/feedback/feedbackSearch.tsx
+++ b/static/app/components/feedback/feedbackSearch.tsx
@@ -66,7 +66,7 @@ function getFeedbackFilterKeys(supportedTags: TagCollection) {
         .map(key => [
           key,
           {
-            ...supportedTags[key],
+            ...supportedTags[key]!,
             kind: getFeedbackFieldDefinition(key)?.kind ?? FieldKind.TAG,
           },
         ])
@@ -79,7 +79,7 @@ function getFeedbackFilterKeys(supportedTags: TagCollection) {
   // To guarantee ordering, we need to implement filterKeySections.
   const keys = Object.keys(allTags);
   keys.sort();
-  return Object.fromEntries(keys.map(key => [key, allTags[key]]));
+  return Object.fromEntries(keys.map(key => [key, allTags[key]!]));
 }
 
 const getFilterKeySections = (tags: TagCollection): FilterKeySection[] => {
diff --git a/static/app/components/feedback/list/issueTrackingSignals.tsx b/static/app/components/feedback/list/issueTrackingSignals.tsx
index 00ca8a6e8bc7bf..a733eddc484271 100644
--- a/static/app/components/feedback/list/issueTrackingSignals.tsx
+++ b/static/app/components/feedback/list/issueTrackingSignals.tsx
@@ -69,7 +69,7 @@ export default function IssueTrackingSignals({group}: Props) {
     );
   }
 
-  const issue = linkedIssues[0];
+  const issue = linkedIssues[0]!;
   const {name, icon} = {
     'plugin-issue': getPluginNames,
     'plugin-actions': getPluginNames,
diff --git a/static/app/components/forms/controls/selectControl.tsx b/static/app/components/forms/controls/selectControl.tsx
index b5242fdd6e90e9..081032fa8d9be1 100644
--- a/static/app/components/forms/controls/selectControl.tsx
+++ b/static/app/components/forms/controls/selectControl.tsx
@@ -41,7 +41,7 @@ function isGroupedOptions(
   if (!maybe || maybe.length === 0) {
     return false;
   }
-  return (maybe as GroupedOptionsType)[0].options !== undefined;
+  return (maybe as GroupedOptionsType)[0]!.options !== undefined;
 }
 
 function ClearIndicator(
diff --git a/static/app/components/forms/fields/choiceMapperField.tsx b/static/app/components/forms/fields/choiceMapperField.tsx
index 1b81df22741436..97af15f23c04c2 100644
--- a/static/app/components/forms/fields/choiceMapperField.tsx
+++ b/static/app/components/forms/fields/choiceMapperField.tsx
@@ -219,7 +219,7 @@ export default class ChoiceMapperField extends Component
                 
                    {
         ]}
       />
     );
-    await userEvent.click(screen.getAllByLabelText('Delete')[0]);
+    await userEvent.click(screen.getAllByLabelText('Delete')[0]!);
 
     expect(defaultProps.onBlur).toHaveBeenCalledWith([[24, 1]], []);
     expect(defaultProps.onChange).toHaveBeenCalledWith([[24, 1]], []);
diff --git a/static/app/components/forms/fields/projectMapperField.tsx b/static/app/components/forms/fields/projectMapperField.tsx
index 92f79bebb25c17..33096362a79ca2 100644
--- a/static/app/components/forms/fields/projectMapperField.tsx
+++ b/static/app/components/forms/fields/projectMapperField.tsx
@@ -67,7 +67,7 @@ export class RenderField extends Component {
 
     if (newProjects.length === 1) {
       this.setState({
-        selectedSentryProjectId: newProjects[0],
+        selectedSentryProjectId: newProjects[0]!,
       });
     }
   }
diff --git a/static/app/components/forms/fields/sentryMemberTeamSelectorField.spec.tsx b/static/app/components/forms/fields/sentryMemberTeamSelectorField.spec.tsx
index 75cd94a07ee326..a68cda0ca8d1c7 100644
--- a/static/app/components/forms/fields/sentryMemberTeamSelectorField.spec.tsx
+++ b/static/app/components/forms/fields/sentryMemberTeamSelectorField.spec.tsx
@@ -50,7 +50,7 @@ describe('SentryMemberTeamSelectorField', () => {
 
     await selectEvent.select(
       screen.getByRole('textbox', {name: 'Select Owner'}),
-      `#${mockTeams[0].slug}`
+      `#${mockTeams[0]!.slug}`
     );
 
     expect(mock).toHaveBeenCalledWith('team:1', expect.anything());
@@ -92,7 +92,7 @@ describe('SentryMemberTeamSelectorField', () => {
 
     await selectEvent.select(
       screen.getByRole('textbox', {name: 'Select Owner'}),
-      mockUsers[0].name
+      mockUsers[0]!.name
     );
 
     expect(mock).toHaveBeenCalledWith('user:1', expect.anything());
@@ -114,11 +114,11 @@ describe('SentryMemberTeamSelectorField', () => {
 
     await selectEvent.select(
       screen.getByRole('textbox', {name: 'Select Owner'}),
-      mockUsers[0].name
+      mockUsers[0]!.name
     );
     await selectEvent.select(
       screen.getByRole('textbox', {name: 'Select Owner'}),
-      `#${mockTeams[0].slug}`
+      `#${mockTeams[0]!.slug}`
     );
 
     expect(mock).toHaveBeenCalledWith(['user:1', 'team:1'], expect.anything());
diff --git a/static/app/components/forms/jsonForm.spec.tsx b/static/app/components/forms/jsonForm.spec.tsx
index 2f3ce623d1a5e8..7dc25a8d75fd6c 100644
--- a/static/app/components/forms/jsonForm.spec.tsx
+++ b/static/app/components/forms/jsonForm.spec.tsx
@@ -6,7 +6,7 @@ import JsonForm from 'sentry/components/forms/jsonForm';
 import accountDetailsFields from 'sentry/data/forms/accountDetails';
 import {fields} from 'sentry/data/forms/projectGeneralSettings';
 
-import type {JsonFormObject} from './types';
+import type {FieldObject, JsonFormObject} from './types';
 
 const user = UserFixture();
 
@@ -167,7 +167,7 @@ describe('JsonForm', function () {
   });
 
   describe('fields prop', function () {
-    const jsonFormFields = [fields.name, fields.platform];
+    const jsonFormFields = [fields.name, fields.platform] as FieldObject[];
 
     it('default', function () {
       render();
@@ -178,7 +178,7 @@ describe('JsonForm', function () {
       try {
         render(
            !!test.email}]}
+            fields={[{...jsonFormFields[0]!, visible: ({test}) => !!test.email}]}
           />
         );
       } catch (error) {
@@ -190,7 +190,7 @@ describe('JsonForm', function () {
 
     it('should NOT hide panel, if at least one field has visible set to true - no visible prop', function () {
       // slug and platform have no visible prop, that means they will be always visible
-      render();
+      render();
 
       expect(screen.getByText('Account Details')).toBeInTheDocument();
       expect(screen.getAllByRole('textbox')).toHaveLength(2);
@@ -200,8 +200,8 @@ describe('JsonForm', function () {
       // slug and platform have no visible prop, that means they will be always visible
       render(
          ({...field, visible: true}))}
+          title={accountDetailsFields[0]!.title}
+          fields={jsonFormFields.map(field => ({...field!, visible: true}))}
         />
       );
 
@@ -213,8 +213,8 @@ describe('JsonForm', function () {
       // slug and platform have no visible prop, that means they will be always visible
       render(
          ({...field, visible: () => true}))}
+          title={accountDetailsFields[0]!.title}
+          fields={jsonFormFields.map(field => ({...field!, visible: () => true}))}
         />
       );
 
@@ -226,8 +226,8 @@ describe('JsonForm', function () {
       // slug and platform have no visible prop, that means they will be always visible
       render(
          ({...field, visible: false}))}
+          title={accountDetailsFields[0]!.title}
+          fields={jsonFormFields.map(field => ({...field!, visible: false}))}
         />
       );
 
@@ -238,8 +238,8 @@ describe('JsonForm', function () {
       // slug and platform have no visible prop, that means they will be always visible
       render(
          ({...field, visible: () => false}))}
+          title={accountDetailsFields[0]!.title}
+          fields={jsonFormFields.map(field => ({...field!, visible: () => false}))}
         />
       );
 
diff --git a/static/app/components/forms/model.tsx b/static/app/components/forms/model.tsx
index 7b4d98a2e54689..bc506b1267e37b 100644
--- a/static/app/components/forms/model.tsx
+++ b/static/app/components/forms/model.tsx
@@ -484,7 +484,7 @@ class FormModel {
     }
 
     this.snapshots.shift();
-    this.fields.replace(this.snapshots[0]);
+    this.fields.replace(this.snapshots[0]!);
 
     return true;
   }
diff --git a/static/app/components/gridEditable/index.tsx b/static/app/components/gridEditable/index.tsx
index e28ef18e1e8f55..66411bdac8168e 100644
--- a/static/app/components/gridEditable/index.tsx
+++ b/static/app/components/gridEditable/index.tsx
@@ -178,7 +178,7 @@ class GridEditable<
 
   clearWindowLifecycleEvents() {
     Object.keys(this.resizeWindowLifecycleEvents).forEach(e => {
-      this.resizeWindowLifecycleEvents[e].forEach(c => window.removeEventListener(e, c));
+      this.resizeWindowLifecycleEvents[e]!.forEach(c => window.removeEventListener(e, c));
       this.resizeWindowLifecycleEvents[e] = [];
     });
   }
@@ -188,7 +188,7 @@ class GridEditable<
 
     const nextColumnOrder = [...this.props.columnOrder];
     nextColumnOrder[i] = {
-      ...nextColumnOrder[i],
+      ...nextColumnOrder[i]!,
       width: COL_WIDTH_UNDEFINED,
     };
     this.setGridTemplateColumns(nextColumnOrder);
@@ -196,7 +196,7 @@ class GridEditable<
     const onResizeColumn = this.props.grid.onResizeColumn;
     if (onResizeColumn) {
       onResizeColumn(i, {
-        ...nextColumnOrder[i],
+        ...nextColumnOrder[i]!,
         width: COL_WIDTH_UNDEFINED,
       });
     }
@@ -224,10 +224,10 @@ class GridEditable<
     };
 
     window.addEventListener('mousemove', this.onResizeMouseMove);
-    this.resizeWindowLifecycleEvents.mousemove.push(this.onResizeMouseMove);
+    this.resizeWindowLifecycleEvents.mousemove!.push(this.onResizeMouseMove);
 
     window.addEventListener('mouseup', this.onResizeMouseUp);
-    this.resizeWindowLifecycleEvents.mouseup.push(this.onResizeMouseUp);
+    this.resizeWindowLifecycleEvents.mouseup!.push(this.onResizeMouseUp);
   };
 
   onResizeMouseUp = (e: MouseEvent) => {
@@ -239,7 +239,7 @@ class GridEditable<
       const widthChange = e.clientX - metadata.cursorX;
 
       onResizeColumn(metadata.columnIndex, {
-        ...columnOrder[metadata.columnIndex],
+        ...columnOrder[metadata.columnIndex]!,
         width: metadata.columnWidth + widthChange,
       });
     }
@@ -267,7 +267,7 @@ class GridEditable<
 
     const nextColumnOrder = [...this.props.columnOrder];
     nextColumnOrder[metadata.columnIndex] = {
-      ...nextColumnOrder[metadata.columnIndex],
+      ...nextColumnOrder[metadata.columnIndex]!,
       width: Math.max(metadata.columnWidth + widthChange, 0),
     };
 
diff --git a/static/app/components/group/assignedTo.tsx b/static/app/components/group/assignedTo.tsx
index 5bb43bfa54c18f..a7b576a583342c 100644
--- a/static/app/components/group/assignedTo.tsx
+++ b/static/app/components/group/assignedTo.tsx
@@ -92,7 +92,7 @@ function getSuggestedReason(owner: IssueOwner) {
   }
 
   if (owner.rules?.length) {
-    const firstRule = owner.rules[0];
+    const firstRule = owner.rules[0]!;
     return `${toTitleCase(firstRule[0])}:${firstRule[1]}`;
   }
 
diff --git a/static/app/components/group/externalIssuesList/externalIssueActions.tsx b/static/app/components/group/externalIssuesList/externalIssueActions.tsx
index 115a8799da0420..cb4c8182250b34 100644
--- a/static/app/components/group/externalIssuesList/externalIssueActions.tsx
+++ b/static/app/components/group/externalIssuesList/externalIssueActions.tsx
@@ -75,7 +75,7 @@ function ExternalIssueActions({configurations, group, onChange}: Props) {
     const {externalIssues} = integration;
     // Currently we do not support a case where there is multiple external issues.
     // For example, we shouldn't have more than 1 jira ticket created for an issue for each jira configuration.
-    const issue = externalIssues[0];
+    const issue = externalIssues[0]!;
     const {id} = issue;
     const endpoint = `/organizations/${organization.slug}/issues/${group.id}/integrations/${integration.id}/?externalIssue=${id}`;
 
@@ -97,7 +97,7 @@ function ExternalIssueActions({configurations, group, onChange}: Props) {
     
       {linked.map(config => {
         const {provider, externalIssues} = config;
-        const issue = externalIssues[0];
+        const issue = externalIssues[0]!;
         return (
            0 && (
         
               {unlinked.map(config => (
@@ -148,7 +148,7 @@ function ExternalIssueActions({configurations, group, onChange}: Props) {
               ? () =>
                   doOpenExternalIssueModal({
                     group,
-                    integration: unlinked[0],
+                    integration: unlinked[0]!,
                     onChange,
                     organization,
                   })
diff --git a/static/app/components/group/externalIssuesList/hooks/useIntegrationExternalIssues.tsx b/static/app/components/group/externalIssuesList/hooks/useIntegrationExternalIssues.tsx
index aa10ecaec532a7..74b860ed629809 100644
--- a/static/app/components/group/externalIssuesList/hooks/useIntegrationExternalIssues.tsx
+++ b/static/app/components/group/externalIssuesList/hooks/useIntegrationExternalIssues.tsx
@@ -84,11 +84,11 @@ export function useIntegrationExternalIssues({
       ...configurations
         .filter(config => config.externalIssues.length > 0)
         .map(config => ({
-          key: config.externalIssues[0].id,
-          displayName: config.externalIssues[0].key,
+          key: config.externalIssues[0]!.id,
+          displayName: config.externalIssues[0]!.key,
           displayIcon,
-          url: config.externalIssues[0].url,
-          title: config.externalIssues[0].title,
+          url: config.externalIssues[0]!.url,
+          title: config.externalIssues[0]!.title,
           onUnlink: () => {
             // Currently we do not support a case where there is multiple external issues.
             // For example, we shouldn't have more than 1 jira ticket created for an issue for each jira configuration.
@@ -98,7 +98,7 @@ export function useIntegrationExternalIssues({
               `/organizations/${organization.slug}/issues/${group.id}/integrations/${config.id}/`,
               {
                 method: 'DELETE',
-                query: {externalIssue: issue.id},
+                query: {externalIssue: issue!.id},
                 success: () => {
                   addSuccessMessage(t('Successfully unlinked issue.'));
                   refetchIntegrations();
diff --git a/static/app/components/group/releaseChart.spec.tsx b/static/app/components/group/releaseChart.spec.tsx
index 2b07253fe25551..4dd8ae1d4d1ad3 100644
--- a/static/app/components/group/releaseChart.spec.tsx
+++ b/static/app/components/group/releaseChart.spec.tsx
@@ -20,6 +20,6 @@ it('should set marker before first bucket', () => {
   const markers = getGroupReleaseChartMarkers(theme as any, data, firstSeen, lastSeen)!.data!;
 
   expect((markers[0] as any).displayValue).toBe(new Date(firstSeen).getTime());
-  expect(markers[0].coord![0]).toBe(1659533400000);
-  expect(markers[1].coord![0]).toBe(new Date(lastSeen).getTime());
+  expect(markers[0]!.coord![0]).toBe(1659533400000);
+  expect(markers[1]!.coord![0]).toBe(new Date(lastSeen).getTime());
 });
diff --git a/static/app/components/group/releaseChart.tsx b/static/app/components/group/releaseChart.tsx
index aefd6becd43798..38d08d207e29e0 100644
--- a/static/app/components/group/releaseChart.tsx
+++ b/static/app/components/group/releaseChart.tsx
@@ -47,7 +47,7 @@ export function getGroupReleaseChartMarkers(
 ): BarChartSeries['markPoint'] {
   const markers: Marker[] = [];
   // Get the timestamp of the first point.
-  const firstGraphTime = stats[0][0] * 1000;
+  const firstGraphTime = stats[0]![0] * 1000;
 
   const firstSeenX = new Date(firstSeen ?? 0).getTime();
   const lastSeenX = new Date(lastSeen ?? 0).getTime();
@@ -67,9 +67,9 @@ export function getGroupReleaseChartMarkers(
     let bucketStart: number | undefined;
     if (firstBucket > 0) {
       // The size of the data interval in ms
-      const halfBucketSize = ((stats[1][0] - stats[0][0]) * 1000) / 2;
+      const halfBucketSize = ((stats[1]![0] - stats[0]![0]) * 1000) / 2;
       // Display the marker in front of the first bucket
-      bucketStart = stats[firstBucket - 1][0] * 1000 - halfBucketSize;
+      bucketStart = stats[firstBucket - 1]![0] * 1000 - halfBucketSize;
     }
 
     markers.push({
@@ -156,26 +156,26 @@ function GroupReleaseChart(props: Props) {
 
   series.push({
     seriesName: t('Events in %s', environmentLabel),
-    data: environmentStats[statsPeriod].map(point => ({
-      name: point[0] * 1000,
-      value: point[1],
+    data: environmentStats[statsPeriod]!.map(point => ({
+      name: point![0] * 1000,
+      value: point![1],
     })),
   });
 
   if (release && releaseStats) {
     series.push({
       seriesName: t('Events in release %s', formatVersion(release.version)),
-      data: releaseStats[statsPeriod].map(point => ({
-        name: point[0] * 1000,
-        value: point[1],
+      data: releaseStats[statsPeriod]!.map(point => ({
+        name: point![0] * 1000,
+        value: point![1],
       })),
     });
   }
 
   const totalSeries =
     environment && environmentStats ? environmentStats[statsPeriod] : stats;
-  const totalEvents = totalSeries.reduce((acc, current) => acc + current[1], 0);
-  series[0].markPoint = getGroupReleaseChartMarkers(theme, stats, firstSeen, lastSeen);
+  const totalEvents = totalSeries!.reduce((acc, current) => acc + current[1], 0);
+  series[0]!.markPoint = getGroupReleaseChartMarkers(theme, stats, firstSeen, lastSeen);
 
   return (
     
diff --git a/static/app/components/group/suggestedOwnerHovercard.tsx b/static/app/components/group/suggestedOwnerHovercard.tsx
index 3bde36f6ca542c..040ccd18990772 100644
--- a/static/app/components/group/suggestedOwnerHovercard.tsx
+++ b/static/app/components/group/suggestedOwnerHovercard.tsx
@@ -142,8 +142,8 @@ function SuggestedOwnerHovercard(props: Props) {
                           
                         ),
                       release: (
diff --git a/static/app/components/group/tagDistributionMeter.spec.tsx b/static/app/components/group/tagDistributionMeter.spec.tsx
index 049b55037310d7..62ddf09d5991b3 100644
--- a/static/app/components/group/tagDistributionMeter.spec.tsx
+++ b/static/app/components/group/tagDistributionMeter.spec.tsx
@@ -35,8 +35,8 @@ describe('TagDistributionMeter', function () {
         group={GroupFixture({id: '1337'})}
         organization={organization}
         projectId="456"
-        totalValues={tags[0].totalValues}
-        topValues={tags[0].topValues}
+        totalValues={tags[0]!.totalValues}
+        topValues={tags[0]!.topValues}
       />
     );
     expect(
diff --git a/static/app/components/group/tagFacets/index.tsx b/static/app/components/group/tagFacets/index.tsx
index bc00bffee094ab..56549f9545ee86 100644
--- a/static/app/components/group/tagFacets/index.tsx
+++ b/static/app/components/group/tagFacets/index.tsx
@@ -51,8 +51,8 @@ export function TAGS_FORMATTER(tagsData: Record) {
   Object.keys(tagsData).forEach(tagKey => {
     if (tagKey === 'release') {
       transformedTagsData[tagKey] = {
-        ...tagsData[tagKey],
-        topValues: tagsData[tagKey].topValues.map(topValue => {
+        ...tagsData[tagKey]!,
+        topValues: tagsData[tagKey]!.topValues.map(topValue => {
           return {
             ...topValue,
             name: formatVersion(topValue.name),
@@ -61,8 +61,8 @@ export function TAGS_FORMATTER(tagsData: Record) {
       };
     } else if (tagKey === 'device') {
       transformedTagsData[tagKey] = {
-        ...tagsData[tagKey],
-        topValues: tagsData[tagKey].topValues.map(topValue => {
+        ...tagsData[tagKey]!,
+        topValues: tagsData[tagKey]!.topValues.map(topValue => {
           return {
             ...topValue,
             name: topValue.readable ?? topValue.name,
@@ -70,7 +70,7 @@ export function TAGS_FORMATTER(tagsData: Record) {
         }),
       };
     } else {
-      transformedTagsData[tagKey] = tagsData[tagKey];
+      transformedTagsData[tagKey] = tagsData[tagKey]!;
     }
   });
 
diff --git a/static/app/components/group/tagFacets/tagFacetsDistributionMeter.tsx b/static/app/components/group/tagFacets/tagFacetsDistributionMeter.tsx
index 0f4ddddcefd2e2..6e1e79ed39ddfe 100644
--- a/static/app/components/group/tagFacets/tagFacetsDistributionMeter.tsx
+++ b/static/app/components/group/tagFacets/tagFacetsDistributionMeter.tsx
@@ -67,9 +67,9 @@ function TagFacetsDistributionMeter({
         
-          {topSegments[0].name || t('n/a')}
+          {topSegments[0]!.name || t('n/a')}
         
         
               ) : (
                 
                   {/* if the first segment is 6% or less, the label won't fit cleanly into the segment, so don't show the label */}
@@ -180,7 +180,7 @@ function TagFacetsDistributionMeter({
                     onMouseLeave={() => setHoveredValue(null)}
                   >
                     
                     
diff --git a/static/app/components/guidedSteps/guidedSteps.tsx b/static/app/components/guidedSteps/guidedSteps.tsx
index e5c5c1395d1bb4..491b00777e54e7 100644
--- a/static/app/components/guidedSteps/guidedSteps.tsx
+++ b/static/app/components/guidedSteps/guidedSteps.tsx
@@ -67,7 +67,7 @@ function useGuidedStepsContentValue({
   // render and that step order does not change.
   const registerStep = useCallback((props: RegisterStepInfo) => {
     if (registeredStepsRef.current[props.stepKey]) {
-      registeredStepsRef.current[props.stepKey].isCompleted = props.isCompleted;
+      registeredStepsRef.current[props.stepKey]!.isCompleted = props.isCompleted;
       return;
     }
     const numRegisteredSteps = Object.keys(registeredStepsRef.current).length + 1;
diff --git a/static/app/components/idBadge/index.stories.tsx b/static/app/components/idBadge/index.stories.tsx
index a15eb439f03c03..abcf2d8d3430d0 100644
--- a/static/app/components/idBadge/index.stories.tsx
+++ b/static/app/components/idBadge/index.stories.tsx
@@ -42,7 +42,7 @@ export default storyBook(IdBadge, story => {
       return ;
     }
 
-    return ;
+    return ;
   });
 
   story('Project', () => {
@@ -53,7 +53,7 @@ export default storyBook(IdBadge, story => {
       return ;
     }
 
-    return ;
+    return ;
   });
 
   story('User', () => {
@@ -116,8 +116,8 @@ export default storyBook(IdBadge, story => {
 
     const teamActor: Actor = {
       type: 'team',
-      id: teams[0].id,
-      name: teams[0].name,
+      id: teams[0]!.id,
+      name: teams[0]!.name,
     };
 
     return (
diff --git a/static/app/components/inactivePlugins.spec.tsx b/static/app/components/inactivePlugins.spec.tsx
index 89067a6d7c52be..32f4b76699a8cf 100644
--- a/static/app/components/inactivePlugins.spec.tsx
+++ b/static/app/components/inactivePlugins.spec.tsx
@@ -20,7 +20,7 @@ describe('InactivePlugins', function () {
     const enableFn = jest.fn();
     const plugins = PluginsFixture();
     render();
-    await userEvent.click(screen.getByRole('button', {name: plugins[0].name}));
+    await userEvent.click(screen.getByRole('button', {name: plugins[0]!.name}));
     expect(enableFn).toHaveBeenCalledWith(expect.objectContaining(plugins[0]));
   });
 });
diff --git a/static/app/components/lastCommit.tsx b/static/app/components/lastCommit.tsx
index e6cd82bd56b0e9..aef8965844fa39 100644
--- a/static/app/components/lastCommit.tsx
+++ b/static/app/components/lastCommit.tsx
@@ -38,7 +38,7 @@ function LastCommit({commit}: Props) {
       );
     }
 
-    let finalMessage = message.split(/\n/)[0];
+    let finalMessage = message.split(/\n/)[0]!;
     if (finalMessage.length > 100) {
       let truncated = finalMessage.substring(0, 90);
       const words = truncated.split(/ /);
diff --git a/static/app/components/letterAvatar.tsx b/static/app/components/letterAvatar.tsx
index 93a25bdc0768c3..e98bfb8433c84b 100644
--- a/static/app/components/letterAvatar.tsx
+++ b/static/app/components/letterAvatar.tsx
@@ -37,7 +37,7 @@ function getColor(identifier: string | undefined): Color {
   }
 
   const id = hashIdentifier(identifier);
-  return COLORS[id % COLORS.length];
+  return COLORS[id % COLORS.length]!;
 }
 
 function getInitials(displayName: string | undefined) {
@@ -46,9 +46,9 @@ function getInitials(displayName: string | undefined) {
   );
   // Use Array.from as slicing and substring() work on ucs2 segments which
   // results in only getting half of any 4+ byte character.
-  let initials = Array.from(names[0])[0];
+  let initials = Array.from(names[0]!)[0]!;
   if (names.length > 1) {
-    initials += Array.from(names[names.length - 1])[0];
+    initials += Array.from(names[names.length - 1]!)[0]!;
   }
   return initials.toUpperCase();
 }
diff --git a/static/app/components/metrics/chart/chart.tsx b/static/app/components/metrics/chart/chart.tsx
index e2052fd3f626a9..c238100b511fbe 100644
--- a/static/app/components/metrics/chart/chart.tsx
+++ b/static/app/components/metrics/chart/chart.tsx
@@ -86,7 +86,7 @@ function isNonZeroValue(value: number | null) {
 function addSeriesPadding(data: Series['data']) {
   const hasNonZeroSibling = (index: number) => {
     return (
-      isNonZeroValue(data[index - 1]?.value) || isNonZeroValue(data[index + 1]?.value)
+      isNonZeroValue(data[index - 1]!?.value) || isNonZeroValue(data[index + 1]!?.value)
     );
   };
   const paddingIndices = new Set();
@@ -142,9 +142,9 @@ export const MetricChart = memo(
         }
       });
 
-      const bucketSize = series[0]?.data[1]?.name - series[0]?.data[0]?.name;
+      const bucketSize = series[0]!?.data[1]!?.name - series[0]!?.data[0]!?.name;
       const isSubMinuteBucket = bucketSize < 60_000;
-      const lastBucketTimestamp = series[0]?.data?.[series[0]?.data?.length - 1]?.name;
+      const lastBucketTimestamp = series[0]!?.data?.[series[0]!?.data?.length - 1]!?.name;
       const ingestionBuckets = useMemo(
         () => getIngestionDelayBucketCount(bucketSize, lastBucketTimestamp),
         [bucketSize, lastBucketTimestamp]
@@ -245,7 +245,7 @@ export const MetricChart = memo(
 
                   // Filter padding datapoints from tooltip
                   if (param.value[1] === 0) {
-                    const currentSeries = seriesToShow[param.seriesIndex];
+                    const currentSeries = seriesToShow[param.seriesIndex]!;
                     const paddingIndices =
                       'paddingIndices' in currentSeries
                         ? currentSeries.paddingIndices
diff --git a/static/app/components/metrics/chart/useFocusArea.tsx b/static/app/components/metrics/chart/useFocusArea.tsx
index f381fc3f3b8674..8fbbe03d4682e0 100644
--- a/static/app/components/metrics/chart/useFocusArea.tsx
+++ b/static/app/components/metrics/chart/useFocusArea.tsx
@@ -278,16 +278,16 @@ function FocusAreaOverlay({
       return;
     }
 
-    const widthPx = bottomRight[0] - topLeft[0];
-    const heightPx = bottomRight[1] - topLeft[1];
+    const widthPx = bottomRight[0]! - topLeft[0]!;
+    const heightPx = bottomRight[1]! - topLeft[1]!;
 
-    const resultTop = useFullYAxis ? '0px' : `${topLeft[1].toPrecision(5)}px`;
+    const resultTop = useFullYAxis ? '0px' : `${topLeft[1]!.toPrecision(5)}px`;
     const resultHeight = useFullYAxis
       ? `${CHART_HEIGHT}px`
       : `${heightPx.toPrecision(5)}px`;
 
     // Ensure the focus area rect is always within the chart bounds
-    const left = Math.max(topLeft[0], 0);
+    const left = Math.max(topLeft[0]!, 0);
     const width = Math.min(widthPx, chartInstance.getWidth() - left);
 
     const newPosition = {
@@ -347,14 +347,14 @@ const getSelectionRange = (
   useFullYAxis: boolean,
   boundingRect: ValueRect
 ): SelectionRange => {
-  const startTimestamp = Math.min(...rect.coordRange[0]);
-  const endTimestamp = Math.max(...rect.coordRange[0]);
+  const startTimestamp = Math.min(...rect.coordRange![0]!);
+  const endTimestamp = Math.max(...rect.coordRange![0]!);
 
   const startDate = getDateString(Math.max(startTimestamp, boundingRect.xMin));
   const endDate = getDateString(Math.min(endTimestamp, boundingRect.xMax));
 
-  const min = useFullYAxis ? NaN : Math.min(...rect.coordRange[1]);
-  const max = useFullYAxis ? NaN : Math.max(...rect.coordRange[1]);
+  const min = useFullYAxis ? NaN : Math.min(...rect.coordRange[1]!);
+  const max = useFullYAxis ? NaN : Math.max(...rect.coordRange[1]!);
 
   return {
     start: startDate,
diff --git a/static/app/components/metrics/chart/useMetricChartSamples.tsx b/static/app/components/metrics/chart/useMetricChartSamples.tsx
index 83cf415ba77f96..e7a25ab26796d1 100644
--- a/static/app/components/metrics/chart/useMetricChartSamples.tsx
+++ b/static/app/components/metrics/chart/useMetricChartSamples.tsx
@@ -164,7 +164,10 @@ export function useMetricChartSamples({
           const value = getSummaryValueForAggregation(sample.summary, aggregation);
           const yValue = value;
 
-          const [xPosition, yPosition] = fitToValueRect(xValue, yValue, valueRect);
+          const [xPosition, yPosition] = fitToValueRect(xValue, yValue, valueRect) as [
+            number,
+            number,
+          ];
 
           return {
             seriesName: sample.id,
diff --git a/static/app/components/metrics/chart/useMetricReleases.tsx b/static/app/components/metrics/chart/useMetricReleases.tsx
index 932e9a5c5ab193..2b2b9b03f7f41c 100644
--- a/static/app/components/metrics/chart/useMetricReleases.tsx
+++ b/static/app/components/metrics/chart/useMetricReleases.tsx
@@ -86,7 +86,7 @@ export function useReleases() {
         if (pageLinks) {
           const paginationObject = parseLinkHeader(pageLinks);
           hasMore = paginationObject?.next?.results ?? false;
-          queryObj.cursor = paginationObject.next.cursor;
+          queryObj.cursor = paginationObject.next!.cursor;
         } else {
           hasMore = false;
         }
diff --git a/static/app/components/metrics/chart/utils.tsx b/static/app/components/metrics/chart/utils.tsx
index af86decedbdfed..42da326d82ab18 100644
--- a/static/app/components/metrics/chart/utils.tsx
+++ b/static/app/components/metrics/chart/utils.tsx
@@ -53,8 +53,8 @@ export function getValueRect(chartRef?: RefObject): ValueRect {
 
   const xMin = moment(topLeft[0]).valueOf();
   const xMax = moment(bottomRight[0]).valueOf();
-  const yMin = Math.max(0, bottomRight[1]);
-  const yMax = topLeft[1];
+  const yMin = Math.max(0, bottomRight[1]!);
+  const yMax = topLeft[1]!;
 
   return {
     xMin,
diff --git a/static/app/components/modals/commandPalette.spec.tsx b/static/app/components/modals/commandPalette.spec.tsx
index fb752b1d3cecc3..2c7e087e16bd62 100644
--- a/static/app/components/modals/commandPalette.spec.tsx
+++ b/static/app/components/modals/commandPalette.spec.tsx
@@ -113,7 +113,7 @@ describe('Command Palette Modal', function () {
     expect(badges[0]).toHaveTextContent('billy-org Dashboard');
     expect(badges[1]).toHaveTextContent('billy-org Settings');
 
-    await userEvent.click(badges[0]);
+    await userEvent.click(badges[0]!);
 
     expect(navigateTo).toHaveBeenCalledWith('/billy-org/', expect.anything(), undefined);
   });
diff --git a/static/app/components/modals/featureTourModal.spec.tsx b/static/app/components/modals/featureTourModal.spec.tsx
index 8cf37f754562ec..7c2764c4fbb0c7 100644
--- a/static/app/components/modals/featureTourModal.spec.tsx
+++ b/static/app/components/modals/featureTourModal.spec.tsx
@@ -71,13 +71,13 @@ describe('FeatureTourModal', function () {
     await clickModal();
 
     // Should start on the first step.
-    expect(screen.getByRole('heading')).toHaveTextContent(steps[0].title);
+    expect(screen.getByRole('heading')).toHaveTextContent(steps[0]!.title);
 
     // Advance to the next step.
     await userEvent.click(screen.getByRole('button', {name: 'Next'}));
 
     // Should move to next step.
-    expect(screen.getByRole('heading')).toHaveTextContent(steps[1].title);
+    expect(screen.getByRole('heading')).toHaveTextContent(steps[1]!.title);
     expect(onAdvance).toHaveBeenCalled();
   });
 
@@ -87,7 +87,7 @@ describe('FeatureTourModal', function () {
     await clickModal();
 
     // Should show title, image and actions
-    expect(screen.getByRole('heading')).toHaveTextContent(steps[0].title);
+    expect(screen.getByRole('heading')).toHaveTextContent(steps[0]!.title);
     expect(screen.getByTestId('step-image')).toBeInTheDocument();
     expect(screen.getByTestId('step-action')).toBeInTheDocument();
     expect(screen.getByText('1 of 2')).toBeInTheDocument();
diff --git a/static/app/components/modals/featureTourModal.tsx b/static/app/components/modals/featureTourModal.tsx
index e0d07789f4356b..960f64fcc6329b 100644
--- a/static/app/components/modals/featureTourModal.tsx
+++ b/static/app/components/modals/featureTourModal.tsx
@@ -156,7 +156,8 @@ class ModalContents extends Component {
     const {Body, steps, doneText, doneUrl, closeModal} = this.props;
     const {current} = this.state;
 
-    const step = steps[current] !== undefined ? steps[current] : steps[steps.length - 1];
+    const step =
+      steps[current] !== undefined ? steps[current]! : steps[steps.length - 1]!;
     const hasNext = steps[current + 1] !== undefined;
 
     return (
diff --git a/static/app/components/modals/inviteMembersModal/index.spec.tsx b/static/app/components/modals/inviteMembersModal/index.spec.tsx
index 339967db5086c5..1953f0949d0837 100644
--- a/static/app/components/modals/inviteMembersModal/index.spec.tsx
+++ b/static/app/components/modals/inviteMembersModal/index.spec.tsx
@@ -96,12 +96,12 @@ describe('InviteMembersModal', function () {
     const emailInputs = screen.getAllByRole('textbox', {name: 'Email Addresses'});
     const roleInputs = screen.getAllByRole('textbox', {name: 'Role'});
 
-    await userEvent.type(emailInputs[0], 'test1@test.com');
+    await userEvent.type(emailInputs[0]!, 'test1@test.com');
     await userEvent.tab();
 
-    await selectEvent.select(roleInputs[0], 'Admin');
+    await selectEvent.select(roleInputs[0]!, 'Admin');
 
-    await userEvent.type(emailInputs[1], 'test2@test.com');
+    await userEvent.type(emailInputs[1]!, 'test2@test.com');
     await userEvent.tab();
   };
 
@@ -162,10 +162,10 @@ describe('InviteMembersModal', function () {
     await userEvent.click(screen.getByRole('button', {name: 'Add another'}));
 
     const emailInputs = screen.getAllByRole('textbox', {name: 'Email Addresses'});
-    await userEvent.type(emailInputs[0], 'test@test.com');
+    await userEvent.type(emailInputs[0]!, 'test@test.com');
     await userEvent.tab();
 
-    await userEvent.type(emailInputs[1], 'test@test.com');
+    await userEvent.type(emailInputs[1]!, 'test@test.com');
     await userEvent.tab();
 
     expect(screen.getByText('Duplicate emails between invite rows.')).toBeInTheDocument();
@@ -211,8 +211,8 @@ describe('InviteMembersModal', function () {
     await setupMemberInviteState();
 
     const teamInputs = screen.getAllByRole('textbox', {name: 'Add to Team'});
-    await selectEvent.select(teamInputs[0], '#team-slug');
-    await selectEvent.select(teamInputs[1], '#team-slug');
+    await selectEvent.select(teamInputs[0]!, '#team-slug');
+    await selectEvent.select(teamInputs[1]!, '#team-slug');
 
     await userEvent.click(screen.getByRole('button', {name: 'Send invites (2)'}));
 
diff --git a/static/app/components/modals/inviteMembersModal/index.tsx b/static/app/components/modals/inviteMembersModal/index.tsx
index d32a3f20e192c5..e50f4c5246a6fb 100644
--- a/static/app/components/modals/inviteMembersModal/index.tsx
+++ b/static/app/components/modals/inviteMembersModal/index.tsx
@@ -100,7 +100,7 @@ function InviteMembersModal({
                 sendInvites: inviteModalSendInvites,
                 reset,
                 inviteStatus,
-                pendingInvites: pendingInvites[0],
+                pendingInvites: pendingInvites[0]!,
                 sendingInvites,
                 complete,
                 error,
diff --git a/static/app/components/modals/inviteMembersModal/inviteRowControl.tsx b/static/app/components/modals/inviteMembersModal/inviteRowControl.tsx
index cd73db279ef038..dc524d6bfbfdef 100644
--- a/static/app/components/modals/inviteMembersModal/inviteRowControl.tsx
+++ b/static/app/components/modals/inviteMembersModal/inviteRowControl.tsx
@@ -96,7 +96,7 @@ function InviteRowControl({
         value={emails}
         components={{
           MultiValue: (props: MultiValueProps) => (
-            
+            
           ),
           DropdownIndicator: () => null,
         }}
diff --git a/static/app/components/modals/inviteMembersModal/inviteRowControlNew.tsx b/static/app/components/modals/inviteMembersModal/inviteRowControlNew.tsx
index 4326a144ba9a8f..61aebc3da2ca18 100644
--- a/static/app/components/modals/inviteMembersModal/inviteRowControlNew.tsx
+++ b/static/app/components/modals/inviteMembersModal/inviteRowControlNew.tsx
@@ -94,7 +94,7 @@ function InviteRowControl({roleDisabledUnallowed, roleOptions}: Props) {
           value={emails}
           components={{
             MultiValue: (props: MultiValueProps) => (
-              
+              
             ),
             DropdownIndicator: () => null,
           }}
diff --git a/static/app/components/modals/inviteMembersModal/useInviteModal.tsx b/static/app/components/modals/inviteMembersModal/useInviteModal.tsx
index ab23e5fbf5be75..98bd2faceee03b 100644
--- a/static/app/components/modals/inviteMembersModal/useInviteModal.tsx
+++ b/static/app/components/modals/inviteMembersModal/useInviteModal.tsx
@@ -163,7 +163,7 @@ export default function useInviteModal({organization, initialData, source}: Prop
 
   const removeSentInvites = useCallback(() => {
     setState(prev => {
-      const emails = prev.pendingInvites[0].emails;
+      const emails = prev.pendingInvites[0]!.emails;
       const filteredEmails = Array.from(emails).filter(
         email => !prev.inviteStatus[email]?.sent
       );
@@ -171,7 +171,7 @@ export default function useInviteModal({organization, initialData, source}: Prop
         ...prev,
         pendingInvites: [
           {
-            ...prev.pendingInvites[0],
+            ...prev.pendingInvites[0]!,
             emails: new Set(filteredEmails),
           },
         ],
@@ -218,7 +218,7 @@ export default function useInviteModal({organization, initialData, source}: Prop
   const setEmails = useCallback((emails: string[], index: number) => {
     setState(prev => {
       const pendingInvites = [...prev.pendingInvites];
-      pendingInvites[index] = {...pendingInvites[index], emails: new Set(emails)};
+      pendingInvites[index] = {...pendingInvites[index]!, emails: new Set(emails)};
 
       return {...prev, pendingInvites};
     });
@@ -227,7 +227,7 @@ export default function useInviteModal({organization, initialData, source}: Prop
   const setTeams = useCallback((teams: string[], index: number) => {
     setState(prev => {
       const pendingInvites = [...prev.pendingInvites];
-      pendingInvites[index] = {...pendingInvites[index], teams: new Set(teams)};
+      pendingInvites[index] = {...pendingInvites[index]!, teams: new Set(teams)};
 
       return {...prev, pendingInvites};
     });
@@ -236,7 +236,7 @@ export default function useInviteModal({organization, initialData, source}: Prop
   const setRole = useCallback((role: string, index: number) => {
     setState(prev => {
       const pendingInvites = [...prev.pendingInvites];
-      pendingInvites[index] = {...pendingInvites[index], role};
+      pendingInvites[index] = {...pendingInvites[index]!, role};
 
       return {...prev, pendingInvites};
     });
diff --git a/static/app/components/modals/inviteMissingMembersModal/index.spec.tsx b/static/app/components/modals/inviteMissingMembersModal/index.spec.tsx
index 8a462fcfbe2316..620f8a7b72d3bf 100644
--- a/static/app/components/modals/inviteMissingMembersModal/index.spec.tsx
+++ b/static/app/components/modals/inviteMissingMembersModal/index.spec.tsx
@@ -188,12 +188,12 @@ describe('InviteMissingMembersModal', function () {
     const teamInputs = screen.getAllByRole('textbox', {name: 'Add to Team'});
 
     await userEvent.click(screen.getByLabelText('Select hello@sentry.io'));
-    await selectEvent.select(roleInputs[0], 'Admin', {
+    await selectEvent.select(roleInputs[0]!, 'Admin', {
       container: document.body,
     });
 
     await userEvent.click(screen.getByLabelText('Select abcd@sentry.io'));
-    await selectEvent.select(teamInputs[1], '#team-slug', {
+    await selectEvent.select(teamInputs[1]!, '#team-slug', {
       container: document.body,
     });
 
diff --git a/static/app/components/modals/inviteMissingMembersModal/index.tsx b/static/app/components/modals/inviteMissingMembersModal/index.tsx
index 9c89de5ec73a09..4ba3e48f86a8b7 100644
--- a/static/app/components/modals/inviteMissingMembersModal/index.tsx
+++ b/static/app/components/modals/inviteMissingMembersModal/index.tsx
@@ -67,9 +67,9 @@ export function InviteMissingMembersModal({
     (role: string, index: number) => {
       setMemberInvites(prevInvites => {
         const invites = prevInvites.map(i => ({...i}));
-        invites[index].role = role;
-        if (!allowedRolesMap[role].isTeamRolesAllowed) {
-          invites[index].teamSlugs = new Set([]);
+        invites[index]!.role = role;
+        if (!allowedRolesMap[role]!.isTeamRolesAllowed) {
+          invites[index]!.teamSlugs = new Set([]);
         }
         return invites;
       });
@@ -80,7 +80,7 @@ export function InviteMissingMembersModal({
   const setTeams = useCallback((teamSlugs: string[], index: number) => {
     setMemberInvites(prevInvites => {
       const invites = prevInvites.map(i => ({...i}));
-      invites[index].teamSlugs = new Set(teamSlugs);
+      invites[index]!.teamSlugs = new Set(teamSlugs);
       return invites;
     });
   }, []);
@@ -96,7 +96,7 @@ export function InviteMissingMembersModal({
   const toggleCheckbox = useCallback(
     (checked: boolean, index: number) => {
       const selectedMembers = [...memberInvites];
-      selectedMembers[index].selected = checked;
+      selectedMembers[index]!.selected = checked;
       setMemberInvites(selectedMembers);
     },
     [memberInvites]
@@ -234,7 +234,7 @@ export function InviteMissingMembersModal({
         stickyHeaders
       >
         {memberInvites?.map((member, i) => {
-          const checked = memberInvites[i].selected;
+          const checked = memberInvites[i]!.selected;
           const username = member.externalId.split(':').pop();
           const isTeamRolesAllowed =
             allowedRolesMap[member.role]?.isTeamRolesAllowed ?? true;
diff --git a/static/app/components/modals/metricWidgetViewerModal.tsx b/static/app/components/modals/metricWidgetViewerModal.tsx
index c3bb40feeedba8..960085fb4c27ce 100644
--- a/static/app/components/modals/metricWidgetViewerModal.tsx
+++ b/static/app/components/modals/metricWidgetViewerModal.tsx
@@ -120,7 +120,7 @@ function MetricWidgetViewerModal({
           if (!updatedQuery.alias) {
             updatedQuery.alias = updatedAlias;
           }
-          if (isVirtualAlias(currentQuery.alias) && isVirtualAlias(updatedQuery.alias)) {
+          if (isVirtualAlias(currentQuery!.alias) && isVirtualAlias(updatedQuery.alias)) {
             updatedQuery.alias = updatedAlias;
           }
         }
@@ -182,7 +182,7 @@ function MetricWidgetViewerModal({
             ? curr.map(q => ({...q, isHidden: true}))
             : curr),
           {
-            ...query,
+            ...query!,
             id: generateQueryId(),
           },
         ];
@@ -241,7 +241,7 @@ function MetricWidgetViewerModal({
         updated.splice(index, 1);
         // Make sure the last query is visible for big number widgets
         if (displayType === DisplayType.BIG_NUMBER && filteredEquations.length === 0) {
-          updated[updated.length - 1].isHidden = false;
+          updated[updated.length - 1]!.isHidden = false;
         }
         return updated;
       });
@@ -308,7 +308,7 @@ function MetricWidgetViewerModal({
     closeModal();
   }, [userHasModified, closeModal, organization]);
 
-  const {mri, aggregation, query, condition} = metricQueries[0];
+  const {mri, aggregation, query, condition} = metricQueries[0]!;
 
   if (isLoading) {
     return ;
diff --git a/static/app/components/modals/metricWidgetViewerModal/queries.tsx b/static/app/components/modals/metricWidgetViewerModal/queries.tsx
index f17bc9d99b367c..08a88d7135d61d 100644
--- a/static/app/components/modals/metricWidgetViewerModal/queries.tsx
+++ b/static/app/components/modals/metricWidgetViewerModal/queries.tsx
@@ -86,7 +86,7 @@ export const Queries = memo(function Queries({
 
   const handleEditQueryAlias = useCallback(
     (index: number) => {
-      const query = metricQueries[index];
+      const query = metricQueries[index]!;
       const alias = getMetricQueryName(query);
 
       onQueryChange({alias}, index);
@@ -96,7 +96,7 @@ export const Queries = memo(function Queries({
 
   const handleEditEquationAlias = useCallback(
     (index: number) => {
-      const equation = metricEquations[index];
+      const equation = metricEquations[index]!;
       const alias = getMetricQueryName(equation);
 
       onEquationChange({alias: alias ?? ''}, index);
diff --git a/static/app/components/modals/metricWidgetViewerModal/visualization.tsx b/static/app/components/modals/metricWidgetViewerModal/visualization.tsx
index c8501a6cb5b123..c5b7fab35b396d 100644
--- a/static/app/components/modals/metricWidgetViewerModal/visualization.tsx
+++ b/static/app/components/modals/metricWidgetViewerModal/visualization.tsx
@@ -97,7 +97,7 @@ function useFocusedSeries({
   const setSeriesVisibility = useCallback(
     (series: FocusedMetricsSeries) => {
       onChange?.();
-      if (focusedSeries?.length === 1 && focusedSeries[0].id === series.id) {
+      if (focusedSeries?.length === 1 && focusedSeries[0]!.id === series.id) {
         setFocusedSeries([]);
         return;
       }
diff --git a/static/app/components/modals/widgetBuilder/addToDashboardModal.tsx b/static/app/components/modals/widgetBuilder/addToDashboardModal.tsx
index 7da42feb17ae34..0de52ea3a08f65 100644
--- a/static/app/components/modals/widgetBuilder/addToDashboardModal.tsx
+++ b/static/app/components/modals/widgetBuilder/addToDashboardModal.tsx
@@ -171,11 +171,11 @@ function AddToDashboardModal({
       return;
     }
 
-    let orderby = widget.queries[0].orderby;
-    if (!(DisplayType.AREA && widget.queries[0].columns.length)) {
+    let orderby = widget.queries[0]!.orderby;
+    if (!(DisplayType.AREA && widget.queries[0]!.columns.length)) {
       orderby = ''; // Clear orderby if its not a top n visualization.
     }
-    const query = widget.queries[0];
+    const query = widget.queries[0]!;
 
     const title =
       // Metric widgets have their default title derived from the query
@@ -278,7 +278,7 @@ function AddToDashboardModal({
         
           
diff --git a/static/app/components/modals/widgetViewerModal.tsx b/static/app/components/modals/widgetViewerModal.tsx
index f343822c3a8797..af4f53478e452c 100644
--- a/static/app/components/modals/widgetViewerModal.tsx
+++ b/static/app/components/modals/widgetViewerModal.tsx
@@ -297,16 +297,16 @@ function WidgetViewerModal(props: Props) {
 
   // Create Table widget
   const tableWidget = {
-    ...cloneDeep({...widget, queries: [sortedQueries[selectedQueryIndex]]}),
+    ...cloneDeep({...widget, queries: [sortedQueries[selectedQueryIndex]!]}),
     displayType: DisplayType.TABLE,
   };
-  const {aggregates, columns} = tableWidget.queries[0];
-  const {orderby} = widget.queries[0];
+  const {aggregates, columns} = tableWidget.queries[0]!;
+  const {orderby} = widget.queries[0]!;
   const order = orderby.startsWith('-');
   const rawOrderby = trimStart(orderby, '-');
 
-  const fields = defined(tableWidget.queries[0].fields)
-    ? tableWidget.queries[0].fields
+  const fields = defined(tableWidget.queries[0]!.fields)
+    ? tableWidget.queries[0]!.fields
     : [...columns, ...aggregates];
 
   // Some Discover Widgets (Line, Area, Bar) allow the user to specify an orderby
@@ -339,8 +339,8 @@ function WidgetViewerModal(props: Props) {
 
   // Need to set the orderby of the eventsv2 query to equation[index] format
   // since eventsv2 does not accept the raw equation as a valid sort payload
-  if (isEquation(rawOrderby) && tableWidget.queries[0].orderby === orderby) {
-    tableWidget.queries[0].orderby = `${order ? '-' : ''}equation[${
+  if (isEquation(rawOrderby) && tableWidget.queries[0]!.orderby === orderby) {
+    tableWidget.queries[0]!.orderby = `${order ? '-' : ''}equation[${
       getNumEquations(fields) - 1
     }]`;
   }
@@ -381,8 +381,8 @@ function WidgetViewerModal(props: Props) {
     switch (widget.widgetType) {
       case WidgetType.DISCOVER:
         if (fields.length === 1) {
-          tableWidget.queries[0].orderby =
-            tableWidget.queries[0].orderby || `-${fields[0]}`;
+          tableWidget.queries[0]!.orderby =
+            tableWidget.queries[0]!.orderby || `-${fields[0]}`;
         }
         fields.unshift('title');
         columns.unshift('title');
@@ -398,7 +398,7 @@ function WidgetViewerModal(props: Props) {
 
   const eventView = eventViewFromWidget(
     tableWidget.title,
-    tableWidget.queries[0],
+    tableWidget.queries[0]!,
     modalTableSelection
   );
 
@@ -410,7 +410,7 @@ function WidgetViewerModal(props: Props) {
   const columnSortBy = eventView.getSorts();
   columnOrder = columnOrder.map((column, index) => ({
     ...column,
-    width: parseInt(widths[index], 10) || -1,
+    width: parseInt(widths[index]!, 10) || -1,
   }));
 
   const getOnDemandFilterWarning = createOnDemandFilterWarning(
@@ -685,7 +685,7 @@ function WidgetViewerModal(props: Props) {
             onResizeColumn,
           }}
         />
-        {!tableWidget.queries[0].orderby.match(/^-?release$/) &&
+        {!tableWidget.queries[0]!.orderby.match(/^-?release$/) &&
           (links?.previous?.results || links?.next?.results) && (
             
         )}
-        {(widget.queries.length > 1 || widget.queries[0].conditions) && (
+        {(widget.queries.length > 1 || widget.queries[0]!.conditions) && (
           
             
-                      {queryOptions[selectedQueryIndex].getHighlightedQuery({
+                      {queryOptions[selectedQueryIndex]!.getHighlightedQuery({
                         display: 'block',
                       }) ??
-                        (queryOptions[selectedQueryIndex].label || (
+                        (queryOptions[selectedQueryIndex]!.label || (
                           {EMPTY_QUERY_NAME}
                         ))}
                     
@@ -1161,7 +1161,7 @@ function OpenButton({
     default:
       openLabel = t('Open in Discover');
       path = getWidgetDiscoverUrl(
-        {...widget, queries: [widget.queries[selectedQueryIndex]]},
+        {...widget, queries: [widget.queries[selectedQueryIndex]!]},
         selection,
         organization,
         0,
diff --git a/static/app/components/modals/widgetViewerModal/widgetViewerTableCell.tsx b/static/app/components/modals/widgetViewerModal/widgetViewerTableCell.tsx
index f9899302ae5767..f0f7dfa3d3bd3c 100644
--- a/static/app/components/modals/widgetViewerModal/widgetViewerTableCell.tsx
+++ b/static/app/components/modals/widgetViewerModal/widgetViewerTableCell.tsx
@@ -80,7 +80,7 @@ export const renderIssueGridHeaderCell = ({
       {column.name}}
-        direction={widget.queries[0].orderby === sortField ? 'desc' : undefined}
+        direction={widget.queries[0]!.orderby === sortField ? 'desc' : undefined}
         canSort={!!sortField}
         generateSortLink={() => ({
           ...location,
@@ -118,14 +118,14 @@ export const renderDiscoverGridHeaderCell = ({
     column: TableColumn,
     _columnIndex: number
   ): React.ReactNode {
-    const {orderby} = widget.queries[0];
+    const {orderby} = widget.queries[0]!;
     // Need to convert orderby to aggregate alias because eventView still uses aggregate alias format
     const aggregateAliasOrderBy = `${
       orderby.startsWith('-') ? '-' : ''
     }${getAggregateAlias(trimStart(orderby, '-'))}`;
     const eventView = eventViewFromWidget(
       widget.title,
-      {...widget.queries[0], orderby: aggregateAliasOrderBy},
+      {...widget.queries[0]!, orderby: aggregateAliasOrderBy},
       selection
     );
     const tableMeta = tableData?.meta;
@@ -318,7 +318,7 @@ export const renderReleaseGridHeaderCell = ({
   ): React.ReactNode {
     const tableMeta = tableData?.meta;
     const align = fieldAlignment(column.name, column.type, tableMeta);
-    const widgetOrderBy = widget.queries[0].orderby;
+    const widgetOrderBy = widget.queries[0]!.orderby;
     const sort: Sort = {
       kind: widgetOrderBy.startsWith('-') ? 'desc' : 'asc',
       field: widgetOrderBy.startsWith('-') ? widgetOrderBy.slice(1) : widgetOrderBy,
diff --git a/static/app/components/nav/utils.tsx b/static/app/components/nav/utils.tsx
index 498162e743828d..5b509e01e8bb90 100644
--- a/static/app/components/nav/utils.tsx
+++ b/static/app/components/nav/utils.tsx
@@ -165,7 +165,7 @@ export function resolveNavItemTo(
     return undefined;
   }
   if (isSidebarItem(item) && isNonEmptyArray(item.submenu)) {
-    return item.submenu[0].to;
+    return item.submenu[0]!.to;
   }
   return undefined;
 }
diff --git a/static/app/components/notificationActions/forms/onCallServiceForm.tsx b/static/app/components/notificationActions/forms/onCallServiceForm.tsx
index 21aa0696c994ce..5dc690069abc34 100644
--- a/static/app/components/notificationActions/forms/onCallServiceForm.tsx
+++ b/static/app/components/notificationActions/forms/onCallServiceForm.tsx
@@ -41,7 +41,7 @@ function OnCallServiceForm({
 }: OnCallServiceFormProps) {
   const [selectedAccount, setSelectedAccount] = useState(
     action.integrationId
-      ? Integrations[action.integrationId][0].action.integrationName
+      ? Integrations[action.integrationId]![0]!.action.integrationName
       : ''
   );
   const [selectedDisplay, setSelectedDisplay] = useState(action.targetDisplay ?? '');
@@ -67,7 +67,7 @@ function OnCallServiceForm({
     if (!action.integrationId) {
       return [];
     }
-    const services = Integrations[action.integrationId];
+    const services = Integrations[action.integrationId]!;
     return services.map(service => ({
       key: service.action.targetDisplay ?? '',
       label: service.action.targetDisplay,
diff --git a/static/app/components/notificationActions/notificationActionManager.spec.tsx b/static/app/components/notificationActions/notificationActionManager.spec.tsx
index f0cafde15aa975..c5cdea2ff4de98 100644
--- a/static/app/components/notificationActions/notificationActionManager.spec.tsx
+++ b/static/app/components/notificationActions/notificationActionManager.spec.tsx
@@ -97,7 +97,7 @@ describe('Adds, deletes, and updates notification actions', function () {
     render(
        {
           // Add notification action
-          const updatedActions = [...notificationActions, validActions[0].action];
+          const updatedActions = [...notificationActions, validActions[0]!.action];
           setNotificationActions(updatedActions);
         },
       });
diff --git a/static/app/components/onboarding/frameworkSuggestionModal.tsx b/static/app/components/onboarding/frameworkSuggestionModal.tsx
index a35999e131881e..187ff72a4cfc13 100644
--- a/static/app/components/onboarding/frameworkSuggestionModal.tsx
+++ b/static/app/components/onboarding/frameworkSuggestionModal.tsx
@@ -313,7 +313,7 @@ function TopFrameworksImage({frameworks}: {frameworks: PlatformIntegration[]}) {
     
       
       
       SENTRY_AUTH_TOKEN='
     );
     expect(tokenNodes).toHaveLength(1);
-    expect(element.contains(tokenNodes[0])).toBe(true);
+    expect(element.contains(tokenNodes[0]!)).toBe(true);
   });
 
   it('replaces multiple ___ORG_AUTH_TOKEN___ tokens', function () {
@@ -29,7 +29,7 @@ const assetUrl = '';
 `
     );
     expect(tokenNodes).toHaveLength(2);
-    expect(element.contains(tokenNodes[0])).toBe(true);
-    expect(element.contains(tokenNodes[1])).toBe(true);
+    expect(element.contains(tokenNodes[0]!)).toBe(true);
+    expect(element.contains(tokenNodes[1]!)).toBe(true);
   });
 });
diff --git a/static/app/components/onboarding/gettingStartedDoc/step.tsx b/static/app/components/onboarding/gettingStartedDoc/step.tsx
index 862d864e8afdad..2233c1a4e45490 100644
--- a/static/app/components/onboarding/gettingStartedDoc/step.tsx
+++ b/static/app/components/onboarding/gettingStartedDoc/step.tsx
@@ -53,8 +53,8 @@ export function TabbedCodeSnippet({
   onSelectAndCopy,
   partialLoading,
 }: TabbedCodeSnippetProps) {
-  const [selectedTabValue, setSelectedTabValue] = useState(tabs[0].value);
-  const selectedTab = tabs.find(tab => tab.value === selectedTabValue) ?? tabs[0];
+  const [selectedTabValue, setSelectedTabValue] = useState(tabs[0]!.value);
+  const selectedTab = tabs.find(tab => tab.value === selectedTabValue) ?? tabs[0]!;
   const {code, language, filename} = selectedTab;
 
   return (
diff --git a/static/app/components/onboarding/gettingStartedDoc/utils/feedbackOnboarding.tsx b/static/app/components/onboarding/gettingStartedDoc/utils/feedbackOnboarding.tsx
index 72e15c3a8dba34..abc989a265a5d5 100644
--- a/static/app/components/onboarding/gettingStartedDoc/utils/feedbackOnboarding.tsx
+++ b/static/app/components/onboarding/gettingStartedDoc/utils/feedbackOnboarding.tsx
@@ -155,13 +155,13 @@ export function getCrashReportSDKInstallFirstStep(params: DocsParams) {
     params.sourcePackageRegistries && !params.sourcePackageRegistries.isLoading;
   const version =
     (dataLoaded &&
-      params.sourcePackageRegistries.data?.['sentry.javascript.browser'].version) ??
+      params.sourcePackageRegistries.data?.['sentry.javascript.browser']!.version) ??
     '';
   const hash =
     (dataLoaded &&
-      params.sourcePackageRegistries.data?.['sentry.javascript.browser'].files[
+      params.sourcePackageRegistries.data?.['sentry.javascript.browser']!.files[
         'bundle.min.js'
-      ].checksums['sha384-base64']) ??
+      ]!.checksums['sha384-base64']) ??
     '';
 
   return {
@@ -242,13 +242,13 @@ export function getCrashReportSDKInstallFirstStepRails(params: DocsParams) {
     params.sourcePackageRegistries && !params.sourcePackageRegistries.isLoading;
   const version =
     (dataLoaded &&
-      params.sourcePackageRegistries.data?.['sentry.javascript.browser'].version) ??
+      params.sourcePackageRegistries.data?.['sentry.javascript.browser']!.version) ??
     '';
   const hash =
     (dataLoaded &&
-      params.sourcePackageRegistries.data?.['sentry.javascript.browser'].files[
+      params.sourcePackageRegistries.data?.['sentry.javascript.browser']!.files[
         'bundle.min.js'
-      ].checksums['sha384-base64']) ??
+      ]!.checksums['sha384-base64']) ??
     '';
 
   return {
diff --git a/static/app/components/onboarding/platformOptionsControl.tsx b/static/app/components/onboarding/platformOptionsControl.tsx
index 7d7588781a6fde..1253ec46ad5822 100644
--- a/static/app/components/onboarding/platformOptionsControl.tsx
+++ b/static/app/components/onboarding/platformOptionsControl.tsx
@@ -26,8 +26,8 @@ export function useUrlPlatformOptions {
-      const defaultValue = platformOptions[key].defaultValue;
-      const values = platformOptions[key].items.map(({value}) => value);
+      const defaultValue = platformOptions[key]!.defaultValue;
+      const values = platformOptions[key]!.items.map(({value}) => value);
       acc[key as keyof PlatformOptions] = values.includes(query[key])
         ? query[key]
         : defaultValue ?? values[0];
@@ -100,7 +100,7 @@ export function PlatformOptionsControl({
          handleChange(key, value)}
         />
       ))}
diff --git a/static/app/components/onboardingWizard/newSidebar.spec.tsx b/static/app/components/onboardingWizard/newSidebar.spec.tsx
index bf0dece9649e89..937f13dfefdac0 100644
--- a/static/app/components/onboardingWizard/newSidebar.spec.tsx
+++ b/static/app/components/onboardingWizard/newSidebar.spec.tsx
@@ -63,20 +63,20 @@ describe('NewSidebar', function () {
     expect(screen.getByText('0 out of 2 tasks completed')).toBeInTheDocument();
     // This means that the group is expanded
     expect(screen.getByRole('button', {name: 'Collapse'})).toBeInTheDocument();
-    expect(screen.getByText(gettingStartedTasks[0].title)).toBeInTheDocument();
-    expect(screen.getByText(gettingStartedTasks[0].description)).toBeInTheDocument();
+    expect(screen.getByText(gettingStartedTasks[0]!.title)).toBeInTheDocument();
+    expect(screen.getByText(gettingStartedTasks[0]!.description)).toBeInTheDocument();
     expect(screen.queryByRole('button', {name: 'Skip Task'})).not.toBeInTheDocument();
 
     // Group 2
     expect(screen.getByText('Beyond the Basics')).toBeInTheDocument();
     expect(screen.getByText('0 out of 1 task completed')).toBeInTheDocument();
     // This means that the group is not expanded
-    expect(screen.queryByText(beyondBasicsTasks[0].title)).not.toBeInTheDocument();
+    expect(screen.queryByText(beyondBasicsTasks[0]!.title)).not.toBeInTheDocument();
 
     // Manually expand second group
     await userEvent.click(screen.getByRole('button', {name: 'Expand'}));
     // Tasks from the second group should be visible
-    expect(await screen.findByText(beyondBasicsTasks[0].title)).toBeInTheDocument();
+    expect(await screen.findByText(beyondBasicsTasks[0]!.title)).toBeInTheDocument();
     // task from second group are skippable
     expect(screen.getByRole('button', {name: 'Skip Task'})).toBeInTheDocument();
   });
@@ -101,7 +101,7 @@ describe('NewSidebar', function () {
 
     // Group 2
     // This means that the group is expanded
-    expect(screen.getByText(beyondBasicsTasks[0].title)).toBeInTheDocument();
+    expect(screen.getByText(beyondBasicsTasks[0]!.title)).toBeInTheDocument();
   });
 
   it('show skipable confirmation when skipping a task', async function () {
@@ -128,7 +128,7 @@ describe('NewSidebar', function () {
     // Manually expand second group
     await userEvent.click(screen.getByRole('button', {name: 'Expand'}));
     // Tasks from the second group should be visible
-    expect(await screen.findByText(beyondBasicsTasks[0].title)).toBeInTheDocument();
+    expect(await screen.findByText(beyondBasicsTasks[0]!.title)).toBeInTheDocument();
 
     await userEvent.click(screen.getByRole('button', {name: 'Skip Task'}));
 
diff --git a/static/app/components/onboardingWizard/task.tsx b/static/app/components/onboardingWizard/task.tsx
index 76bb18b5ce06fa..21e3495b2e0b21 100644
--- a/static/app/components/onboardingWizard/task.tsx
+++ b/static/app/components/onboardingWizard/task.tsx
@@ -128,7 +128,7 @@ function Task(props: Props) {
     
       
diff --git a/static/app/components/onboardingWizard/taskConfig.tsx b/static/app/components/onboardingWizard/taskConfig.tsx
index 6900c8ac85a7f4..1e62e7db20d483 100644
--- a/static/app/components/onboardingWizard/taskConfig.tsx
+++ b/static/app/components/onboardingWizard/taskConfig.tsx
@@ -58,7 +58,7 @@ function getIssueAlertUrl({projects, organization}: Options) {
   }
   // pick the first project with events if we have that, otherwise just pick the first project
   const firstProjectWithEvents = projects.find(project => !!project.firstEvent);
-  const project = firstProjectWithEvents ?? projects[0];
+  const project = firstProjectWithEvents ?? projects[0]!;
   return `/organizations/${organization.slug}/alerts/${project.slug}/wizard/`;
 }
 
@@ -81,7 +81,7 @@ function getOnboardingInstructionsUrl({projects, organization}: Options) {
   const firstProjectWithoutError = projects.find(project => !project.firstEvent);
   // If all projects contain errors, this step will not be visible to the user,
   // but if the user falls into this case for some reason, we pick the first project
-  const project = firstProjectWithoutError ?? projects[0];
+  const project = firstProjectWithoutError ?? projects[0]!;
 
   let url = `/${organization.slug}/${project.slug}/getting-started/`;
 
@@ -100,7 +100,7 @@ function getMetricAlertUrl({projects, organization}: Options) {
   const firstProjectWithEvents = projects.find(
     project => !!project.firstTransactionEvent
   );
-  const project = firstProjectWithEvents ?? projects[0];
+  const project = firstProjectWithEvents ?? projects[0]!;
   return {
     pathname: `/organizations/${organization.slug}/alerts/${project.slug}/wizard/`,
     query: {
@@ -230,7 +230,7 @@ export function getOnboardingTasks({
            !taskIsDone(task) && onCompleteTask?.()}
           >
@@ -372,14 +372,14 @@ export function getOnboardingTasks({
 
         if (projectsForOnboarding.length) {
           navigateTo(
-            `${performanceUrl}?project=${projectsForOnboarding[0].id}#performance-sidequest`,
+            `${performanceUrl}?project=${projectsForOnboarding[0]!.id}#performance-sidequest`,
             router
           );
           return;
         }
 
         navigateTo(
-          `${performanceUrl}?project=${projectsWithoutFirstTransactionEvent[0].id}#performance-sidequest`,
+          `${performanceUrl}?project=${projectsWithoutFirstTransactionEvent[0]!.id}#performance-sidequest`,
           router
         );
       },
@@ -408,7 +408,7 @@ export function getOnboardingTasks({
            !taskIsDone(task) && onCompleteTask?.()}
           >
@@ -485,7 +485,7 @@ export function getOnboardingTasks({
            !taskIsDone(task) && onCompleteTask?.()}
           >
diff --git a/static/app/components/organizations/environmentPageFilter/trigger.tsx b/static/app/components/organizations/environmentPageFilter/trigger.tsx
index 7146b4b5e9a937..b37703f0156056 100644
--- a/static/app/components/organizations/environmentPageFilter/trigger.tsx
+++ b/static/app/components/organizations/environmentPageFilter/trigger.tsx
@@ -27,7 +27,7 @@ function BaseEnvironmentPageFilterTrigger(
   // Show 2 environments only if the combined string's length does not exceed 25.
   // Otherwise show only 1 environment.
   const envsToShow =
-    value[0]?.length + value[1]?.length <= 23 ? value.slice(0, 2) : value.slice(0, 1);
+    value[0]!?.length + value[1]!?.length <= 23 ? value.slice(0, 2) : value.slice(0, 1);
 
   // e.g. "production, staging"
   const enumeratedLabel = envsToShow.map(env => trimSlug(env, 25)).join(', ');
diff --git a/static/app/components/organizations/hybridFilter.tsx b/static/app/components/organizations/hybridFilter.tsx
index 82ac8be78b7aee..eb9f17e961dc58 100644
--- a/static/app/components/organizations/hybridFilter.tsx
+++ b/static/app/components/organizations/hybridFilter.tsx
@@ -324,12 +324,12 @@ export function HybridFilter({
       // A modifier key is being pressed --> enter multiple selection mode
       if (multiple && modifierKeyPressed) {
         !modifierTipSeen && setModifierTipSeen(true);
-        toggleOption(diff[0]);
+        toggleOption(diff[0]!);
         return;
       }
 
       // Only one option was clicked on --> use single, direct selection mode
-      onReplace?.(diff[0]);
+      onReplace?.(diff[0]!);
       commit(diff);
     },
     [
diff --git a/static/app/components/organizations/projectPageFilter/index.tsx b/static/app/components/organizations/projectPageFilter/index.tsx
index 6917dd03b8dec6..393d75d57e1ec8 100644
--- a/static/app/components/organizations/projectPageFilter/index.tsx
+++ b/static/app/components/organizations/projectPageFilter/index.tsx
@@ -171,10 +171,10 @@ export function ProjectPageFilter({
       if (!val.length) {
         return allowMultiple
           ? memberProjects.map(p => parseInt(p.id, 10))
-          : [parseInt(memberProjects[0]?.id, 10)];
+          : [parseInt(memberProjects[0]!?.id, 10)];
       }
 
-      return allowMultiple ? val : [val[0]];
+      return allowMultiple ? val : [val[0]!];
     },
     [memberProjects, allowMultiple]
   );
diff --git a/static/app/components/organizations/projectPageFilter/trigger.tsx b/static/app/components/organizations/projectPageFilter/trigger.tsx
index 93b09ff1281862..64fdf90744d256 100644
--- a/static/app/components/organizations/projectPageFilter/trigger.tsx
+++ b/static/app/components/organizations/projectPageFilter/trigger.tsx
@@ -54,7 +54,7 @@ function BaseProjectPageFilterTrigger(
   // Show 2 projects only if the combined string does not exceed maxTitleLength.
   // Otherwise show only 1 project.
   const projectsToShow =
-    selectedProjects[0]?.slug?.length + selectedProjects[1]?.slug?.length <= 23
+    selectedProjects[0]!?.slug?.length + selectedProjects[1]!?.slug?.length <= 23
       ? selectedProjects.slice(0, 2)
       : selectedProjects.slice(0, 1);
 
diff --git a/static/app/components/performance/searchBar.tsx b/static/app/components/performance/searchBar.tsx
index f26ef55e9aa1af..a7293c7458bcde 100644
--- a/static/app/components/performance/searchBar.tsx
+++ b/static/app/components/performance/searchBar.tsx
@@ -97,12 +97,12 @@ function SearchBar(props: SearchBarProps) {
       isDropdownOpen &&
       transactionCount > 0
     ) {
-      const currentHighlightedItem = searchResults[0].children[highlightedItemIndex];
+      const currentHighlightedItem = searchResults[0]!.children[highlightedItemIndex];
       const nextHighlightedItemIndex =
         (highlightedItemIndex + transactionCount + (key === 'ArrowUp' ? -1 : 1)) %
         transactionCount;
       setHighlightedItemIndex(nextHighlightedItemIndex);
-      const nextHighlightedItem = searchResults[0].children[nextHighlightedItemIndex];
+      const nextHighlightedItem = searchResults[0]!.children[nextHighlightedItemIndex];
 
       let newSearchResults = searchResults;
       if (currentHighlightedItem) {
diff --git a/static/app/components/performance/waterfall/utils.spec.tsx b/static/app/components/performance/waterfall/utils.spec.tsx
index c284110f42a07c..e4664d79369cfd 100644
--- a/static/app/components/performance/waterfall/utils.spec.tsx
+++ b/static/app/components/performance/waterfall/utils.spec.tsx
@@ -16,7 +16,7 @@ describe('pickBarColor()', function () {
   });
 
   it('returns a random color when no predefined option is available', function () {
-    const colorsAsArray = Object.keys(CHART_PALETTE).map(key => CHART_PALETTE[17][key]);
+    const colorsAsArray = Object.keys(CHART_PALETTE).map(key => CHART_PALETTE[17]![key]);
 
     let randomColor = pickBarColor('a normal string');
     expect(colorsAsArray).toContain(randomColor);
diff --git a/static/app/components/performance/waterfall/utils.tsx b/static/app/components/performance/waterfall/utils.tsx
index 63b7fed34ff53c..3589403bf789e5 100644
--- a/static/app/components/performance/waterfall/utils.tsx
+++ b/static/app/components/performance/waterfall/utils.tsx
@@ -238,13 +238,13 @@ const getLetterIndex = (letter: string): number => {
   return index === -1 ? 0 : index;
 };
 
-const colorsAsArray = Object.keys(CHART_PALETTE).map(key => CHART_PALETTE[17][key]);
+const colorsAsArray = Object.keys(CHART_PALETTE).map(key => CHART_PALETTE[17]![key]);
 
 export const barColors = {
-  default: CHART_PALETTE[17][4],
-  transaction: CHART_PALETTE[17][8],
-  http: CHART_PALETTE[17][10],
-  db: CHART_PALETTE[17][17],
+  default: CHART_PALETTE[17]![4],
+  transaction: CHART_PALETTE[17]![8],
+  http: CHART_PALETTE[17]![10],
+  db: CHART_PALETTE[17]![17],
 };
 
 export const pickBarColor = (input: string | undefined): string => {
@@ -252,17 +252,17 @@ export const pickBarColor = (input: string | undefined): string => {
   // That way colors stay consistent between transactions.
 
   if (!input || input.length < 3) {
-    return CHART_PALETTE[17][4];
+    return CHART_PALETTE[17]![4]!;
   }
 
   if (barColors[input]) {
     return barColors[input];
   }
 
-  const letterIndex1 = getLetterIndex(input[0]);
-  const letterIndex2 = getLetterIndex(input[1]);
-  const letterIndex3 = getLetterIndex(input[2]);
-  const letterIndex4 = getLetterIndex(input[3]);
+  const letterIndex1 = getLetterIndex(input[0]!);
+  const letterIndex2 = getLetterIndex(input[1]!);
+  const letterIndex3 = getLetterIndex(input[2]!);
+  const letterIndex4 = getLetterIndex(input[3]!);
 
   return colorsAsArray[
     (letterIndex1 + letterIndex2 + letterIndex3 + letterIndex4) % colorsAsArray.length
diff --git a/static/app/components/performanceOnboarding/sidebar.tsx b/static/app/components/performanceOnboarding/sidebar.tsx
index 207dfd170afcf9..23a88d7fe47b63 100644
--- a/static/app/components/performanceOnboarding/sidebar.tsx
+++ b/static/app/components/performanceOnboarding/sidebar.tsx
@@ -85,7 +85,7 @@ function PerformanceOnboardingSidebar(props: CommonSidebarProps) {
 
       const priorityProjects: Project[] = [];
       priorityProjectIds.forEach(projectId => {
-        priorityProjects.push(projectMap[String(projectId)]);
+        priorityProjects.push(projectMap[String(projectId)]!);
       });
 
       // Among the project selection, find a project that has performance onboarding docs support, and has not sent
diff --git a/static/app/components/pickProjectToContinue.tsx b/static/app/components/pickProjectToContinue.tsx
index b15d0fb082a4f1..b04309d63a6871 100644
--- a/static/app/components/pickProjectToContinue.tsx
+++ b/static/app/components/pickProjectToContinue.tsx
@@ -49,7 +49,7 @@ function PickProjectToContinue({
 
   // if the project in URL is missing, but this release belongs to only one project, redirect there
   if (projects.length === 1) {
-    router.replace(path + projects[0].id);
+    router.replace(path + projects[0]!.id);
     return null;
   }
 
diff --git a/static/app/components/platformPicker.spec.tsx b/static/app/components/platformPicker.spec.tsx
index a0a31b356c4904..6e127f16ce96c8 100644
--- a/static/app/components/platformPicker.spec.tsx
+++ b/static/app/components/platformPicker.spec.tsx
@@ -104,7 +104,7 @@ describe('PlatformPicker', function () {
     const platformNames = screen.getAllByRole('heading', {level: 3});
 
     platformNames.forEach((platform, index) => {
-      expect(platform).toHaveTextContent(alphabeticallyOrderedPlatformNames[index]);
+      expect(platform).toHaveTextContent(alphabeticallyOrderedPlatformNames[index]!);
     });
   });
 
diff --git a/static/app/components/platformPicker.tsx b/static/app/components/platformPicker.tsx
index edee2eda9fe73c..c1bba265ab8e1d 100644
--- a/static/app/components/platformPicker.tsx
+++ b/static/app/components/platformPicker.tsx
@@ -72,8 +72,8 @@ class PlatformPicker extends Component {
   };
 
   state: State = {
-    category: this.props.defaultCategory ?? categoryList[0].id,
-    filter: this.props.noAutoFilter ? '' : (this.props.platform || '').split('-')[0],
+    category: this.props.defaultCategory ?? categoryList[0]!.id,
+    filter: this.props.noAutoFilter ? '' : (this.props.platform || '').split('-')[0]!,
   };
 
   get platformList() {
diff --git a/static/app/components/profiling/flamegraph/continuousFlamegraph.tsx b/static/app/components/profiling/flamegraph/continuousFlamegraph.tsx
index cbe1d3931fe460..a55ddbacc11dcf 100644
--- a/static/app/components/profiling/flamegraph/continuousFlamegraph.tsx
+++ b/static/app/components/profiling/flamegraph/continuousFlamegraph.tsx
@@ -165,11 +165,11 @@ function convertContinuousProfileMeasurementsToUIFrames(
   };
 
   for (let i = 0; i < measurement.values.length; i++) {
-    const value = measurement.values[i];
+    const value = measurement.values[i]!;
     const next = measurement.values[i + 1] ?? value;
 
     measurements.values.push({
-      elapsed: next.timestamp - value.timestamp,
+      elapsed: next!.timestamp - value.timestamp,
       value: value.value,
     });
   }
@@ -207,7 +207,7 @@ function findLongestMatchingFrame(
     }
 
     for (let i = 0; i < frame.children.length; i++) {
-      frames.push(frame.children[i]);
+      frames.push(frame.children[i]!);
     }
   }
 
@@ -425,8 +425,8 @@ export function ContinuousFlamegraph(): ReactElement {
 
         let offset = 0;
         for (let i = 0; i < measurements.values.length; i++) {
-          const value = measurements.values[i];
-          const next = measurements.values[i + 1] ?? value;
+          const value = measurements.values[i]!;
+          const next = measurements.values[i + 1]! ?? value;
           offset += (next.timestamp - value.timestamp) * 1e3;
 
           values.push({
@@ -467,8 +467,8 @@ export function ContinuousFlamegraph(): ReactElement {
 
         let offset = 0;
         for (let i = 0; i < measurements.values.length; i++) {
-          const value = measurements.values[i];
-          const next = measurements.values[i + 1] ?? value;
+          const value = measurements.values[i]!;
+          const next = measurements.values[i + 1]! ?? value;
           offset += (next.timestamp - value.timestamp) * 1e3;
 
           values.push({
@@ -502,8 +502,8 @@ export function ContinuousFlamegraph(): ReactElement {
 
       let offset = 0;
       for (let i = 0; i < memory_footprint.values.length; i++) {
-        const value = memory_footprint.values[i];
-        const next = memory_footprint.values[i + 1] ?? value;
+        const value = memory_footprint.values[i]!;
+        const next = memory_footprint.values[i + 1]! ?? value;
         offset += (next.timestamp - value.timestamp) * 1e3;
 
         values.push({
@@ -525,8 +525,8 @@ export function ContinuousFlamegraph(): ReactElement {
 
       let offset = 0;
       for (let i = 0; i < native_memory_footprint.values.length; i++) {
-        const value = native_memory_footprint.values[i];
-        const next = native_memory_footprint.values[i + 1] ?? value;
+        const value = native_memory_footprint.values[i]!;
+        const next = native_memory_footprint.values[i + 1]! ?? value;
         offset += (next.timestamp - value.timestamp) * 1e3;
 
         values.push({
diff --git a/static/app/components/profiling/flamegraph/flamegraph.tsx b/static/app/components/profiling/flamegraph/flamegraph.tsx
index a02ce26d2a4fd4..3e35201a064573 100644
--- a/static/app/components/profiling/flamegraph/flamegraph.tsx
+++ b/static/app/components/profiling/flamegraph/flamegraph.tsx
@@ -132,7 +132,7 @@ function convertProfileMeasurementsToUIFrames(
   };
 
   for (let i = 0; i < measurement.values.length; i++) {
-    const value = measurement.values[i];
+    const value = measurement.values[i]!;
 
     measurements.values.push({
       elapsed: value.elapsed_since_start_ns,
@@ -173,7 +173,7 @@ function findLongestMatchingFrame(
     }
 
     for (let i = 0; i < frame.children.length; i++) {
-      frames.push(frame.children[i]);
+      frames.push(frame.children[i]!);
     }
   }
 
@@ -449,7 +449,7 @@ function Flamegraph(): ReactElement {
         const values: ProfileSeriesMeasurement['values'] = [];
 
         for (let i = 0; i < measurements.values.length; i++) {
-          const value = measurements.values[i];
+          const value = measurements.values[i]!;
           values.push({
             value: value.value,
             elapsed: value.elapsed_since_start_ns,
@@ -478,7 +478,7 @@ function Flamegraph(): ReactElement {
       const values: ProfileSeriesMeasurement['values'] = [];
 
       for (let i = 0; i < memory_footprint.values.length; i++) {
-        const value = memory_footprint.values[i];
+        const value = memory_footprint.values[i]!;
         values.push({
           value: value.value,
           elapsed: value.elapsed_since_start_ns,
@@ -497,7 +497,7 @@ function Flamegraph(): ReactElement {
       const values: ProfileSeriesMeasurement['values'] = [];
 
       for (let i = 0; i < native_memory_footprint.values.length; i++) {
-        const value = native_memory_footprint.values[i];
+        const value = native_memory_footprint.values[i]!;
         values.push({
           value: value.value,
           elapsed: value.elapsed_since_start_ns,
diff --git a/static/app/components/profiling/flamegraph/flamegraphChartTooltip.tsx b/static/app/components/profiling/flamegraph/flamegraphChartTooltip.tsx
index 02ac3aadbec950..328d1202c37539 100644
--- a/static/app/components/profiling/flamegraph/flamegraphChartTooltip.tsx
+++ b/static/app/components/profiling/flamegraph/flamegraphChartTooltip.tsx
@@ -59,7 +59,7 @@ export function FlamegraphChartTooltip({
               />
               {p.name}: 
               
-                {chart.tooltipFormatter(p.points[0].y)}
+                {chart.tooltipFormatter(p.points[0]!.y)}
               
             
           
diff --git a/static/app/components/profiling/flamegraph/flamegraphDrawer/flamegraphDrawer.tsx b/static/app/components/profiling/flamegraph/flamegraphDrawer/flamegraphDrawer.tsx
index 75aad0f8a04977..00e15b320e4034 100644
--- a/static/app/components/profiling/flamegraph/flamegraphDrawer/flamegraphDrawer.tsx
+++ b/static/app/components/profiling/flamegraph/flamegraphDrawer/flamegraphDrawer.tsx
@@ -264,7 +264,7 @@ const FlamegraphDrawer = memo(function FlamegraphDrawer(props: FlamegraphDrawerP
               ? props.profileTransaction.data
               : null
           }
-          projectId={params.projectId}
+          projectId={params.projectId!}
           profileGroup={props.profileGroup}
         />
       ) : null}
diff --git a/static/app/components/profiling/flamegraph/flamegraphOverlays/profileDragDropImport.tsx b/static/app/components/profiling/flamegraph/flamegraphOverlays/profileDragDropImport.tsx
index e7495f1be38133..fd7fe5745e52d9 100644
--- a/static/app/components/profiling/flamegraph/flamegraphOverlays/profileDragDropImport.tsx
+++ b/static/app/components/profiling/flamegraph/flamegraphOverlays/profileDragDropImport.tsx
@@ -25,7 +25,7 @@ function ProfileDragDropImport({
       evt.preventDefault();
       evt.stopPropagation();
 
-      const file = evt.dataTransfer.items[0].getAsFile();
+      const file = evt.dataTransfer.items[0]!.getAsFile();
 
       if (file) {
         setDropState('processing');
diff --git a/static/app/components/profiling/flamegraph/flamegraphPreview.tsx b/static/app/components/profiling/flamegraph/flamegraphPreview.tsx
index e38af70780bf2d..5bcb5c362ef468 100644
--- a/static/app/components/profiling/flamegraph/flamegraphPreview.tsx
+++ b/static/app/components/profiling/flamegraph/flamegraphPreview.tsx
@@ -332,7 +332,7 @@ export function computePreviewConfigView(
     }
 
     for (let i = 0; i < frame.children.length; i++) {
-      frames.push(frame.children[i]);
+      frames.push(frame.children[i]!);
     }
   }
 
diff --git a/static/app/components/profiling/flamegraph/flamegraphToolbar/flamegraphSearch.tsx b/static/app/components/profiling/flamegraph/flamegraphToolbar/flamegraphSearch.tsx
index f9571c828f8f06..b6322a43ac6e2a 100644
--- a/static/app/components/profiling/flamegraph/flamegraphToolbar/flamegraphSearch.tsx
+++ b/static/app/components/profiling/flamegraph/flamegraphToolbar/flamegraphSearch.tsx
@@ -171,7 +171,7 @@ function yieldingRafFrameSearch(
 
   const searchFramesFunction = isRegExpSearch ? searchFrameRegExp : searchFrameFzf;
   const searchSpansFunction = isRegExpSearch ? searchSpanRegExp : searchSpanFzf;
-  const searchQuery = isRegExpSearch ? lookup : lowercaseQuery;
+  const searchQuery = isRegExpSearch ? lookup! : lowercaseQuery;
 
   function searchFramesAndSpans() {
     const start = performance.now();
diff --git a/static/app/components/projects/missingProjectMembership.tsx b/static/app/components/projects/missingProjectMembership.tsx
index 94912788222c8b..8110ca41bac49b 100644
--- a/static/app/components/projects/missingProjectMembership.tsx
+++ b/static/app/components/projects/missingProjectMembership.tsx
@@ -126,14 +126,14 @@ class MissingProjectMembership extends Component {
     const teamAccess = [
       {
         label: t('Request Access'),
-        options: this.getTeamsForAccess()[0].map(request => ({
+        options: this.getTeamsForAccess()[0]!.map(request => ({
           value: request,
           label: `#${request}`,
         })),
       },
       {
         label: t('Pending Requests'),
-        options: this.getTeamsForAccess()[1].map(pending =>
+        options: this.getTeamsForAccess()[1]!.map(pending =>
           this.getPendingTeamOption(pending)
         ),
       },
diff --git a/static/app/components/quickTrace/index.spec.tsx b/static/app/components/quickTrace/index.spec.tsx
index 254aa2acefc80b..353e3a2e8788e8 100644
--- a/static/app/components/quickTrace/index.spec.tsx
+++ b/static/app/components/quickTrace/index.spec.tsx
@@ -411,7 +411,7 @@ describe('Quick Trace', function () {
         makeTransactionHref('p4', 'e4', 't4'),
         makeTransactionHref('p5', 'e5', 't5'),
       ].forEach((target, i) => {
-        const linkNode = nodes[i].children[0];
+        const linkNode = nodes[i]!.children[0];
         if (target) {
           expect(linkNode).toHaveAttribute('href', target);
         } else {
diff --git a/static/app/components/quickTrace/index.tsx b/static/app/components/quickTrace/index.tsx
index 78a914d8796ebd..03cd05ef3fd4ff 100644
--- a/static/app/components/quickTrace/index.tsx
+++ b/static/app/components/quickTrace/index.tsx
@@ -394,20 +394,20 @@ function EventNodeSelector({
     const hoverText = totalErrors ? (
       t('View the error for this Transaction')
     ) : (
-      
+      
     );
     const target = errors.length
-      ? generateSingleErrorTarget(errors[0], organization, location, errorDest)
+      ? generateSingleErrorTarget(errors[0]!, organization, location, errorDest)
       : perfIssues.length
-        ? generateSingleErrorTarget(perfIssues[0], organization, location, errorDest)
+        ? generateSingleErrorTarget(perfIssues[0]!, organization, location, errorDest)
         : generateLinkToEventInTraceView({
             traceSlug,
-            eventId: events[0].event_id,
-            projectSlug: events[0].project_slug,
-            timestamp: events[0].timestamp,
+            eventId: events[0]!.event_id,
+            projectSlug: events[0]!.project_slug,
+            timestamp: events[0]!.timestamp,
             location,
             organization,
-            transactionName: events[0].transaction,
+            transactionName: events[0]!.transaction,
             type: transactionDest,
           });
     return (
diff --git a/static/app/components/replays/breadcrumbs/breadcrumbItem.spec.tsx b/static/app/components/replays/breadcrumbs/breadcrumbItem.spec.tsx
index d2ab3d84f476a6..57ca7b981ebae2 100644
--- a/static/app/components/replays/breadcrumbs/breadcrumbItem.spec.tsx
+++ b/static/app/components/replays/breadcrumbs/breadcrumbItem.spec.tsx
@@ -22,12 +22,12 @@ describe('BreadcrumbItem', function () {
     const mockMouseLeave = jest.fn();
     render(
        {}}
-        startTimestampMs={MOCK_FRAME.timestampMs}
+        startTimestampMs={MOCK_FRAME!.timestampMs}
       />,
       {organization}
     );
diff --git a/static/app/components/replays/breadcrumbs/replayTimelineEvents.tsx b/static/app/components/replays/breadcrumbs/replayTimelineEvents.tsx
index 0a701c42a5e0f1..eed579105eafe8 100644
--- a/static/app/components/replays/breadcrumbs/replayTimelineEvents.tsx
+++ b/static/app/components/replays/breadcrumbs/replayTimelineEvents.tsx
@@ -163,9 +163,9 @@ const getBackgroundGradient = ({
   frameCount: number;
   theme: Theme;
 }) => {
-  const c0 = theme[colors[0]] ?? colors[0];
-  const c1 = theme[colors[1]] ?? colors[1] ?? c0;
-  const c2 = theme[colors[2]] ?? colors[2] ?? c1;
+  const c0 = theme[colors[0]!] ?? colors[0]!;
+  const c1 = theme[colors[1]!] ?? colors[1]! ?? c0;
+  const c2 = theme[colors[2]!] ?? colors[2]! ?? c1;
 
   if (frameCount === 1) {
     return `background: ${c0};`;
diff --git a/static/app/components/replays/canvasReplayerPlugin.tsx b/static/app/components/replays/canvasReplayerPlugin.tsx
index 55fec93e00cdaa..a026dcdf0b1367 100644
--- a/static/app/components/replays/canvasReplayerPlugin.tsx
+++ b/static/app/components/replays/canvasReplayerPlugin.tsx
@@ -51,7 +51,7 @@ function findIndex(
   const mid = Math.floor((start + end) / 2);
 
   // Search lower half
-  if (event.timestamp <= arr[mid].timestamp) {
+  if (event.timestamp <= arr[mid]!.timestamp) {
     return findIndex(arr, event, start, mid - 1);
   }
 
@@ -106,7 +106,7 @@ export function CanvasReplayerPlugin(events: eventWithTime[]): ReplayPlugin {
     while (eventsToPrune.length) {
       // Peek top of queue and see if event should be pruned, otherwise we can break out of the loop
       if (
-        Math.abs(event.timestamp - eventsToPrune[0].timestamp) <= BUFFER_TIME &&
+        Math.abs(event.timestamp - eventsToPrune[0]!.timestamp) <= BUFFER_TIME &&
         eventsToPrune.length <= PRELOAD_SIZE
       ) {
         break;
diff --git a/static/app/components/replays/header/errorCounts.spec.tsx b/static/app/components/replays/header/errorCounts.spec.tsx
index 659e2e89912e92..00a97e2765eb0d 100644
--- a/static/app/components/replays/header/errorCounts.spec.tsx
+++ b/static/app/components/replays/header/errorCounts.spec.tsx
@@ -94,11 +94,11 @@ describe('ErrorCounts', () => {
     const pyIcon = await screen.findByTestId('platform-icon-python');
     expect(pyIcon).toBeInTheDocument();
 
-    expect(countNodes[0].parentElement).toHaveAttribute(
+    expect(countNodes[0]!.parentElement).toHaveAttribute(
       'href',
       '/mock-pathname/?f_e_project=my-js-app&t_main=errors'
     );
-    expect(countNodes[1].parentElement).toHaveAttribute(
+    expect(countNodes[1]!.parentElement).toHaveAttribute(
       'href',
       '/mock-pathname/?f_e_project=my-py-backend&t_main=errors'
     );
diff --git a/static/app/components/replays/utils.spec.tsx b/static/app/components/replays/utils.spec.tsx
index 7e9928dfb91948..e402b281c5f883 100644
--- a/static/app/components/replays/utils.spec.tsx
+++ b/static/app/components/replays/utils.spec.tsx
@@ -110,11 +110,11 @@ describe('getFramesByColumn', () => {
 
   it('should put a crumbs in the first and last buckets', () => {
     const columnCount = 3;
-    const columns = getFramesByColumn(durationMs, [CRUMB_1, CRUMB_5], columnCount);
+    const columns = getFramesByColumn(durationMs, [CRUMB_1!, CRUMB_5!], columnCount);
     expect(columns).toEqual(
       new Map([
-        [1, [CRUMB_1]],
-        [3, [CRUMB_5]],
+        [1, [CRUMB_1!]],
+        [3, [CRUMB_5!]],
       ])
     );
   });
@@ -124,7 +124,7 @@ describe('getFramesByColumn', () => {
     const columnCount = 6;
     const columns = getFramesByColumn(
       durationMs,
-      [CRUMB_1, CRUMB_2, CRUMB_3, CRUMB_4, CRUMB_5],
+      [CRUMB_1!, CRUMB_2!, CRUMB_3!, CRUMB_4!, CRUMB_5!],
       columnCount
     );
     expect(columns).toEqual(
diff --git a/static/app/components/replays/utils.tsx b/static/app/components/replays/utils.tsx
index a750ed5b279590..5c1ee7851f79d9 100644
--- a/static/app/components/replays/utils.tsx
+++ b/static/app/components/replays/utils.tsx
@@ -134,17 +134,17 @@ export function flattenFrames(frames: SpanFrame[]): FlattenedSpanRange[] {
     };
   });
 
-  const flattened = [first];
+  const flattened = [first!];
 
   for (const span of rest) {
     let overlap = false;
     for (const range of flattened) {
-      if (doesOverlap(range, span)) {
+      if (doesOverlap(range!, span)) {
         overlap = true;
-        range.frameCount += 1;
-        range.startTimestamp = Math.min(range.startTimestamp, span.startTimestamp);
-        range.endTimestamp = Math.max(range.endTimestamp, span.endTimestamp);
-        range.duration = range.endTimestamp - range.startTimestamp;
+        range!.frameCount += 1;
+        range!.startTimestamp = Math.min(range!.startTimestamp, span.startTimestamp);
+        range!.endTimestamp = Math.max(range!.endTimestamp, span.endTimestamp);
+        range!.duration = range!.endTimestamp - range!.startTimestamp;
         break;
       }
     }
@@ -178,11 +178,11 @@ export function findVideoSegmentIndex(
 
   const mid = Math.floor((start + end) / 2);
 
-  const [ts, index] = trackList[mid];
+  const [ts, index] = trackList[mid]!;
   const segment = segments[index];
 
   // Segment match found
-  if (targetTimestamp >= ts && targetTimestamp <= ts + segment.duration) {
+  if (targetTimestamp >= ts && targetTimestamp <= ts + segment!.duration) {
     return index;
   }
 
diff --git a/static/app/components/replays/videoReplayer.tsx b/static/app/components/replays/videoReplayer.tsx
index 1583fc9172238d..b16ceb6444ef40 100644
--- a/static/app/components/replays/videoReplayer.tsx
+++ b/static/app/components/replays/videoReplayer.tsx
@@ -141,7 +141,7 @@ export class VideoReplayer {
     const handleLoadedData = event => {
       // Used to correctly set the dimensions of the first frame
       if (index === 0) {
-        this._callbacks.onLoaded(event);
+        this._callbacks.onLoaded!(event);
       }
 
       // Only call this for current segment as we preload multiple
@@ -159,7 +159,7 @@ export class VideoReplayer {
 
     const handlePlay = event => {
       if (index === this._currentIndex) {
-        this._callbacks.onLoaded(event);
+        this._callbacks.onLoaded!(event);
       }
     };
 
@@ -168,13 +168,13 @@ export class VideoReplayer {
       if (index === this._currentIndex) {
         // Theoretically we could have different orientations and they should
         // only happen in different segments
-        this._callbacks.onLoaded(event);
+        this._callbacks.onLoaded!(event);
       }
     };
 
     const handleSeeking = event => {
       // Centers the video when seeking (and video is not playing)
-      this._callbacks.onLoaded(event);
+      this._callbacks.onLoaded!(event);
     };
 
     el.addEventListener('ended', handleEnded);
@@ -284,12 +284,12 @@ export class VideoReplayer {
       this.resumeTimer();
     }
 
-    this._callbacks.onBuffer(isBuffering);
+    this._callbacks.onBuffer!(isBuffering);
   }
 
   private stopReplay() {
     this._timer.stop();
-    this._callbacks.onFinished();
+    this._callbacks.onFinished!();
     this._isPlaying = false;
   }
 
diff --git a/static/app/components/replaysOnboarding/platformOptionDropdown.tsx b/static/app/components/replaysOnboarding/platformOptionDropdown.tsx
index 780a9fc75f8924..e735456aa1acdb 100644
--- a/static/app/components/replaysOnboarding/platformOptionDropdown.tsx
+++ b/static/app/components/replaysOnboarding/platformOptionDropdown.tsx
@@ -41,7 +41,7 @@ function OptionControl({option, value, onChange, disabled}: OptionControlProps)
   return (
      v.value === value)?.label ?? option.items[0].label
+        option.items.find(v => v.value === value)?.label ?? option.items[0]!.label
       }
       value={value}
       onChange={onChange}
@@ -81,7 +81,7 @@ export function PlatformOptionDropdown({
        handleChange('siblingOption', v.value)}
         disabled={disabled}
       />
diff --git a/static/app/components/replaysOnboarding/sidebar.tsx b/static/app/components/replaysOnboarding/sidebar.tsx
index f2c6054f997d19..e40f0a2e5b30af 100644
--- a/static/app/components/replaysOnboarding/sidebar.tsx
+++ b/static/app/components/replaysOnboarding/sidebar.tsx
@@ -181,7 +181,7 @@ function OnboardingContent({
     value: PlatformKey;
     label?: ReactNode;
     textValue?: string;
-  }>(jsFrameworkSelectOptions[0]);
+  }>(jsFrameworkSelectOptions[0]!);
 
   const backendPlatform =
     currentProject.platform && replayBackendPlatforms.includes(currentProject.platform);
@@ -215,7 +215,7 @@ function OnboardingContent({
     platform:
       showJsFrameworkInstructions && setupMode() === 'npm'
         ? replayJsFrameworkOptions().find(p => p.id === jsFramework.value) ??
-          replayJsFrameworkOptions()[0]
+          replayJsFrameworkOptions()[0]!
         : currentPlatform,
     projSlug: currentProject.slug,
     orgSlug: organization.slug,
@@ -226,7 +226,7 @@ function OnboardingContent({
   const {docs: jsFrameworkDocs} = useLoadGettingStarted({
     platform:
       replayJsFrameworkOptions().find(p => p.id === jsFramework.value) ??
-      replayJsFrameworkOptions()[0],
+      replayJsFrameworkOptions()[0]!,
     projSlug: currentProject.slug,
     orgSlug: organization.slug,
     productType: 'replay',
diff --git a/static/app/components/replaysOnboarding/utils.tsx b/static/app/components/replaysOnboarding/utils.tsx
index 96273c99b035ec..1f057421d3b950 100644
--- a/static/app/components/replaysOnboarding/utils.tsx
+++ b/static/app/components/replaysOnboarding/utils.tsx
@@ -7,7 +7,7 @@ export function replayJsFrameworkOptions(): PlatformIntegration[] {
   // at the front so that it shows up by default in the onboarding.
   const frameworks = platforms.filter(p => replayFrontendPlatforms.includes(p.id));
   const jsPlatformIdx = frameworks.findIndex(p => p.id === 'javascript');
-  const jsPlatform = frameworks[jsPlatformIdx];
+  const jsPlatform = frameworks[jsPlatformIdx]!;
 
   // move javascript to the front
   frameworks.splice(jsPlatformIdx, 1);
diff --git a/static/app/components/resultGrid.tsx b/static/app/components/resultGrid.tsx
index e14af9c402250d..d4376e5e5ac85c 100644
--- a/static/app/components/resultGrid.tsx
+++ b/static/app/components/resultGrid.tsx
@@ -204,7 +204,7 @@ class ResultGrid extends Component {
     this.setState(
       {
         query: queryParams.query ?? '',
-        sortBy: queryParams.sortBy ?? this.props.defaultSort,
+        sortBy: queryParams.sortBy ?? this.props.defaultSort!,
         filters: {...queryParams},
         pageLinks: null,
         loading: true,
@@ -358,7 +358,7 @@ class ResultGrid extends Component {
              {
 
     const [searchResults, directResults] = await Promise.all([
       this.getSearchableResults([
-        organizations,
-        projects,
-        teams,
-        members,
-        plugins,
-        integrations,
-        sentryApps,
-        docIntegrations,
+        organizations!,
+        projects!,
+        teams!,
+        members!,
+        plugins!,
+        integrations!,
+        sentryApps!,
+        docIntegrations!,
       ]),
-      this.getDirectResults([shortIdLookup, eventIdLookup]),
+      this.getDirectResults([shortIdLookup!, eventIdLookup!]),
     ]);
 
     // TODO(XXX): Might consider adding logic to maintain consistent ordering
@@ -468,14 +468,14 @@ class ApiSource extends Component {
       docIntegrations,
     ] = requests;
     const searchResults = await Promise.all([
-      createOrganizationResults(organizations),
-      createProjectResults(projects, orgId),
-      createTeamResults(teams, orgId),
-      createMemberResults(members, orgId),
-      createIntegrationResults(integrations, orgId),
-      createPluginResults(plugins, orgId),
-      createSentryAppResults(sentryApps, orgId),
-      createDocIntegrationResults(docIntegrations, orgId),
+      createOrganizationResults(organizations!),
+      createProjectResults(projects!, orgId),
+      createTeamResults(teams!, orgId),
+      createMemberResults(members!, orgId),
+      createIntegrationResults(integrations!, orgId),
+      createPluginResults(plugins!, orgId),
+      createSentryAppResults(sentryApps!, orgId),
+      createDocIntegrationResults(docIntegrations!, orgId),
     ]);
 
     return searchResults.flat();
@@ -488,8 +488,8 @@ class ApiSource extends Component {
 
     const directResults = (
       await Promise.all([
-        createShortIdLookupResult(shortIdLookup),
-        createEventIdLookupResult(eventIdLookup),
+        createShortIdLookupResult(shortIdLookup!),
+        createEventIdLookupResult(eventIdLookup!),
       ])
     ).filter(defined);
 
diff --git a/static/app/components/search/sources/helpSource.tsx b/static/app/components/search/sources/helpSource.tsx
index 95f6623df24f16..4f72b1a7c234dc 100644
--- a/static/app/components/search/sources/helpSource.tsx
+++ b/static/app/components/search/sources/helpSource.tsx
@@ -121,8 +121,8 @@ function mapSearchResults(results: SearchResult[]) {
 
     // The first element should indicate the section.
     if (sectionItems.length > 0) {
-      sectionItems[0].item.sectionHeading = section.name;
-      sectionItems[0].item.sectionCount = sectionItems.length;
+      sectionItems[0]!.item.sectionHeading = section.name;
+      sectionItems[0]!.item.sectionCount = sectionItems.length;
 
       items.push(...sectionItems);
       return;
diff --git a/static/app/components/search/sources/index.tsx b/static/app/components/search/sources/index.tsx
index 24b98acbb0d5f5..523c99cd7f9190 100644
--- a/static/app/components/search/sources/index.tsx
+++ b/static/app/components/search/sources/index.tsx
@@ -53,7 +53,7 @@ function SearchSources(props: Props) {
       if (idx >= sources.length) {
         return renderResults(results);
       }
-      const Source = sources[idx];
+      const Source = sources[idx]!;
       return (
         
           {(args: SourceResult) => {
diff --git a/static/app/components/searchQueryBuilder/hooks/useQueryBuilderState.tsx b/static/app/components/searchQueryBuilder/hooks/useQueryBuilderState.tsx
index 3296faf061fe89..8f9157cb041935 100644
--- a/static/app/components/searchQueryBuilder/hooks/useQueryBuilderState.tsx
+++ b/static/app/components/searchQueryBuilder/hooks/useQueryBuilderState.tsx
@@ -131,7 +131,7 @@ function removeQueryTokensFromQuery(
   }
 
   return removeExcessWhitespaceFromParts(
-    query.substring(0, tokens[0].location.start.offset),
+    query.substring(0, tokens[0]!.location.start.offset),
     query.substring(tokens.at(-1)!.location.end.offset)
   );
 }
@@ -243,7 +243,7 @@ function replaceQueryTokens(
     return query;
   }
 
-  const start = query.substring(0, tokens[0].location.start.offset);
+  const start = query.substring(0, tokens[0]!.location.start.offset);
   const end = query.substring(tokens.at(-1)!.location.end.offset);
 
   return start + value + end;
@@ -296,7 +296,7 @@ export function replaceTokensWithPadding(
     return query;
   }
 
-  const start = query.substring(0, tokens[0].location.start.offset);
+  const start = query.substring(0, tokens[0]!.location.start.offset);
   const end = query.substring(tokens.at(-1)!.location.end.offset);
 
   return removeExcessWhitespaceFromParts(start, value, end);
@@ -367,7 +367,7 @@ function updateFilterMultipleValues(
   const newValue =
     uniqNonEmptyValues.length > 1
       ? `[${uniqNonEmptyValues.join(',')}]`
-      : uniqNonEmptyValues[0];
+      : uniqNonEmptyValues[0]!;
 
   return {...state, query: replaceQueryToken(state.query, token.value, newValue)};
 }
diff --git a/static/app/components/searchQueryBuilder/hooks/useSelectOnDrag.tsx b/static/app/components/searchQueryBuilder/hooks/useSelectOnDrag.tsx
index 83c37de6c73d45..1cc93d905ef84d 100644
--- a/static/app/components/searchQueryBuilder/hooks/useSelectOnDrag.tsx
+++ b/static/app/components/searchQueryBuilder/hooks/useSelectOnDrag.tsx
@@ -87,8 +87,8 @@ function getItemIndexAtPosition(
   y: number
 ) {
   for (let i = 0; i < keys.length; i++) {
-    const key = keys[i];
-    const coords = coordinates[key];
+    const key = keys[i]!;
+    const coords = coordinates[key]!;
 
     // If we are above this item, we must be in between this and the
     // previous item on the row above it.
diff --git a/static/app/components/searchQueryBuilder/index.spec.tsx b/static/app/components/searchQueryBuilder/index.spec.tsx
index ada4b162131fcf..a36e631d1b5110 100644
--- a/static/app/components/searchQueryBuilder/index.spec.tsx
+++ b/static/app/components/searchQueryBuilder/index.spec.tsx
@@ -321,7 +321,7 @@ describe('SearchQueryBuilder', function () {
       expect(groups).toHaveLength(3);
 
       // First group (Field) should have age, assigned, browser.name
-      const group1 = groups[0];
+      const group1 = groups[0]!;
       expect(within(group1).getByRole('option', {name: 'age'})).toBeInTheDocument();
       expect(within(group1).getByRole('option', {name: 'assigned'})).toBeInTheDocument();
       expect(
@@ -329,13 +329,13 @@ describe('SearchQueryBuilder', function () {
       ).toBeInTheDocument();
 
       // Second group (Tag) should have custom_tag_name
-      const group2 = groups[1];
+      const group2 = groups[1]!;
       expect(
         within(group2).getByRole('option', {name: 'custom_tag_name'})
       ).toBeInTheDocument();
 
       // There should be a third group for uncategorized keys
-      const group3 = groups[2];
+      const group3 = groups[2]!;
       expect(
         within(group3).getByRole('option', {name: 'uncategorized_tag'})
       ).toBeInTheDocument();
@@ -398,7 +398,7 @@ describe('SearchQueryBuilder', function () {
         expect(recentFilterKeys[1]).toHaveTextContent('browser');
         expect(recentFilterKeys[2]).toHaveTextContent('is');
 
-        await userEvent.click(recentFilterKeys[0]);
+        await userEvent.click(recentFilterKeys[0]!);
 
         expect(await screen.findByRole('row', {name: 'assigned:""'})).toBeInTheDocument();
       });
@@ -460,7 +460,7 @@ describe('SearchQueryBuilder', function () {
         await waitFor(() => {
           expect(getLastInput()).toHaveAttribute(
             'aria-activedescendant',
-            recentFilterKeys[0].id
+            recentFilterKeys[0]!.id
           );
         });
 
@@ -469,7 +469,7 @@ describe('SearchQueryBuilder', function () {
         await waitFor(() => {
           expect(getLastInput()).toHaveAttribute(
             'aria-activedescendant',
-            recentFilterKeys[1].id
+            recentFilterKeys[1]!.id
           );
         });
 
@@ -487,7 +487,7 @@ describe('SearchQueryBuilder', function () {
         await waitFor(() => {
           expect(getLastInput()).toHaveAttribute(
             'aria-activedescendant',
-            recentFilterKeys[0].id
+            recentFilterKeys[0]!.id
           );
         });
       });
@@ -695,7 +695,7 @@ describe('SearchQueryBuilder', function () {
       // jsdom does not support getBoundingClientRect, so we need to mock it for each item
 
       // First freeText area is 5px wide
-      freeText1.getBoundingClientRect = () => {
+      freeText1!.getBoundingClientRect = () => {
         return {
           top: 0,
           left: 10,
@@ -706,7 +706,7 @@ describe('SearchQueryBuilder', function () {
         } as DOMRect;
       };
       // "is:unresolved" filter is 100px wide
-      filter.getBoundingClientRect = () => {
+      filter!.getBoundingClientRect = () => {
         return {
           top: 0,
           left: 15,
@@ -717,7 +717,7 @@ describe('SearchQueryBuilder', function () {
         } as DOMRect;
       };
       // Last freeText area is 200px wide
-      freeText2.getBoundingClientRect = () => {
+      freeText2!.getBoundingClientRect = () => {
         return {
           top: 0,
           left: 115,
@@ -990,7 +990,7 @@ describe('SearchQueryBuilder', function () {
 
       // Put focus into the first input (before the token)
       await userEvent.click(
-        screen.getAllByRole('combobox', {name: 'Add a search term'})[0]
+        screen.getAllByRole('combobox', {name: 'Add a search term'})[0]!
       );
 
       // Pressing delete once should focus the previous token
@@ -1461,17 +1461,17 @@ describe('SearchQueryBuilder', function () {
       expect(within(screen.getByRole('listbox')).getByText('All')).toBeInTheDocument();
 
       // First group is the selected "me"
-      expect(within(groups[0]).getByRole('option', {name: 'me'})).toBeInTheDocument();
+      expect(within(groups[0]!).getByRole('option', {name: 'me'})).toBeInTheDocument();
       // Second group is the remaining option in the "Suggested" section
       expect(
-        within(groups[1]).getByRole('option', {name: 'unassigned'})
+        within(groups[1]!).getByRole('option', {name: 'unassigned'})
       ).toBeInTheDocument();
       // Third group are the options under the "All" section
       expect(
-        within(groups[2]).getByRole('option', {name: 'person1@sentry.io'})
+        within(groups[2]!).getByRole('option', {name: 'person1@sentry.io'})
       ).toBeInTheDocument();
       expect(
-        within(groups[2]).getByRole('option', {name: 'person2@sentry.io'})
+        within(groups[2]!).getByRole('option', {name: 'person2@sentry.io'})
       ).toBeInTheDocument();
     });
 
diff --git a/static/app/components/searchQueryBuilder/tokens/filter/filter.tsx b/static/app/components/searchQueryBuilder/tokens/filter/filter.tsx
index af001328692cca..15665bb382cbdd 100644
--- a/static/app/components/searchQueryBuilder/tokens/filter/filter.tsx
+++ b/static/app/components/searchQueryBuilder/tokens/filter/filter.tsx
@@ -51,10 +51,10 @@ export function FilterValueText({token}: {token: TokenResult}) {
     case Token.VALUE_NUMBER_LIST:
       const items = token.value.items;
 
-      if (items.length === 1 && items[0].value) {
+      if (items.length === 1 && items[0]!.value) {
         return (
           
-            {formatFilterValue(items[0].value)}
+            {formatFilterValue(items[0]!.value)}
           
         );
       }
diff --git a/static/app/components/searchQueryBuilder/tokens/filter/parametersCombobox.tsx b/static/app/components/searchQueryBuilder/tokens/filter/parametersCombobox.tsx
index 642ded7066b69c..bcbdd2935b45a1 100644
--- a/static/app/components/searchQueryBuilder/tokens/filter/parametersCombobox.tsx
+++ b/static/app/components/searchQueryBuilder/tokens/filter/parametersCombobox.tsx
@@ -44,9 +44,9 @@ function getParameterAtCursorPosition(
 
   let characterCount = 0;
   for (let i = 0; i < items.length; i++) {
-    characterCount += items[i].length + 1;
+    characterCount += items[i]!.length + 1;
     if (characterCount > cursorPosition) {
-      return {parameterIndex: i, textValue: items[i].trim()};
+      return {parameterIndex: i, textValue: items[i]!.trim()};
     }
   }
 
@@ -58,7 +58,7 @@ function getCursorPositionAtEndOfParameter(text: string, parameterIndex: number)
   const charactersBefore =
     items.slice(0, parameterIndex).join('').length + parameterIndex;
 
-  return charactersBefore + items[parameterIndex].length;
+  return charactersBefore + items[parameterIndex]!.length;
 }
 
 function useSelectionIndex({
diff --git a/static/app/components/searchQueryBuilder/tokens/filter/parsers/string/parser.spec.tsx b/static/app/components/searchQueryBuilder/tokens/filter/parsers/string/parser.spec.tsx
index aa1333237fb8d8..4e3a6a1f7c40a5 100644
--- a/static/app/components/searchQueryBuilder/tokens/filter/parsers/string/parser.spec.tsx
+++ b/static/app/components/searchQueryBuilder/tokens/filter/parsers/string/parser.spec.tsx
@@ -7,7 +7,7 @@ describe('parseMultiSelectValue', function () {
     expect(result).not.toBeNull();
 
     expect(result!.items).toHaveLength(1);
-    expect(result?.items[0].value?.value).toEqual('a');
+    expect(result!.items[0]!.value?.value).toEqual('a');
   });
 
   it('multiple value', function () {
@@ -16,9 +16,9 @@ describe('parseMultiSelectValue', function () {
     expect(result).not.toBeNull();
 
     expect(result!.items).toHaveLength(3);
-    expect(result?.items[0].value?.value).toEqual('a');
-    expect(result?.items[1].value?.value).toEqual('b');
-    expect(result?.items[2].value?.value).toEqual('c');
+    expect(result!?.items[0]!.value?.value).toEqual('a');
+    expect(result!?.items[1]!.value?.value).toEqual('b');
+    expect(result!?.items[2]!.value?.value).toEqual('c');
   });
 
   it('quoted value', function () {
@@ -27,13 +27,13 @@ describe('parseMultiSelectValue', function () {
     expect(result).not.toBeNull();
 
     expect(result!.items).toHaveLength(3);
-    expect(result?.items[0].value?.value).toEqual('a');
+    expect(result!?.items[0]!.value?.value).toEqual('a');
 
-    expect(result?.items[1].value?.value).toEqual('b');
-    expect(result?.items[1].value?.text).toEqual('"b"');
-    expect(result?.items[1].value?.quoted).toBe(true);
+    expect(result!?.items[1]!.value?.value).toEqual('b');
+    expect(result!?.items[1]!.value?.text).toEqual('"b"');
+    expect(result!?.items[1]!.value?.quoted).toBe(true);
 
-    expect(result?.items[2].value?.value).toEqual('c');
+    expect(result!.items[2]!.value?.value).toEqual('c');
   });
 
   it('just quotes', function () {
@@ -44,9 +44,9 @@ describe('parseMultiSelectValue', function () {
     expect(result!.items).toHaveLength(1);
     const item = result!.items[0];
 
-    expect(item.value?.value).toEqual('');
-    expect(item.value?.text).toEqual('""');
-    expect(item.value?.quoted).toBe(true);
+    expect(item!.value!?.value).toEqual('');
+    expect(item!.value!?.text).toEqual('""');
+    expect(item!.value!?.quoted).toBe(true);
   });
 
   it('single empty value', function () {
@@ -57,7 +57,7 @@ describe('parseMultiSelectValue', function () {
     expect(result!.items).toHaveLength(1);
     const item = result!.items[0];
 
-    expect(item.value!.value).toBe('');
+    expect(item!.value!.value).toBe('');
   });
 
   it('multiple empty value', function () {
@@ -67,9 +67,9 @@ describe('parseMultiSelectValue', function () {
 
     expect(result!.items).toHaveLength(3);
 
-    expect(result?.items[0].value?.value).toEqual('a');
-    expect(result?.items[1].value?.value).toBe('');
-    expect(result?.items[2].value?.value).toEqual('b');
+    expect(result!?.items[0]!.value!?.value).toEqual('a');
+    expect(result!?.items[1]!.value!?.value).toBe('');
+    expect(result!?.items[2]!.value!?.value).toEqual('b');
   });
 
   it('trailing comma', function () {
@@ -79,8 +79,8 @@ describe('parseMultiSelectValue', function () {
 
     expect(result!.items).toHaveLength(2);
 
-    expect(result?.items[0].value?.value).toEqual('a');
-    expect(result?.items[1].value?.value).toBe('');
+    expect(result!?.items[0]!.value!?.value).toEqual('a');
+    expect(result!?.items[1]!.value!?.value).toBe('');
   });
 
   it('spaces', function () {
@@ -90,8 +90,8 @@ describe('parseMultiSelectValue', function () {
 
     expect(result!.items).toHaveLength(3);
 
-    expect(result?.items[0].value?.value).toEqual('a');
-    expect(result?.items[1].value?.value).toEqual('b c');
-    expect(result?.items[2].value?.value).toEqual('d');
+    expect(result!?.items[0]!.value!?.value).toEqual('a');
+    expect(result!?.items[1]!.value!?.value).toEqual('b c');
+    expect(result!?.items[2]!.value!?.value).toEqual('d');
   });
 });
diff --git a/static/app/components/searchQueryBuilder/tokens/filter/valueListBox.tsx b/static/app/components/searchQueryBuilder/tokens/filter/valueListBox.tsx
index 6da3c0416ffff8..7cd8c2c9b53ed4 100644
--- a/static/app/components/searchQueryBuilder/tokens/filter/valueListBox.tsx
+++ b/static/app/components/searchQueryBuilder/tokens/filter/valueListBox.tsx
@@ -82,7 +82,7 @@ export function ValueListBox>({
               overlayIsOpen={isOpen}
               showSectionHeaders={!filterValue}
               size="sm"
-              style={{maxWidth: overlayProps.style.maxWidth}}
+              style={{maxWidth: overlayProps.style!.maxWidth}}
             />