yeet

modules/guild_onboarding/native/GuildOnboardingConnectionPrompt.tsx

@@ -0,0 +1,208 @@
+// Metro module 5512 (f5513).
+import { useRef, useEffect, useCallback } from "react";
+import { ScrollView, View } from "react-native";
+import MemberVerificationFormStore from "../../guild_member_verification/MemberVerificationFormStore";
+import AuthorizedAppsStore from "../../oauth2/AuthorizedAppsStore";
+import ConnectedAccountsStore from "../../../stores/ConnectedAccountsStore";
+import GuildStore from "../../../stores/GuildStore";
+import GuildOnboardingPromptsStore from "../GuildOnboardingPromptsStore";
+import { OnboardingConnectionType } from "../GuildOnboardingPromptsConstants";
+import { GuildOnboardingModalStates } from "./GuildOnboardingConstants";
+import { AnalyticEvents } from "../../../Constants";
+import { createStyles } from "../../../design/components/Styles/native/createStyles";
+import { NAV_BAR_HEIGHT } from "../../../design/components/Navigator/native/NavigatorConstants.native";
+import Module712 from "../../../_bundle/Module712";
+import { useNavigation } from "../../../design/components/Navigator/native/useNavigation.native";
+import useSafeAreaInsets_native from "../../safe_area/useSafeAreaInsets.native";
+import { useStateFromStores, useStateFromStoresArray } from "../../../_bundle/Module589";
+import { getProviderConnectionState, getApplicationConnectionState, showRulesInOnboarding } from "../GuildOnboardingUtils";
+import AnalyticsUtils from "../../../utils/AnalyticsUtils";
+import { collectGuildAnalyticsMetadata } from "../../app_analytics/AppAnalyticsUtils";
+import { CONNECTIONS_STEP } from "../GuildOnboardingPromptsActionCreators";
+import { SafeAreaPaddingView } from "../../../components_native/common/SafeAreaView";
+import { Text } from "../../../design/components/Text/native/Text";
+import { intl, t } from "../../../intl/index.native";
+import ConnectionCard from "./ConnectionCard";
+import AnalyticsLocation from "../../app_analytics/AnalyticsLocation";
+import { Button } from "../../../design/components/Button/native/Button.native";
+const useStyles = createStyles({
+  flex: {
+    flex: 1
+  },
+  container: {
+    display: "flex",
+    flex: 1,
+    flexGrow: 1,
+    marginTop: NAV_BAR_HEIGHT,
+    marginBottom: Module712.space.PX_16,
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOWER
+  },
+  scrollContainer: {
+    display: "flex",
+    flexGrow: 1,
+    paddingHorizontal: Module712.space.PX_16,
+    paddingTop: Module712.space.PX_16,
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOWER
+  },
+  header: {
+    marginBottom: Module712.space.PX_24
+  },
+  title: {
+    marginBottom: Module712.space.PX_8
+  },
+  description: {
+    marginTop: Module712.space.PX_8
+  },
+  connectionsList: {
+    marginTop: Module712.space.PX_8
+  },
+  footer: {
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "flex-end",
+    alignItems: "center",
+    bottom: 0,
+    paddingBottom: Module712.space.PX_8,
+    position: "absolute",
+    width: "100%",
+    backgroundColor: Module712.colors.BACKGROUND_BASE_LOWER
+  },
+  footerContent: {
+    width: "100%",
+    paddingHorizontal: Module712.space.PX_16
+  }
+});
+export default function GuildOnboardingConnectionPrompt(props) {
+  let props2;
+  let stateFromStoresArray, stateFromStores2, stateFromStores3, stateFromStores4, stateFromStores5;
+  const { guildId, onComplete, isLastStep } = props;
+  stateFromStoresArray = void 0;
+  stateFromStores2 = void 0;
+  stateFromStores3 = void 0;
+  stateFromStores4 = void 0;
+  stateFromStores5 = void 0;
+  const styles = useStyles();
+  const navigation = useNavigation();
+  const bottom = useSafeAreaInsets_native().bottom;
+  const paddingBottom = 64 + bottom + Module712.space.PX_8;
+  const ref = useRef(false);
+  const stateFromStores = useStateFromStores([GuildOnboardingPromptsStore], () => GuildOnboardingPromptsStore.getOnboardingConnections(guildId));
+  stateFromStoresArray = useStateFromStoresArray([GuildOnboardingPromptsStore], () => GuildOnboardingPromptsStore.getOnboardingPromptsForOnboarding(guildId));
+  stateFromStores2 = useStateFromStores([GuildStore], () => GuildStore.getGuild(guildId));
+  stateFromStores3 = useStateFromStores([MemberVerificationFormStore], () => MemberVerificationFormStore.getRulesPrompt(guildId));
+  stateFromStores4 = useStateFromStores([GuildOnboardingPromptsStore], () => GuildOnboardingPromptsStore.isLoading());
+  stateFromStores5 = useStateFromStores([AuthorizedAppsStore, ConnectedAccountsStore], () => {
+    for (const stateFromStore of stateFromStores) {
+      L11: {
+        const r26 = stateFromStore;
+        const connection_type = stateFromStore.connection_type;
+        if (OnboardingConnectionType.APPLICATION === connection_type) {
+          if (AuthorizedAppsStore.getNewestTokenForApplication(r26.application_id) != null) {
+            break L11;
+          }
+          continue;
+        }
+        if (OnboardingConnectionType.PROVIDER_CONNECTED_ACCOUNT !== connection_type) {
+          r26.connection_type;
+          continue;
+        }
+        if (r26.provider_id == null) {
+          continue;
+        }
+        const account = ConnectedAccountsStore.getAccount(null, r26.provider_id);
+        if (account == null) {
+          continue;
+        }
+        if (account.revoked) {
+          continue;
+        }
+        return true;
+      }
+      return true;
+    }
+    return false;
+  }, [stateFromStores]);
+  useEffect(() => {
+    if (!stateFromStores4 && stateFromStores.length !== 0 && !ref.current) {
+      const providerConnectionState = getProviderConnectionState(stateFromStores);
+      const applicationConnectionState = getApplicationConnectionState(stateFromStores);
+      AnalyticsUtils.track(AnalyticEvents.GUILD_ONBOARDING_STEP_VIEWED, {
+        ...collectGuildAnalyticsMetadata(guildId),
+        step: CONNECTIONS_STEP,
+        required: false,
+        provider_connections_connected: providerConnectionState.connected,
+        provider_connections_not_connected: providerConnectionState.notConnected,
+        application_connections_connected: applicationConnectionState.connected,
+        application_connections_not_connected: applicationConnectionState.notConnected
+      });
+      ref.current = true;
+    }
+  }, [guildId, stateFromStores4, stateFromStores]);
+  const callback = useCallback(() => {
+    const providerConnectionState = getProviderConnectionState(stateFromStores);
+    const applicationConnectionState = getApplicationConnectionState(stateFromStores);
+    AnalyticsUtils.track(AnalyticEvents.GUILD_ONBOARDING_STEP_COMPLETED, {
+      ...collectGuildAnalyticsMetadata(guildId),
+      step: CONNECTIONS_STEP,
+      skipped: !stateFromStores5,
+      back: false,
+      options_selected: 0,
+      in_onboarding: true,
+      is_final_step: isLastStep,
+      provider_connections_connected: providerConnectionState.connected,
+      provider_connections_not_connected: providerConnectionState.notConnected,
+      application_connections_connected: applicationConnectionState.connected,
+      application_connections_not_connected: applicationConnectionState.notConnected
+    });
+    if (stateFromStoresArray.length > 0) {
+      navigation.push(GuildOnboardingModalStates.PROMPT, {
+        currentPrompt: 0
+      });
+    } else if (showRulesInOnboarding(stateFromStores2, stateFromStores3)) {
+      navigation.push(GuildOnboardingModalStates.RULES);
+    } else {
+      onComplete();
+    }
+  }, [stateFromStoresArray.length, stateFromStores2, stateFromStores3, navigation, onComplete, stateFromStores, stateFromStores5, isLastStep, guildId]);
+  const r92 = {
+    top: true,
+    style: [styles.flex, styles.container],
+    children: null
+  };
+  if (stateFromStores4) {
+    r92.children = <View style={[styles.flex, {
+      justifyContent: "center",
+      alignItems: "center"
+    }]}>
+      <Text variant="text-md/normal" color="text-muted">
+        {intl.string(t.ZTNur7)}
+      </Text>
+    </View>;
+    props2 = r92;
+  } else {
+    r92.children = <View style={styles.flex}>
+      <ScrollView contentContainerStyle={[styles.scrollContainer, {
+        paddingBottom
+      }]}>
+        <View style={styles.header}>
+          <Text style={styles.title} accessibilityRole="header" variant="heading-xl/semibold" color="mobile-text-heading-primary">
+            {intl.string(t.eDVMrA)}
+          </Text>
+          <Text style={styles.description} variant="text-md/normal" color="text-muted">
+            {intl.string(t.BozOXu)}
+          </Text>
+        </View>
+        <View style={styles.connectionsList}>
+          {stateFromStores.map((stateFromStore, index) => <ConnectionCard key={index} connection={stateFromStore} guildId={guildId} location={AnalyticsLocation.GUILD_ONBOARDING} />)}
+        </View>
+      </ScrollView>
+      <View style={[styles.footer, styles.footerContent, {
+        paddingBottom: bottom
+      }]}>
+        <Button variant={stateFromStores5 ? "primary" : isLastStep ? "primary" : "secondary"} size="md" text={isLastStep ? `${intl.string(t["8SuVoE"])} 🎉` : stateFromStores5 ? intl.string(t.PDTjLN) : intl.string(t["5Wxrcd"])} onPress={callback} grow />
+      </View>
+    </View>;
+    props2 = r92;
+  }
+  return <SafeAreaPaddingView {...props2} />;
+};