63 lines
2.1 KiB
TypeScript
63 lines
2.1 KiB
TypeScript
// Metro module 9426 (f9427).
|
|
import { View } from "react-native";
|
|
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import EmojiUtils from "../../../../utils/EmojiUtils";
|
|
import AvatarUtils from "../../../../utils/AvatarUtils";
|
|
import Emoji2 from "../../../emojis/native/Emoji";
|
|
import { useSharedMessageEmojiStyles } from "./useSharedMessageEmojiStyles";
|
|
import chunk from "../../../../_bundle/chunk";
|
|
import { GappedList } from "../../../guild_role_subscriptions/native/components/LayoutUtils";
|
|
let useStyles;
|
|
const Emoji = function Emoji(props) {
|
|
const guildEmoji = props.guildEmoji;
|
|
const styles = useStyles();
|
|
return <Emoji2 key={guildEmoji.id} src={guildEmoji.id == null ? EmojiUtils.getURL(guildEmoji.name) : AvatarUtils.getEmojiURL({
|
|
id: guildEmoji.id,
|
|
animated: guildEmoji.animated,
|
|
size: 48
|
|
})} fastImageStyle={styles.gridEmojiFastImage} textEmojiStyle={styles.gridEmojiText} name={guildEmoji.name} />;
|
|
};
|
|
useStyles = createStyles({
|
|
gridEmojiFastImage: {
|
|
height: 40,
|
|
width: 40,
|
|
borderRadius: Module712.radii.sm
|
|
},
|
|
gridEmojiText: {
|
|
fontSize: 18,
|
|
lineHeight: 44
|
|
},
|
|
emojiGridRowContainer: {
|
|
marginTop: 16,
|
|
flexDirection: "row"
|
|
},
|
|
emojiGridContainer: {
|
|
marginTop: 8,
|
|
alignItems: "center"
|
|
}
|
|
});
|
|
export function EmojiGrid(props) {
|
|
const { expressionSourceGuild, doNotDisplayEmojiIds = [] } = props;
|
|
let c17211_0 = doNotDisplayEmojiIds;
|
|
const { numberToShow = 10, maxPerRow = 5 } = props;
|
|
const r10 = {
|
|
...useSharedMessageEmojiStyles(),
|
|
...useStyles()
|
|
};
|
|
let c17211_1 = r10;
|
|
let r24 = expressionSourceGuild?.emojis;
|
|
if (r24 == null) {
|
|
r24 = [];
|
|
}
|
|
return <View style={r10.emojiGridContainer}>
|
|
<GappedList gap={8}>
|
|
{chunk(r24.slice(0, numberToShow + 1).filter((item) => !c17211_0.includes(item.id)).slice(0, numberToShow), maxPerRow).map((a0, index) => <View key={index} style={c17211_1.emojiGridRowContainer}>
|
|
<GappedList gap={32}>
|
|
{a0.map((item) => <Emoji key={item.id} guildEmoji={item} />)}
|
|
</GappedList>
|
|
</View>)}
|
|
</GappedList>
|
|
</View>;
|
|
}
|