// withHooks
// noPage

import { LibCurl } from 'esoftplay/cache/lib/curl/import';
import { LibDialog } from 'esoftplay/cache/lib/dialog/import';
import { LibIcon } from 'esoftplay/cache/lib/icon/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 { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
import { LibToastProperty } from 'esoftplay/cache/lib/toast/import';
import { LibUtils } from 'esoftplay/cache/lib/utils/import';
import { MarketButton } from 'esoftplay/cache/market/button/import';
import { MarketInput_square } from 'esoftplay/cache/market/input_square/import';
import { MarketOrder_detailProperty } from 'esoftplay/cache/market/order_detail/import';
import { MarketSection_menu } from 'esoftplay/cache/market/section_menu/import';
import { MarketSlidingupProperty } from 'esoftplay/cache/market/slidingup/import';
import { MarketStyle } from 'esoftplay/cache/market/style/import';
import esp from 'esoftplay/esp';

import moment from 'esoftplay/moment';
import useSafeState from 'esoftplay/state';
import { useTimeout } from 'esoftplay/timeout';
import React, { useEffect, useRef } from 'react';
import { ScrollView, Text, TouchableOpacity, View } from 'react-native';

moment().locale('id')
export interface MarketOrder_detail_buttonsArgs {

}
export interface MarketOrder_detail_buttonsProps {
  data: any,
  price: number,
  config: any,
  shipping_resi?: string,
  order_url: string
}

export function approveOrder(order_id: number): void {
  LibDialog.warningConfirm(esp.lang("market/order_detail_buttons", "approve_title"), esp.lang("market/order_detail_buttons", "approve_msg"), esp.lang("market/order_detail_buttons", "approve_confirm"), () => {
    LibProgress.show()
    new LibCurl("shop/order_merchant_detail_approve/" + order_id, null,
      (res) => {
        LibProgress.hide()
        LibNavigation.back(2)
        LibNavigation.navigate('market/merchant_order', { status: 4 })
      }, (error) => {
        LibToastProperty.show(error?.message)
        LibProgress.hide()
      }, 1
    )
  }, esp.lang("market/order_detail_buttons", "approve_cancel"), () => { })
}

export function reSettingShipping(order_id: string, merchant: any): void {
  LibDialog.warningConfirm(esp.lang("market/order_detail_buttons", "reset_title"), esp.lang("market/order_detail_buttons", "reset_msg"), esp.lang("market/order_detail_buttons", "reset_confirm"), () => {
    //curl untuk ubah status dari dikirim(5) ke dikemas(4)
    LibProgress.show(esp.lang("market/order_detail_buttons", "reset_wait"))
    new LibCurl('shop/order_merchant_detail_sending_retry/' + order_id, null,
      (res, msg) => {
        LibProgress.hide()
        LibNavigation.navigate('market/merchant_resending', { from: 'market/merchant_resending', order_id: order_id, shipping_code: merchant.shipping_code, shipping_label: merchant.shipping_label })
      }, (msg) => {
        LibProgress.hide()
        LibDialog.warning(esp.lang("market/order_detail_buttons", "reset_failed"), msg?.message)
      }, 1
    )
  }, esp.lang("market/order_detail_buttons", "reset_cancel"), () => { })
}

export function finishOrder(merchant: any, data: any) {
  const total = Number(merchant?.shipping) + Number(merchant?.total) + Number(data?.fee) + Number(merchant?.shipping_fee)
  LibDialog.warningConfirm(esp.lang("market/order_detail_buttons", "finish_title"), esp.lang("market/order_detail_buttons", "finish_msg", LibUtils.money(total)), esp.lang("market/order_detail_buttons", "finish_confirm"), () => {
    // shop/order_detail_received GET: { "id":"id order"} POST:{"merchant_id":"id merchant tiap order"}
    LibProgress.show(esp.lang("market/order_detail_buttons", "finish_wait"))
    new LibCurl("shop/order_detail_received/" + data.id, { merchant_id: merchant.merchant_id },
      (res) => {
        LibProgress.hide()
        LibNavigation.back(2)
        LibNavigation.navigate('market/order', { status: 7 })
      }, (err) => {
        LibProgress.hide()
        LibToastProperty.show(err?.message)
      }, 1
    )
  }, esp.lang("market/order_detail_buttons", "finish_cancel"), () => { })
}

