// withHooks
import esp from 'esoftplay/esp';

import { LibCurl } from 'esoftplay/cache/lib/curl/import';
import { LibDialog } from 'esoftplay/cache/lib/dialog/import';
import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
import { LibToastProperty } from 'esoftplay/cache/lib/toast/import';
import { MarketHeader } from 'esoftplay/cache/market/header/import';
import { MarketProduct_input, MarketProduct_inputProperty } from 'esoftplay/cache/market/product_input/import';
import { MarketStyle } from 'esoftplay/cache/market/style/import';
import { UseForm } from 'esoftplay/cache/use/form/import';
import { UseTest } from 'esoftplay/cache/use/test/import';
import { UserClass } from 'esoftplay/cache/user/class/import';

import { LibProgress } from 'esoftplay/cache/lib/progress/import';
import { MarketProduct_inputForm } from 'esoftplay/modules/market/product_input';
import React from 'react';
import { TouchableOpacity, View } from 'react-native';

export interface MarketProduct_addProps {

}
export default function m(props: MarketProduct_addProps): any {
  const user = UserClass.state().get()
  const [form, setForm, reForm] = UseForm<MarketProduct_inputForm>("market_product_input")

  const { execAndPass, execState, fail, pass, setInput, setTasks, waitRef } = UseTest({ isRunTest: false }, 'code')

  setTasks([
    [execAndPass, [setForm('title'), ['Judul']]],
    [execAndPass, [setForm('description'), ['Deskripsi']]],
    [execAndPass, [setForm('price'), ['20000']]],
    [execAndPass, [setForm('min_order'), ['1']]],
    [execAndPass, [setForm('stocks'), ['1000']]],
    [execAndPass, [setForm('stocks'), ['1000']]],
    [execAndPass, [setForm('weight'), ['1000']]],
    [execAndPass, [setForm('length'), ['50']]],
    [execAndPass, [setForm('width'), ['100']]],
    [execAndPass, [setForm('height'), ['50']]],
  ])

  function doAdd() {
    reForm(form => {
      if (form) {
        if (MarketProduct_inputProperty.validateInput(form)) {
          LibProgress.show(esp.lang("market/product_add", "wait_add"))
          new LibCurl('shop/product_add', MarketProduct_inputProperty.buildPost(form),
            (res, msg) => {
              LibProgress.hide()
              LibToastProperty.show(res)
              LibNavigation.back()
              if (form.publish == 1) {
                LibNavigation.navigate('market/merchant_detail', { url: "shop/merchant_detail/" + user?.merchant_id, tabIndex: 2 })
              } else {
                // yang dipakai yang ini nantinya kalau sudah ok
                LibNavigation.navigate('market/merchant_detail_product_list', { title: esp.lang("market/product_add", "my_product"), tab: 2, url: 'shop/merchant_product_draft' })
              }
            },
            (msg) => {
              LibProgress.hide()
              LibToastProperty.show(msg?.message)
            }, 1
          )
        }
      }
    })
  }

  return (
    <View style={{ flex: 1, backgroundColor: "white" }} >
      <MarketHeader
        leftIcon={{
          name: "arrow-left", onPress: () => {
            LibDialog.warningConfirm(esp.lang("market/product_add", "exit_title"), esp.lang("market/product_add", "exit_msg"), esp.lang("market/product_add", "exit_confirm"), () => {
              LibNavigation.back()
            }, esp.lang("market/product_add", "exit_cancel"), () => { })
          }
        }}
        title={esp.lang("market/product_add", "header_title")}
        subtitle={esp.lang("market/product_add", "header_subtitle")} rightView={() => (
          <TouchableOpacity
            onPress={doAdd}
            style={{ paddingRight: 17 }} >
            <LibTextstyle text={esp.lang("market/product_add", "btn_save")} textStyle="footnote" style={{ color: MarketStyle.colorPrimaryMarket, fontWeight: "bold" }} />
          </TouchableOpacity>)} />
      <MarketProduct_input />
    </View>
  )
}