rnmapbox / maps

A Mapbox react native module for creating custom maps
MIT License
2.19k stars 834 forks source link

[Bug]: TypeScript Error with "noUncheckedIndexedAccess" in tsconfig.json #3591

Open sairus2k opened 3 weeks ago

sairus2k commented 3 weeks ago

Mapbox Implementation

Mapbox

Mapbox Version

default

React Native Version

0.75.2

Platform

iOS, Android

@rnmapbox/maps version

10.1.29

Standalone component to reproduce

Reproduction repo

import { Camera, Map } from '@rnmapbox/maps'
import React, { useRef } from 'react'

function MapComponent() {
  const cameraRef = useRef<Camera>(null)

  return (
               <Map cameraRef={cameraRef}>
                {/*...*/}
               </Map>
  )
}

Observed behavior and steps to reproduce

  1. Init new react-native project npx @react-native-community/cli@latest init
  2. Install @rnmapbox/maps
  3. Add "noUncheckedIndexedAccess": true to tsconfig.json
  4. Add Map component with cameraRef prop. Example
  5. Run npx tsc --noEmit
Found 8 errors in 1 file.

Errors  Files
     8  node_modules/@rnmapbox/maps/src/components/Camera.tsx:450

Expected behavior

Changes to project local typescript configuration should not impact files imported from node_modules

Notes / preliminary analysis

Possible Solution

Update paddingConfig type declaration:

Change the type from number | number[] to number | [number, number] | [number, number, number, number]. This ensures a stricter type safety as only these specific array lengths are meaningful and expected in the context of the Camera component.

Enable noUncheckedIndexedAccess for the project:

By enabling this flag for the entire project, similar issues can be prevented in future development cycles, enforcing stricter type checks and improving overall code robustness.

Additional links and references

There is a previously closed issue regarding this problem marked as completed: https://github.com/rnmapbox/maps/issues/2528

mfazekas commented 3 weeks ago

@sairus2k pls include repro steps, to reproduce in a new project, to ensure it's not something in your project settings. Staring with npx @react-native-community/cli@latest init, thanks

sairus2k commented 3 weeks ago

@mfazekas thanks for taking a look. I've updated reproduction steps and added a link to reproduction repo.