// withHooks
import { EventButton } from 'esoftplay/cache/event/button/import';
import { EventHeader } from 'esoftplay/cache/event/header/import';
import { LibFont } from 'esoftplay/cache/lib/font/import';
import { LibIcon } from 'esoftplay/cache/lib/icon/import';
import { LibPicture } from 'esoftplay/cache/lib/picture/import';
import { LibStyle } from 'esoftplay/cache/lib/style/import';

import React from 'react';
import { ScrollView, Text, TouchableOpacity, View } from 'react-native';


export interface EventPoint_redemption_exchangeArgs {

}
export interface EventPoint_redemption_exchangeProps {

}
export default function m(props: EventPoint_redemption_exchangeProps): any {
  return (
    <View style={{ flex: 1, backgroundColor: LibStyle.colorBgGrey }}>
      <EventHeader />
      <ScrollView>

        <View style={{ margin: 15, marginBottom: 0, padding: 10, borderRadius: 10, backgroundColor: '#059669', overflow: 'hidden' }}>
          <View style={{ opacity: 0.3, height: 100, width: 150, top: -40, right: -40, position: 'absolute', }}>
            <LibIcon name='shield-check' size={150} color='#fff' />
          </View>
          <View style={{ marginBottom: 20, flexDirection: 'row' }}>
            <LibPicture source={{ uri: 'https://0.soompi.io/wp-content/uploads/2025/11/17232014/karina-chanel-beauty-2.jpg' }} style={{ height: 50, width: 50, borderRadius: 30 }} />
            <View style={{ marginLeft: 10, alignContent: 'center', justifyContent: 'center', }}>
              <Text allowFontScaling={false} style={{ fontWeight: 'bold', fontSize: 16, color: '#fff' }}>{"KATARINABLUEEE"}</Text>
              <Text allowFontScaling={false} style={{ letterSpacing: 1, color: '#fff' }}>{"katarinabluee@gmail.com"}</Text>
            </View>
          </View>
          <Text allowFontScaling={false} style={{ color: '#fff', fontFamily: LibFont('SFProText'), letterSpacing: 1, fontSize: 12 }}>{"POINT TERSEDIA"}</Text>
          <Text allowFontScaling={false} style={{ color: '#fff', marginTop: 5, fontFamily: LibFont('DecoNumbers'), fontSize: 36, letterSpacing: 1.5 }}>{"1000"}<Text style={{ fontSize: 14, fontWeight: 'normal' }}>{" POINT"}</Text> </Text>
        </View>

        <Text allowFontScaling={false} style={{ margin: 15, marginBottom: 0, letterSpacing: 1.5, fontWeight: 'bold' }}>REWARD TERSEDIA</Text>

        <TouchableOpacity style={{ margin: 15, marginBottom: 0, borderWidth: 1, borderColor: '#C5C7C8', backgroundColor: '#fff', borderRadius: 10, padding: 10, flexDirection: 'row', alignContent: 'center', alignItems: 'center' }}>
          <View>
            <View style={{ padding: 5, borderRadius: 5, backgroundColor: '#4EDEA3' }}>
              <LibIcon name={'medal'} color='#fff' />
            </View>
          </View>
          <View style={{ flex: 1, marginLeft: 10, marginRight: 10, alignContent: 'center', justifyContent: 'center' }}>
            <Text allowFontScaling={false} style={{ fontFamily: LibFont('ArialBold'), fontSize: 16 }}>{"Redeem struk belanja untuk tas bigbang besar warna kuning"}</Text>
            <Text allowFontScaling={false} style={{ marginTop: 5, fontSize: 20, fontFamily: LibFont('DecoNumbers'), color: LibStyle.colorGreen }}>{"400 Point"}</Text>
          </View>
          <LibIcon name='checkbox-blank-circle-outline' color='#059669' />
        </TouchableOpacity>

      </ScrollView>
      <EventButton style={{ margin: 10 }} backgroundColor={"#059669"} label='TUKARKAN' onPress={() => { }} />

    </View>
  )
}