import React, {useEffect, useState} from 'react';
import {StyleSheet, Text, View, Button, Alert, Platform} from 'react-native';
import {useNavigation} from '@react-navigation/native';
import {TextInput} from 'react-native-gesture-handler';
import {useTheme} from '../themes';
import {useTranslation} from 'react-i18next';
import DeviceInfo from 'react-native-device-info';
import {Service} from '@src/services';
import {API_URL_LOGIN} from '@src/services/url-constant';
import {
  getItemFromStorage,
  setItemInStorage,
  removeStoreItem,
} from '@src/utils/Storage';
import {request, check, PERMISSIONS, RESULTS} from 'react-native-permissions';
import NetInfo from '@react-native-community/netinfo';
import checkResponse from '@src/services/CheckResponse';
import InvalidVersionAlert from '@src/components/atoms/InvalidVersionAlert';

const Login = (props: any) => {
  const {theme, dark, toggle} = useTheme();
  const navigation = useNavigation();
  const {t} = useTranslation();
  const [emailText, setEmailText] = React.useState('');
  const [passwordText, setPasswordText] = React.useState('');
  const [showInvalidVersionAlert, setShowInvalidVersionAlert] = useState(false);

  if (Platform.OS === 'ios') {
    request(PERMISSIONS.IOS.LOCATION_WHEN_IN_USE).then(result => {
      // …
      console.log('Result', result);
    });
  } else {
    request(PERMISSIONS.ANDROID.ACCESS_FINE_LOCATION).then(result => {
      // …
      console.log('Result', result);
    });
  }

  const toggleSwitch = () => {
    toggle();
  };

  const validateEmail = () => {
    let reg = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w\w+)+$/;
    if (reg.test(emailText) === false) {
      return false;
    } else {
      return true;
    }
  };

  const checkConnection = () => {
    NetInfo.fetch().then(state => {
      console.log('Connection type', state.type);
      console.log('Is connected?', state.isConnected);

      if (state.isConnected) {
        //Alert.alert('You are online!');
        onLogin();
      } else {
        Alert.alert('You are offline!');
      }
    });
  };

  const onLogin = () => {
    if (emailText === '' || passwordText === '') {
      //Alert.alert('Invalid email or password.');
    } else {
      callLoginAPI();
    }
  };

  let DeviceType = '';
  if (DeviceInfo.getSystemName() === 'iOS') {
    DeviceType = 'iPhone';
  } else {
    DeviceType = 'Android';
  }
  const sendData = {
    ApplicationVersion: '12.1.3',
    BatteryLevelPercent: '-100',
    BatteryState: 'Unknown',
    CarrierName: 'Unknown',
    ConnectionType: 'WiFi',
    DeviceGuid: '1A5FAF66-EAA7-488A-A518-99321BB2FB59',
    DeviceModel: 'x86_64',
    DeviceType: 'iPhone',
    DiskSpaceAvailableInMB: '85185.89',
    DiskSpaceSizeInMB: '233752.4',
    //Email: 'kpatel3@wiser.com',
    Email: emailText,
    IsUploadNeeded: 0,
    MachineName: 'iPhone 14',
    OsVersion: '16.0',
    Password: passwordText,
    //Password: 'rw3kpatel',

    // ApplicationVersion: '12.1.5',
    // BatteryLevelPercent: DeviceInfo.getBatteryLevel(),
    // BatteryState: DeviceInfo.isBatteryCharging(),
    // CarrierName: DeviceInfo.getCarrier(),
    // ConnectionType: 'WiFi',
    // DeviceGuid: DeviceInfo.getUniqueId(),
    // DeviceModel: DeviceInfo.supportedAbis(),
    // DeviceType: DeviceType,
    // DiskSpaceAvailableInMB: DeviceInfo.getFreeDiskStorage(),
    // DiskSpaceSizeInMB: DeviceInfo.getTotalDiskCapacity(),
    // Email: emailText,
    // IsUploadNeeded: 0,
    // MachineName: DeviceInfo.getModel(),
    // OsVersion: DeviceInfo.getSystemVersion(),
    // Password: passwordText,
  };

  const callLoginAPI = async () => {
    try {
      const res = await Service.send({
        method: 'POST',
        url: API_URL_LOGIN,
        obj: JSON.stringify(sendData),
        isRawData: true,
        contentType: 'application/json',
      });
      checkResponse({
        res: res,
        delegate: navigation,
      });

      if (res.data.LoginResultCode === 'Success') {
        deleteData();
        saveData(res);
        navigation.navigate('appscreens' as never);
      }
      // else {
      //   Alert.alert(res.data.LoginErrorMessage);
      // }
      getSaveddata();
    } catch (err) {
      console.log('catch', err);
    }
  };

  const deleteData = async () => {
    await removeStoreItem('RW3Email');
    await removeStoreItem('RW3Password');
    await removeStoreItem('RW3PeopleID');
    await removeStoreItem('RW3SyncGUID');
  };

  const saveData = async (res: any) => {
    let peopleId = res.data.PeopleId;
    let syncGuid = res.data.SyncGuid;
    await setItemInStorage('RW3Email', emailText);
    await setItemInStorage('RW3Password', passwordText);
    await setItemInStorage('RW3PeopleID', peopleId.toString());
    await setItemInStorage('RW3SyncGUID', syncGuid.toString());
  };

  const getSaveddata = async () => {
    const emailFromStorage = await getItemFromStorage('RW3Email');
    console.log('Email val ----->>', emailFromStorage);
  };

  return (
    <View
      style={{
        flex: 1,
        backgroundColor: theme.palette.backgroundcolor,
        padding: 15,
      }}>
      {showInvalidVersionAlert && <InvalidVersionAlert />}
      <Text style={[styles.title, {color: theme.palette.textcolor}]}>
        {`${t('PRICECHECK')}`}
      </Text>
      <View style={[styles.textfieldView, {marginTop: 30}]}>
        <TextInput
          style={styles.commontextField}
          autoCapitalize={'none'}
          placeholder={`${t('EMAIL')}`}
          placeholderTextColor={theme.palette.textplaceholdercolor}
          keyboardType={'email-address'}
          returnKeyType={'next'}
          onChangeText={newText => setEmailText(newText)}
        />
      </View>
      <View style={[styles.textfieldView, , {marginTop: 15, marginBottom: 15}]}>
        <TextInput
          style={styles.commontextField}
          autoCapitalize={'none'}
          placeholder={`${t('PASSWORD')}`}
          placeholderTextColor={theme.palette.textplaceholdercolor}
          keyboardType={'email-address'}
          secureTextEntry={true}
          returnKeyType={'next'}
          onChangeText={newText => setPasswordText(newText)}
        />
      </View>
      <Button
        onPress={checkConnection}
        title={`${t('LOGIN')}`}
        color={theme.palette.appthemecolor}
      />
      {/* <Switch onChange={toggleSwitch} value={dark} /> */}
      <Text style={styles.bottomTitle}>{`${t(
        'SPLASHSCREEN_BOTTOM_TITLE',
      )}`}</Text>
    </View>
  );
};

const styles = StyleSheet.create({
  title: {
    alignSelf: 'center',
    marginTop: 150,
    fontWeight: 'bold',
    fontSize: 40,
  },
  textfieldView: {
    borderColor: 'lightgray',
    borderWidth: 0.5,
    borderRadius: 5.0,
    padding: 5,
  },
  commontextField: {
    fontSize: 17,
    padding: 5,
  },
  loginButton: {
    padding: 10,
    borderColor: '#000000',
    borderRadius: 10,
    borderWidth: 1,
    overflow: 'hidden',
    color: 'black',
  },
  bottomTitle: {
    alignSelf: 'center',
    position: 'absolute',
    bottom: 0,
    marginBottom: 20,
  },
});
export default Login;