import React, { createContext, useContext, useState, useEffect } from "react";
import { useWindowDimensions } from "react-native";
import * as ScreenOrientation from "expo-screen-orientation";
const initialState = { isLandscape: false, setIsLandscape: () => {} };

const DeviceOrientationChange = createContext(initialState);

export const useDeviceOrientationChange = () => {
  return useContext(DeviceOrientationChange);
};

export const DeviceOrientationChangeProvider = ({ children }) => {
  const [isLandscape, setIsLandscape] = useState(false);
  const { height, width } = useWindowDimensions();
  const data = async () => {
    await ScreenOrientation.lockAsync(
      ScreenOrientation.OrientationLock.PORTRAIT_UP
    );
  };
  useEffect(() => {
    //data();
    //ScreenOrientation.unlockAsync();
  }, []);

  useEffect(() => {
    if (height / width > 1.5) {
      setIsLandscape(false);
    }
    if (height / width < 1.5) {
      setIsLandscape(true);
    }
  }, [height, width]);
  return (
    <DeviceOrientationChange.Provider value={{ isLandscape, setIsLandscape }}>
      {children}
    </DeviceOrientationChange.Provider>
  );
};