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

const getRadius = (style) => {
  let s = undefined;
  if (Array.isArray(style)) {
    let res = {}
    for (let s of style) {
      res = {...res, ...s};
    }
    s = res;
  } else {
    s = style
  }
  var view = {}, text = {}
  for (let name in s) {
    if (name.indexOf('margin') >= 0) {
      view[name] = s[name];
      continue;
    }
    if (name.indexOf('padding') >= 0) {
      text[name] = s[name];
      continue;
    }
    if (name.indexOf('color') == 0) {
      text[name] = s[name];
      continue;
    }
    if (name.indexOf('font') >= 0) {
      text[name] = s[name];
      continue;
    }
    if (name.indexOf('border') >= 0) {
      view[name] = s[name];
      continue;
    } else if (name.indexOf('Radius') >= 0) {
      view[name] = s[name];
      continue;
    }
    if (name.indexOf('background') >= 0) {
      view[name] = s[name];
      continue;
    }
    if (name.indexOf('text') >= 0) {
      text[name] = s[name];
      continue;
    } 
    if (name.indexOf('position') >= 0) {
      view[name] = s[name];
      continue;
    } else {
      view[name] = s[name];
    }
  }
  return {
    view: view,
    text: text
  }
}

const TextRadius = ({style, onPress, children}) => {
  if (isIOS) {
    const styles = getRadius(style);
    return (
      <View style={styles.view}>
        <Text style={styles.text} onPress={onPress}>{children}</Text>
      </View>
    );
  } else {
    return <Text style={style} onPress={onPress}>{children}</Text>;
  }
};

export default TextRadius;