fix typo with axWidth to maxWidth

lens-protocol · Feb 27, 2023 · 79d4188 · 79d4188
1 parent 4d22aaf
commit 79d4188
Showing 1 changed file with 79 additions and 78 deletions.
diff --git a/src/components/ProfileListItem.tsx b/src/components/ProfileListItem.tsx
@@ -1,51 +1,51 @@
 import {
- TouchableHighlight, View, Image, Text, StyleSheet
-} from 'react-native'
-import { useContext } from 'react'
+ TouchableHighlight,
+ View,
+ Image,
+ Text,
+ StyleSheet,
+} from "react-native";
+import { useContext } from "react";
 import {
  ProfileListItemStyles,
  ExtendedProfile,
  ThemeColors,
- LensContextType
-} from '../types'
-import { LensContext } from '../context'
+ LensContextType,
+} from "../types";
+import { LensContext } from "../context";
 
 export function ProfileListItem({
  profile,
- onProfilePress = profile => console.log({ profile }),
- onFollowPress = profile => console.log({ profile }),
+ onProfilePress = (profile) => console.log({ profile }),
+ onFollowPress = (profile) => console.log({ profile }),
  isFollowing,
- styles = baseStyles
-} : {
- profile: ExtendedProfile,
- onProfilePress?: (profile: ExtendedProfile) => void,
- onFollowPress?: (profile: ExtendedProfile) => void,
- isFollowing?: boolean,
- styles?: ProfileListItemStyles
+ styles = baseStyles,
+}: {
+ profile: ExtendedProfile;
+ onProfilePress?: (profile: ExtendedProfile) => void;
+ onFollowPress?: (profile: ExtendedProfile) => void;
+ isFollowing?: boolean;
+ styles?: ProfileListItemStyles;
 }) {
- const { theme } = useContext<LensContextType>(LensContext)
+ const { theme } = useContext<LensContextType>(LensContext);
  if (theme) {
- if (theme === 'dark') {
- styles = darkThemeStyles
+ if (theme === "dark") {
+ styles = darkThemeStyles;
  }
  }
  function renderFollowButton(isFollowing: boolean = false) {
  if (isFollowing) {
  return (
  <View style={styles.followingButton}>
- <Text style={styles.followingButtonText}>
- Following
- </Text>
+ <Text style={styles.followingButtonText}>Following</Text>
  </View>
- )
+ );
  } else {
  return (
  <View style={styles.followButton}>
- <Text style={styles.followButtonText}>
- Follow
- </Text>
+ <Text style={styles.followButtonText}>Follow</Text>
  </View>
- )
+ );
  }
  }
 
