// withHooks

import { applyStyle } from 'esoftplay';
import { EventHeader } from 'esoftplay/cache/event/header/import';
import { EventIndexProperty } from 'esoftplay/cache/event/index/import';
import { EventMessage } from 'esoftplay/cache/event/message/import';
import { LibCurl } from 'esoftplay/cache/lib/curl/import';
import { LibList } from 'esoftplay/cache/lib/list/import';
import { LibLoading } from 'esoftplay/cache/lib/loading/import';
import { LibNavigation } from 'esoftplay/cache/lib/navigation/import';
import { LibPicture } from 'esoftplay/cache/lib/picture/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 { UserClass } from 'esoftplay/cache/user/class/import';
import esp from 'esoftplay/esp';
import moment from 'esoftplay/moment';
import useSafeState from 'esoftplay/state';
import React, { useEffect } from 'react';
import { Text, TouchableOpacity, View } from 'react-native';


moment().locale('id')


export interface BigbangArtistProps {

}

export default function m(props: BigbangArtistProps): any {
  const [result, setResult] = useSafeState<any>()
  const [resultEvent, setResultEvent] = useSafeState<any>()
  const [error, setError] = useSafeState<any>('')

  const { title, has_addition } = LibNavigation.getArgsAll(props)
  const url = LibNavigation.getArgs(props, 'url', 'event_artist')

  function loadData(): void {
    /* get detail event untuk dapat config antrian */

    new LibCurl(url, null,
      (res) => {
        esp.modProp("event/countdown").eventURI.set(url)
        new LibCurl(res?.[0]?.url_event || `event_detail/${res?.[0]?.event_id}`, null, (res) => {
          setResultEvent(res)
          if (res.allotment) {
            esp.modProp("event/firebase_socket").userIdKeyReplacer.set({
              t: Number(res.allotment.t),
              s: Number(res.allotment.s),
              priority: 1
            })
          }
        }, (err) => {

        }, 0)
        setResult(res)
      }, (err) => {
        setError(err?.message)
      }, 1)
  }

  useEffect(() => {
    if (esp.isDebug("") && UserClass?.state()?.get()?.email == "bagus@fisip.net") {
      LibNavigation.replace('event/artistv2', { url: url })
    } else {
      loadData?.()
    }
  }, [])

  const itemWidth = (LibStyle.width - 2)
  const itemHeight = itemWidth * 9 / 16

  let subs = {
    is_subscribed: resultEvent?.config?.is_subscribed,
    is_subscribed_default: resultEvent?.config?.is_subscribed_default,
    is_subscribed_label: resultEvent?.config?.is_subscribed_label
  }

  function renderItem(item: any, index: number) {
    const styleId_Z2g4Hs7: any = { backgroundColor: '#FFC523', width: itemWidth, height: itemHeight, margin: 0.5, justifyContent: 'center', alignItems: 'center' }
    let isNotAvailable = item?.price_list?.every((v: any) => v.status == 0)


    return (
      <TouchableOpacity key={index} onPress={() => {
        if (isNotAvailable) {
          LibToastProperty.show(item?.price_list?.[0]?.message)
        } else {
          EventIndexProperty.isLogin(() => {
            let newItem = {
              has_addition: has_addition,
              ...item,
            }
            if (item.book_available == 1) {
              if (item?.config?.hasOwnProperty('multiprice') && item?.config?.multiprice == 1) {
                LibNavigation.navigate('event/artist_detail_multi', {
                  data: newItem,
                  subscribed: subs,
                  url: item?.url_detail
                })
              } else {
                LibNavigation.navigate('event/artist_detail', {
                  data: newItem,
                  subscribed: subs,
                  url: item?.url_detail
                })
              }
              // }
            } else {
              LibToastProperty.show(esp.lang("event/artist_detail", "book_available", moment(item?.start_booking).serverFormat("DD MMMM YYYY HH:mm:ss")))
            }
          })
        }
      }} >
        {
          item && item.image != "" ?
            <LibPicture style={applyStyle({ opacity: isNotAvailable ? 0.3 : 1, backgroundColor: '#f2f3f4', width: itemWidth, height: itemHeight, margin: 0.5 })} source={{ uri: item.image }} />
            :
            <View style={styleId_Z2g4Hs7}>
              <Text numberOfLines={2} style={styleId_2cYE4h}>{item.title}</Text>
            </View>
        }
      </TouchableOpacity >
    )
  }

  return (
    <View style={{ flex: 1, backgroundColor: 'white' }} >
      <EventHeader title={title ? title : resultEvent?.event_title} iconShare={resultEvent?.url_share_artist && resultEvent?.url_share_artist !== ""}
        onPressShare={() => {
          LibUtils.share(resultEvent?.url_share_artist)
        }} />
      {
        !result && !error ? <LibLoading /> :
          <LibList
            data={result}
            keyExtractor={(item) => item.id}
            onRefresh={loadData}
            staticHeight={itemHeight + 1}
            renderItem={renderItem}
            ListEmptyComponent={
              <EventMessage message={error} />
            }
          />
      }
    </View>
  )
}
const styleId_2cYE4h: any = { padding: 15, color: 'white', fontSize: 24 }