useAppColorScheme incorrect behaviour when used more than once

[crjc]

Just noticed that even since #266 and #271, the useAppColorScheme hook appears to misbehave.

If you're using the hook in two different parts of your app, and use toggleColorScheme in one part, it doesn't update globally.

I think the solution might be to remove useState from the hook?

[jaredh159]

thanks for the report. just to double-check, are you sure it's not a memoization issue?

[crjc]

See this quick repro example I just threw together.

The hook inside the <AssetExample/> component does not change when you change the colour scheme using the pressable component at the bottom of App.js

[jaredh159]

Really appreciate the repro, thanks. I turned that into a unit test and have what seems like a straightforward fix in #283. I need useState to make sure i trigger re-renders when someone changes the color scheme, but I think my mistake was tracking the colorscheme in state instead of using the canonical tw.getColorScheme and just using some dummy state to force re-renders.

[jaredh159]

released in v4.0.2. (i checked that it fixed your repro snack as well, so i think you should be good)

[Serchinastico]

I just wanted to add that if you set your color scheme from a callback by calling setColorScheme (from the useAppColorScheme hook), do not forget adding setColorScheme to your list of dependencies for it to work correctly 😅.

I'm aware this is not a bug in the library but wanted to leave the message for others in case they faced the same issue.