Skip to content

Conversation

@hb2708
Copy link
Contributor

@hb2708 hb2708 commented Dec 20, 2025

✅ I have read the contributing file

Completes #409

Summary

This PR focuses on a major upgrade and standardization of the app's navigation system. The primary motivation was to migrate the codebase to React Navigation v7 and adopt native-stack for improved performance and native feel.

Key changes include:

  • Migration to Native Stack: Converted Root, Modal, and Tab stack navigators from JS-based stack to native-stack.
  • Navigation Options Standardization: Refactored navigation options across all screens (Features, Modals, Tabs) to ensure consistent header styling, back button behavior, and title alignment across iOS and Android.
  • Large Header Support: Implemented native large header titles for key screens (Emissions, Budget, Settings) on iOS.
  • Android Tab Bar Padding Fix: specific fix for Android where the last item in CategorySelection and SubCategorySelection was hidden behind the tab bar by increasing the bottom padding constant.
  • TypeScript & Dependency Updates: Resolved TypeScript errors in platform utilities and updated yarn.lock for v7 dependencies.

Changelog

  • Fix: Increased ANDROID_TAB_BAR_HEIGHT constant from 60 to 90 to prevent content overlap on Android scroll views.
  • Refactor: Migrated all stack navigators (Root, Home, Emissions, Budget, Act, Settings) to @react-navigation/native-stack.
  • Refactor: Standardized navigationOptions for all feature and modal screens, removing redundant configs and adhering to platform defaults.
  • Feat: Enabled "Large Title" headers for Emissions, Budget, and Settings screens.
  • Fix: Updated getIOSVersion utility to resolve TypeScript errors.
  • Chore: Updated package.json and yarn.lock for React Navigation v7 and related dependencies.

Note:

Saw this warning coming in when opening info modal from add emission screen We can cover it as a separate ticket

 WARN  Your app (or one of its dependencies) is using an outdated JSX transform. Update to the modern JSX transform for faster performance: https://react.dev/link/new-jsx-transform

- Replace createStackNavigator with createNativeStackNavigator in AddEmissionNavigator.
- Update navigation options for AddEmission, BarCodeScan, CategorySelection, and SubCategorySelection screens to use NativeStackNavigationOptions.
- Enable large title and transparent header for CategorySelectionScreen on iOS.
- Adjust InfoButton styles to remove unnecessary margin in native header.
@hb2708
Copy link
Contributor Author

hb2708 commented Dec 20, 2025

@PierreBresson pushed a pr. If i missed any or we need different UX than what we have let me know will try addressing

@hb2708 hb2708 changed the title Nmf app 409 Nmf app 409 - feat: large header title Dec 20, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant