100 lines
4.0 KiB
TypeScript
100 lines
4.0 KiB
TypeScript
// Metro module 15177 (f15178).
|
|
import { useMemo } from "react";
|
|
import { View } from "react-native";
|
|
import GuildMemberStore from "../../../stores/GuildMemberStore";
|
|
import GuildOnboardingHomeSettingsStore from "../GuildOnboardingHomeSettingsStore";
|
|
import GuildOnboardingMemberActionStore from "../GuildOnboardingMemberActionStore";
|
|
import { StaticChannelRoute } from "../../channel/ChannelConstants";
|
|
import { GuildMemberFlags } from "../../guild_member/GuildMemberConstants";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import Module712 from "../../../_bundle/Module712";
|
|
import Module4611 from "../../../_bundle/Module4611";
|
|
import { useStateFromStores } from "../../../_bundle/defaultAreStatesEqual";
|
|
import { hasFlag } from "../../../_bundle/Module1384";
|
|
import { PressableOpacity } from "../../../design/void/Pressables/native/Pressables";
|
|
import { transitionTo } from "../../routing/router_utils";
|
|
import { Text } from "../../../design/components/Text/native/Text";
|
|
import { intl, t } from "../../../intl/index.native";
|
|
import { Icon } from "../../../design/void/native";
|
|
import Module10737 from "../../../_bundle/Module10737";
|
|
let useStyles;
|
|
const ProgressBar = function ProgressBar(props) {
|
|
const percent = props.percent;
|
|
const styles = useStyles();
|
|
return <View style={styles.progressBackground}>
|
|
<Module4611 style={[styles.progressForeground, {
|
|
width: `${percent}%`
|
|
}]} colors={["rgba(103, 203, 134, 1)", "rgba(59, 165, 92, 1)"]} useAngle angle={-90} />
|
|
</View>;
|
|
};
|
|
useStyles = createStyles({
|
|
container: {
|
|
padding: 16
|
|
},
|
|
horizontal: {
|
|
flexDirection: "row",
|
|
alignItems: "center"
|
|
},
|
|
spaceBetween: {
|
|
justifyContent: "space-between"
|
|
},
|
|
spaceBelow: {
|
|
marginBottom: 8
|
|
},
|
|
progressBackground: {
|
|
borderRadius: Module712.radii.round,
|
|
height: 8,
|
|
backgroundColor: Module712.colors.BACKGROUND_MOD_NORMAL
|
|
},
|
|
progressForeground: {
|
|
backgroundColor: Module712.colors.STATUS_POSITIVE_BACKGROUND,
|
|
borderRadius: Module712.radii.round,
|
|
height: 8
|
|
}
|
|
});
|
|
export function NewMemberActionsProgress(props) {
|
|
let stateFromStores2;
|
|
const guildId = props.guildId;
|
|
stateFromStores2 = void 0;
|
|
const styles = useStyles();
|
|
const stateFromStores = useStateFromStores([GuildOnboardingHomeSettingsStore], () => GuildOnboardingHomeSettingsStore.getNewMemberActions(guildId), [guildId]);
|
|
stateFromStores2 = useStateFromStores([GuildOnboardingMemberActionStore], () => GuildOnboardingMemberActionStore.getCompletedActions(guildId));
|
|
const stateFromStores3 = useStateFromStores([GuildMemberStore], () => GuildMemberStore.getSelfMember(guildId));
|
|
let r14 = stateFromStores?.length;
|
|
if (r14 == null) {
|
|
r14 = 0;
|
|
}
|
|
const memo = useMemo(() => {
|
|
if (stateFromStores != null && stateFromStores2 != null) {
|
|
let c27958_0 = 0;
|
|
stateFromStores.forEach((stateFromStore) => {
|
|
if (stateFromStores2[stateFromStore.channelId] != null) {
|
|
c27958_0 = c27958_0 + 1;
|
|
}
|
|
});
|
|
return c27958_0;
|
|
}
|
|
return 0;
|
|
}, [stateFromStores2, stateFromStores]);
|
|
let r50 = stateFromStores3?.flags;
|
|
if (r50 == null) {
|
|
r50 = 0;
|
|
}
|
|
return hasFlag(r50, GuildMemberFlags.COMPLETED_HOME_ACTIONS) ? null : r14 !== 0 ? memo + r14 !== 0 ? <PressableOpacity accessibilityRole="button" activeOpacity={0.4} style={styles.container} onPress={function onPress() {
|
|
transitionTo(StaticChannelRoute.GUILD_HOME);
|
|
}}>
|
|
<View style={[styles.horizontal, styles.spaceBetween, styles.spaceBelow]}>
|
|
<Text variant="text-xs/bold" color="mobile-text-heading-primary">
|
|
{intl.string(t.LhlgY9)}
|
|
</Text>
|
|
<View style={styles.horizontal}>
|
|
<Text variant="text-xs/bold" color="mobile-text-heading-primary">{memo}</Text>
|
|
<Text variant="text-xs/medium" color="text-default">/</Text>
|
|
<Text variant="text-xs/bold" color="mobile-text-heading-primary">{r14}</Text>
|
|
<Icon size={Icon.Sizes.REFRESH_SMALL_16} source={Module10737} />
|
|
</View>
|
|
</View>
|
|
<ProgressBar percent={memo / r14 * 100 + 3} />
|
|
</PressableOpacity> : null : null;
|
|
}
|