165 lines
6.5 KiB
TypeScript
165 lines
6.5 KiB
TypeScript
// Metro module 13931 (f13932).
|
|
import { memo } from "react";
|
|
import { View } from "react-native";
|
|
import UserStore from "../../../stores/UserStore";
|
|
import FamilyCenterStore from "../FamilyCenterStore";
|
|
import { ACTION_TO_TEXT } from "../FamilyCenterConstants";
|
|
import { GuildFeatures } from "../../../Constants";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../_bundle/Module712";
|
|
import { AVATAR_SIZE_MAP, AvatarSizes, Avatar } from "../../../design/void/native";
|
|
import Module38 from "../../../_bundle/Module38";
|
|
import { useStateFromStores } from "../../../_bundle/defaultAreStatesEqual";
|
|
import SnowflakeUtils from "../../../utils/SnowflakeUtils";
|
|
import { Text } from "../../../design/components/Text/native/Text";
|
|
import UserUtils from "../../../utils/UserUtils";
|
|
import { formatUserActivityTimestamp, isUserAction, isGuildAction, isPurchase, isGift } from "../FamilyCenterUtils";
|
|
import GuildIcon, { GuildIconSizes } from "../../guild/native/GuildIcon";
|
|
import GuildBadge from "../../guild/native/GuildBadge";
|
|
import { intl } from "../../../intl/index.native";
|
|
import FamilyCenter_messages from "../FamilyCenter.messages";
|
|
import FamilyCenterActivityPurchaseRow from "./FamilyCenterActivityPurchaseRow";
|
|
import { getGiftRowDisplayInfo } from "../FamilyCenterActivityGiftRowUtils";
|
|
import FamilyCenterActivityGiftRow from "./FamilyCenterActivityGiftRow";
|
|
let useStyles2, Component2;
|
|
const useStyles = createStyles({
|
|
container: {
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
borderBottomColor: Module712.colors.BORDER_SUBTLE,
|
|
borderBottomWidth: 1,
|
|
paddingVertical: 12
|
|
},
|
|
avatar: {
|
|
borderRadius: AVATAR_SIZE_MAP[AvatarSizes.NORMAL] / 2,
|
|
backgroundColor: Module712.colors.BACKGROUND_SURFACE_HIGH
|
|
},
|
|
avatarContainer: {
|
|
marginRight: 12,
|
|
alignItems: "flex-start"
|
|
},
|
|
textContainer: {
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
flexShrink: 1
|
|
},
|
|
text: {
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
flexShrink: 1
|
|
}
|
|
});
|
|
let Component = memo(({ action }) => {
|
|
const styles = useStyles();
|
|
const r12 = ACTION_TO_TEXT.get(action.display_type);
|
|
Module38(r12 != null, "No text for action type");
|
|
const stateFromStores = useStateFromStores([UserStore], () => UserStore.getUser(action.entity_id));
|
|
if (stateFromStores == null) {
|
|
return null;
|
|
}
|
|
const r17 = SnowflakeUtils.extractTimestamp(action.event_id);
|
|
return <View style={styles.container}>
|
|
<View style={styles.avatarContainer}>
|
|
<Avatar avatarStyle={styles.avatar} user={stateFromStores} guildId={void 0} disablePlaceholder avatarDecoration={stateFromStores.avatarDecoration} />
|
|
</View>
|
|
<View style={styles.textContainer}>
|
|
<Text style={styles.text} variant="text-md/semibold" color="interactive-text-active" ellipsizeMode="tail" lineClamp={1}>
|
|
{UserUtils.getName(stateFromStores)}
|
|
</Text>
|
|
<Text variant="text-xs/medium" color="channels-default">
|
|
{formatUserActivityTimestamp(new Date(r17).getTime(), r12.timestampFormatter)}
|
|
</Text>
|
|
</View>
|
|
</View>;
|
|
});
|
|
Component.displayName = "FamilyCenterActivityRowUser";
|
|
useStyles2 = createStyles({
|
|
container: {
|
|
display: "flex",
|
|
alignItems: "center",
|
|
flexDirection: "row",
|
|
borderBottomColor: Module712.colors.BORDER_SUBTLE,
|
|
borderBottomWidth: 1,
|
|
paddingVertical: 12
|
|
},
|
|
avatar: {
|
|
borderRadius: Module712.radii.md,
|
|
borderColor: Module712.colors.BACKGROUND_BASE_LOW,
|
|
height: 40,
|
|
width: 40,
|
|
margin: 0,
|
|
backgroundColor: Module712.colors.BACKGROUND_SURFACE_HIGHEST,
|
|
marginRight: 12
|
|
},
|
|
avatarText: {
|
|
color: Module712.colors.TEXT_DEFAULT
|
|
},
|
|
text: {
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
flexShrink: 1
|
|
},
|
|
headerContainer: {
|
|
display: "flex",
|
|
flexDirection: "row"
|
|
},
|
|
badge: {
|
|
marginRight: 4
|
|
},
|
|
header: {
|
|
paddingRight: 16
|
|
},
|
|
headerAndIconContainer: {
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
alignItems: "center"
|
|
}
|
|
});
|
|
Component2 = memo(({ action: action2 }) => {
|
|
const styles2 = useStyles2();
|
|
const stateFromStores = useStateFromStores([FamilyCenterStore], () => FamilyCenterStore.getGuild(action2.entity_id));
|
|
Module38(ACTION_TO_TEXT.get(action2.display_type) != null, "No text for action type");
|
|
if (stateFromStores === void 0) {
|
|
return null;
|
|
}
|
|
return <View style={styles2.container}>
|
|
<GuildIcon style={styles2.avatar} textStyle={styles2.avatarText} guild={stateFromStores} size={GuildIconSizes.NORMAL} animate />
|
|
<View style={styles2.text}>
|
|
<View style={styles2.headerContainer}>
|
|
<View style={styles2.headerAndIconContainer}>
|
|
{stateFromStores.features.has(GuildFeatures.VERIFIED) || stateFromStores.features.has(GuildFeatures.PARTNERED) ? <GuildBadge style={styles2.badge} guild={stateFromStores} size={GuildBadge.Sizes.SMALL} disableColor /> : null}
|
|
<Text style={styles2.header} variant="text-md/semibold" color="interactive-text-active" ellipsizeMode="tail" lineClamp={1}>{stateFromStores.name}</Text>
|
|
</View>
|
|
</View>
|
|
{stateFromStores.approximateMemberCount !== void 0 ? <Text variant="text-xs/medium" color="channels-default">
|
|
{intl.format(FamilyCenter_messages["5JmNgg"], {
|
|
members: stateFromStores.approximateMemberCount
|
|
})}
|
|
</Text> : null}
|
|
</View>
|
|
</View>;
|
|
});
|
|
Component2.displayName = "FamilyCenterActivityRowGuild";
|
|
export default function FamilyCenterActivityRow(props) {
|
|
const action3 = props.action;
|
|
if (!isUserAction(action3) && !isGuildAction(action3) && !isPurchase(action3) && !isGift(action3)) {
|
|
return null;
|
|
}
|
|
if (isPurchase(action3)) {
|
|
const purchaseInfo = FamilyCenterStore.getPurchaseInfo(action3.entity_id);
|
|
return purchaseInfo != null ? <FamilyCenterActivityPurchaseRow skuId={purchaseInfo.sku_id} subscriptionPlanId={purchaseInfo.subscription_plan_id} total={purchaseInfo.total} currency={purchaseInfo.currency} /> : null;
|
|
}
|
|
if (isGift(action3)) {
|
|
const giftInfo = FamilyCenterStore.getGiftInfo(action3.entity_id);
|
|
if (giftInfo == null) {
|
|
return null;
|
|
}
|
|
const giftRowDisplayInfo = getGiftRowDisplayInfo(giftInfo);
|
|
const { skuId, subscriptionPlanId, price } = giftRowDisplayInfo;
|
|
return <FamilyCenterActivityGiftRow skuId={skuId} subscriptionPlanId={subscriptionPlanId} price={price} gifterUserId={giftRowDisplayInfo.gifterUserId} claimed={giftRowDisplayInfo.claimed} offeredAt={giftRowDisplayInfo.offeredAt} claimedAt={giftRowDisplayInfo.claimedAt} />;
|
|
}
|
|
return <View>
|
|
{isUserAction(action3) ? <Component action={action3} /> : <Component2 action={action3} />}
|
|
</View>;
|
|
};
|