maps icon indicating copy to clipboard operation
maps copied to clipboard

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

Open sairus2k opened this issue 1 year ago • 2 comments

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

sairus2k avatar Aug 19 '24 06:08 sairus2k

@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

mfazekas avatar Aug 20 '24 10:08 mfazekas

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

sairus2k avatar Aug 21 '24 15:08 sairus2k