- more

app/components/Profile/PhoneInput/PhoneListItem.js

@@ -0,0 +1,37 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+import { Button, Text, View } from 'react-native';
+
+import styles from '../Profile.styles.js';
+
+export default function PhoneListItem({ index, label, number, handleDelete, handleEdit, handleEditStart }) {
+    return (
+        <View style={styles.listItem}>
+            <View style={styles.listValue}>
+                <Text style={styles.value}>{phone.get('number')}</Text>
+                <Text style={styles.label}>{phone.get('label')}</Text>
+            </View>
+            <View style={styles.listActions}>
+                {handleEdit !== null && <Button title={`Edit`} onPress={() => this.handleEditStart(index)} />}
+                <Button title={`X`} onPress={() => this.props.handleDelete(index)} />
+            </View>
+        </View>
+    );
+}
+
+PhoneListItem.propTypes = {
+    index: PropTypes.number.isRequired,
+    label: PropTypes.string.isRequired,
+    number: PropTypes.string.isRequired,
+    handleDelete: PropTypes.func.isRequired,
+    handleEdit: PropTypes.func,
+    handleEditStart: PropTypes.func.isRequired,
+};
+
+PhoneListItem.defaultProps = {
+    handleEdit: null,
+};
+
+
+