make Carlton whole again and fix picker picture in search (#23622)

Author: songgao

shared/chat/conversation/messages/react-button/emoji-picker/index.tsx

@@ -342,21 +342,25 @@ class EmojiPicker extends React.PureComponent<Props, State> {
       // so I'm not adding a ScrollView here. If we increase that later check
       // if this can sometimes overflow the screen here & add a ScrollView
       return (
-        <Kb.Box2 direction="vertical" fullWidth={true} style={Styles.globalStyles.flexGrow}>
-          <Kb.Box2 direction="horizontal" fullWidth={true} centerChildren={true} alignItems="flex-start">
-            <Kb.Box2
-              direction="horizontal"
-              fullWidth={true}
-              style={Styles.collapseStyles([styles.emojiRowContainer, styles.flexWrap])}
-            >
-              {this.getSectionHeader('Search results')}
-              {results.map(e => this.getEmojiSingle(e, this.props.skinTone))}
-              {[...Array(emojisPerLine - (results.length % emojisPerLine))].map((_, index) =>
-                makeEmojiPlaceholder(index)
-              )}
-            </Kb.Box2>
+        <Kb.Box2
+          direction="horizontal"
+          fullWidth={true}
+          centerChildren={true}
+          alignItems="flex-start"
+          style={Styles.globalStyles.flexGrow}
+        >
+          <Kb.Box2
+            direction="horizontal"
+            fullWidth={true}
+            style={Styles.collapseStyles([styles.emojiRowContainer, styles.flexWrap])}
+          >
+            {this.getSectionHeader('Search results')}
+            {results.map(e => this.getEmojiSingle(e, this.props.skinTone))}
+            {[...Array(emojisPerLine - (results.length % emojisPerLine))].map((_, index) =>
+              makeEmojiPlaceholder(index)
+            )}
+            {this.makeNotFound()}
           </Kb.Box2>
-          {this.makeNotFound()}
         </Kb.Box2>
       )
     }

shared/common-adapters/custom-emoji.native.tsx

@@ -15,7 +15,7 @@ const CustomEmoji = (props: Props) => {
       direction="vertical"
       style={Styles.collapseStyles([dimensions, styles.container, !!props.addTopMargin && styles.topMargin])}
     >
-      <FastImage source={{uri: src}} style={dimensions} />
+      <FastImage source={{uri: src}} style={dimensions} resizeMode={FastImage.resizeMode.contain} />
     </Box2>
   )
 }

shared/common-adapters/native-image.native.tsx

@@ -22,6 +22,7 @@ class FastImageImpl extends React.Component<
   ImageProps & {showLoadingStateUntilLoaded?: boolean},
   FastImageImplState
 > {
+  static resizeMode = RNFI.resizeMode
   static getSize = Image.getSize
   state = {
     loading: true,