EStyleSheet.build is not updating/re-rendering all EStyleSheets/components every time I call it

plaporte commented 3 years ago

Steps to Reproduce

I am making an API call when I log into my app and storing that value (a color) in a Redux Reducer. I then call this reducer to get the value of the color:

const defaultClubMainColor = useSelector(
    (state) => state.AppSettings.DefaultClubMainColor,
  );

Then I set the value with EStyleSheet.build:

EStyleSheet.build({
    $defaultClubMainColor: defaultClubMainColor,
  });

I then have my styles set in an external styles.js file like so:

export const styles = EStyleSheet.create({
  accountManagerButtonsText: {
    color: '$defaultClubMainColor',
    fontSize: Global.heading4,
    fontWeight: '600',
  },
});

Expected Behavior

All components or stylesheets that use global styles re-render and update

Actual Behavior

Colors and styling throughout app stays the same until I manually refresh the app.

Why does EStyleSheet.build not re-render the app with the correct styles?

stale[bot] commented 3 years ago

Is this still relevant? If so, what is blocking it? Is there anything you can do to help move it forward?

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.

haveamission commented 3 years ago

@plaporte Did you find a solution to this?

vitalets commented 3 years ago

@plaporte Re-building styles does not automatically update all components of the app, because it's not trivial. Please have a look on https://github.com/vitalets/react-native-extended-stylesheet/issues/47#issuecomment-314760557 for more details.

vitalets / react-native-extended-stylesheet