esoftplay-event 0.0.0-p → 0.0.0-q

package/_templates/event/ticket_list.tsx

@@ -1,759 +0,0 @@
-// withHooks
-import { BigbangConfigProperty } from 'esoftplay/cache/bigbang/config/import';
-import { ComponentButton } from 'esoftplay/cache/component/button/import';
-import { ComponentHeader } from 'esoftplay/cache/component/header/import';
-import { ComponentPending_trx } from 'esoftplay/cache/component/pending_trx/import';
-import { ComponentTouchable } from 'esoftplay/cache/component/touchable/import';
-import { EventQueue_pricingProperty } from 'esoftplay/cache/event/queue_pricing/import';
-import { LibCurl } from 'esoftplay/cache/lib/curl/import';
-import { LibDialog } from 'esoftplay/cache/lib/dialog/import';
-import { LibFocus } from 'esoftplay/cache/lib/focus/import';
-import { LibIcon } from 'esoftplay/cache/lib/icon/import';
-import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
-import { LibObject } from 'esoftplay/cache/lib/object/import';
-import { LibPicture } from 'esoftplay/cache/lib/picture/import';
-import { LibSkeleton } from 'esoftplay/cache/lib/skeleton/import';
-import { LibStyle } from 'esoftplay/cache/lib/style/import';
-import { LibToastProperty } from 'esoftplay/cache/lib/toast/import';
-import { LibUtils } from 'esoftplay/cache/lib/utils/import';
-import { MarketCountdown } from 'esoftplay/cache/market/countdown/import';
-import moment from 'esoftplay/moment';
-import { memo } from 'react';
-
-import { applyStyle } from 'esoftplay';
-import { BigbangLoading_pageProperty } from 'esoftplay/cache/bigbang/loading_page/import';
-import { ComponentText } from 'esoftplay/cache/component/text/import';
-import { EventCountdownProperty } from 'esoftplay/cache/event/countdown/import';
-import { LibEffect } from 'esoftplay/cache/lib/effect/import';
-import { LibFirebase_socket, LibFirebase_socketProperty } from 'esoftplay/cache/lib/firebase_socket/import';
-import { LibProgress } from 'esoftplay/cache/lib/progress/import';
-import { UseDeeplinkProperty } from 'esoftplay/cache/use/deeplink/import';
-import esp from 'esoftplay/esp';
-import useLazyState from 'esoftplay/lazy';
-import useSafeState from 'esoftplay/state';
-import React, { useEffect, useRef } from 'react';
-import { Pressable, RefreshControl, ScrollView, Text, TouchableOpacity, View } from 'react-native';
-
-
-export interface EventTicket_listArgs {
-
-}
-export interface EventTicket_listProps {
-
-}
-
-export type Result = {
-  "id": string,
-  "title": string,
-  "image": string,
-  "images": Array<{
-    "image": string,
-    "title": string,
-    "description": string,
-  }>,
-  "image_map": string,
-  "charge_payment": number,
-  "status": string,
-  "quota_checkout": string,
-  "show_price": string,
-  "config_queue": {
-    "limit": number,
-    "time": number,
-  },
-  "form_allotment": string,
-  "form_allotment_text": string,
-  "use_queue": string,
-  "is_pod_limit": string,
-  "event_tag": [],
-  "charge_payment_type": string,
-  "price_type": Array<{
-    "price_id": string,
-    "type": string,
-    "kind": string,
-    "currency": string,
-    "price_min": string,
-    "price_max": string,
-    "use_code": string,
-    "use_seat": string,
-    "use_quota": boolean,
-    "config": {
-      "seat_autopick": string,
-      "seat_autopick_start": string,
-    },
-    "price_date": string,
-    "info": string,
-    "qty_min": string,
-    "qty_max": string,
-    "tax": string,
-    "quota": string,
-    "quota_used": string,
-    "status": number,
-    "quota_checkout": string,
-    "date_start": string,
-    "date_end": string,
-    "paper_size": string,
-    "is_refundable": boolean,
-    "refund": string,
-    "is_printed": string,
-    "image_map": string,
-    "term": Array<string>,
-    "list": Array<{
-      "list_id": string,
-      "date_id": number,
-      "ondate": string,
-      "price_id": string,
-      "price": string,
-      "quota": string,
-      "quota_used": string,
-      "show_limit": number,
-      "status": number,
-      "show_price": number,
-      "currency": string,
-      "schedule": {
-        "info": string,
-        "artist": [],
-      },
-      "is_available"?: string,
-    }>,
-  }>,
-  "price_type_info": string,
-  "exhibitor": {
-    "list": Array<{
-      "id": string,
-      "title": string,
-      "image": string,
-    }>,
-    "more_url": string,
-  },
-  "url_share": string,
-}
-
-function m(props: EventTicket_listProps): any {
-  const checkCounter = useRef<number>(0)
-  let refTimeout = useRef<any>()
-  const bboConfig = BigbangConfigProperty.state().get()
-  const { doneQueue, isInPricingQueueConfig, updateQueueExp } = LibFirebase_socket();
-
-  const [pendingData] = BigbangLoading_pageProperty.state().useState()
-
-  const { url, fee_platform, has_addition, subscribed }: any = useRef(LibNavigation.getArgsAll(props)).current
-
-  const [deeplinkParams] = UseDeeplinkProperty.params.useState()
-  const [timer] = EventCountdownProperty.countdownTime.useState()
-
-  const [unAvailableResult, setUnavailableResult] = useLazyState<any>()
-  const [availableResult, setAvailableResult, getAvailableResult] = useSafeState<Result>()
-
-  const [, setQty, getQty] = useSafeState<number>(1)
-  const [selectedTicket, setSelectedTicket, getSelectedTicket] = useSafeState<any>()
-
-  const [isPass, setIsPass] = useSafeState(true)
-  const [showAll, setShowAll] = useSafeState<any>({});
-
-  const [allTicket, setAllTicket, getAllTicket] = useSafeState()
-
-  useEffect(() => {
-    const { event_id } = EventQueue_pricingProperty.state().get()
-    if (isInPricingQueueConfig(event_id))
-      EventCountdownProperty.countdownTime.set(moment().add(LibFirebase_socketProperty.eventQueueConfig.get(event_id).time, 'seconds').localeFormat('YYYY-MM-DD HH:mm:ss'))
-    // loadData()
-    getCheckCounter()
-    return () => {
-      clearTimeout(refTimeout.current)
-      EventCountdownProperty.releaseQueue.trigger()
-    }
-  }, [])
-
-  function onRefresh() {
-    loadData()
-  }
-
-  function getCheckCounter() {
-    clearTimeout(refTimeout.current)
-    const { pathQueue, event_id, key } = EventQueue_pricingProperty.state().get()
-    if (event_id && isInPricingQueueConfig(event_id)) {
-      updateQueueExp(pathQueue, event_id)
-      checkCounter.current++
-      refTimeout.current = setTimeout(() => {
-        getCheckCounter()
-      }, 6000);
-    }
-  }
-
-
-  function loadData() {
-    new LibCurl(url, null, (res, msg) => {
-
-      esp.log({ res, url });
-
-      const availablePriceType = LibObject.update(res, (arr: any[]) => arr.filter((x) => x.status != 0))('price_type')
-      const unAvailablePriceType = LibObject.update(res, (arr: any[]) => arr.filter((x) => x.status == 0))('price_type')
-
-      setUnavailableResult(unAvailablePriceType)
-      setAvailableResult(availablePriceType)
-
-      setAllTicket(res)
-
-
-      if (selectedTicket) {
-        res?.price_type?.map((item: any) => {
-          if (item.price_id == selectedTicket?.price_id && item.status != 1) {
-            setSelectedTicket(undefined)
-          }
-        })
-      }
-
-      if (res.form_allotment == 1) {
-        releaseQueue()
-        LibNavigation.push('event/queue_out', { event_id: res.id, notes: res.form_allotment_text })
-      }
-    }, (error) => {
-      LibDialog.warningConfirm(esp.lang("event/ticket_list", "warn"), error?.message, "Ok", () => {
-        LibNavigation.back()
-      }, "", () => { })
-    }, 1)
-  }
-
-  function add(quota?: any, quota_used?: any): void {
-    if (getQty() != parseInt(getSelectedTicket()?.qty_max)) {
-      if (getQty() != (parseInt(quota) - parseInt(quota_used))) {
-        setQty(getQty() + 1)
-      }
-    }
-  }
-
-  function min(): void {
-    if (getQty() <= getSelectedTicket()?.qty_min) {
-      setQty(Number(getSelectedTicket()?.qty_min))
-    } else {
-      setQty(getQty() == 1 ? 1 : getQty() - 1)
-    }
-  }
-
-  function setQtyGlobal(value: any) {
-    let qty = 1
-    if (getSelectedTicket()?.qty_min) {
-      qty = Number(getSelectedTicket()?.qty_min)
-    }
-    if (qty > getSelectedTicket()?.qty_max) {
-      qty = Number(getSelectedTicket().qty_max)
-    }
-    if (value.quota != 0 && qty > value.quota) {
-      qty = value.quota
-    }
-    setQty(qty)
-  }
-
-  function releaseQueue() {
-    const { pathQueue, event_id, key } = EventQueue_pricingProperty.state().get()
-    if (event_id && isInPricingQueueConfig(event_id)) {
-      doneQueue(pathQueue, event_id, key, () => { })
-      EventQueue_pricingProperty.state().reset()
-      setIsPass(false)
-      EventCountdownProperty.releaseQueue.trigger()
-    }
-  }
-
-  let dataPost: any = {
-    event_id: availableResult?.id,
-    event_title: availableResult?.title,
-    charge_payment: availableResult?.charge_payment,
-    charge_payment_type: availableResult?.charge_payment_type,
-    images: availableResult?.images,
-    selected_ticket: selectedTicket,
-    qty: getQty(),
-  }
-
-  function checkAddition(newDataPost: any) {
-    if ((has_addition == 1 || selectedTicket?.hasOwnProperty("has_addition") && selectedTicket?.has_addition == 1)) {
-      LibNavigation.navigateForResult('event/additional', { ondate: selectedTicket?.list?.ondate, event_id: availableResult?.id, qty: getQty(), price_id: selectedTicket?.price_id }, 321).then((additions) => {
-        if (additions != "") {
-          newDataPost.addition = additions
-        }
-        LibNavigation.navigate('payment/ticket', {
-          order_type: bboConfig?.order_type?.ticket,
-          tax: selectedTicket?.tax == null ? 0 : selectedTicket?.tax,
-          fee_platform: fee_platform,
-          dataBookingEvent: { ...newDataPost, qty: getQty() },
-          subscribed: subscribed
-        })
-      })
-    } else {
-      LibNavigation.navigate('payment/ticket', {
-        order_type: bboConfig?.order_type?.ticket,
-        tax: selectedTicket?.tax == null ? 0 : selectedTicket?.tax,
-        fee_platform: fee_platform,
-        dataBookingEvent: { ...newDataPost, qty: getQty() },
-        subscribed: subscribed
-      })
-    }
-  }
-
-  function eventConfig() {
-    // ini nantinya curl config setelah tombol continue di klik
-    let date_ids = [
-      "22450",
-      "22469"
-    ]
-
-    LibNavigation.navigateForResult('component/curl_page', {
-      url: 'home',
-      post: {
-        event_id: availableResult?.id,
-        date_ids: date_ids
-      }
-    }).then((value) => {
-
-      // result yang diharapkan
-      let _value = [
-        {
-          "date_id": "22450",
-          "ondate": "0000-00-00",
-          "seat_autopick": 1,
-          "use_seat": 1,
-          "has_addition": 1,
-          "addition e": {}
-        },
-        {
-          "date_id": "22469",
-          "ondate": "0000-00-00",
-          "seat_autopick": 1,
-          "use_seat": 1,
-          "has_addition": 1,
-          "addition e": {}
-        },
-      ]
-
-      // cek masing2 apakah mengandung seat sama addition
-
-      // keperluan api seat
-      // "event_seat"
-      // post = {
-      //   event_id: 348,
-      //   price_id: 1593.
-      //   ondate: '0000-00-00',
-      // }
-
-      LibNavigation.navigateForResult('event/seat_map').then((value) => {
-
-      })
-
-      // LibNavigation.navigate('payment/event', {
-      //   dataBookingEvent: dataPost,
-      //   subscribed: subscribed
-      // })
-
-      // if (_value?.seat_autopick == 1 && getQty() > 1) {
-      //   dataPost.adjacent_seats = 1
-      // }
-
-      // if (selectedTicket?.use_code == 1 && selectedTicket?.use_seat == 1) {
-      //   // tak arahke halaman seng anyar
-      //   LibNavigation.navigate('payment/event_invitation', {
-      //     dataBookingEvent: dataPost,
-      //     subscribed: subscribed
-      //   })
-      // } else if (selectedTicket?.use_seat == 1) {
-      //   if (selectedTicket?.config && selectedTicket?.config?.seat_autopick == 1) {
-      //     checkAddition(dataPost)
-      //   } else {
-      //     LibNavigation.navigateForResult('event/seat_map', {
-      //       url: 'event_seat',
-      //       dataTicket: dataPost,
-      //     }).then((value) => {
-      //       dataPost.row_id = value.row_id
-      //       dataPost.column_id = value.column_id
-      //       dataPost.seat_name = value.seat_name
-
-      //       checkAddition(dataPost)
-      //     })
-      //   }
-      // } else {
-      //   checkAddition(dataPost)
-      // }
-    })
-  }
-
-  function nextStep() {
-    eventConfig()
-  }
-
-  function checkInvBlock() {
-    LibProgress.show(esp.lang("event/ticket_list", "wait"))
-    new LibCurl('voucher_check_validate', null, (res, msg) => {
-      LibProgress.hide()
-      if (res?.status == 1) {
-        LibNavigation.navigate('event/block_invitation', {
-          dataCheck: res,
-        })
-      } else {
-        nextStep()
-      }
-    }, (err) => {
-      LibProgress.hide()
-    })
-  }
-
-  function renderItem(itemC: any, iC: number, item: any, i: number) {
-    // itemC adalah item yang ada diindex list, kalo item itu adalah item yang ada diindex price_type
-
-    let ticketWithDate = item.price_date == 1 && item.use_code == 0
-    let ticketInvitation = item.price_date == 0 && item.use_code == 1
-    let ticketSpecial = item.price_date == 0 && item.use_code == 0
-
-    let _selectedTicket = itemC.selected == 1
-
-    let colorDefault = _selectedTicket ? "#FFE9AD" : '#fff'
-    let colorBackground = item.status != 1 ? LibStyle.colorLightGrey : itemC.status != 1 ? LibStyle.colorLightGrey : colorDefault
-    let textOpacity = /* item.status == 1 ? 1 :  */itemC?.status == 1 ? 1 : 0.3
-
-    return (
-      <TouchableOpacity key={iC} onPress={() => {
-        let msg = item.status == 0 ? esp.lang("event/ticket_list", "sold_out") : esp.lang("event/ticket_list", "coming_soon")
-        if (itemC.status == 1 && item.status == 1) {
-          const data = new LibObject(getAllTicket())
-            .update((itemList) => {
-              itemList.selected = itemList.selected == 1 ? 0 : 1
-              itemList.qty = itemList.selected == 1 ? item.qty_min : 0
-              itemList.adjacent_seats = item.config?.seat_autopick
-              itemList.use_seat = item.use_seat
-              return itemList
-            })('price_type', i, 'list', iC)
-            .update((priceTypeItem) => {
-              return ({
-                ...priceTypeItem,
-                selected: priceTypeItem?.list?.some((item: any) => item.selected == 1) ? 1 : 0
-              })
-            })('price_type', i)
-            .value()
-
-          setAllTicket(data)
-        } else if (itemC.status == 0) {
-          LibToastProperty.show(msg)
-        } else if (itemC.status == 2) {
-          LibToastProperty.show(msg)
-        }
-
-      }} testID="ticket_item" activeOpacity={itemC.status == 1 ? 0 : 1} style={{ backgroundColor: colorBackground, borderBottomWidth: item.list.length == 1 ? 0 : 3, borderBottomColor: "#fff" }}>
-        <View style={{ flex: 1, flexDirection: 'row', justifyContent: 'space-between', padding: 10, alignItems: 'center' }}>
-          {
-            ticketWithDate ?
-              // view untuk yang ada tanggalnya
-              <View style={{ flex: 1, flexDirection: 'row', alignContent: 'center', alignItems: 'center', }}>
-                <View style={applyStyle({ marginLeft: 10, marginHorizontal: 20, width: 42, height: 42, borderRadius: 5, backgroundColor: colorBackground, borderStyle: "solid", borderWidth: textOpacity, borderColor: _selectedTicket ? "#3ea4dc" : '#999', alignContent: 'center', alignItems: 'center', justifyContent: 'center' })}>
-                  <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, fontFamily: "Arial", fontSize: 20, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0.23, textAlign: "center", color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC.ondate).localeFormat('DD')}</Text>
-                </View>
-                <View style={applyStyle({ flexDirection: 'column', flex: 1 })}>
-                  {
-                    item?.status == 1 && itemC.status != 1 &&
-                    <View style={applyStyle({ flexDirection: 'row', marginBottom: 5 })}>
-                      <View style={applyStyle({ alignContent: 'center', alignItems: 'center', justifyContent: 'center', marginTop: 5, borderWidth: 1, backgroundColor: itemC.status == 0 ? LibStyle.colorRed : "#4cd964", borderColor: itemC.status == 0 ? LibStyle.colorRed : "#4cd964", borderRadius: 5, padding: 3, opacity: 0.8 })}>
-                        <Text allowFontScaling={false} style={applyStyle({ fontSize: 10, fontStyle: "normal", letterSpacing: 0, color: /* itemC.status == 2 ? "#000" : */ "#fff", fontWeight: 'bold' })}>{itemC.status == 0 ? esp.lang("event/ticket_list", "sold_out") : esp.lang("event/ticket_list", "coming_soon")}</Text>
-                      </View>
-                    </View>
-                  }
-                  <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC.ondate).localeFormat('dddd')}</Text>
-                  <View style={applyStyle({ flexDirection: 'row' })}>
-                    <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC.ondate).localeFormat('MMMM')}</Text>
-                    <Text allowFontScaling={false} style={applyStyle({ opacity: textOpacity, marginLeft: 7, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' })}>{LibUtils.moment(itemC.ondate).localeFormat('YYYY')}</Text>
-                  </View>
-                </View>
-              </View>
-              :
-              // view untuk yang undangan dan khusus
-              <View style={{ flex: 1, flexDirection: 'row', alignContent: 'center', alignItems: 'center' }}>
-                <LibPicture source={esp.assets(ticketInvitation ? 'icons/invitation2.png' : 'icons/ic_special2.png')} style={{ height: 42, width: 42 }} />
-                <View style={{ marginLeft: 14, flex: 1 }} >
-                  {
-                    item?.status == 1 && itemC.status != 1 &&
-                    <View style={applyStyle({ flexDirection: 'row', marginBottom: 5 })}>
-                      <View style={applyStyle({ alignContent: 'center', alignItems: 'center', justifyContent: 'center', marginTop: 5, borderWidth: 1, backgroundColor: itemC.status == 0 ? LibStyle.colorRed : LibStyle.colorPrimary, borderColor: itemC.status == 0 ? LibStyle.colorRed : LibStyle.colorPrimary, borderRadius: 5, padding: 3, opacity: 0.8 })}>
-                        <Text allowFontScaling={false} style={applyStyle({ fontSize: 10, fontStyle: "normal", letterSpacing: 0, color: "#fff", fontWeight: 'bold' })}>{itemC.status == 0 ? esp.lang("event/ticket_list", "sold_out") : esp.lang("event/ticket_list", "coming_soon")}</Text>
-                      </View>
-                    </View>
-                  }
-                  {<Text allowFontScaling={false} style={{ fontFamily: "Arial", fontSize: 14, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' }}>{item.type}</Text>}
-                  {
-                    item.info != "" &&
-                    <Text allowFontScaling={false} numberOfLines={3} style={{ flexWrap: 'wrap', fontFamily: "Arial", fontSize: 11, fontStyle: "normal", letterSpacing: 0, color: _selectedTicket ? "#3ea4dc" : '#999' }} >{item.info}</Text>
-                  }
-                </View>
-              </View>
-          }
-
-          <View style={applyStyle({ marginRight: 5, marginLeft: 5, flexDirection: 'column' })} >
-            {
-              (itemC.status == 1 || itemC.status == 0 || itemC.show_price == 1) &&
-              <Text allowFontScaling={false} style={applyStyle({ opacity: ticketWithDate ? textOpacity : 1, fontFamily: "Arial", fontSize: 12, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, textAlign: "right", color: _selectedTicket ? "#3ea4dc" : (itemC.price == 0 ? LibStyle.colorGreen : '#999') })} >{itemC.price == 0 ? esp.lang("event/ticket_list", "free") : LibUtils.money(itemC.price, itemC.currency)}</Text>
-            }
-            {
-              (ticketWithDate || ticketSpecial) && itemC.selected == 1 &&
-              <View style={applyStyle({ marginTop: 4, flexDirection: 'row', marginLeft: 8, alignContent: 'center', alignItems: 'center' })}>
-                <Pressable hitSlop={{ top: 15, left: 15, right: 15, bottom: 15 }} testID='minus_btn' onPress={() => {
-                  // min()
-                  let qty = 1
-                  if (itemC.qty <= item.qty_min) {
-                    qty = Number(item.qty_min)
-                  } else {
-                    qty = Number(itemC.qty) == 1 ? 1 : Number(itemC.qty) - 1
-                  }
-
-                  setAvailableResult(LibObject.set(getAvailableResult(), qty)('price_type', i, 'list', iC, 'qty'))
-
-                }}>
-                  <View style={applyStyle({ padding: 1, borderRadius: 6, backgroundColor: "#ecf0f1", alignContent: 'center', alignItems: 'center' })}>
-                    <LibIcon name="minus" color="#e74c3c" />
-                  </View>
-                </Pressable>
-                <Text style={applyStyle({ fontFamily: "Arial", fontSize: 20, fontWeight: "bold", fontStyle: "normal", letterSpacing: 0, color: "#9b9b9b", marginLeft: 13, marginRight: 13 })}>{itemC?.qty}</Text>
-                <Pressable hitSlop={{ top: 15, left: 15, right: 15, bottom: 15 }} testID='plus_btn' onPress={() => {
-                  // add(itemP.quota, itemP.quota_used)
-                  let qty = 1
-                  if (itemC.qty != item.qty_max) {
-                    if (qty != (Number(itemC.quota) - Number(itemC.quota_used))) {
-                      qty = Number(itemC?.qty) + 1
-                    }
-                  } else {
-                    qty = Number(item.qty_max)
-                  }
-                  setAvailableResult(LibObject.set(getAvailableResult(), qty)('price_type', i, 'list', iC, 'qty'))
-                }}>
-                  <View style={applyStyle({ padding: 1, borderRadius: 6, backgroundColor: "#ecf0f1", alignContent: 'center', alignItems: 'center' })}>
-                    <LibIcon name="plus" color="#16a085" />
-                  </View>
-                </Pressable>
-              </View>
-            }
-          </View>
-
-        </View>
-      </TouchableOpacity>
-    )
-  }
-
-
-  let listLength = new Array(10).fill('')
-
-
-  const maxDisplay = 3;
-
-  const handleShowAll = (price_id: any) => {
-    setShowAll((prevShowAll: any) => ({
-      ...prevShowAll,
-      [price_id]: !prevShowAll[price_id],
-    }));
-  };
-
-  return (
-    <View style={{ flex: 1, backgroundColor: "#fff" }}>
-      <LibFocus onFocus={() => {
-        onRefresh();
-      }} />
-      <ComponentHeader title={esp.lang("event/ticket_list", "buy_ticket")} subtitle={esp.lang("event/ticket_list", "choose_date")} />
-      {
-        !allTicket ?
-          <LibSkeleton>
-            {
-              listLength.map((item: any, i: number) => {
-                return (
-                  <View key={i}>
-                    <View style={{ height: 30, width: '100%', backgroundColor: '#fff' }} />
-                    <View style={{ padding: 10, width: '100%', flexDirection: 'row', justifyContent: 'space-between', alignContent: 'center', alignItems: 'center' }}>
-                      <View style={{ flexDirection: 'row' }}>
-                        <View style={{ backgroundColor: '#fff', height: 42, width: 42, borderRadius: 3, marginRight: 10 }} />
-                        <View style={{ width: '60%' }}>
-                          <View style={{ backgroundColor: '#fff', height: 20, width: '40%' }} />
-                          <View style={{ backgroundColor: '#fff', marginTop: 7, height: 14, width: '70%' }} />
-                        </View>
-                      </View>
-                      <View style={{ backgroundColor: '#fff', height: 20, width: '10%' }} />
-                    </View>
-                  </View>
-                )
-              })
-            }
-          </LibSkeleton>
-          :
-          <>
-            {
-              Object.values(pendingData).filter((item: any) => item?.order_type == "ticket").length > 0 &&
-              <ComponentPending_trx
-                onPress={() => {
-                  LibNavigation.navigate('bigbang/loading_page_list', {
-                    order_type: 'ticket'
-                  })
-                }}
-                order_type="ticket"
-                title={esp.lang("event/ticket_list", "pending", String(Object.values(pendingData).filter((item: any) => item?.order_type == "ticket").length))}
-              />
-            }
-            {
-              isInPricingQueueConfig(allTicket?.id) && isPass ?
-                <LibEffect deps={[]}>
-                  <View style={{ backgroundColor: LibStyle.colorGreen, margin: 16, borderRadius: 5, padding: 10, ...LibStyle.elevation(2) }} >
-                    <ComponentText.Caption>{esp.lang("event/ticket_list", "select_ticket")}</ComponentText.Caption>
-                    <MarketCountdown
-                      onExpired={() => {
-                        LibNavigation.navigate("event/detail")
-                      }}
-                      expired={timer}
-                      style={{ color: "#fff", fontWeight: 'bold' }} />
-                  </View>
-                </LibEffect>
-                : null
-            }
-            <ScrollView refreshControl={<RefreshControl refreshing={false} onRefresh={onRefresh} />}>
-              {
-                allTicket?.image_map != "" &&
-                <ComponentTouchable onPress={() => {
-                  LibNavigation.navigate('lib/gallery', { image: allTicket?.image_map })
-                }} style={{ marginBottom: 10, marginTop: 20 }}>
-                  <LibPicture source={{ uri: allTicket?.image_map }} style={applyStyle({ alignSelf: 'center', height: LibStyle.width * 0.5, width: LibStyle.width })} resizeMode="contain" />
-                </ComponentTouchable>
-              }
-              <View style={{ flex: 1 }}>
-                {
-                  allTicket?.price_type?.map?.((item: any, i: number) => {
-                    let textOpacity = item?.status == 1 ? 1 : 0.3
-                    let filterFullData = allTicket?.price_type?.filter((it: any) => it.status != 0)
-                    const displayedData = showAll[item.price_id] ? item?.list : item?.list.slice(0, maxDisplay);
-
-                    let selTic = item.price_id == selectedTicket?.price_id
-                    let ticketWithDate = item.price_date == 1 && item.use_code == 0
-
-                    return (
-                      <Pressable onPress={() => {
-
-                      }} key={i} style={{ overflow: 'hidden', margin: 15, marginBottom: 5, backgroundColor: '#fff', borderRadius: 10, ...LibStyle.elevation(2), borderWidth: 1, borderColor: selTic ? LibStyle.colorBlue : LibStyle.colorBgGrey }}>
-                        <View style={{ padding: 10, backgroundColor: '#f1f2f3', borderTopLeftRadius: 10, borderTopRightRadius: 10 }}>
-                          <View style={{ alignContent: 'center', alignItems: 'center', flexDirection: 'row', justifyContent: 'space-between', }}>
-                            <View>
-                              <ComponentText.Subtitle style={{ opacity: textOpacity }} bold>
-                                {item.type}
-                                {
-                                  item.qty_min > 1 &&
-                                  <ComponentText.Small color={LibStyle.colorRed}>{"(" + esp.lang("event/ticket_list", "min_order") + LibUtils.number(item.qty_min) + ")"}</ComponentText.Small>
-                                }
-                              </ComponentText.Subtitle>
-                              {
-                                deeplinkParams?.type == 'event-voucher' && deeplinkParams?.price_id == item.price_id ?
-                                  <ComponentText.Caption color='coral' bold>{esp.lang("event/ticket_list", "applied_code", deeplinkParams?.code)}</ComponentText.Caption>
-                                  : null
-                              }
-                            </View>
-                            {
-                              item?.status != 1 &&
-                              <View style={applyStyle({ flexDirection: 'row' })}>
-                                <View style={applyStyle({ alignContent: 'center', alignItems: 'center', justifyContent: 'center', borderWidth: 1, backgroundColor: item.status == 0 ? LibStyle.colorRed : "#4cd964", borderColor: item.status == 0 ? LibStyle.colorRed : "#4cd964", borderRadius: 5, padding: 3, opacity: 0.8 })}>
-                                  <ComponentText.Small bold>{item.status == 0 ? esp.lang("event/ticket_list", "sold_out") : esp.lang("event/ticket_list", "coming_soon")}</ComponentText.Small>
-                                </View>
-                              </View>
-                            }
-                          </View>
-                          {
-                            item.info != "" && ticketWithDate &&
-                            <View style={{ marginTop: 3, alignContent: 'center', alignItems: 'center', flexDirection: 'row', marginRight: 5 }}>
-                              <ComponentText.Caption color={LibStyle.colorBlue}>{item.info}</ComponentText.Caption>
-                            </View>
-                          }
-                        </View>
-                        {
-                          displayedData?.map((itemC: any, iC: number) => renderItem(itemC, iC, item, i))
-                        }
-
-                        {
-                          filterFullData[i]?.list?.length > 3 &&
-                          <TouchableOpacity onPress={() => {
-                            handleShowAll(item.price_id)
-                          }} style={{ borderTopColor: LibStyle.colorGrey, borderTopWidth: 0.8, flex: 1, padding: 8, flexDirection: 'row', alignContent: 'center', alignItems: 'center', justifyContent: 'center' }}>
-                            <ComponentText.Caption bold color={LibStyle.colorBlue} style={{ marginRight: 5 }}>{showAll[item.price_id] ? esp.lang("event/ticket_list", "see_less") : esp.lang("event/ticket_list", "see_more")}</ComponentText.Caption>
-                            <LibIcon name={showAll[item.price_id] ? 'chevron-up-circle-outline' : 'chevron-down-circle-outline'} color={LibStyle.colorBlue} size={18} />
-                          </TouchableOpacity>
-                        }
-
-                      </Pressable>
-                    )
-                  })
-                }
-
-                {/* ini view yang dibawah */}
-                <View style={{ marginTop: 30 }}>
-                  <View style={{ padding: 15, paddingTop: 0, marginTop: 0, flexDirection: 'row', justifyContent: 'space-between', alignContent: 'center', alignItems: 'center', marginBottom: 0, paddingBottom: 10, borderBottomWidth: 1, borderBottomColor: LibStyle.colorGrey }}>
-                    <ComponentText.Body bold>{esp.lang("event/ticket_list", "ticket_not_available")}</ComponentText.Body>
-                    <TouchableOpacity onPress={() => {
-                      LibToastProperty.show("Nanti dia curl tiket yang gak available")
-                    }} style={{ padding: 5, paddingVertical: 3, borderRadius: 5, borderWidth: 1, borderColor: LibStyle.colorBlue, }}>
-                      <ComponentText.Button bold color={LibStyle.colorBlue}>{"Lihat tiket"}</ComponentText.Button>
-
-                    </TouchableOpacity>
-                  </View>
-                  {/* {
-                    unAvailableResult?.price_type?.length > 0 &&
-                  } */}
-                  {
-                    unAvailableResult?.price_type?.map?.((item: any, i: number) => {
-                      let selTic = item.price_id == selectedTicket?.price_id
-                      let textOpacity = item?.status == 1 ? 1 : 0.3
-                      let ticketWithDate = item.price_date == 1 && item.use_code == 0
-                      return (
-                        <View key={i} style={{ overflow: 'hidden', margin: 15, marginBottom: 5, backgroundColor: '#fff', borderRadius: 10, ...LibStyle.elevation(2), borderWidth: 1, borderColor: selTic ? LibStyle.colorBlue : LibStyle.colorBgGrey }}>
-                          <View style={{ padding: 10, backgroundColor: '#f1f2f3', borderTopLeftRadius: 10, borderTopRightRadius: 10 }}>
-                            <View style={{ alignContent: 'center', alignItems: 'center', flexDirection: 'row', justifyContent: 'space-between', }}>
-                              <ComponentText.Subtitle bold style={{ opacity: textOpacity }}>{item.type}</ComponentText.Subtitle>
-                              {
-                                item?.status != 1 &&
-                                <View style={applyStyle({ flexDirection: 'row' })}>
-                                  <View style={applyStyle({ alignContent: 'center', alignItems: 'center', justifyContent: 'center', borderWidth: 1, backgroundColor: item.status == 0 ? LibStyle.colorRed : "#4cd964", borderColor: item.status == 0 ? LibStyle.colorRed : "#4cd964", borderRadius: 5, padding: 3, opacity: 0.8 })}>
-                                    <ComponentText.Small bold>{item.status == 0 ? esp.lang("event/ticket_list", "sold_out") : esp.lang("event/ticket_list", "coming_soon")}</ComponentText.Small>
-                                  </View>
-                                </View>
-                              }
-                            </View>
-                            {
-                              item.info != "" && ticketWithDate &&
-                              <View style={{ marginTop: 3, alignContent: 'center', alignItems: 'center', flexDirection: 'row', marginRight: 5 }}>
-                                <ComponentText.Caption color={LibStyle.colorBlue}>{item.info}</ComponentText.Caption>
-                              </View>
-                            }
-                          </View>
-                          {
-                            item?.list.slice(0, 3).map((itemC: any, iC: number) => renderItem(itemC, iC, item, i))
-                          }
-                        </View>
-                      )
-                    })
-                  }
-                </View>
-              </View>
-            </ScrollView>
-
-
-            <View style={applyStyle({ margin: 10, marginVertical: 5 })}>
-              {
-                allTicket?.price_type_info != "" &&
-                <ComponentText.Subtitle bold color={LibStyle.colorBlue} style={{ marginBottom: 10 }}>{allTicket && allTicket?.hasOwnProperty("price_type_info") && allTicket?.price_type_info}</ComponentText.Subtitle>
-              }
-              <ComponentButton testID={"next_btn"} label={esp.lang("event/ticket_list", "next")} onPress={() => {
-                if (!allTicket?.price_type.some((item: any) => item.selected == 1)) {
-                  LibToastProperty.show(esp.lang("event/ticket_list", "ticket_not_select"), 3000)
-                  return
-                }
-                if (selectedTicket?.use_code == 1) {
-                  checkInvBlock()
-                }
-                // else if (selectedTicket?.config?.seat_autopick == 1 && getQty() > 1) {
-                //   chooseBestSeat()
-                // }
-                else {
-                  nextStep();
-                }
-
-              }} style={applyStyle({ backgroundColor: LibStyle.colorPrimary })} />
-            </View>
-          </>
-      }
-
-    </View>
-  )
-}
-export default memo(m);