Workaround text wrap on Oppo, make assets folder.

See react-native#15114 for info. Also applies to OnePlus devices.

Author: retrixe

TODO

@@ -5,5 +5,4 @@
 - Handle graceful disconnect when being hit by the OOM killer?
 - https://reactnative.dev/docs/performance (esp when logging in)
 - Respect chat message length limits.
-- OnePlus 3T titles are wrapped.
 - Add command history.

src/microsoft.png renamed to src/assets/microsoft.png

@@ -13,8 +13,9 @@ const Text = (props: React.PropsWithChildren<TextProps>) => (
 )
 
 const styles = StyleSheet.create({
-  darkMode: { color: '#ffffff' },
-  lightMode: { color: '#000000' }
+  // https://github.com/facebook/react-native/issues/15114#issuecomment-364458149
+  darkMode: { color: '#ffffff', fontFamily: '' },
+  lightMode: { color: '#000000', fontFamily: '' }
 })
 
 export default Text

src/pack.png renamed to src/assets/pack.png

@@ -28,5 +28,6 @@ export default StyleSheet.create({
     borderBottomWidth: 1,
     borderBottomColor: '#121212'
   },
+  iconButtonText: { color: 'white', fontWeight: '600' }, // backgroundColor: 'transparent'
   flexSpacer: { flex: 1 }
 })

src/components/Text.tsx

@@ -291,7 +291,7 @@ const ServerScreen = () => {
           onPress={() => setAddServerDialogOpen(true)}
           iconStyle={globalStyle.iconStyle}
         >
-          Add
+          <Text style={globalStyle.iconButtonText}>Add</Text>
         </Ionicons.Button>
       </View>
       <ScrollView
@@ -322,7 +322,7 @@ const ServerScreen = () => {
                       source={
                         (ping as Ping).favicon
                           ? { uri: (ping as Ping).favicon }
-                          : require('../pack.png')
+                          : require('../assets/pack.png')
                       }
                       style={styles.serverImage}
                     />

src/globalStyle.ts

@@ -72,7 +72,7 @@ const AccountScreen = () => {
           onPress={() => setAddAccountDialogOpen(true)}
           iconStyle={globalStyle.iconStyle}
         >
-          Add
+          <Text style={globalStyle.iconButtonText}>Add</Text>
         </Ionicons.Button>
       </View>
       <View style={globalStyle.outerView}>

src/screens/ServerScreen.tsx

@@ -96,7 +96,7 @@ const AddAccountDialog = ({
         android_ripple={{ color: '#aaa' }}
         onPress={() => setMicrosoftLogin(true)}
       >
-        <Image source={require('../../microsoft.png')} />
+        <Image source={require('../../assets/microsoft.png')} />
         <Text style={styles.microsoftButtonText}>Login with Microsoft</Text>
       </Pressable>
       <TextField