import React from 'react';
import { View, StyleSheet } from 'react-native';
import Svg, { Path } from 'react-native-svg';

export default DiscountView = ({visible=false}) => {
  if (visible) {
    return (<>
      <Svg
        width={35}
        height={35}
        viewBox="0 0 40 40"
        style={{top: 0, right: 0, zIndex: 2, position: 'absolute'}}>
        <Path
          fill={colorAccent}
          d="M28 0H0L40 40V12C40 5.37258 34.6274 -30 28 0Z" />
      </Svg>
      <View style={styles.cardDiscount}>
        <MaterialCommunityIcons
          name="brightness-percent"
          size={15}
          color={"#ffff"}
          style={{top: 0, right: 0, position: 'absolute'}}
        />
      </View>
    </>);
  } else {
    return <></>;
  }
};

const styles = StyleSheet.create({
  cardDiscount: {
    top: 0,
    left: 0,
    right: 0,
    bottom: 0,
    zIndex: 2,
    borderWidth: 3,
    borderRadius: 10,
    position: 'absolute',
    borderColor: colorAccent,
    borderStyle: 'solid'
  }
})