export default function m(props: MarketOrder_detail_buttonsProps): any {
  const inputReason = useRef<LibInput>(null)
  const cancelUrl = props?.data.is_merchant == 1 ? 'shop/order_merchant_detail_cancel/' : 'shop/order_detail_cancel/'
  const merchant: any = Object.values(props?.data.merchant)[0]
  //@ts-ignore
  const merchId = Object.values(props?.data.merchant)[0].merchant_id
  // const total = merchant.shipping_cashless == 1 ? LibUtils.money(Number(props?.data?.total) + Number(props?.data?.fee)) : LibUtils.money(Number(props?.data?.shipping) + Number(props?.data?.total) + Number(props?.data?.fee))
  const total = Number(merchant?.shipping) + Number(merchant?.total) + Number(props?.data?.fee) + Number(merchant?.shipping_fee)
  //@ts-ignore
  const product_url = Object.values(props?.data.merchant)[0].product_list[0].url
  const currentTime = moment().localeFormat('YYYY-MM-DD H:m:s')
  const accTime = moment(merchant.sending_at).add(Number(props?.config?.shop?.time_order_approve || 0), 'hours').localeFormat('YYYY-MM-DD H:m:s')

  const [selectReason, setSelectReason, getSelectReason] = useSafeState<any>()
  const [other, setOther] = useSafeState(false)
  const timeout = useTimeout()

  const reason = [
    {
      id: 1,
      text: esp.lang("market/order_detail_buttons", "change_address"),
    },
    {
      id: 2,
      text: esp.lang("market/order_detail_buttons", "not_chat"),
    },
    {
      id: 3,
      text: esp.lang("market/order_detail_buttons", "change_detail"),
    },
    {
      id: 4,
      text: esp.lang("market/order_detail_buttons", "other")
    },
  ]

  function cancelOrder(merchant_id?: string) {
    let res = ''
    if (getSelectReason()) {
      if (getSelectReason().id == 4) {
        if (inputReason.current?.getText() != '') {
          res = inputReason.current?.getText() || ''
        } else {
          res = getSelectReason()?.text
        }
      } else {
        res = getSelectReason()?.text
      }
    } else {
      res = inputReason?.current?.getText() || ''
    }

    let post = {
      merchant_id: merchant_id || '',
      reason: res
    }

    MarketSlidingupProperty.hide()
    LibProgress.show()
    new LibCurl(cancelUrl + props?.data.id, post,
      (res) => {
        LibProgress.hide()
        LibToastProperty.show(res)
        LibNavigation.backToRoot()
        MarketSlidingupProperty.hide()
        if (props?.data.is_merchant == 1) {
          LibNavigation.navigate("market/merchant_order", { status: '2,8' })
        } else {
          LibNavigation.navigate("market/order", { status: '2,8' })
        }
      }, (error) => {
        LibProgress.hide()
        LibToastProperty.show(error?.message)
        MarketSlidingupProperty.hide()
      }, 1
    )
  }


  function confirmDelivered() {
    MarketSlidingupProperty.add(
      <View style={{ backgroundColor: "white", paddingVertical: 10 }} >
        <MarketButton
          text={esp.lang("market/order_detail_buttons", "btn_done")}
          textStyle={{ color: '#f1f1f1' }}
          buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
          onPress={() => {
            MarketSlidingupProperty.hide()
            //baca dari config api home. waktu aprove berdasarkan jam
            if (Number(props?.config?.shop?.time_order_approve || 0) > 0) {
              if (currentTime >= accTime) {
                finishOrder(merchant, props?.data)
              } else {
                LibToastProperty.show(esp.lang("market/order_detail_buttons", "cant_done", props?.config?.shop?.time_order_approve))
              }
            } else {
              finishOrder(merchant, props?.data)
            }
          }} />
        <MarketButton
          text={esp.lang("market/order_detail_buttons", "btn_complaint")}
          colorBackground={"white"}
          colorBorder={MarketStyle.colorPrimaryMarket}
          color={MarketStyle.colorPrimaryMarket}
          buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
          onPress={() => {
            MarketSlidingupProperty.hide()
            LibDialog.warningConfirm(
              esp.lang("market/order_detail_buttons", "complaint_title"), esp.lang("market/order_detail_buttons", "complaint_msg")
              , esp.lang("market/order_detail_buttons", "complaint_confirm"), () => {
                LibNavigation.navigate('market/complaint_step1', { data: merchant, order_id: props?.data.id })
              }
              , esp.lang("market/order_detail_buttons", "complaint_cancel"), () => { }
            )
          }} />
      </View>
    )
  }

  useEffect(() => {

    MarketSlidingupProperty.add(
      <View style={{ backgroundColor: "white", paddingVertical: 15 }} >
        <ScrollView>
          <LibTextstyle textStyle="headline" text={esp.lang("market/order_detail_buttons", "select_reason")} style={{ textAlign: 'center', paddingBottom: 10 }} />
          <MarketSection_menu size="line" />
          {
            reason.map((item: any, i: number) => (
              <TouchableOpacity onPress={() => {
                setOther(item.id == 4 ? true : false)
                setSelectReason(item)
                if (item.id != 4) {
                  inputReason?.current?.setText('')
                }
              }} key={i} style={{ flexDirection: 'row', alignItems: 'center', paddingVertical: 10, marginHorizontal: 17 }} >
                <LibIcon name={selectReason?.id == item.id ? "radiobox-marked" : "radiobox-blank"} color={MarketStyle.colorPrimaryMarket} style={{ marginRight: 10 }} />
                <Text>{item.text}</Text>
              </TouchableOpacity>
            ))
          }
          {
            other &&
            <MarketInput_square
              _ref={inputReason}
              multiline
              style={{ height: 100, textAlignVertical: "top" }}
              placeholder={esp.lang("market/order_detail_buttons", "give_reason")}
              onChangeText={() => { }} />
          }
          <MarketButton
            text={esp.lang("market/order_detail_buttons", "cancel_order")}
            buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
            onPress={() => {
              if (selectReason) {
                if (props?.data.status == 3 || props?.data.status == 4) {
                  cancelOrder(merchId)
                } else {
                  cancelOrder()
                }
              } else {
                LibToastProperty.show(esp.lang("market/order_detail_buttons", "empty_reason"))
              }
            }} />
        </ScrollView>
      </View>
    )
  })

  let guaranteeOn: boolean = (merchant.extension == '' || merchant.extension == null)

  return (
    <View>
      {
        props?.data.is_merchant == 1 ?
          <>
            {
              (props?.data.status == 1 || props?.data.status == 3 || props?.data.status == 4 || props?.data.status == 5 || props?.data.status == 7 || props?.data.status == 9) &&
              <MarketButton
                text={esp.lang("market/order_detail_buttons", "chat_buyer")}
                colorBackground={"white"}
                colorBorder={MarketStyle.colorPrimaryMarket}
                color={MarketStyle.colorPrimaryMarket}
                buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                onPress={() => {
                  esp.modProp('market/chat')?.openChat?.(props?.data?.buyer_user_id, undefined, undefined,
                    {
                      type: 'market',
                      image: merchant.product_list[0].product_image,
                      title: merchant.product_list[0].product_name,
                      description: merchant.product_list[0].price,
                      module: 'market/order_detail',
                      url: '',
                      data: {
                        invoice: merchant.invoice_merchant,
                        products_count: merchant.product_count
                      },
                      buttons: {
                        [props?.data.buyer_user_id]: [
                          {
                            text: esp.lang("market/order_detail_buttons", "show_detail"),
                            module: '',
                            url: merchant?.url_attach,
                            enabled: true
                          }
                        ],
                        [merchant.merchant_user_id]: [
                          {
                            text: esp.lang("market/order_detail_buttons", "show_detail1"),
                            module: '',
                            url: merchant?.url_attach_merchant,
                            enabled: true
                          }
                        ]
                      }
                    }
                  )
                }} />
            }
            {
              props?.data.status == 3 &&
              <>
                <MarketButton
                  text={esp.lang("market/order_detail_buttons", "decline_order")}
                  colorBackground={"white"}
                  colorBorder={MarketStyle.colorPrimaryMarket}
                  color={MarketStyle.colorPrimaryMarket}
                  buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                  onPress={() => {
                    MarketSlidingupProperty.add(
                      <View style={{ backgroundColor: "white", paddingVertical: 10 }} >
                        <LibTextstyle textStyle="headline" text={esp.lang("market/order_detail_buttons", "cancel_info")} style={{ textAlign: 'center', paddingBottom: 10 }} />
                        <MarketSection_menu size="line" />
                        <MarketInput_square
                          _ref={inputReason}
                          multiline
                          style={{ height: 100, textAlignVertical: "top" }}
                          label={esp.lang("market/order_detail_buttons", "reason_cancel")}
                          placeholder={esp.lang("market/order_detail_buttons", "reason_cancel_placeholder")}
                          onChangeText={() => { }} />
                        <MarketButton
                          text={esp.lang("market/order_detail_buttons", "btn_cancel")}
                          buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                          onPress={() => {
                            if (props?.data.status == 3 || props?.data.status == 4) {
                              cancelOrder(merchId)
                            } else {
                              cancelOrder()
                            }
                          }} />
                      </View>
                    )
                    MarketSlidingupProperty.show()
                  }} />
                {/* mark after sticky button done */}
                <MarketButton
                  text={esp.lang("market/order_detail_buttons", "btn_process")}
                  textStyle={{ color: '#f1f1f1' }}
                  buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                  onPress={() => {
                    approveOrder(props?.data.id)
                  }} />
              </>
            }
            {
              props?.data.status == 4 &&
              <>
                {/* mark after sticky button done */}
                {
                  merchant.shipping_method == 0 &&
                  <MarketButton
                    text={esp.lang("market/order_detail_buttons", "set_shipping")}
                    textStyle={{ color: '#f1f1f1' }}
                    buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                    onPress={() => {
                      LibNavigation.navigate('market/merchant_sending_method', { order_id: props?.data.id, shipping_code: merchant.shipping_code, shipping_label: merchant.shipping_label })
                      // LibDialog.warningConfirm(esp.lang("market/order_detail_buttons", "warn_title"), esp.lang("market/order_detail_buttons", "warn_msg"), esp.lang("market/order_detail_buttons", "warn_ok"), () => {
                      //   LibNavigation.navigate<MarketMerchant_sending_methodArgs>('market/merchant_sending_method', { order_id: props?.data.id, shipping_code: merchant.shipping_code, shipping_label: merchant.shipping_label })
                      // }, esp.lang("market/order_detail_buttons", "warn_cancel"), () => {
                      //   LibNavigation.navigate<MarketOrder_detail_label_printArgs>('market/order_detail_label_print', { url: merchant.shipping_label })
                      // })
                    }} />
                }

                {
                  merchant.shipping_method == 0 &&
                  <MarketButton
                    text={esp.lang("market/order_detail_buttons", "btn_cancel1")}
                    colorBackground={"white"}
                    colorBorder={MarketStyle.colorPrimaryMarket}
                    color={MarketStyle.colorPrimaryMarket}
                    buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                    onPress={() => {
                      MarketSlidingupProperty.add(
                        <View style={{ backgroundColor: "white", paddingVertical: 10 }} >
                          <LibTextstyle textStyle="headline" text={esp.lang("market/order_detail_buttons", "info_cancel")} style={{ textAlign: 'center', paddingBottom: 10 }} />
                          <MarketSection_menu size="line" />
                          <MarketInput_square
                            _ref={inputReason}
                            multiline
                            style={{ height: 100, textAlignVertical: "top" }}
                            label={esp.lang("market/order_detail_buttons", "label_reason")}
                            placeholder={esp.lang("market/order_detail_buttons", "placeholder_reason")}
                            onChangeText={() => { }} />
                          <MarketButton
                            text={esp.lang("market/order_detail_buttons", "btn_cancel2")}
                            buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                            onPress={() => {
                              if (props?.data.status == 3 || props?.data.status == 4) {
                                cancelOrder(merchId)
                              } else {
                                cancelOrder()
                              }
                            }} />
                        </View>
                      )
                      MarketSlidingupProperty.show()
                    }} />
                }

                {/* {
                  merchant.shipping_method != 0 && merchant.shipping_cashless == 1 && merchant.shipping_resi != '' &&
                  <MarketButton
                    text={'Lihat Resi'}
                    buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                    onPress={() => {
                      LibNavigation.navigate<Merchant_input_receiptArgs>("market/merchant_input_receipt", { order_id: props?.data.id, shipping_resi: merchant.shipping_resi, shipping_resi_edit: props?.shipping_resi })
                    }} />
                } */}
              </>
              // <>
              //   {
              //     merchant.shipping_cashless == 0 ?
              //       <MarketButton
              //         text={merchant.shipping_resi != '' ? esp.lang("market/order_detail_buttons", "show_resi") : esp.lang("market/order_detail_buttons", "input_resi")}
              //         buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
              //         onPress={() => {
              //           LibNavigation.navigate<Merchant_input_receiptArgs>("market/merchant_input_receipt", { order_id: props?.data.id, shipping_resi: merchant.shipping_resi, shipping_resi_edit: props?.shipping_resi })
              //         }} />
              //       :
              //       <>
              //         {
              //           merchant.shipping_cashless == 1 && merchant.shipping_resi != '' &&
              //           <MarketButton
              //             text={'Lihat Resi'}
              //             buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
              //             onPress={() => {
              //               LibNavigation.navigate<Merchant_input_receiptArgs>("market/merchant_input_receipt", { order_id: props?.data.id, shipping_resi: merchant.shipping_resi, shipping_resi_edit: props?.shipping_resi })
              //             }} />
              //         }
              //       </>
              //   }
              // </>
            }

            {/* mark after sticky button done */}
            {
              props?.data.status == 5 && merchant.shipping_method_change == 1 &&
              <MarketButton
                text={esp.lang("market/order_detail_buttons", "set_reshipping")}
                textStyle={{ color: '#f1f1f1' }}
                buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                onPress={() => {
                  reSettingShipping(props?.data.id, merchant)
                }} />
            }

            {
              (props?.data.status == 6) &&
              <MarketButton
                text={esp.lang("market/order_detail_buttons", "show_complaint")}
                textStyle={{ color: '#f1f1f1' }}
                buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                onPress={() => {
                  //is merchant
                  LibNavigation.navigate('market/complaint_detail', { url: 'shop/order_complaint_merchant?id=' + props?.data.id, order_id: props?.data.id, merchant_id: merchId })
                }} />
            }
            {
              props?.data.status == 7 &&
              <MarketButton
                text={esp.lang("market/order_detail_buttons", "show_review")}
                textStyle={{ color: '#f1f1f1' }}
                buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                onPress={() => {
                  // LibNavigation.navigate<MarketReview_listArgs>("market/review_list", { index: 1, url: "shop/order_merchant_review?is_reviewed=" })
                  LibNavigation.navigate("market/review_merchant_list", { index: 1, url: "shop/order_merchant_review?is_reviewed=" })
                }} />
            }
          </>
          :
          <>
            {
              props?.data.status == 1 &&
              <MarketButton
                text={esp.lang("market/order_detail_buttons", "change_payment_method")}
                colorBackground={"white"}
                colorBorder={MarketStyle.colorPrimaryMarket}
                color={MarketStyle.colorPrimaryMarket}
                buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                onPress={() => { LibNavigation.navigate("market/checkout_payment_method", { price: props?.price, id: props?.data.payment_id, fee: props?.data.fee, order_id: props?.data.id, from: "market/order_detail" }) }} />
            }
            {/* {
              props?.data.status == 1 &&
              <MarketButton
                text={esp.lang("market/order_detail_buttons", "btn_pay")}
                buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                onPress={() => { LibNavigation.navigate("market/order_detail") }} />
            } */}
            {
              (props?.data.status == 1 || props?.data.status == 3) &&
              <MarketButton
                text={esp.lang("market/order_detail_buttons", "btn_cancel3")}
                textStyle={{ color: '#f1f1f1' }}
                buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                onPress={() => {
                  MarketSlidingupProperty.show()
                }} />
            }
            {
              props?.data.status == 4 &&
              <View pointerEvents={!guaranteeOn ? "none" : "auto"} style={{ paddingHorizontal: 17, marginTop: 4, marginBottom: 8 }} >
                <MarketButton
                  text={guaranteeOn ? esp.lang("market/order_detail_buttons", "extend_guarantee") : esp.lang("market/order_detail_buttons", "guarantee_extended")}
                  icon='shield-check'
                  iconSize={24}
                  colorBackground={!guaranteeOn ? '#aaa' : undefined}
                  textStyle={{ color: '#f1f1f1', fontSize: 14 }}
                  onPress={() => {
                    if (guaranteeOn) {
                      MarketOrder_detailProperty.extendShippingForMerchant(props?.data.id, merchId, () => {
                        LibNavigation.back()
                        LibNavigation.navigate('market/order_detail', { url: merchant.url_attach })
                      })
                    }
                  }} />
              </View>
            }

            {/* mark after sticky button done */}
            {
              (props?.data.status == 5) &&
              <>
                {
                  merchant.delivered == 0 &&
                  <MarketButton
                    text={esp.lang("market/order_detail_buttons", "track")}
                    textStyle={{ color: '#f1f1f1' }}
                    buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                    onPress={() => {
                      LibNavigation.navigate("market/order_tracing", { order_id: props?.data.id, merchant: merchant })
                    }} />
                }
                <MarketButton
                  text={esp.lang("market/order_detail_buttons", "product_receive")}
                  textStyle={{ color: '#f1f1f1' }}
                  buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                  onPress={() => {
                    confirmDelivered()
                    timeout(() => {
                      MarketSlidingupProperty.show()
                    }, 500);
                  }} />
              </>
            }
            {
              (props?.data.status == 9) &&
              <>
                <MarketButton
                  text={esp.lang("market/order_detail_buttons", "order_done")}
                  textStyle={{ color: '#f1f1f1' }}
                  buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                  onPress={() => {
                    //baca dari config api home. waktu aprove berdasarkan jam
                    if (Number(props?.config?.shop?.time_order_approve || 0) > 0) {
                      if (currentTime >= accTime) {
                        finishOrder(merchant, props?.data)
                      } else {
                        LibToastProperty.show(esp.lang("market/order_detail_buttons", "time_done", props?.config?.shop?.time_order_approve))
                      }
                    } else {
                      finishOrder(merchant, props?.data)
                    }
                  }} />
                <MarketButton
                  text={esp.lang("market/order_detail_buttons", "do_complaint")}
                  colorBackground={"white"}
                  colorBorder={MarketStyle.colorPrimaryMarket}
                  color={MarketStyle.colorPrimaryMarket}
                  buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                  onPress={() => {
                    LibDialog.warningConfirm(
                      esp.lang("market/order_detail_buttons", "complaint"), esp.lang("market/order_detail_buttons", "msg_complaint")
                      , esp.lang("market/order_detail_buttons", "confirm_complaint"), () => {
                        LibNavigation.navigate('market/complaint_step1', { data: merchant, order_id: props?.data.id })
                      }
                      , esp.lang("market/order_detail_buttons", "cancel_complaint"), () => { }
                    )
                  }} />
              </>
            }
            {
              (props?.data.status == 6) &&
              <MarketButton
                text={esp.lang("market/order_detail_buttons", "show_complaint1")}
                textStyle={{ color: '#f1f1f1' }}
                buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                onPress={() => {
                  LibNavigation.navigate('market/complaint_detail', { url: 'shop/order_complaint?id=' + props?.data.id + '&merchant_id=' + merchId, order_id: props?.data.id, merchant_id: merchId })
                }} />
            }
            {
              (props?.data.status == 7) &&
              <MarketButton
                text={merchant?.is_reviewed == "0" ? esp.lang("market/order_detail_buttons", "give_review") : esp.lang("market/order_detail_buttons", "review_show")}
                textStyle={{ color: '#f1f1f1' }}
                buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                onPress={() => {
                  // LibNavigation.navigate<MarketProduct_review_sendArgs>("market/product_review_send", { data: merchant })
                  if (merchant?.is_reviewed == "0") {
                    //berikan ulasan
                    LibNavigation.navigate("market/order_detail_review", { invoice_id: merchant.invoice_id, invoice_merchant: merchant.invoice_merchant })
                  } else {
                    //lihat riwayat ulasan
                    LibNavigation.navigate('market/review_list', { index: 1 })
                  }
                }} />
            }
            {
              (props?.data.status == 7 || props?.data.status == 2) &&
              <MarketButton
                text={esp.lang("market/order_detail_buttons", "buy_again")}
                textStyle={{ color: '#f1f1f1' }}
                buttonStyle={{ marginHorizontal: 17, marginVertical: 5 }}
                onPress={() => { LibNavigation.navigate('market/product_detail', { url: product_url }) }} />
            }
          </>
      }

    </View>
  )
}