// withHooks
import { EventHeader } from 'esoftplay/cache/event/header/import';
import { EventMessage } from 'esoftplay/cache/event/message/import';
import { EventTurnstile_event_item } from 'esoftplay/cache/event/turnstile_event_item/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 { LibStyle } from 'esoftplay/cache/lib/style/import';
import esp from 'esoftplay/esp';
import useSafeState from 'esoftplay/state';

import React, { useEffect } from 'react';
import { View } from 'react-native';


export interface EventTurnstile_event_listArgs {

}
export interface EventTurnstile_event_listProps {

}
export default function m(props: EventTurnstile_event_listProps): any {
  const [result, setResult] = useSafeState<any>(undefined)
  const [error, setError] = useSafeState<any>()

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

  useEffect(() => {
    loadDataEvent()
  }, [])

  function loadDataEvent() {
    new LibCurl("gate_turnstile_event", null, (res, msg) => {
      setResult(res)
    }, (err) => {
      setError(err)
    }, 1)
  }

  function renderItem(item: any) {
    return (
      <EventTurnstile_event_item onPress={() => {
        LibNavigation.sendBackResult(item)
      }} image={item.event_image} title={item.event_name} start_date={item.event_start_date} end_date={item.event_end_date} />
    )
  }

  return (
    <View style={{ flex: 1, backgroundColor: LibStyle.colorBgGrey }}>
      <EventHeader title={esp.lang("event/turnstile_event_list", "header_title")} />
      {
        !result && !error ? <LibLoading /> :
          <LibList
            data={result}
            onRefresh={loadDataEvent}
            ListEmptyComponent={
              <EventMessage message={error?.message} />
            }
            renderItem={renderItem}

          />
      }

    </View >
  )
}