167 lines
6.8 KiB
TypeScript
167 lines
6.8 KiB
TypeScript
// Metro module 15435 (f15436).
|
|
import { useEffect, useCallback } from "react";
|
|
import { Image as Image2, View } from "react-native";
|
|
import ChannelStore from "../../../stores/ChannelStore";
|
|
import GuildChannelStore from "../../../stores/GuildChannelStore";
|
|
import MessageStore from "../../../stores/MessageStore";
|
|
import PermissionStore from "../../../stores/PermissionStore";
|
|
import { Permissions, Routes } from "../../../Constants";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../_bundle/Module712";
|
|
import { useStateFromStores } from "../../../_bundle/Module589";
|
|
import { useForumPostMediaProperties, useFirstMediaIsEmbed, getEmbedColor } from "../../forums/ForumPostMediaUtils";
|
|
import { useSharedMediaProps, ForumPostMediaThumbnail } from "../../forums/native/posts/ForumPostMedia";
|
|
import useFirstMessageOrEmbedContent from "../useFirstMessageOrEmbedContent";
|
|
import MessageActionCreators from "../../../actions/MessageActionCreators";
|
|
import { selectHomeResourceChannel } from "../GuildOnboardingHomeActionCreators";
|
|
import AvatarUtils from "../../../utils/AvatarUtils";
|
|
import { PressableOpacity } from "../../../design/void/Pressables/native/Pressables";
|
|
import { Text } from "../../../design/components/Text/native/Text";
|
|
import MarkupUtils from "../../markup/MarkupUtils";
|
|
import useResourceChannels from "../useResourceChannels";
|
|
import { transitionTo } from "../../routing/router_utils";
|
|
import { intl, t } from "../../../intl/index.native";
|
|
import Module15437 from "../../../_bundle/Module15437";
|
|
import { Button } from "../../../design/components/Button/native/Button.native";
|
|
let useStyles;
|
|
const ResourceChannelRow = function ResourceChannelRow(props) {
|
|
let c21992_2;
|
|
const { channelId, title, icon, description } = props;
|
|
c21992_2 = void 0;
|
|
const styles = useStyles();
|
|
const stateFromStores = useStateFromStores([ChannelStore], () => ChannelStore.getChannel(channelId));
|
|
const stateFromStores2 = useStateFromStores([PermissionStore], () => PermissionStore.can(Permissions.VIEW_CHANNEL, stateFromStores));
|
|
const stateFromStores3 = useStateFromStores([MessageStore], () => MessageStore.getMessages(channelId));
|
|
const r52 = stateFromStores3.first();
|
|
const forumPostMediaProperties = useForumPostMediaProperties(r52, false);
|
|
const firstMediaIsEmbed = useFirstMediaIsEmbed(r52, false);
|
|
const media = forumPostMediaProperties?.length > 0 ? forumPostMediaProperties[0] : null;
|
|
let shouldObscure = useSharedMediaProps({
|
|
channel: stateFromStores,
|
|
media
|
|
}).shouldObscure;
|
|
const firstMessageOrEmbedContent = useFirstMessageOrEmbedContent(r52);
|
|
const r69 = stateFromStores != null && stateFromStores3.first() == null && !stateFromStores3.loadingMore && !stateFromStores3.ready && !stateFromStores3.hasFetched;
|
|
c21992_2 = r69;
|
|
useEffect(() => {
|
|
if (c21992_2) {
|
|
MessageActionCreators.fetchMessages({
|
|
channelId,
|
|
after: channelId,
|
|
limit: 5
|
|
});
|
|
}
|
|
}, [channelId, r69]);
|
|
const callback = useCallback(() => {
|
|
if (stateFromStores != null) {
|
|
selectHomeResourceChannel(stateFromStores.guild_id, stateFromStores.id);
|
|
}
|
|
}, [stateFromStores]);
|
|
if (stateFromStores != null && stateFromStores2) {
|
|
const resourceChannelIconURL = AvatarUtils.getResourceChannelIconURL({
|
|
channelId: stateFromStores.id,
|
|
icon
|
|
});
|
|
const r90 = description == null || description.length === 0;
|
|
const r128 = [<View style={styles.textContent}>
|
|
<Text variant="heading-md/extrabold" color="mobile-text-heading-primary">{title}</Text>
|
|
{r90 && firstMessageOrEmbedContent != null && <Text variant="text-sm/normal" color="text-default" style={styles.messageContent} lineClamp={3} ellipsizeMode="tail">
|
|
{MarkupUtils.parse(firstMessageOrEmbedContent, true, {
|
|
guildId: stateFromStores.guild_id,
|
|
channelId: stateFromStores.id
|
|
})}
|
|
</Text>}
|
|
{r90 ? !r90 : <Text variant="text-sm/normal" color="text-default" style={styles.messageContent} lineClamp={3} ellipsizeMode="tail">
|
|
{MarkupUtils.parse(description, true, {
|
|
guildId: stateFromStores.guild_id,
|
|
channelId: stateFromStores.id
|
|
})}
|
|
</Text>}
|
|
</View>, icon != null ? resourceChannelIconURL != null ? <Image2 source={{
|
|
uri: resourceChannelIconURL
|
|
}} style={styles.icon} /> : null : null, ,];
|
|
const r136 = resourceChannelIconURL != null;
|
|
let r137 = null;
|
|
if (!r136) {
|
|
const r138 = r52 == null;
|
|
r137 = null;
|
|
if (!r138) {
|
|
const blocked = r52?.blocked;
|
|
r137 = null;
|
|
if (!blocked) {
|
|
const r141 = media == null;
|
|
r137 = null;
|
|
if (!r141) {
|
|
if (shouldObscure == null) {
|
|
shouldObscure = false;
|
|
}
|
|
r137 = <ForumPostMediaThumbnail channel={stateFromStores} media={media} isEmbed={firstMediaIsEmbed} embedLeftBorderColor={getEmbedColor(r52, shouldObscure)} firstMessageId={r52?.id} containerStyle={styles.thumbnail} />;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
r128[2] = r137;
|
|
return <PressableOpacity onPress={callback} style={styles.channelContainer}>{r128}</PressableOpacity>;
|
|
}
|
|
return null;
|
|
};
|
|
useStyles = createStyles({
|
|
container: {
|
|
paddingHorizontal: 12,
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
alignItems: "center"
|
|
},
|
|
emptyStateContainer: {
|
|
padding: 20,
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
alignItems: "center"
|
|
},
|
|
channelContainer: {
|
|
backgroundColor: Module712.colors.BACKGROUND_BASE_LOW,
|
|
marginBottom: 8,
|
|
padding: 12,
|
|
borderRadius: Module712.radii.sm,
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
alignItems: "flex-start"
|
|
},
|
|
messageContent: {
|
|
marginTop: 8
|
|
},
|
|
textContent: {
|
|
flex: 1
|
|
},
|
|
thumbnail: {
|
|
marginLeft: 8
|
|
},
|
|
emptyStateImage: {
|
|
marginTop: 12,
|
|
marginBottom: 20
|
|
},
|
|
icon: {
|
|
width: 72,
|
|
height: 72
|
|
}
|
|
});
|
|
export default function GuildHomeResources(props) {
|
|
const guildId = props.guildId;
|
|
const styles = useStyles();
|
|
const resourceChannels = useResourceChannels(guildId);
|
|
return resourceChannels.length === 0 ? <View style={styles.emptyStateContainer}>
|
|
<Text variant="heading-xl/bold" color="mobile-text-heading-primary">
|
|
{intl.string(t.owvC9U)}
|
|
</Text>
|
|
<Image2 style={styles.emptyStateImage} source={Module15437} />
|
|
<Button onPress={function onPress() {
|
|
const defaultChannel = GuildChannelStore.getDefaultChannel(guildId);
|
|
if (defaultChannel != null) {
|
|
transitionTo(Routes.CHANNEL(guildId, defaultChannel.id));
|
|
}
|
|
}} text={intl.string(t["3iCBUn"])} />
|
|
</View> : <View style={styles.container}>
|
|
{resourceChannels.map((resourceChannel) => <ResourceChannelRow key={`resource-${resourceChannel.channelId}`} channelId={resourceChannel.channelId} title={resourceChannel.title} icon={resourceChannel.icon} description={resourceChannel.description} />)}
|
|
</View>;
|
|
};
|