67 lines
1.9 KiB
TypeScript
67 lines
1.9 KiB
TypeScript
// Metro module 11486 (f11487).
|
|
import { View } from "react-native";
|
|
import { EMOJI_URL_BASE_SIZE } from "../../emojis/EmojiConstants";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../_bundle/Module712";
|
|
import FastImage from "../../../components_native/common/FastImage";
|
|
import AvatarUtils from "../../../utils/AvatarUtils";
|
|
import { Text } from "../../../design/components/Text/native/Text";
|
|
import { intl, t } from "../../../intl/index.native";
|
|
const useStyles = createStyles({
|
|
upsell: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
justifyContent: "space-between"
|
|
},
|
|
title: {
|
|
lineHeight: 16,
|
|
flex: 1
|
|
},
|
|
emojis: {
|
|
height: 28
|
|
},
|
|
emojiWrapper: {
|
|
position: "absolute",
|
|
width: 28,
|
|
height: 28,
|
|
padding: 2,
|
|
backgroundColor: Module712.colors.BACKGROUND_BASE_LOWEST,
|
|
borderWidth: 2,
|
|
borderRadius: 14,
|
|
borderColor: Module712.colors.BACKGROUND_SURFACE_HIGH,
|
|
alignItems: "center",
|
|
justifyContent: "center"
|
|
},
|
|
emoji: {
|
|
width: 16,
|
|
height: 16
|
|
}
|
|
});
|
|
export default function ChannelAutocompleteEmojiUpsell(props) {
|
|
const results = props.results;
|
|
const styles = useStyles();
|
|
const r18 = results.slice(0, 3);
|
|
const r9 = r18.map((item, index) => <View key={item.id} style={[styles.emojiWrapper, {
|
|
left: 24 * index
|
|
}]}>
|
|
<FastImage style={styles.emoji} source={{
|
|
uri: item.id != null ? AvatarUtils.getEmojiURL({
|
|
id: item.id,
|
|
animated: item.animated,
|
|
size: EMOJI_URL_BASE_SIZE
|
|
}) : item.url
|
|
}} />
|
|
</View>);
|
|
const r22 = 24 * r18.length;
|
|
return <View style={styles.upsell}>
|
|
<Text style={styles.title} accessibilityRole="header" variant="text-sm/medium">
|
|
{intl.format(t.uEky42, {
|
|
count: results.length
|
|
})}
|
|
</Text>
|
|
<View style={[styles.emojis, {
|
|
width: r22 + 16
|
|
}]}>{r9}</View>
|
|
</View>;
|
|
};
|