79 lines
2.5 KiB
TypeScript
79 lines
2.5 KiB
TypeScript
// Metro module 15112 (f15113).
|
||
import { useState, useCallback } from "react";
|
||
import { View } from "react-native";
|
||
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
||
import useDisplayNameStyles from "../../display_name_styles/hooks/useDisplayNameStyles";
|
||
import { useDisplayNameStylesFont } from "../../display_name_styles/native/useDisplayNameStylesFont";
|
||
import { Text } from "../../../design/components/Text/native/Text";
|
||
import UserUtils from "../../../utils/UserUtils";
|
||
import { intl, t } from "../../../intl/index.native";
|
||
import VoiceGuildTag from "../../guild_tag/native/VoiceGuildTag";
|
||
const useStyles = createStyles({
|
||
container: {
|
||
marginLeft: 8,
|
||
flex: 1,
|
||
flexDirection: "row"
|
||
},
|
||
tag: {
|
||
flexDirection: "row",
|
||
alignItems: "center",
|
||
paddingLeft: 8
|
||
},
|
||
measuringTag: {
|
||
opacity: 0
|
||
}
|
||
});
|
||
export default function VoiceUserNameItem(props) {
|
||
const { member, user, guildId } = props;
|
||
let isGuest = props.isGuest;
|
||
const { color, variant } = props;
|
||
const styles = useStyles();
|
||
const displayNameStylesFont = useDisplayNameStylesFont({
|
||
displayNameStyles: useDisplayNameStyles({
|
||
userId: user.id,
|
||
guildId
|
||
})
|
||
});
|
||
const [state, setState] = useState(0);
|
||
const [state2, setState2] = useState(0);
|
||
let [state3, setState3] = useState(true);
|
||
const [state4, setState4] = useState(0);
|
||
const callback2 = useCallback((a0) => {
|
||
setState(a0.nativeEvent.layout.width);
|
||
}, []);
|
||
const callback = useCallback((a0) => {
|
||
setState2(a0.nativeEvent.layout.width);
|
||
}, []);
|
||
const callback3 = useCallback((a0) => {
|
||
setState4(a0.nativeEvent.layout.width);
|
||
setState3(false);
|
||
}, []);
|
||
const style = [styles.container, state3 ? styles.measuringTag : state3];
|
||
const style2 = displayNameStylesFont != null && {
|
||
fontFamily: displayNameStylesFont
|
||
};
|
||
let r77 = member?.nick;
|
||
if (r77 == null) {
|
||
r77 = UserUtils.getName(user);
|
||
}
|
||
const r81 = [r77, ,];
|
||
if (isGuest) {
|
||
isGuest = <Text variant="text-sm/normal" lineClamp={1} color="status-positive">
|
||
{" "}
|
||
{intl.string(t["pFO/Ph"])}
|
||
</Text>;
|
||
}
|
||
r81[1] = isGuest;
|
||
const r96 = [<Text variant={variant} color={color} lineClamp={1} onLayout={callback} style={style2}>{r81}</Text>, ,];
|
||
if (!state3) {
|
||
state3 = state !== 0 && state2 !== 0 && state4 !== 0 && state >= state2 + state4;
|
||
}
|
||
if (state3) {
|
||
state3 = <View onLayout={callback3} style={styles.tag}>
|
||
<VoiceGuildTag userId={user.id} />
|
||
</View>;
|
||
}
|
||
r96[1] = state3;
|
||
return <View onLayout={callback2} style={style}>{r96}</View>;
|
||
};
|