+22 -14

src/view/com/composer/Composer.tsx

reviewed

··· 657 657 ref={scrollViewRef} 658 658 layout={native(LinearTransition)} 659 659 onScroll={scrollHandler} 660 660 - contentContainerStyle={a.flex_grow} 661 660 style={a.flex_1} 662 661 keyboardShouldPersistTaps="always" 663 662 onContentSizeChange={onScrollViewContentSizeChange} ··· 796 795 ) 797 796 798 797 return ( 799 799 - <View 800 800 - style={[ 801 801 - a.mx_lg, 802 802 - !isActive && styles.inactivePost, 803 803 - isTextOnly && isNative && a.flex_grow, 804 804 - ]}> 805 805 - <View style={[a.flex_row, isNative && a.flex_1]}> 798 798 + <View style={[styles.post, !isActive && styles.inactivePost]}> 799 799 + <View 800 800 + style={[ 801 801 + styles.textInputLayout, 802 802 + isNative && styles.textInputLayoutMobile, 803 803 + ]}> 806 804 <UserAvatar 807 805 avatar={currentProfile?.avatar} 808 806 size={50} 809 807 type={currentProfile?.associated?.labeler ? 'labeler' : 'user'} 810 810 - style={[a.mt_xs]} 811 808 /> 812 809 <TextInput 813 810 ref={textInput} 814 814 - style={[a.pt_xs]} 815 811 richtext={richtext} 816 812 placeholder={selectTextInputPlaceholder} 817 813 autoFocus ··· 1081 1077 </Animated.View> 1082 1078 )} 1083 1079 </LayoutAnimationConfig> 1084 1084 - {embed.quote?.uri ? ( 1085 1085 - <View style={!video ? [a.mt_md] : []}> 1080 1080 + 1081 1081 + <View style={!video ? [a.mt_md] : []}> 1082 1082 + {embed.quote?.uri ? ( 1086 1083 <View style={[s.mt5, s.mb2, isWeb && s.mb10]}> 1087 1084 <View style={{pointerEvents: 'none'}}> 1088 1085 <LazyQuoteEmbed uri={embed.quote.uri} /> ··· 1091 1088 <QuoteX onRemove={() => dispatch({type: 'embed_remove_quote'})} /> 1092 1089 )} 1093 1090 </View> 1094 1094 - </View> 1095 1095 - ) : null} 1091 1091 + ) : null} 1092 1092 + </View> 1096 1093 </> 1097 1094 ) 1098 1095 } ··· 1472 1469 marginLeft: 12, 1473 1470 }, 1474 1471 stickyFooterWeb: { 1472 1472 + // @ts-ignore web-only 1475 1473 position: 'sticky', 1476 1474 bottom: 0, 1477 1475 }, ··· 1505 1503 justifyContent: 'center', 1506 1504 marginRight: 5, 1507 1505 }, 1506 1506 + post: { 1507 1507 + marginHorizontal: 16, 1508 1508 + }, 1508 1509 inactivePost: { 1509 1510 opacity: 0.5, 1511 1511 + }, 1512 1512 + textInputLayout: { 1513 1513 + flexDirection: 'row', 1514 1514 + paddingTop: 4, 1515 1515 + }, 1516 1516 + textInputLayoutMobile: { 1517 1517 + flex: 1, 1510 1518 }, 1511 1519 addExtLinkBtn: { 1512 1520 borderWidth: 1,

+2 -4

src/view/com/composer/text-input/TextInput.tsx

reviewed

··· 249 249 multiline 250 250 scrollEnabled={false} 251 251 numberOfLines={2} 252 252 - {...props} 253 252 style={[ 254 253 inputTextStyle, 255 254 a.w_full, 256 256 - !autocompletePrefix && a.h_full, 257 255 { 258 256 textAlignVertical: 'top', 259 257 minHeight: 60, ··· 263 261 borderWidth: 1, 264 262 borderColor: 'transparent', 265 263 }, 266 266 - props.style, 267 267 - ]}> 264 264 + ]} 265 265 + {...props}> 268 266 {textDecorated} 269 267 </PasteInput> 270 268 <Autocomplete

+1 -1

src/view/com/composer/text-input/mobile/Autocomplete.tsx

reviewed

··· 49 49 a.px_sm, 50 50 a.py_md, 51 51 ]} 52 52 - key={item.did}> 52 52 + key={item.handle}> 53 53 <PressableScale 54 54 testID="autocompleteButton" 55 55 style={[

+3 -22

src/view/com/util/UserAvatar.tsx

reviewed

··· 1 1 import React, {memo, useMemo} from 'react' 2 2 - import { 3 3 - Image, 4 4 - Pressable, 5 5 - StyleProp, 6 6 - StyleSheet, 7 7 - View, 8 8 - ViewStyle, 9 9 - } from 'react-native' 2 2 + import {Image, Pressable, StyleSheet, View} from 'react-native' 10 3 import {Image as RNImage} from 'react-native-image-crop-picker' 11 4 import Svg, {Circle, Path, Rect} from 'react-native-svg' 12 5 import {ModerationUI} from '@atproto/api' ··· 55 48 moderation?: ModerationUI 56 49 usePlainRNImage?: boolean 57 50 onLoad?: () => void 58 58 - style?: StyleProp<ViewStyle> 59 51 } 60 52 61 53 interface EditableUserAvatarProps extends BaseUserAvatarProps { ··· 189 181 moderation, 190 182 usePlainRNImage = false, 191 183 onLoad, 192 192 - style, 193 184 }: UserAvatarProps): React.ReactNode => { 194 185 const pal = usePalette('default') 195 186 const backgroundColor = pal.colors.backgroundLight ··· 227 218 ) 228 219 }, [moderation?.alert, size, pal]) 229 220 230 230 - const containerStyle = useMemo(() => { 231 231 - return [ 232 232 - { 233 233 - width: size, 234 234 - height: size, 235 235 - }, 236 236 - style, 237 237 - ] 238 238 - }, [size, style]) 239 239 - 240 221 return avatar && 241 222 !((moderation?.blur && isAndroid) /* android crashes with blur */) ? ( 242 242 - <View style={containerStyle}> 223 223 + <View style={{width: size, height: size}}> 243 224 {usePlainRNImage ? ( 244 225 <Image 245 226 accessibilityIgnoresInvertColors ··· 268 249 {alert} 269 250 </View> 270 251 ) : ( 271 271 - <View style={containerStyle}> 252 252 + <View style={{width: size, height: size}}> 272 253 <DefaultAvatar type={type} shape={finalShape} size={size} /> 273 254 {alert} 274 255 </View>