251 lines
8.9 KiB
TypeScript
251 lines
8.9 KiB
TypeScript
// Metro module 8647 (f8648).
|
|
import { useState, useRef, useEffect, useMemo, useCallback } from "react";
|
|
import { View } from "react-native";
|
|
import GuildMembershipStore from "../../../../stores/GuildMembershipStore";
|
|
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import { ThirdPartyGameApplicationWebsiteCategory } from "../../../../_bundle/Module8490";
|
|
import { findCodedLink } from "../../../coded_links/findCodedLinks";
|
|
import { CodedLinkType } from "../../../coded_links/CodedLink";
|
|
import resolveInvite from "../../../instant_invite/resolveInvite";
|
|
import { useStateFromStores } from "../../../../_bundle/Module589";
|
|
import { GameProfileTrackActionActions } from "../../GameProfileAnalyticUtils";
|
|
import { transitionToGuild } from "../../../routing/transitionToGuild.native";
|
|
import { showInvite } from "../../../../actions/native/DisplayedInviteActionCreators";
|
|
import { fromInviteGuild } from "../../../../utils/GuildRecordUtils";
|
|
import { Text } from "../../../../design/components/Text/native/Text";
|
|
import { intl, t } from "../../../../intl/index.native";
|
|
import FastImage from "../../../../components_native/common/FastImage";
|
|
import AvatarUtils from "../../../../utils/AvatarUtils";
|
|
import GuildIcon, { GuildIconSizes } from "../../../guild/native/GuildIcon";
|
|
import GuildBadgeV2 from "../../../guild/native/GuildBadgeV2";
|
|
import { Icon } from "../../../../design/void/native";
|
|
import { Button } from "../../../../design/components/Button/native/Button.native";
|
|
const useStyles = createStyles({
|
|
container: {
|
|
gap: Module712.space.PX_8
|
|
},
|
|
headerText: {
|
|
paddingHorizontal: Module712.space.PX_8
|
|
},
|
|
card: {
|
|
borderRadius: Module712.radii.lg,
|
|
borderWidth: 1,
|
|
borderColor: Module712.colors.BORDER_SUBTLE,
|
|
overflow: "hidden",
|
|
backgroundColor: Module712.colors.BACKGROUND_BASE_LOW
|
|
},
|
|
guildBanner: {
|
|
height: 112,
|
|
width: "100%",
|
|
resizeMode: "cover"
|
|
},
|
|
guildContent: {
|
|
flexDirection: "column",
|
|
padding: Module712.space.PX_16,
|
|
gap: Module712.space.PX_16
|
|
},
|
|
guildIcon: {
|
|
width: 56,
|
|
height: 56,
|
|
borderRadius: Module712.radii.md,
|
|
overflow: "hidden",
|
|
borderWidth: Module712.space.PX_4,
|
|
borderColor: Module712.colors.BACKGROUND_BASE_LOW,
|
|
marginLeft: -Module712.space.PX_4
|
|
},
|
|
guildIconWithBanner: {
|
|
marginTop: -Module712.space.PX_48
|
|
},
|
|
guildIconImage: {
|
|
width: "100%",
|
|
height: "100%",
|
|
borderRadius: Module712.radii.none
|
|
},
|
|
guildInfo: {
|
|
flex: 1,
|
|
gap: Module712.space.PX_16
|
|
},
|
|
guildNameDescriptionContainer: {
|
|
gap: Module712.space.PX_4
|
|
},
|
|
guildNameRow: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
gap: Module712.space.PX_4
|
|
},
|
|
memberCountsContainer: {
|
|
flexDirection: "row",
|
|
gap: Module712.space.PX_16
|
|
},
|
|
memberCountContainer: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
gap: Module712.space.PX_4
|
|
},
|
|
onlineEllipse: {
|
|
width: 8,
|
|
height: 8,
|
|
borderRadius: Module712.radii.round,
|
|
backgroundColor: Module712.colors.STATUS_POSITIVE
|
|
},
|
|
membersEllipse: {
|
|
width: 8,
|
|
height: 8,
|
|
borderRadius: Module712.radii.round,
|
|
backgroundColor: Module712.colors.TEXT_DEFAULT
|
|
}
|
|
});
|
|
export default function GameProfileCommunityServer(props) {
|
|
let memo, stateFromStores;
|
|
const { game, trackAction, onInviteResolved, closeModal } = props;
|
|
memo = void 0;
|
|
stateFromStores = void 0;
|
|
const styles = useStyles();
|
|
const [state, setState] = useState(null);
|
|
const ref = useRef(onInviteResolved);
|
|
useEffect(() => {
|
|
ref.current = onInviteResolved;
|
|
}, [onInviteResolved]);
|
|
memo = useMemo(() => {
|
|
const r2 = game == null;
|
|
let r7 = void 0;
|
|
if (!r2) {
|
|
const websites = game.websites;
|
|
r7 = websites == null ? void 0 : websites.find((website) => website.category === ThirdPartyGameApplicationWebsiteCategory.DISCORD);
|
|
}
|
|
return r7;
|
|
}, [game?.websites]);
|
|
useEffect(() => {
|
|
let _resolve2 = function _resolve() {
|
|
const r9 = async () => {
|
|
let c31471_2 = 0;
|
|
let c31978_0, c31978_1, c31978_2;
|
|
L20: {
|
|
L19: {
|
|
try {
|
|
c31978_0 = void 0;
|
|
c31978_1 = void 0;
|
|
c31978_2 = void 0;
|
|
if (memo == null) {
|
|
break L20;
|
|
}
|
|
const r35 = findCodedLink(memo.url);
|
|
if (r35 == null) {
|
|
break L20;
|
|
}
|
|
if (r35.type === CodedLinkType.INVITE) {
|
|
c31471_2 = 1;
|
|
c31978_0 = await resolveInvite(r35.code, "game_profile");
|
|
c31978_1 = c31978_0.invite;
|
|
c31978_2 = c31978_0.banned;
|
|
if (c31978_1 != null && c31978_2 !== true) {
|
|
(0, setState)(c31978_1);
|
|
const current = ref.current;
|
|
if (current != null) {
|
|
current.call(ref, c31978_1);
|
|
}
|
|
}
|
|
c31471_2 = 0;
|
|
break L19;
|
|
}
|
|
break L20;
|
|
} catch ($e) {
|
|
let r28 = $e;
|
|
if (c31471_2 !== 0) {
|
|
while (true) {
|
|
try {
|
|
c31471_2 = 0;
|
|
break L19;
|
|
} catch ($e) {
|
|
r28 = $e;
|
|
if (c31471_2 === 0) {
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
throw r28;
|
|
}
|
|
}
|
|
return void 0;
|
|
}
|
|
};
|
|
_resolve2 = r9;
|
|
return r9.apply(this, arguments);
|
|
};
|
|
if (memo != null) {
|
|
(function resolve() {
|
|
return _resolve2.apply(this, arguments);
|
|
})();
|
|
}
|
|
}, [memo]);
|
|
stateFromStores = useStateFromStores([GuildMembershipStore], () => (state == null ? void 0 : state.guild?.id) != null && GuildMembershipStore.isMember(state.guild.id));
|
|
const callback = useCallback(() => {
|
|
L7: {
|
|
if (state != null) {
|
|
trackAction(GameProfileTrackActionActions.JoinServer);
|
|
closeModal();
|
|
if (stateFromStores) {
|
|
if (state.guild?.id != null) {
|
|
transitionToGuild(state.guild.id);
|
|
break L7;
|
|
}
|
|
}
|
|
showInvite(state.code);
|
|
}
|
|
}
|
|
}, [state, stateFromStores, trackAction, closeModal]);
|
|
if (state != null && state.guild != null) {
|
|
const guild = fromInviteGuild(state.guild);
|
|
let approximate_member_count = state.approximate_member_count;
|
|
if (approximate_member_count == null) {
|
|
approximate_member_count = state.guild.approximate_member_count;
|
|
}
|
|
let approximate_presence_count = state.approximate_presence_count;
|
|
if (approximate_presence_count == null) {
|
|
approximate_presence_count = state.guild.approximate_presence_count;
|
|
}
|
|
const r88 = [<Text variant="heading-sm/semibold" color="mobile-text-heading-primary" style={styles.headerText}>
|
|
{intl.string(t["U2N+ci"])}
|
|
</Text>, ,];
|
|
const r100 = [guild.banner != null && <FastImage source={AvatarUtils.getGuildBannerSource(guild)} style={styles.guildBanner} />, ,];
|
|
r100[1] = <View style={styles.guildContent}>
|
|
<View style={[styles.guildIcon, guild.banner != null ? styles.guildIconWithBanner : null]}>
|
|
<GuildIcon guild={guild} size={GuildIconSizes.LARGE} style={styles.guildIconImage} />
|
|
</View>
|
|
<View style={styles.guildInfo}>
|
|
<View style={styles.guildNameDescriptionContainer}>
|
|
<View style={styles.guildNameRow}>
|
|
<Text variant="text-md/semibold" color="mobile-text-heading-primary" lineClamp={1}>{guild.name}</Text>
|
|
<GuildBadgeV2 guild={guild} size={Icon.Sizes.REFRESH_SMALL_16} />
|
|
</View>
|
|
<Text variant="text-sm/medium" color="text-default" lineClamp={3}>{guild.description}</Text>
|
|
</View>
|
|
<View style={styles.memberCountsContainer}>
|
|
{approximate_presence_count != null ? <View style={styles.memberCountContainer}>
|
|
<View style={styles.onlineEllipse} />
|
|
<Text variant="text-xs/normal" color="text-default">
|
|
{intl.formatToPlainString(t["LC+S+m"], {
|
|
membersOnline: approximate_presence_count
|
|
})}
|
|
</Text>
|
|
</View> : null}
|
|
{approximate_member_count != null ? <View style={styles.memberCountContainer}>
|
|
<View style={styles.membersEllipse} />
|
|
<Text variant="text-xs/normal" color="text-default">
|
|
{intl.formatToPlainString(t.zRl6XR, {
|
|
count: approximate_member_count
|
|
})}
|
|
</Text>
|
|
</View> : null}
|
|
</View>
|
|
</View>
|
|
<Button variant="secondary" size="md" text={stateFromStores ? intl.string(t.cEnaWx) : intl.string(t.XpeFYr)} onPress={callback} />
|
|
</View>;
|
|
r88[1] = <View style={styles.card}>{r100}</View>;
|
|
return <View style={styles.container}>{r88}</View>;
|
|
}
|
|
return null;
|
|
};
|