Updating Example App to use React Native 0.81.1

[whiteHatCip]

Description

Updating Example App to use React Native 0.81.0

Because of the high amount of files changed, I advise you to review this PR using Google Chrome, as it seems that from Safari the Github UI hangs when entering the Files Changed tab

Checklist

• I've read CONTRIBUTING.md
• I updated the doc/other generated code with running yarn generate in the root folder
• I have tested the new feature on /example app.
  • In V11 mode/ios
  • In New Architecture mode/ios
  • In V11 mode/android
  • In New Architecture mode/android
• I updated the example app (but no new feature has been implemented)

Changes

• Updating the example app to make use of the dependencies' latest versions, including react-native 0.81.0.
• Importing SafeAreaView from react-native-safe-area-context to get rid of deprecation warnings for importing it from react-native
• The example app now will show all the pages properly: some of them were showing two screen headers at the same time, and fixing an app crash when tapping clusters in the Earthquakes example screen on iOS.
• The example app will show modals using react-navigation modals and of react-native Modals, for more comprehensive presentation of react-native alternatives and better UX.

[whiteHatCip]

@mfazekas

FYI in this PR I had to put the changes from PR #3937, because otherwise the example app for iOS wouldn't build. It would make sense to merge PR #3937 before this one and #3941.

In addition, I also had to update debounce dependency to version 2.2.0 in the root package.json because otherwise debounce wouldn't work in the example app's MapView component

[Copilot]

Pull Request Overview

This PR updates the example app to use React Native 0.81.1 and makes several quality improvements. It includes upgrading dependencies, improving error handling, replacing deprecated imports, and enhancing the navigation structure for better user experience.

• Updates React Native from 0.80.2 to 0.81.1 and upgrades related dependencies
• Refactors debounce library usage and improves TypeScript configuration
• Enhances modal presentation with React Navigation modals and native modals

Reviewed Changes

Copilot reviewed 43 out of 46 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
src/components/MapView.tsx	Updates debounce library usage for API compatibility
package.json	Upgrades debounce to v2.2.0 and adds eslint-plugin-prettier
ios/RNMBX/ShapeAnimators/	Renames method from create to generate for consistency
example/ files	Updates SafeAreaView imports to use react-native-safe-area-context
example/src/examples/CacheManagement/	Converts from class to functional component and reorganizes structure
example/src/examples/SymbolCircleLayer/Earthquakes.tsx	Refactors modal presentation and improves component organization
example/src/examples/Map/MapAndRNNavigation.js	Enhances modal presentation with multiple navigation options
Various example files	Removes deprecated Page wrapper usage throughout examples

Comments suppressed due to low confidence (1)

example/src/examples/SymbolCircleLayer/ShapeSourceIcon.js:1

• Text components cannot have border radius, shadow properties, or backgroundColor applied directly. These styling properties should be applied to a wrapping View component instead.

import React from 'react';

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[Copilot]

The title was corrected from "Animaated point" to "Animated point" - this fixes the spelling error.

[mfazekas]

@whiteHatCip I'm concerned about this PR getting bigger and bigger. Also I'm not 100% sure about converting examples to typescript. Those are code examples serving as documentation/demonstrating the use of rnmapbox and typescript generally means a bit more noise.

[whiteHatCip]

@whiteHatCip I'm concerned about this PR getting bigger and bigger. Also I'm not 100% sure about converting examples to typescript. Those are code examples serving as documentation/demonstrating the use of rnmapbox and typescript generally means a bit more noise.

@mfazekas I see your point. The thing is that saw the notification from the Copilot review: Corrected one suggestion for a useless wrapper, and noticed a couple more things, like an error that would have caused a crash related to the ShapeSource example.
If I may say my humble opinion, typescript allows less confusion on the kind of data that is being manipulated, rather than noise, but maybe this is a bias of mine, coming from the fact that I prefer it. Considering that react-native now defaults new project to be based on Typescript, moving towards it seems a reasonable decision. But I don't want to push any decision. I thought I was doing good. And also, there were already examples that were using Typescript, therefore I didn't think that converting a couple of the would have been a problem. I thought that the JS examples were simply legacy examples that were part of the library since a long time. That's it

Anyway, I won't add any more changes to the changes from this PR. You approved it, early this morning, Shall we merge it as is, or should I revert that last file I turned from JS to TS for this PR to be merged? What is exactly that you are concerned about? Is it just about that single js-to-tsx file?