233 lines
9.6 KiB
TypeScript
233 lines
9.6 KiB
TypeScript
// Metro module 10398 (f10399).
|
|
import { useState } from "react";
|
|
import { ImageBackground, View } from "react-native";
|
|
import ChannelStore from "../../../../stores/ChannelStore";
|
|
import GuildChannelStore, { GUILD_SELECTABLE_CHANNELS_KEY } from "../../../../stores/GuildChannelStore";
|
|
import GuildStore from "../../../../stores/GuildStore";
|
|
import PermissionStore from "../../../../stores/PermissionStore";
|
|
import SortedGuildStore from "../../../../stores/SortedGuildStore";
|
|
import { AbortCodes, ChannelTypes, Permissions } from "../../../../Constants";
|
|
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import { useBottomSheetRef } from "../../../../design/components/Sheet/native/useBottomSheetRef";
|
|
import useTheme from "../../../../hooks/useTheme";
|
|
import { useStateFromStoresObject } from "../../../../_bundle/Module589";
|
|
import useChannelName from "../../../channel/useChannelName";
|
|
import useMountEffect from "../../../../hooks/useMountEffect";
|
|
import { isThemeDark } from "../../../../design/shared";
|
|
import Module10399 from "../../../../_bundle/Module10399";
|
|
import Module10400 from "../../../../_bundle/Module10400";
|
|
import { BottomSheet } from "../../../../design/components/Sheet/native/BottomSheet.native";
|
|
import { BottomSheetScrollView } from "../../../../_bundle/Module5245";
|
|
import GuildIcon, { GuildIconSizes } from "../../../guild/native/GuildIcon";
|
|
import { Icon } from "../../../../design/void/native";
|
|
import { getChannelIcon } from "../../../../utils/native/ChannelUtils";
|
|
import { Text } from "../../../../design/components/Text/native/Text";
|
|
import { intl, t } from "../../../../intl/index.native";
|
|
import { Stack } from "../../../../design/components/Stack/native/Stack.native";
|
|
import { TableRowGroup } from "../../../../design/components/TableRow/native/TableRowGroup.native";
|
|
import { TableRow } from "../../../../design/components/TableRow/native/TableRow.native";
|
|
import ActionSheetActionCreators from "../../../action_sheet/native/ActionSheetActionCreators";
|
|
import openChannelPicker from "../../../channel/native/openChannelPicker";
|
|
import { FormHint } from "../../../../design/void/Form/native/index";
|
|
import { ButtonGroup } from "../../../../design/components/ButtonGroup/native/ButtonGroup.native";
|
|
import { Button } from "../../../../design/components/Button/native/Button.native";
|
|
import ChannelFollowerActionCreators from "../../../../actions/ChannelFollowerActionCreators";
|
|
import { ActionSheetHeaderBar } from "../../../../design/components/Sheet/native/ActionSheetHeaderBar.native";
|
|
const useStyles = createStyles({
|
|
container: {
|
|
flex: 1,
|
|
flexDirection: "column",
|
|
alignItems: "stretch",
|
|
paddingHorizontal: 16,
|
|
paddingVertical: 24
|
|
},
|
|
header: {
|
|
flex: 1,
|
|
flexDirection: "row",
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
height: 96
|
|
},
|
|
headerGuildIcon: {
|
|
width: 40,
|
|
marginRight: 16
|
|
},
|
|
headerChannelContainer: {
|
|
borderRadius: Module712.radii.xs,
|
|
backgroundColor: Module712.colors.BACKGROUND_SURFACE_HIGH,
|
|
height: 32
|
|
},
|
|
headerChannel: {
|
|
flex: 1,
|
|
flexDirection: "row",
|
|
minWidth: 160,
|
|
paddingHorizontal: 8,
|
|
paddingVertical: 6,
|
|
borderRadius: Module712.radii.xs,
|
|
backgroundColor: Module712.colors.INTERACTIVE_BACKGROUND_SELECTED
|
|
},
|
|
headerChannelIcon: {
|
|
height: 20,
|
|
width: 20,
|
|
marginRight: 8,
|
|
opacity: 0.6
|
|
},
|
|
ctaHeader: {
|
|
flex: 1,
|
|
textAlign: "center",
|
|
marginBottom: 8
|
|
},
|
|
ctaSubhead: {
|
|
flex: 1,
|
|
textAlign: "center",
|
|
marginBottom: 8
|
|
},
|
|
channelIcon: {
|
|
height: 16,
|
|
width: 16,
|
|
opacity: 0.6
|
|
}
|
|
});
|
|
export default function NewChannelFollower(props) {
|
|
let targetChannel, c17931_10;
|
|
const { sourceGuildId, sourceChannelId, targetGuildId, targetChannelId, reopenActionSheetWithTarget, onCancel, onSuccess } = props;
|
|
targetChannel = void 0;
|
|
c17931_10 = void 0;
|
|
const styles = useStyles();
|
|
const [loading, setState] = useState(false);
|
|
const [state, setState2] = useState(null);
|
|
const bottomSheetRef2 = useBottomSheetRef();
|
|
const { bottomSheetRef, bottomSheetClose } = bottomSheetRef2;
|
|
const theme = useTheme();
|
|
const stateFromStoresObject = useStateFromStoresObject([GuildStore], () => ({
|
|
sourceGuild: GuildStore.getGuild(sourceGuildId),
|
|
targetGuild: GuildStore.getGuild(targetGuildId)
|
|
}));
|
|
const { sourceGuild, targetGuild } = stateFromStoresObject;
|
|
const stateFromStoresObject2 = useStateFromStoresObject([ChannelStore], () => ({
|
|
sourceChannel: ChannelStore.getChannel(sourceChannelId),
|
|
targetChannel: ChannelStore.getChannel(targetChannelId)
|
|
}));
|
|
const sourceChannel = stateFromStoresObject2.sourceChannel;
|
|
targetChannel = stateFromStoresObject2.targetChannel;
|
|
const channelName2 = useChannelName(sourceChannel);
|
|
const channelName = useChannelName(targetChannel);
|
|
const r73 = targetGuildId != null && targetChannelId != null;
|
|
c17931_10 = r73;
|
|
useMountEffect(() => {
|
|
if (c17931_10) {
|
|
const current = bottomSheetRef.current;
|
|
if (current != null) {
|
|
current.expandActionSheet();
|
|
}
|
|
}
|
|
});
|
|
const r127 = [<ImageBackground source={isThemeDark(theme) ? Module10399 : Module10400} style={styles.header}>
|
|
<View style={styles.header}>
|
|
<GuildIcon style={styles.headerGuildIcon} guild={sourceGuild} />
|
|
<View style={styles.headerChannelContainer}>
|
|
<View style={styles.headerChannel}>
|
|
<Icon size={Icon.Sizes.CUSTOM} source={sourceChannel != null ? getChannelIcon(sourceChannel) : null} style={styles.headerChannelIcon} />
|
|
<Text lineClamp={1} variant="text-sm/medium">{channelName2}</Text>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
</ImageBackground>, ,];
|
|
const r145 = [<Text style={styles.ctaHeader} variant="heading-lg/semibold" color="mobile-text-heading-primary">
|
|
{intl.string(t.mvPFbA)}
|
|
</Text>, <Text style={styles.ctaSubhead} variant="text-sm/medium" color="text-default">
|
|
{intl.string(t.kbpkxJ)}
|
|
</Text>, , , , ,];
|
|
const r202 = [<TableRowGroup title={intl.string(t.xFn72s)} hasIcons>
|
|
<TableRow label={targetGuild != null ? targetGuild.name : intl.string(t.XqMe3N)} icon={targetGuild != null ? <GuildIcon guild={targetGuild} size={GuildIconSizes.XSMALL} /> : null} arrow onPress={function onPress() {
|
|
const r19 = import("../../../../components_native/common/ItemSelectorActionSheet");
|
|
const r28 = {
|
|
title: intl.string(t.etZ9tX),
|
|
items: SortedGuildStore.getFlattenedGuildIds().reduce((acc, item) => {
|
|
const guild = GuildStore.getGuild(item);
|
|
if (guild != null && PermissionStore.can(Permissions.MANAGE_WEBHOOKS, guild)) {
|
|
acc.push({
|
|
label: guild.name,
|
|
value: guild.id
|
|
});
|
|
}
|
|
return acc;
|
|
}, new Array()),
|
|
selectedItem: null,
|
|
onItemSelect: null,
|
|
onClose: null,
|
|
hasIcons: false
|
|
};
|
|
let selectedItem = targetGuildId;
|
|
if (targetGuildId == null) {
|
|
selectedItem = void 0;
|
|
}
|
|
r28.selectedItem = selectedItem;
|
|
r28.onItemSelect = (a0) => {
|
|
reopenActionSheetWithTarget(a0, GuildChannelStore.getDefaultChannel(a0)?.id);
|
|
};
|
|
r28.onClose = () => {
|
|
reopenActionSheetWithTarget(targetGuildId, targetChannelId);
|
|
};
|
|
ActionSheetActionCreators.openLazy(r19, "NewChannelFollowerGuildPicker", r28);
|
|
}} />
|
|
</TableRowGroup>, ,];
|
|
const props2 = {
|
|
title: intl.string(t.PDn2fR),
|
|
hasIcons: true,
|
|
children: null
|
|
};
|
|
let label = channelName;
|
|
if (label == null) {
|
|
label = intl.string(t.XqMe3N);
|
|
}
|
|
props2.children = <TableRow label={label} disabled={targetGuildId == null} icon={targetChannel != null ? <Icon size={Icon.Sizes.CUSTOM} source={getChannelIcon(targetChannel)} style={styles.channelIcon} /> : null} arrow onPress={function onPress() {
|
|
if (targetGuildId != null) {
|
|
let selectedChannel = targetChannel;
|
|
if (targetChannel == null) {
|
|
selectedChannel = null;
|
|
}
|
|
openChannelPicker({
|
|
guildId: targetGuildId,
|
|
selectedChannel,
|
|
channelType: GUILD_SELECTABLE_CHANNELS_KEY,
|
|
filterFn: ({ channel }) => channel.type === ChannelTypes.GUILD_TEXT && PermissionStore.can(Permissions.MANAGE_WEBHOOKS, channel),
|
|
onSelect: (a0) => {
|
|
reopenActionSheetWithTarget(targetGuildId, a0.id);
|
|
},
|
|
onClose: () => {
|
|
reopenActionSheetWithTarget(targetGuildId, targetChannelId);
|
|
}
|
|
});
|
|
}
|
|
}} />;
|
|
r202[1] = <TableRowGroup {...props2} />;
|
|
r145[2] = <Stack spacing={16}>{r202}</Stack>;
|
|
r145[3] = <FormHint inset>
|
|
{intl.string(t.Z0quyN)}
|
|
</FormHint>;
|
|
r145[4] = state != null ? <FormHint inset>{state}</FormHint> : null;
|
|
r145[5] = <ButtonGroup>
|
|
<Button text={intl.string(t["3aOv+h"])} disabled={!r73} loading={loading} onPress={function onPress() {
|
|
if (targetChannelId != null) {
|
|
setState(true);
|
|
ChannelFollowerActionCreators.createChannelFollower(targetChannelId, sourceChannelId).then(onSuccess).catch((error) => {
|
|
setState(false);
|
|
if (error.body.code === AbortCodes.TOO_MANY_WEBHOOKS) {
|
|
setState2(intl.string(t["1eZ4aB"]));
|
|
} else {
|
|
setState2(intl.string(t.LgwhuN));
|
|
}
|
|
});
|
|
}
|
|
}} />
|
|
<Button text={intl.string(t["ETE/oC"])} variant="secondary" onPress={onCancel} />
|
|
</ButtonGroup>;
|
|
r127[1] = <View style={styles.container}>{r145}</View>;
|
|
return <BottomSheet handleDisabled startExpanded scrollable ref={bottomSheetRef}>
|
|
<BottomSheetScrollView>{r127}</BottomSheetScrollView>
|
|
<ActionSheetHeaderBar variant="floating" onPress={bottomSheetClose} />
|
|
</BottomSheet>;
|
|
};
|