React Native - useTheme hook

useTheme.ts

import { ITheme } from "@Themes/interfaces";
import { DarkTheme } from "@Themes/theme.dark";
import { LightTheme } from "@Themes/theme.light";
import React from "react";
import { useColorScheme } from "react-native-appearance";

export const useTheme = (): [ITheme] => {
  const scheme = useColorScheme();

  const [currentTheme, setCurrentTheme] = React.useState<ITheme>(DarkTheme);
  React.useEffect(() => {
    setCurrentTheme(scheme === "dark" ? DarkTheme : LightTheme);
  }, [scheme]);

  return [currentTheme];
};

useThemeWithOverride.tsx

/**
 * This version allows you to override the theme by passing a theme as a parameter to the hook
 */

import { ITheme } from "@Themes/interfaces";
import { DarkTheme } from "@Themes/theme.dark";
import { LightTheme } from "@Themes/theme.light";
import React from "react";
import { useColorScheme } from "react-native-appearance";

export const useTheme = (forceTheme?: ITheme): [ITheme] => {
  const scheme = useColorScheme();

  const [currentTheme, setCurrentTheme] = React.useState<ITheme>(forceTheme ?? DarkTheme);
  React.useEffect(() => {
    if (forceTheme){
      setCurrentTheme(forceTheme);
    } else {
      setCurrentTheme(scheme === "dark" ? DarkTheme : LightTheme);
    }
  }, [scheme, forceTheme]);

  return [currentTheme];
};