// withHooks
import { EventHeader } from 'esoftplay/cache/event/header/import';
import { LibCurl } from 'esoftplay/cache/lib/curl/import';
import { LibInput } from 'esoftplay/cache/lib/input/import';
import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
import { LibProgress } from 'esoftplay/cache/lib/progress/import';
import { LibStyle } from 'esoftplay/cache/lib/style/import';

import { EventLabel_input } from 'esoftplay/cache/event/label_input/import';
import { LibDialog } from 'esoftplay/cache/lib/dialog/import';
import esp from 'esoftplay/esp';
import useSafeState from 'esoftplay/state';
import React, { useEffect } from 'react';
import { ScrollView, Text, TouchableOpacity, View } from 'react-native';


export interface EventVoucherArgs {
  defaultCode?: string
  event_id: number,
  price_id: string,
  from?: string,
  ondate?: string
  qty?: string
  bundling_id?: string //untuk registrasi pos, kiriman dari pos/pricing_payment
}
export interface EventVoucherProps {

}
export default function m(props: EventVoucherProps): any {
  let { event_id, price_id, from, defaultCode, bundling_id, ondate, qty }: any = LibNavigation.getArgsAll(props)
  let [result, setResult] = useSafeState<any>()
  let [showText, setShowText] = useSafeState<boolean>(false)
  let voucherCode = React.useRef<LibInput>(null)

  useEffect(() => {
    return () => LibNavigation.cancelBackResult(LibNavigation.getResultKey(props))
  }, [])

  function checkVoucher() {
    let post = {
      voucher_code: voucherCode.current!.getText(),
      event_id: event_id,
      price_id: price_id,
      ondate: ondate,
      qty: qty
    }


    let url = "event_booking_voucher_check"

    LibProgress.show(esp.lang("event/voucher", "check_wait"))
    new LibCurl(url, post, (res, msg) => {
      setShowText(true)
      setResult(res)
      LibProgress.hide()
    }, (error) => {
      LibDialog.warning("Oops", error?.message)
      setShowText(false)
      LibProgress.hide()

    }, 1)
  }

  function checkVoucherPos() {
    let post = {
      code: voucherCode.current!.getText(),
      bundling_id: bundling_id || ""
    }

    let url = "pos_discount_check"

    LibProgress.show(esp.lang("event/voucher", "check_wait"))
    new LibCurl(url, post, (res, msg) => {
      setShowText(true)
      setResult(res)
      LibProgress.hide()
    }, (error) => {
      LibDialog.warning("Oops", error?.message)
      setShowText(false)
      LibProgress.hide()

    }, 1)
  }


  return (
    <View style={{ flex: 1, backgroundColor: '#fff' }}>
      <EventHeader title={esp.lang("event/voucher", "header")} />
      <ScrollView>
        <View style={{ margin: 15, marginTop: 0 }}>
          <EventLabel_input label={esp.lang("event/voucher", "voucher_or_referral_code")} mandatory />
        </View>
        <View testID='input_voucher'>
          <LibInput
            ref={voucherCode}
            label=""
            editable={showText ? false : true}
            defaultValue={defaultCode}
            autoCapitalize={"characters"}
            returnKeyType="go"
            onSubmitEditing={() => {
              if (from == 'pos/pricing_payment') /* untuk register pos, bawa props bundling_id: bundling yg dipilih saat register */ {
                checkVoucherPos()
              } else {
                checkVoucher()
              }
            }}
            style={{ marginTop: -20, backgroundColor: LibStyle.colorGrey, letterSpacing: 0, fontSize: 30, textAlign: 'center' }} />
        </View>
        {
          showText &&
          <Text allowFontScaling={false} style={{ marginLeft: 15, fontFamily: "Arial", fontSize: 10, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: LibStyle.colorPrimary }} >{esp.lang("bigbang/payment", "text_alert")}</Text>
        }
        <TouchableOpacity testID='use_voucher' onPress={() => {
          if (!showText) {
            if (from == 'pos/pricing_payment') /* untuk register pos, bawa props bundling_id: bundling yg dipilih saat register */ {
              checkVoucherPos()
            } else {
              checkVoucher()
            }
          }
        }}>
          <View style={{ alignSelf: 'flex-end', marginRight: 15, marginBottom: 10, marginLeft: 10, width: 68, height: 35, borderRadius: 3, backgroundColor: showText ? '#8e8e8e' : LibStyle.colorGreen, alignContent: 'center', alignItems: 'center', justifyContent: 'center' }}>
            <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: '#fff' }}>{esp.lang("bigbang/payment", "button_use")}</Text>
          </View>
        </TouchableOpacity>

      </ScrollView>
      {
        result &&
        <TouchableOpacity testID='claim_now' onPress={() => {
          if (result) {
            let data = {
              ...result,
              code: voucherCode?.current?.getText()
            }
            LibNavigation.sendBackResult(data)
          }
        }}>
          <View style={{ marginHorizontal: 15, marginVertical: 10, height: 35, borderRadius: 17.5, backgroundColor: result ? "#00b894" : LibStyle.colorGrey, alignItems: 'center', justifyContent: 'center', flexDirection: 'row' }} >
            <Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 13, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "center", color: '#fff' }} >{esp.lang("bigbang/payment", "claim")}</Text>
          </View>
        </TouchableOpacity>
      }

    </View>
  )
}