DEV Community

Discussion on: 🌙 How I set Dark Mode for Gatsby website

Collapse
 
lucascoorek profile image
Ɓukasz Kurek

Hi Amal,
I don't understand how this window.__onThemeChange function works.

First this function is declared: window.__onThemeChange = function() {};

And them it is called from inside of setTheme function:
function setTheme(newTheme) {
window.theme = newTheme;
window.
onThemeChange(newTheme);
}
Then you use it in Component in useEffect by adding into body of this onThemeChange function change to Components state:

useEffect(() => {
toggleTheme(websiteTheme);
window.onThemeChange = () => {
toggleTheme(window.
theme);
};
}, []);

How is it that you call window.__onThemeChange(newTheme) from within setTheme() when it is only declared as a empty function at the top of this file?
Can you explain how it works?

Thank you in advance.