fix(ui): Fix Bio section in auth-profile.screen and profile.screen (#600

) After the react-native-elements update, we've lost some styles, this commit remove ellipsize from bio text and and use ListItem text as title instead subtitle
gitpoint · Oct 30, 2017 · 753f60c · 753f60c
1 parent 2fda53e
commit 753f60c
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 45 deletions.
diff --git a/src/auth/screens/auth-profile.screen.js b/src/auth/screens/auth-profile.screen.js
@@ -45,10 +45,6 @@ const mapDispatchToProps = dispatch =>
 
 const styles = StyleSheet.create({
   listTitle: {
-    color: colors.black,
-    ...fonts.fontPrimary,
-  },
-  listSubTitle: {
     color: colors.greyDark,
     ...fonts.fontPrimary,
   },
@@ -159,8 +155,9 @@ class AuthProfile extends Component {
             user.bio !== '' && (
               <SectionList title={translate('common.bio', locale)}>
                 <ListItem
-                  subtitle={emojifyText(user.bio)}
-                  subtitleStyle={styles.listSubTitle}
+                  titleNumberOfLines={0}
+                  title={emojifyText(user.bio)}
+                  titleStyle={styles.listTitle}
                   hideChevron
                 />
               </SectionList>

diff --git a/src/user/screens/profile.screen.js b/src/user/screens/profile.screen.js
@@ -59,10 +59,6 @@ const mapDispatchToProps = dispatch =>
 
 const styles = StyleSheet.create({
   listTitle: {
-    color: colors.black,
-    ...fonts.fontPrimary,
-  },
-  listSubTitle: {
     color: colors.greyDark,
     ...fonts.fontPrimary,
   },
@@ -168,7 +164,7 @@ class Profile extends Component {
     return (
       <ViewContainer>
         <ParallaxScroll
-          renderContent={() =>
+          renderContent={() => (
             <UserProfile
               type="user"
               initialUser={initialUser}
@@ -178,7 +174,8 @@ class Profile extends Component {
               user={!isPending ? user : {}}
               locale={locale}
               navigation={navigation}
-            />}
+            />
+          )}
           refreshControl={
             <RefreshControl
               refreshing={refreshing || isPending}
@@ -195,47 +192,51 @@ class Profile extends Component {
           navigateBack
           navigation={navigation}
         >
-          {isPending &&
+          {isPending && (
             <ActivityIndicator
               animating={isPending}
               style={{ height: Dimensions.get('window').height / 3 }}
               size="large"
-            />}
+            />
+          )}
 
           {!isPending &&
-            initialUser.login === user.login &&
-            <View>
-              {!!user.bio &&
-                user.bio !== '' &&
-                <SectionList title={translate('common.bio', locale)}>
-                  <ListItem
-                    subtitle={emojifyText(user.bio)}
-                    subtitleStyle={styles.listSubTitle}
-                    hideChevron
-                  />
-                </SectionList>}
+            initialUser.login === user.login && (
+              <View>
+                {!!user.bio &&
+                  user.bio !== '' && (
+                    <SectionList title={translate('common.bio', locale)}>
+                      <ListItem
+                        titleNumberOfLines={0}
+                        title={emojifyText(user.bio)}
+                        titleStyle={styles.listTitle}
+                        hideChevron
+                      />
+                    </SectionList>
+                  )}
 
-              <EntityInfo
-                entity={user}
-                orgs={orgs}
-                navigation={navigation}
-                locale={locale}
-              />
+                <EntityInfo
+                  entity={user}
+                  orgs={orgs}
+                  navigation={navigation}
+                  locale={locale}
+                />
 
-              <SectionList
-                title={translate('common.orgs', locale)}
-                noItems={orgs.length === 0}
-                noItemsMessage={translate('common.noOrgsMessage', locale)}
-              >
-                {orgs.map(item =>
-                  <UserListItem
-                    key={item.id}
-                    user={item}
-                    navigation={navigation}
-                  />
-                )}
-              </SectionList>
-            </View>}
+                <SectionList
+                  title={translate('common.orgs', locale)}
+                  noItems={orgs.length === 0}
+                  noItemsMessage={translate('common.noOrgsMessage', locale)}
+                >
+                  {orgs.map(item => (
+                    <UserListItem
+                      key={item.id}
+                      user={item}
+                      navigation={navigation}
+                    />
+                  ))}
+                </SectionList>
+              </View>
+            )}
         </ParallaxScroll>
 
         <ActionSheet