// Metro module 9234 (f9235).
import { useState, useRef, useEffect } from "react";
import { ScrollView, View } from "react-native";
import PhoneStore from "../../../phone/PhoneStore";
import UserRequiredActionStore from "../../../../stores/UserRequiredActionStore";
import UserStore from "../../../../stores/UserStore";
import { UserFlags } from "../../../../Constants";
import { NOOP_NULL } from "../../../../_bundle/Module505";
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
import Module712 from "../../../../_bundle/Module712";
import { useStateFromStores } from "../../../../_bundle/Module589";
import VerificationUtils from "../../VerificationUtils";
import PhoneActionCreators from "../../../phone/PhoneActionCreators";
import { APIError } from "../../../../errors/index";
import { Text } from "../../../../design/components/Text/native/Text";
import { intl, t } from "../../../../intl/index.native";
import FormPhoneOrEmail from "../../../phone/native/FormPhoneOrEmail";
import { PhoneOrEmailSelectorForceMode } from "../../../phone/PhoneOrEmailUtils";
import ModalActionCreators from "../../../../actions/ModalActionCreators";
import { Button } from "../../../../design/components/Button/native/Button.native";
import AlertActionCreators from "../../../../actions/native/AlertActionCreators";
const useStyles = createStyles({
  background: {
    flex: 1,
    backgroundColor: Module712.colors.BACKGROUND_BASE_LOW
  },
  container: {
    padding: 16,
    flex: 1
  },
  title: {
    textAlign: "center"
  },
  input: {
    marginTop: 24
  },
  redesignInput: {
    borderRadius: Module712.radii.lg
  },
  button: {
    marginTop: 8
  }
});
export default function AddPhone(props) {
  let r69;
  let stateFromStores, isPhoneReverification, c17081_5, state, setState, state2, setState2, setState3, ref, setState4;
  let header = props.header;
  const { onComplete, onDeletePhone, reason, style } = props;
  stateFromStores = void 0;
  isPhoneReverification = void 0;
  c17081_5 = void 0;
  state = void 0;
  setState = void 0;
  state2 = void 0;
  setState2 = void 0;
  setState3 = void 0;
  ref = void 0;
  setState4 = void 0;
  let _handleSubmit2 = function _handleSubmit() {
    const r9 = async () => {
      let c30068_2;
      let c30068_3 = 0;
      let c31498_0, c31498_1, c31498_2;
      L12: {
        try {
          c31498_0 = void 0;
          c31498_1 = void 0;
          const r37 = `${state}${state2}`;
          c31498_0 = r37;
          setState4(true);
          c30068_3 = 2;
          if (isPhoneReverification) {
            await PhoneActionCreators.beginReverifyPhone(r37, reason);
          } else {
            await PhoneActionCreators.beginAddPhone(r37, reason);
          }
          (0, onComplete)(c31498_0);
          c30068_3 = 1;
          c30068_3 = 0;
          (0, setState4)(false);
        } catch ($e) {
          const r33 = $e;
          let r7 = r33;
          c30068_2 = r33;
          let r34 = c30068_3;
          if (r34 !== 0) {
            while (true) {
              if (r34 === 1) {
                try {
                  const r131 = c30068_2;
                  c30068_3 = 0;
                  (0, setState4)(false);
                  throw r131;
                } catch (r129) {
                  r7 = r129;
                  c30068_2 = r129;
                  r34 = c30068_3;
                  if (r34 === 0) {
                    break;
                  }
                }
              } else {
                try {
                  const r108 = c30068_2;
                  c30068_3 = 1;
                  c31498_2 = r108;
                  c31498_1 = new APIError(c31498_2);
                  (0, setState3)(c31498_1.getAnyErrorMessage());
                  c30068_3 = 0;
                  (0, setState4)(false);
                  break L12;
                } catch (r105) {
                  r7 = r105;
                  c30068_2 = r105;
                  r34 = c30068_3;
                  if (r34 === 0) {
                    break;
                  }
                }
              }
            }
          }
          throw r7;
        }
      }
    };
    _handleSubmit2 = r9;
    return r9.apply(this, arguments);
  };
  const styles = useStyles();
  stateFromStores = useStateFromStores([UserStore], () => UserStore.getCurrentUser());
  const stateFromStores3 = useStateFromStores([UserRequiredActionStore], () => UserRequiredActionStore.getAction());
  const phone = stateFromStores?.phone;
  isPhoneReverification = VerificationUtils.isPhoneReverification(stateFromStores, stateFromStores3);
  const r48 = onDeletePhone != null && phone != null && stateFromStores?.email != null && !isPhoneReverification;
  const stateFromStores2 = useStateFromStores([PhoneStore], () => PhoneStore.getCountryCode());
  const [countryCode, r62] = stateFromStores2.code.split(" ");
  c17081_5 = r62;
  let r65 = countryCode;
  if (r65 == null) {
    r65 = "";
  }
  [state, setState] = useState(r65);
  if (phone != null) {
    r69 = phone.replace(state, "");
  } else {
    r69 = r62;
    if (r69 == null) {
      r69 = "";
    }
  }
  [state2, setState2] = useState(r69);
  let error;
  [error, setState3] = useState(null);
  ref = useRef(true);
  let loading;
  [loading, setState4] = useState(false);
  useEffect(() => {
    if (ref.current) {
      ref.current = false;
    } else {
      let r5 = c17081_5;
      if (r5 == null) {
        r5 = "";
      }
      setState2(r5);
    }
  }, [r62]);
  if (header == null) {
    header = <Text style={styles.title} accessibilityRole="header" variant="heading-xl/extrabold" color="mobile-text-heading-primary">
      {phone != null && !isPhoneReverification ? intl.string(t.WO0zBE) : intl.string(t.hY8QTR)}
    </Text>;
  }
  const label = phone != null && !isPhoneReverification ? intl.string(t.K6R0UP) : intl.string(t["64bX0M"]);
  const handleSubmit = function handleSubmit() {
    return _handleSubmit2.apply(this, arguments);
  };
  return <ScrollView style={[styles.background, style]} keyboardShouldPersistTaps="handled" alwaysBounceVertical={false}>
    <View style={styles.container}>
      {header}
      <FormPhoneOrEmail style={styles.input} textInputStyle={styles.redesignInput} label={label} alpha2={stateFromStores2.alpha2} countryCode={countryCode} value={state2} onChangeText={(text, a1) => {
        setState2(text);
        setState(a1);
      }} forceMode={PhoneOrEmailSelectorForceMode.PHONE} returnKeyType="done" onSubmitEditing={handleSubmit} error={error} onPressCountrySelector={() => ModalActionCreators.pushLazy(import("./CountrySelectModal"))} autoFocus />
      <View style={styles.button}>
        <Button variant="primary" size={r48 ? "md" : "lg"} text={intl.string(t.PDTjLN)} onPress={handleSubmit} loading={loading} />
      </View>
      {r48 ? <View style={styles.button}>
        <Button variant="secondary" size="md" text={intl.string(t.kYvzoQ)} onPress={function onPress() {
          if (stateFromStores != null) {
            if (stateFromStores.hasFlag(UserFlags.MFA_SMS)) {
              AlertActionCreators.openLazy({
                importer: () => import("../../../user_settings/account/native/SMSBackupWarningAlert").then(({ default: Component }) => (a0) => {
                  let onConfirm = onDeletePhone;
                  if (onDeletePhone == null) {
                    onConfirm = NOOP_NULL;
                  }
                  return <Component {...a0} onConfirm={onConfirm} />;
                })
              });
            } else if (onDeletePhone != null) {
              onDeletePhone();
            }
          }
        }} />
      </View> : null}
    </View>
  </ScrollView>;
};