import React from 'react';
import {TextInput, View} from 'react-native';
import {scale, verticalScale, moderateScale} from 'react-native-size-matters';
import Size from '../common/size';
const size = new Size();
import {colors} from '../assets/styles/colors-theme';
import {Fonts} from '../assets/styles/fonts-theme';
import {width, height} from '../common/screen';

const NewTextInput = props => {
  return (
    <View
      style={{
        marginTop: 20,
        borderBottomWidth: 1,
        borderBottomColor: colors.line2Color,
      }}>
      <Text
        style={{
          fontFamily: Fonts.ubuntuL,
          fontSize: 17,
          color: colors.line2Color,
        }}>
        {this.store.text.problems}
      </Text>

      <View style={{flexDirection: 'row', marginBottom: 5}}>
        <View style={{flex: 0.8}}>
          <TextInput
            underlineColorAndroid="rgba(0,0,0,0)"
            editable={this.editable}
            style={{
              fontSize: 20,
              color: 'black',
              fontFamily: Fonts.ubuntuTh,
            }}
            value={this.caseData.content}
            onChangeText={text => {
              this.caseData.content = text;
            }}
          />
        </View>
        <TouchableOpacity
          disabled={!this.editable}
          style={{flex: 0.2, alignItems: 'flex-end', marginRight: 10}}
          onPress={() => {
            this.caseData.content = '';
          }}>
          <Icon name="times-circle" color={'black'} size={20} solid />
        </TouchableOpacity>
      </View>
    </View>
  );
};

export default NewTextInput;
