// withHooks

import { LibSlidingup } from 'esoftplay/cache/lib/slidingup/import';
import { LibStyle } from 'esoftplay/cache/lib/style/import';
import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
import esp from 'esoftplay/esp';
import React from 'react';
import { ScrollView, TouchableOpacity, View } from 'react-native';

export interface EventSheetData {
  text: string,
  onPress: () => void,
  textStyle?: any,
  containerStyle?: any
}

export interface EventSheetProps {
  _ref: React.Ref<LibSlidingup>,
  options: EventSheetData[]
  cancel?: EventSheetData,
  title?: string,
  detail?: string,
}
export default function m(props: EventSheetProps): any {
  let { cancel, options, title, detail, _ref } = props

  if (!cancel)
    cancel = {
      text: esp.lang("market/sheet", "cancel"), onPress: () => {
        try {
          // @ts-ignore
          _ref?.current?.hide() || _ref.hide()
        } catch (error) { }
      }
    }

  return (
    <LibSlidingup ref={_ref}>
      <View style={{ alignItems: 'center', marginBottom: 17 }} >
        <View style={{ width: LibStyle.width - 30, borderRadius: 13, overflow: 'hidden', }} >
          <ScrollView showsVerticalScrollIndicator={false} style={{ borderRadius: 13, overflow: 'hidden', backgroundColor: "white", maxHeight: LibStyle.height * 0.5 }} >
            <View style={{ marginVertical: title || detail ? 17 : 0 }} >
              {title && <LibTextstyle textStyle="caption1" text={title} style={{ textAlign: 'center', fontWeight: "bold", color: "#888" }} />}
              {detail && <LibTextstyle textStyle="caption1" text={detail} style={{ textAlign: 'center', color: "#888", marginTop: 5 }} />}
            </View>
            {
              options.map((opt, i) => (
                <TouchableOpacity
                  key={i}
                  style={{ paddingHorizontal: 17, paddingVertical: 15, alignItems: 'center', borderTopWidth: 1, borderTopColor: "#f4f4f4", ...opt.containerStyle }}
                  onPress={() => {
                    opt.onPress()
                    try {
                      // @ts-ignore
                      _ref?.current?.hide() || _ref.hide()
                    } catch (error) { }
                  }} >
                  <LibTextstyle text={opt.text} textStyle="body" style={opt.textStyle} />
                </TouchableOpacity>
              ))
            }
          </ScrollView>
          <View style={{ borderRadius: 13, marginTop: 10, backgroundColor: "white" }} >
            <TouchableOpacity
              style={{ paddingHorizontal: 17, paddingVertical: 15, alignItems: 'center', ...cancel.containerStyle }}
              onPress={cancel.onPress} >
              <LibTextstyle text={cancel.text} textStyle="body" style={{ fontWeight: "bold", color: LibStyle.colorBlue, ...cancel.textStyle }} />
            </TouchableOpacity>
          </View>
        </View>
      </View>
    </LibSlidingup>
  )
}