116 lines
4.7 KiB
TypeScript
116 lines
4.7 KiB
TypeScript
// Metro module 5211 (f5212).
|
|
import { useCallback } from "react";
|
|
import { View } from "react-native";
|
|
import EmojiStore from "../../emojis/EmojiStore";
|
|
import GuildOnboardingPromptsStore from "../GuildOnboardingPromptsStore";
|
|
import { EMOJI_URL_BASE_SIZE } from "../../emojis/EmojiConstants";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import { useStateFromStores, useStateFromStoresArray } from "../../../_bundle/defaultAreStatesEqual";
|
|
import Emoji from "../../emojis/native/Emoji";
|
|
import AvatarUtils from "../../../utils/AvatarUtils";
|
|
import { TextBadge, BadgeColors, CardSection } from "../../../design/void/native";
|
|
import { intl, t } from "../../../intl/index.native";
|
|
import { Text } from "../../../design/components/Text/native/Text";
|
|
import FormCheckboxRow from "../../../design/void/Form/native/FormCheckboxRow";
|
|
import useSafeAreaInsets_native from "../../safe_area/useSafeAreaInsets.native";
|
|
import ActionSheetActionCreators from "../../action_sheet/native/ActionSheetActionCreators";
|
|
import { BottomSheetTitleHeader } from "../../../design/components/Sheet/native/BottomSheetTitleHeader.native";
|
|
import { BottomSheet } from "../../../design/components/Sheet/native/BottomSheet.native";
|
|
import { BottomSheetScrollView } from "../../../_bundle/Module5245";
|
|
import { Button } from "../../../design/components/Button/native/Button.native";
|
|
let useStyles;
|
|
const DropdownOptionRow = function DropdownOptionRow(props) {
|
|
let leading;
|
|
let c14759_2;
|
|
const { option, responses, onSelect, canBeNew: canBeNew2 } = props;
|
|
c14759_2 = void 0;
|
|
const styles = useStyles();
|
|
const stateFromStores = useStateFromStores([EmojiStore], () => option.emoji?.id != null ? EmojiStore.getUsableCustomEmojiById(option.emoji?.id) : null);
|
|
const selected = responses.includes(option.id);
|
|
c14759_2 = selected;
|
|
const callback = useCallback(() => {
|
|
onSelect(option, !c14759_2);
|
|
}, [onSelect, option, selected]);
|
|
const id = option.emoji?.id;
|
|
L13: {
|
|
if (id == null) {
|
|
const r40 = option.emoji?.name != null;
|
|
leading = null;
|
|
if (!r40) {
|
|
break L13;
|
|
}
|
|
}
|
|
const src = stateFromStores != null ? AvatarUtils.getEmojiURL({
|
|
id: stateFromStores.id,
|
|
animated: stateFromStores.animated,
|
|
size: EMOJI_URL_BASE_SIZE
|
|
}) : void 0;
|
|
let name = option.emoji?.name;
|
|
if (name == null) {
|
|
name = "";
|
|
}
|
|
leading = <View style={{
|
|
display: "flex",
|
|
alignItems: "center"
|
|
}}>
|
|
<Emoji textEmojiStyle={styles.optionTextEmoji} fastImageStyle={styles.optionImageEmoji} src={src} name={name} />
|
|
</View>;
|
|
}
|
|
const trailing = canBeNew2 ? option.isUnseen ? <TextBadge color={BadgeColors.BRAND} text={intl.string(t.y2b7CA)} textStyle={styles.newBadge} /> : null : null;
|
|
return <FormCheckboxRow label={<View style={styles.labelRow}>
|
|
<Text variant="text-md/normal">{option.title}</Text>
|
|
{trailing}
|
|
</View>} selected={selected} leading={leading} trailing={trailing} onPress={callback} />;
|
|
};
|
|
useStyles = createStyles({
|
|
optionTextEmoji: {
|
|
fontSize: 24,
|
|
lineHeight: 24,
|
|
paddingTop: 5
|
|
},
|
|
optionImageEmoji: {
|
|
height: 24,
|
|
width: 24
|
|
},
|
|
newBadge: {
|
|
fontWeight: "bold"
|
|
},
|
|
labelRow: {
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
justifyContent: "space-between",
|
|
alignItems: "center"
|
|
},
|
|
closeButtonWrapper: {
|
|
marginTop: 16,
|
|
marginHorizontal: 16
|
|
}
|
|
});
|
|
export default function DropdownOptionsActionSheet(props) {
|
|
let stateFromStoresArray;
|
|
const { guildId, promptId, canBeNew, onSelect: onSelect2 } = props;
|
|
stateFromStoresArray = void 0;
|
|
const styles = useStyles();
|
|
const bottom = useSafeAreaInsets_native().bottom;
|
|
const stateFromStores = useStateFromStores([GuildOnboardingPromptsStore], () => GuildOnboardingPromptsStore.getOnboardingPrompt(promptId));
|
|
stateFromStoresArray = useStateFromStoresArray([GuildOnboardingPromptsStore], () => GuildOnboardingPromptsStore.getOnboardingResponsesForPrompt(guildId, promptId));
|
|
const callback = useCallback(() => {
|
|
ActionSheetActionCreators.hideActionSheet();
|
|
}, []);
|
|
if (stateFromStores == null) {
|
|
return null;
|
|
}
|
|
return <BottomSheet scrollable header={<BottomSheetTitleHeader title={intl.string(t.E2ICbC)} />}>
|
|
<BottomSheetScrollView contentContainerStyle={{
|
|
paddingBottom: bottom
|
|
}}>
|
|
<CardSection accessibilityRole="radiogroup" accessibilityLabel={intl.string(t.E2ICbC)}>
|
|
{stateFromStores.options.map((a0) => <DropdownOptionRow key={a0.id} option={a0} responses={stateFromStoresArray} onSelect={onSelect2} canBeNew={Boolean(canBeNew)} />)}
|
|
</CardSection>
|
|
<View style={styles.closeButtonWrapper}>
|
|
<Button onPress={callback} text={intl.string(t.cpT0Cq)} grow />
|
|
</View>
|
|
</BottomSheetScrollView>
|
|
</BottomSheet>;
|
|
};
|