TypeError with 'changeNavigationBarColor' in React Native & Hermes

[Senzo13]

Hello,

I've encountered a TypeError when trying to use react-native-navigation-bar-color in my React Native project. I'm not using Expo and my project is set up with the Hermes engine. Here's the error message I receive when I try to execute the code: ERROR TypeError: Cannot read property 'changeNavigationBarColor' of null, js engine: hermes

Here's how I'm attempting to use the package in my component:

import React, { useEffect } from 'react';
import changeNavigationBarColor from 'react-native-navigation-bar-color';
import { useSettings } from '@context/settings.context'; // Assuming this is where theme.colors.primary is defined

const MyComponent = () => {
  const { theme } = useSettings();

  const changeColor = () => {
    changeNavigationBarColor(theme.colors.primary, true, true);
  };

  useEffect(() => {
      changeColor();
  }, []);

  return (
    // Component JSX
  );
};

export default MyComponent;

I've followed the installation instructions for react-native-navigation-bar-color and made sure everything is up to date. However, I'm still facing this issue. Could this be related to the Hermes engine, or is there something else I'm missing? Any guidance or assistance in resolving this error would be greatly appreciated.

I'm on React Native version "react-native": "^0.73.6".

Thank you in advance for your help.

[adriendomoison]

Same issue here ERROR TypeError: Cannot read property 'hideNavigationBar' of null

[gabrielpasini]

Same error here! ERROR TypeError: Cannot read property 'changeNavigationBarColor' of null

I tried to call changeNavigationBarColor as a Promise, like the tutorial, but this is not a promise. This error occurs in both cases.

I am on react-native@0.74.1 with EXPO