Add system to ThemeSwitch

[pavelzw]

The current implementation doesn't allow changing back to system once you changed the theme once since it's stored in localstorage by next-themes. This PR adds a RadioGroup to choose from all three states similar to https://tailwindcss.com/.

For an example of how this looks like in action see https://pavel.pink/ / https://github.com/pavelzw/blog

Bildschirmaufnahme.2023-08-26.um.14.46.21.mov

[vercel]

Someone is attempting to deploy a commit to a Personal Account owned by @timlrx on Vercel.

@timlrx first needs to authorize it.

[timlrx]

Hi @pavelzw, thanks for the contribution. I intentionally did it this way - by default it follows your system theme but once a user selects a preference, I don't see a situation where the user would revert back to system instead of just switching to the preferred theme.

Happy to link your blog instead in the examples list for a reference to the implementation for those that might prefer it this way.

[Mood93]

Hi @timlrx, what about if they clicked dark/light out of curiosity, then decided they won't it to go with their system. For example, on my Mac I have it set to switch to dark mode at sunset, then light mode at sunrise.

Am I explaining the scenario well? In this situation, I would be annoyed with the site if I couldn't switch to 'System'.

[timlrx]

@Mood93 Did not realised that's how auto works on the Mac. I am convinced by your argument and it appears the upvotes tilt in favour of supporting it as well 😄

@pavelzw do you mind handling the merge conflict? You could use resolvedTheme from useTheme as per the new code to deduce the settings based on prefers-color-scheme instead of adding an additional hook. Since it has been a while since the PR was created, let me know if you are are busy and I can also do it. Many thanks!

[pavelzw]

do you mind handling the merge conflict

yeah, I can take a look at it later 👍🏻

[pavelzw]

@timlrx ready for review

[pavelzw]

@timlrx what's the status of this PR? From my side it can be merged.

[timlrx]

Apologies for the delay! I have merged it in. Thanks for the contribution!