//@ts-nocheck
import { useNavigation } from '@react-navigation/native';
import { observer } from 'mobx-react-lite';
import React, { useState } from 'react';
import { Alert, SafeAreaView, TouchableOpacity, View } from 'react-native';
import WebView from 'react-native-webview';
import { IconBack } from '../../assets/icons';
import { MText } from '../../components/MText';
import { color } from '../../theme';
import { commonStyles } from '../CommonStyles';
import MHeader from '../../components/MHeader';

export const CIMBSign = observer(function CIMBSign(props: any) {
  const navigation = useNavigation();
  const [stateWebView, setStateWebView] = useState(null);

  return (
    <View style={{ flex: 1, backgroundColor: '#FFFFFF' }}>
      <MHeader
        title="Ký hợp đồng"
        onBack={() => {
          if (
            stateWebView &&
            stateWebView?.url.includes('contract-status-approval')
          ) {
            navigation.goBack();
          } else {
            Alert.alert(
              'Cảnh báo',
              'Bạn có chắc chắn muốn rời khỏi màn hình ký hợp đồng?',
              [
                {
                  text: 'Đồng ý',
                  onPress: () => navigation.goBack(),
                },
                {
                  text: 'Huỷ',
                },
              ]
            );
          }
        }}
        style={{
          width: 40,
          height: 40,
          position: 'absolute',
          left: 8,
          alignItems: 'center',
          justifyContent: 'center',
        }}
      />
      <SafeAreaView style={{ flex: 1 }}>
        <View style={{ flex: 1, marginBottom: 16 }}>
          <WebView
            source={{
              uri: props?.route.params?.url,
            }}
            style={{ flex: 1 }}
            onNavigationStateChange={(value) => setStateWebView(value)}
          />
        </View>
      </SafeAreaView>
    </View>
  );
});
