countries api solution w/ typescript, axios, modularized scss

If you are using a library like React, or VueJs, you can make use of context api or Redux, or Redux Toolkit (in react for example) or Vuex (in case of vue) to create a global state for Dark/light theme. In this way there is no longer need to pass props down the dom tree multiple levels to implement a theme switcher. Instead, you save all state variables related to themes in one central point, and any component that have multiple themes can directly get access to the global state using context (again in case of react).