zoontek / react-native-edge-to-edge

Effortlessly enable edge-to-edge display in React Native (formerly known as react-native-bars).
MIT License
624 stars 21 forks source link

TypeError: Cannot read properties of undefined (reading 'android') when running expo prebuild #43

Closed fredrikburmester closed 3 weeks ago

fredrikburmester commented 3 weeks ago

Before submitting a new issue

Bug summary

Description

When using the withAndroidEdgeToEdgeTheme plugin, an error occurs if the android property is not present in the props object when running expo prebuild.

Error Message

TypeError: [android.styles]: withAndroidStylesBaseMod: Cannot read properties of undefined (reading 'android')

Steps to Reproduce

  1. Use the withAndroidEdgeToEdgeTheme plugin in an Expo project
  2. Run expo prebuild

Proposed Fix

I've created a patch that adds a check for the android property and provides a default empty object if it's not present. Here's the patch:

--- expo.js.original    2024-11-10 09:08:19
+++ node_modules/react-native-edge-to-edge/dist/commonjs/expo.js    2024-11-10 09:08:23
@@ -19,10 +19,8 @@
     const {
       barStyle
     } = androidStatusBar;
+    const android = props?.android || {};
     const {
-      android = {}
-    } = props;
-    const {
       parentTheme = "Default"
     } = android;
     config.modResults.resources.style = config.modResults.resources.style?.map(style => {
\ No newline at end of file

Library version

1.1.0

Environment info

npx react-native info
info Fetching system and libraries information...
System:
  OS: macOS 15.1
  CPU: (11) arm64 Apple M3 Pro
  Memory: 133.70 MB / 18.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.13.1
    path: ~/.nvm/versions/node/v20.13.1/bin/node
  Yarn:
    version: 1.22.22
    path: /opt/homebrew/bin/yarn
  npm:
    version: 10.8.3
    path: ~/.nvm/versions/node/v20.13.1/bin/npm
  Watchman:
    version: 2024.10.21.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.15.2
    path: /Users/fredrikburmester/.rvm/rubies/ruby-3.2.2/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.0
      - iOS 18.0
      - macOS 15.0
      - tvOS 18.0
      - visionOS 2.0
      - watchOS 11.0
  Android SDK: Not Found
IDEs:
  Android Studio: 2024.1 AI-241.18034.62.2411.12169540
  Xcode:
    version: 16.0/16A242d
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.13
    path: /opt/homebrew/opt/openjdk@17/libexec/openjdk.jdk/Contents/Home/bin/javac
  Ruby:
    version: 3.2.2
    path: /Users/fredrikburmester/.rvm/rubies/ruby-3.2.2/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.74.5
    wanted: 0.74.5
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

info React Native v0.76.1 is now available (your project is running on v0.74.5).
info Changelog: https://github.com/facebook/react-native/releases/tag/v0.76.1
info Diff: https://react-native-community.github.io/upgrade-helper/?from=0.74.5
info For more info, check out "https://reactnative.dev/docs/upgrading?os=macos".

Steps to reproduce

  1. Use the withAndroidEdgeToEdgeTheme plugin in an Expo project
  2. Run expo prebuild

Reproducible sample code

Sorry i don't have this.
zoontek commented 3 weeks ago

Thanks, fixed in 1.1.1. I'm gonna open a PR on the Expo repo, the ConfigPlugin type is incorrect.

EDIT: Started here, will see with the expo team if this is the best way to do this as the PR could quickly become huge.