Use built-in numberOfLines prop instead of truncating by hand

components/app-text.js

@@ -7,6 +7,7 @@ export default function AppText(props) {
     <Text
       style={[styles.appText, props.style]}
       onPress={props.onPress}
+      numberOfLines={props.numberOfLines}
     >
       {props.children}
     </Text>

components/cycle-day/cycle-day-overview.js

@@ -167,10 +167,7 @@ export default class CycleDayOverView extends Component {
     }
 
     const symptomValue = cycleDay[symptomName]
-    const label = l[symptomName](symptomValue)
-    if (!label) return
-    if (label.length < 45) return label
-    return label.slice(0, 42) + '...'
+    return l[symptomName](symptomValue)
   }
 
   render() {
@@ -293,7 +290,10 @@ class SymptomBox extends Component {
           </AppText>
         </View>
         <View style={[styles.symptomDataBox, disabledStyle]}>
-          <AppText style={styles.symptomDataText}>{this.props.data}</AppText>
+          <AppText
+            style={styles.symptomDataText}
+            numberOfLines={3}
+          >{this.props.data}</AppText>
         </View>
       </TouchableOpacity>
     )