// withHooks

import { applyStyle } from 'esoftplay';
import { LibIcon } from 'esoftplay/cache/lib/icon/import';
import { LibTextstyle } from 'esoftplay/cache/lib/textstyle/import';
import { LibIconStyle } from 'esoftplay/modules/lib/icon';
import React from 'react';
import { TouchableOpacity, View } from 'react-native';


export interface EventNoticeArgs {
  
}
export interface EventNoticeProps {
  text: string
  mode: "info" | "success" | "danger" | "warning"
  onPress?: () => void,
  canPress?: boolean
  textStyle?: any
  containerStyle?: any
}

const icon: LibIconStyle[] = ["information-outline", "check-circle-outline", "close-circle-outline", "alert-circle-outline"]
const mode = ["info", "success", "danger", "warning"]
const color = ["blue", "lightgreen", "red", "orange"]
const bgColor = ["#cce5ff", "#d4edda", "#f8d7da", "#fff3cd"]

export default function m(props: EventNoticeProps): any {
  return (
    <TouchableOpacity onPress={props.onPress} >
      <View style={applyStyle({ marginVertical: 5, marginHorizontal: 17, paddingVertical: 8, paddingHorizontal: 10, borderRadius: 6, flexDirection: 'row', alignItems: 'center', backgroundColor: bgColor[mode.indexOf(props.mode)], ...props.containerStyle })} >
        <LibIcon name={icon[mode.indexOf(props.mode)]} color={color[mode.indexOf(props.mode)]} size={17} />
        <LibTextstyle textStyle="caption2" numberOfLines={2} ellipsizeMode='tail' text={props.text} style={applyStyle({ marginHorizontal: 10, flex: 1, ...props?.textStyle })} />
        {
          props.canPress &&
          <LibIcon name={'chevron-right'} size={17} />
        }
      </View>
    </TouchableOpacity>
  )
}