// 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} />;
};