@@ -59,171 +59,172 @@ export function ProfileListItem({
  <View style={styles.avatarContainer}>
  <Image
  source={{
- uri: profile?.picture?.__typename === 'MediaSet' && profile?.picture?.original?.url
- || "https://source.unsplash.com/random/200x200?sig=1"
+ uri:
+ (profile?.picture?.__typename === "MediaSet" &&
+ profile?.picture?.original?.url) ||
+ "https://source.unsplash.com/random/200x200?sig=1",
  }}
  style={styles.avatar}
  />
  </View>
  <View style={styles.infoContainer}>
- <Text style={styles.profileName}>{profile.name || profile.handle}</Text>
+ <Text style={styles.profileName}>
+ {profile.name || profile.handle}
+ </Text>
  <Text style={styles.profileHandle}>@{profile.handle}</Text>
- <Text style={styles.profileBio}>{profile.bio && profile.bio.substring(0, 150)}</Text>
-
+ <Text style={styles.profileBio}>
+ {profile.bio && profile.bio.substring(0, 150)}
+ </Text>
  </View>
  <View style={styles.followButtonContainer}>
  <TouchableHighlight
  underlayColor="transparent"
  onPress={() => onFollowPress(profile)}
  activeOpacity={0.6}
  >
- {
- renderFollowButton(isFollowing)
- }
+ {renderFollowButton(isFollowing)}
  </TouchableHighlight>
  </View>
  </View>
  </TouchableHighlight>
- )
+ );
 }
 
 const baseStyles = StyleSheet.create({
  container: {
- flexDirection: 'row',
+ flexDirection: "row",
  paddingLeft: 15,
  paddingVertical: 10,
  borderBottomWidth: 1,
- borderBottomColor: 'rgba(0, 0, 0, .06)'
+ borderBottomColor: "rgba(0, 0, 0, .06)",
  },
  avatarContainer: {
- padding: 5
+ padding: 5,
  },
  avatar: {
  width: 44,
  height: 44,
- borderRadius: 22
+ borderRadius: 22,
  },
  profileName: {
- fontWeight: '600',
+ fontWeight: "600",
  fontSize: 16,
  maxWidth: 200,
-
  },
  profileHandle: {
  marginTop: 3,
- axWidth: 200
+ maxWidth: 200,
  },
  profileBio: {
  maxWidth: 200,
  marginTop: 15,
- color: 'rgba(0, 0, 0, .5)'
+ color: "rgba(0, 0, 0, .5)",
  },
  infoContainer: {
- justifyContent: 'center',
+ justifyContent: "center",
  paddingLeft: 10,
  maxWidth: 200,
  },
  followButtonContainer: {
  flex: 1,
- alignItems: 'flex-end', 
- paddingRight: 20
+ alignItems: "flex-end",
+ paddingRight: 20,
  },
  followButton: {
  borderWidth: 1,
  borderRadius: 34,
  paddingHorizontal: 17,
- paddingVertical:7,
+ paddingVertical: 7,
  marginTop: 3,
- backgroundColor: 'black',
+ backgroundColor: "black",
  },
  followingButton: {
  borderWidth: 1,
  borderRadius: 34,
  paddingHorizontal: 17,
- paddingVertical:7,
+ paddingVertical: 7,
  marginTop: 3,
  },
  followButtonText: {
  fontSize: 12,
- fontWeight: '700',
- color: 'white'
+ fontWeight: "700",
+ color: "white",
  },
  followingButtonText: {
  fontSize: 12,
- fontWeight: '700',
- color: 'black'
- }
-})
+ fontWeight: "700",
+ color: "black",
+ },
+});
 
 const darkThemeStyles = StyleSheet.create({
  container: {
- flexDirection: 'row',
+ flexDirection: "row",
  paddingLeft: 15,
  paddingVertical: 12,
  backgroundColor: ThemeColors.black,
  borderBottomColor: ThemeColors.clearWhite,
- borderBottomWidth: 1
+ borderBottomWidth: 1,
  },
  avatarContainer: {
- padding: 5
+ padding: 5,
  },
  avatar: {
  width: 44,
  height: 44,
- borderRadius: 22
+ borderRadius: 22,
  },
  profileName: {
- fontWeight: '600',
+ fontWeight: "600",
  fontSize: 16,
  maxWidth: 200,
- color: ThemeColors.white
+ color: ThemeColors.white,
  },
  profileHandle: {
  marginTop: 3,
- axWidth: 200,
- color: ThemeColors.lightGray
+ maxWidth: 200,
+ color: ThemeColors.lightGray,
  },
  profileBio: {
  maxWidth: 200,
  marginTop: 15,
- color: ThemeColors.white
+ color: ThemeColors.white,
  },
  infoContainer: {
- justifyContent: 'center',
+ justifyContent: "center",
  paddingLeft: 10,
  maxWidth: 200,
  },
  followButtonContainer: {
  flex: 1,
- alignItems: 'flex-end', 
- paddingRight: 20
+ alignItems: "flex-end",
+ paddingRight: 20,
  },
  followButton: {
  borderWidth: 1,
  borderRadius: 34,
  paddingHorizontal: 17,
- paddingVertical:7,
+ paddingVertical: 7,
  marginTop: 3,
  backgroundColor: ThemeColors.white,
- color: ThemeColors.black
+ color: ThemeColors.black,
  },
  followingButton: {
  borderWidth: 1,
  borderRadius: 34,
  paddingHorizontal: 17,
- paddingVertical:7,
+ paddingVertical: 7,
  marginTop: 3,
- borderColor: ThemeColors.white
+ borderColor: ThemeColors.white,
  },
  followButtonText: {
  fontSize: 12,
- fontWeight: '700',
- color: ThemeColors.black
+ fontWeight: "700",
+ color: ThemeColors.black,
  },
  followingButtonText: {
  fontSize: 12,
- fontWeight: '700',
- color: ThemeColors.white
- }
-})
-
+ fontWeight: "700",
+ color: ThemeColors.white,
+ },
+});