48 lines
1.9 KiB
TypeScript
48 lines
1.9 KiB
TypeScript
// Metro module 11651 (f11652).
|
|
import { View } from "react-native";
|
|
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../../_bundle/Module712";
|
|
import useGuildPowerupsWarningConfig from "../hooks/useGuildPowerupsWarningConfig";
|
|
import { CircleErrorIcon } from "../../../../design/components/Icon/native/redesign/generated/CircleErrorIcon";
|
|
import { Text } from "../../../../design/components/Text/native/Text";
|
|
const useStyles = createStyles({
|
|
container: {
|
|
flexDirection: "row",
|
|
alignItems: "flex-start",
|
|
padding: Module712.space.PX_24,
|
|
backgroundColor: Module712.colors.BACKGROUND_FEEDBACK_WARNING,
|
|
borderWidth: 1,
|
|
borderColor: Module712.colors.STATUS_WARNING,
|
|
borderRadius: Module712.radii.lg,
|
|
gap: Module712.space.PX_8,
|
|
overflow: "hidden"
|
|
},
|
|
contentContainer: {
|
|
flex: 1,
|
|
gap: Module712.space.PX_4,
|
|
alignItems: "center"
|
|
},
|
|
warningText: {
|
|
marginTop: Module712.space.PX_4
|
|
},
|
|
text: {
|
|
textAlign: "center"
|
|
}
|
|
});
|
|
export default function GuildPowerupsWarning(props) {
|
|
const { guildId, powerupNames, warnings } = props;
|
|
const styles = useStyles();
|
|
const guildPowerupsWarningConfig = useGuildPowerupsWarningConfig(guildId, powerupNames);
|
|
const { shouldShow, title, description } = guildPowerupsWarningConfig;
|
|
return shouldShow ? <View style={styles.container}>
|
|
<View style={styles.contentContainer}>
|
|
<CircleErrorIcon color={Module712.colors.TEXT_FEEDBACK_WARNING} size="md" />
|
|
<Text variant="text-md/semibold" color="text-feedback-warning" style={styles.text}>{title}</Text>
|
|
<Text variant="text-sm/medium" style={styles.text}>{description}</Text>
|
|
{warnings == null ? void 0 : warnings.map((warning, index) => <Text key={`warning-${index}`} variant="text-sm/medium" color="text-feedback-warning" style={[styles.warningText, styles.text]}>
|
|
{warning}
|
|
</Text>)}
|
|
</View>
|
|
</View> : null;
|
|
};
|