import { useEffect, useState } from 'react';

import { useColorScheme as useRNColorScheme } from 'react-native';

/**

 * To support static rendering, this value needs to be re-calculated on the client side for web

 */

export function useColorScheme() {

  const [hasHydrated, setHasHydrated] = useState(false);

  useEffect(() => {

    setHasHydrated(true);

  }, []);

  const colorScheme = useRNColorScheme();

  if (hasHydrated) {

    return colorScheme;

  }

  return 'light';

}